feat(showcase): adapt showcase to work with latest version of nouisli…

…der library
NationalBankBelgium · Oct 9, 2024 · 730fdef · 730fdef
1 parent afcd3ab
commit 730fdef
Show file tree

Hide file tree

Showing 3 changed files with 68 additions and 67 deletions.
diff --git a/showcase/package-lock.json b/showcase/package-lock.json
diff --git a/showcase/package.json b/showcase/package.json
@@ -60,7 +60,6 @@
     "ng": "node --max_old_space_size=4096 ./node_modules/@angular/cli/bin/ng",
     "ngc": "ngc",
     "node": "node",
-    "postinstall": "npm run webdriver:update",
     "postversion": "git push && git push --tags",
     "preclean:install": "npm run clean",
     "prettier-check": "prettier **/*.{css,js,json,md,pcss,scss,ts} --write",
@@ -117,9 +116,9 @@
     "@angular/router": "^16.2.12",
     "@nationalbankbelgium/code-style": "^1.11.0",
     "@nationalbankbelgium/ngx-form-errors": "2.0.1",
-    "@nationalbankbelgium/stark-core": "file:../dist/packages-dist/stark-core/nationalbankbelgium-stark-core-12.0.0-rc.0-8c3bb141-1728386498.tgz",
-    "@nationalbankbelgium/stark-rbac": "file:../dist/packages-dist/stark-rbac/nationalbankbelgium-stark-rbac-12.0.0-rc.0-8c3bb141-1728386498.tgz",
-    "@nationalbankbelgium/stark-ui": "file:../dist/packages-dist/stark-ui/nationalbankbelgium-stark-ui-12.0.0-rc.0-8c3bb141-1728386498.tgz",
+    "@nationalbankbelgium/stark-core": "file:../dist/packages-dist/stark-core/nationalbankbelgium-stark-core-12.0.0-rc.0-9af149cf-1728455849.tgz",
+    "@nationalbankbelgium/stark-rbac": "file:../dist/packages-dist/stark-rbac/nationalbankbelgium-stark-rbac-12.0.0-rc.0-9af149cf-1728455849.tgz",
+    "@nationalbankbelgium/stark-ui": "file:../dist/packages-dist/stark-ui/nationalbankbelgium-stark-ui-12.0.0-rc.0-9af149cf-1728455849.tgz",
     "@uirouter/visualizer": "~7.2.1",
     "angular-in-memory-web-api": "~0.16.0",
     "basscss": "~8.1.0",
@@ -135,8 +134,8 @@
   "devDependencies": {
     "@compodoc/compodoc": "1.1.25",
     "@nationalbankbelgium/eslint-config": "^16.0.0",
-    "@nationalbankbelgium/stark-build": "file:../dist/packages-dist/stark-build/nationalbankbelgium-stark-build-12.0.0-rc.0-8c3bb141-1728386498.tgz",
-    "@nationalbankbelgium/stark-testing": "file:../dist/packages-dist/stark-testing/nationalbankbelgium-stark-testing-12.0.0-rc.0-8c3bb141-1728386498.tgz",
+    "@nationalbankbelgium/stark-build": "file:../dist/packages-dist/stark-build/nationalbankbelgium-stark-build-12.0.0-rc.0-9af149cf-1728455849.tgz",
+    "@nationalbankbelgium/stark-testing": "file:../dist/packages-dist/stark-testing/nationalbankbelgium-stark-testing-12.0.0-rc.0-9af149cf-1728455849.tgz",
     "@types/core-js": "~2.5.4",
     "@types/hammerjs": "~2.0.39",
     "@types/node": "^18.19.4",

diff --git a/showcase/src/app/demo-ui/pages/slider/demo-slider-page.component.ts b/showcase/src/app/demo-ui/pages/slider/demo-slider-page.component.ts
@@ -1,6 +1,6 @@
 import { Component } from "@angular/core";
-import { StarkSliderConfig } from "@nationalbankbelgium/stark-ui";
 import { ReferenceLink } from "../../../shared/components";
+import { Options, PipsMode } from "nouislider";
 
 export enum SLIDER_HANDLES {
 	lower = 0,
@@ -28,16 +28,17 @@ export class DemoSliderPageComponent {
 	public isSimpleHorizontalSliderEnabled = true;
 	public valueForSimpleHorizontalSlider = 100;
 	public simpleHorizontalSliderValues: number[] = [100];
-	public simpleHorizontalSliderConfig: StarkSliderConfig = {
-		connect: [true, false],
+	public simpleHorizontalSliderConfig: Options = {
+		connect: "lower",
 		tooltips: [true],
 		step: 10,
+		start: 0,
 		range: {
 			min: 0,
 			max: 1000
 		},
 		pips: {
-			mode: "values",
+			mode: PipsMode.Values,
 			values: [0, 250, 500, 750, 1000],
 			density: 6
 		}
@@ -50,16 +51,17 @@ export class DemoSliderPageComponent {
 	public lowerValueForHorizontalRangeSlider = 100;
 	public upperValueForHorizontalRangeSlider = 900;
 	public horizontalRangeSliderValues: number[] = [100, 900];
-	public horizontalRangeSliderConfig: StarkSliderConfig = {
+	public horizontalRangeSliderConfig: Options = {
 		connect: [false, true, false],
 		tooltips: [true, true],
 		step: 10,
+		start: 0,
 		range: {
 			min: 0,
 			max: 1000
 		},
 		pips: {
-			mode: "values",
+			mode: PipsMode.Values,
 			values: [0, 250, 500, 750, 1000],
 			density: 6
 		}
@@ -71,17 +73,18 @@ export class DemoSliderPageComponent {
 	public isSimpleVerticalSliderEnabled = true;
 	public valueForSimpleVerticalSlider = 100;
 	public simpleVerticalSliderValues: number[] = [100];
-	public simpleVerticalSliderConfig: StarkSliderConfig = {
+	public simpleVerticalSliderConfig: Options = {
 		connect: [true, false],
 		orientation: "vertical",
 		tooltips: [true],
 		step: 10,
+		start: 0,
 		range: {
 			min: 0,
 			max: 1000
 		},
 		pips: {
-			mode: "values",
+			mode: PipsMode.Values,
 			values: [0, 250, 500, 750, 1000],
 			density: 6
 		}
@@ -94,17 +97,18 @@ export class DemoSliderPageComponent {
 	public lowerValueForVerticalRangeSlider = 100;
 	public upperValueForVerticalRangeSlider = 900;
 	public verticalRangeSliderValues: number[] = [100, 900];
-	public verticalRangeSliderConfig: StarkSliderConfig = {
+	public verticalRangeSliderConfig: Options = {
 		connect: [false, true, false],
 		orientation: "vertical",
 		tooltips: [true, true],
 		step: 10,
+		start: 0,
 		range: {
 			min: 0,
 			max: 1000
 		},
 		pips: {
-			mode: "values",
+			mode: PipsMode.Values,
 			values: [0, 250, 500, 750, 1000],
 			density: 6
 		}