@mintplayer/ng-bootstrap 20.0.0 → 20.2.0

package/fesm2022/mintplayer-ng-bootstrap-color-picker.mjs

@@ -7,7 +7,7 @@ import { BehaviorSubject, combineLatest, map, debounceTime, switchMap, take } fr
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 
 class BsColorWheelComponent {
-    constructor(element) {
+    constructor(element, destroy) {
         // this.resizeObserver = new ResizeObserver((entries) => {
         //   for (const entry of entries) {
         //     if (entry.target === this.element.nativeElement) {
@@ -19,6 +19,7 @@ class BsColorWheelComponent {
         //   }
         // });
         this.element = element;
+        this.destroy = destroy;
         this.positionRelative = true;
         //#region Hue/Luminosity
         this.hs$ = new BehaviorSubject({ hue: 0, saturation: 0 });
@@ -141,7 +142,9 @@ class BsColorWheelComponent {
     ngAfterViewInit() {
         // this.resizeObserver.observe(this.element.nativeElement);
         this.viewInited$.next(true);
-        this.canvasContext = this.canvas.nativeElement.getContext('2d', { willReadFrequently: true });
+        if (typeof window !== 'undefined') {
+            this.canvasContext = this.canvas.nativeElement.getContext('2d', { willReadFrequently: true });
+        }
     }
     onPointerDown(ev) {
         if (!this.disabled$.value) {
@@ -178,7 +181,7 @@ class BsColorWheelComponent {
                 y: ev.clientY - (subtract ? rect.top : 0),
             };
         }
-        this.position2color(co.x, co.y).pipe(take(1)).subscribe((color) => {
+        this.position2color(co.x, co.y).pipe(take(1), takeUntilDestroyed(this.destroy)).subscribe((color) => {
             if (color) {
                 this.hs$.next({ hue: color.hue, saturation: color.saturation });
             }
@@ -290,13 +293,13 @@ class BsColorWheelComponent {
             return (n % max) / max;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsColorWheelComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: BsColorWheelComponent, isStandalone: false, selector: "bs-color-wheel", inputs: { diameterRatio: "diameterRatio", width: "width", height: "height", hs: "hs", luminosity: "luminosity" }, outputs: { hsChange: "hsChange" }, host: { listeners: { "document:mousemove": "onMouseMove($event)", "document:mouseup": "onPointerUp($event)" }, properties: { "class.position-relative": "this.positionRelative" } }, viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true }], ngImport: i0, template: "<canvas\n    class=\"d-block\"\n    [width]=\"width$ | async\"\n    [height]=\"height$ | async\"\n    (mousedown)=\"onPointerDown($event)\"\n    (touchstart)=\"onPointerDown($event)\"\n    (touchmove)=\"onPointerMove($event)\"\n    (touchend)=\"onPointerUp($event)\"\n    #canvas></canvas>\n\n@if (markerPosition$ | async; as markerPosition) {\n    <div class=\"thumb position-absolute pe-none\" [style.left.px]=\"markerPosition.x\" [style.top.px]=\"markerPosition.y\"></div>\n}", styles: [".thumb{width:30px;height:30px;border-radius:15px;margin-top:-15px;margin-left:-15px;box-sizing:border-box;border:2px solid white;box-shadow:#0000001a 0 0 10px 5px}\n"], dependencies: [{ kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsColorWheelComponent, deps: [{ token: i0.ElementRef }, { token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: BsColorWheelComponent, isStandalone: false, selector: "bs-color-wheel", inputs: { diameterRatio: "diameterRatio", width: "width", height: "height", hs: "hs", luminosity: "luminosity" }, outputs: { hsChange: "hsChange" }, host: { listeners: { "document:mousemove": "onMouseMove($event)", "document:mouseup": "onPointerUp($event)" }, properties: { "class.position-relative": "this.positionRelative" } }, viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true }], ngImport: i0, template: "<canvas\n    class=\"d-block\"\n    [width]=\"width$ | async\"\n    [height]=\"height$ | async\"\n    (mousedown)=\"onPointerDown($event)\"\n    (touchstart)=\"onPointerDown($event)\"\n    (touchmove)=\"onPointerMove($event)\"\n    (touchend)=\"onPointerUp($event)\"\n    #canvas></canvas>\n\n@if (markerPosition$ | async; as markerPosition) {\n    <div class=\"thumb position-absolute pe-none\" [style.left.px]=\"markerPosition.x\" [style.top.px]=\"markerPosition.y\"></div>\n}", styles: [".thumb{width:30px;height:30px;border-radius:15px;margin-top:-15px;margin-left:-15px;box-sizing:border-box;border:2px solid white;box-shadow:#0000001a 0 0 10px 5px}\n"], dependencies: [{ kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsColorWheelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsColorWheelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bs-color-wheel', standalone: false, template: "<canvas\n    class=\"d-block\"\n    [width]=\"width$ | async\"\n    [height]=\"height$ | async\"\n    (mousedown)=\"onPointerDown($event)\"\n    (touchstart)=\"onPointerDown($event)\"\n    (touchmove)=\"onPointerMove($event)\"\n    (touchend)=\"onPointerUp($event)\"\n    #canvas></canvas>\n\n@if (markerPosition$ | async; as markerPosition) {\n    <div class=\"thumb position-absolute pe-none\" [style.left.px]=\"markerPosition.x\" [style.top.px]=\"markerPosition.y\"></div>\n}", styles: [".thumb{width:30px;height:30px;border-radius:15px;margin-top:-15px;margin-left:-15px;box-sizing:border-box;border:2px solid white;box-shadow:#0000001a 0 0 10px 5px}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { positionRelative: [{
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.DestroyRef }], propDecorators: { positionRelative: [{
                 type: HostBinding,
                 args: ['class.position-relative']
             }], diameterRatio: [{
@@ -381,10 +384,10 @@ class BsSliderComponent {
         const limited = Math.max(0, Math.min(1, percent));
         this.value$.next(limited);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsSliderComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.0", type: BsSliderComponent, isStandalone: false, selector: "bs-slider", inputs: { value: "value" }, outputs: { valueChange: "valueChange" }, host: { listeners: { "document:mousemove": "onPointerMove($event)", "document:mouseup": "onPointerUp($event)" }, properties: { "class.d-block": "this.dBlock", "class.position-relative": "this.positionRelative" } }, viewQueries: [{ propertyName: "track", first: true, predicate: ["track"], descendants: true }, { propertyName: "thumb", first: true, predicate: ["thumb"], descendants: true }], ngImport: i0, template: "<div class=\"wrapper d-block position-relative\">\n    <div #track class=\"track2\"\n        (mousedown)=\"onPointerDown($event)\"\n        (touchstart)=\"onPointerDown($event)\"\n        (touchmove)=\"onPointerMove($event)\"\n        (touchend)=\"onPointerUp($event)\">\n        <ng-content select=\"[bsTrack]\"></ng-content>\n    </div>\n    <div #thumb\n        (mousedown)=\"onPointerDown($event)\"\n        (touchstart)=\"onPointerDown($event)\"\n        (touchmove)=\"onPointerMove($event)\"\n        (touchend)=\"onPointerUp($event)\"\n        [class]=\"cursorClass$ | async\"\n        [style.margin-left.px]=\"thumbMarginLeft$ | async\">\n        <ng-content select=\"[bsThumb]\"></ng-content>\n    </div>\n</div>", styles: [".track2{height:8px}.wrapper{padding-top:8px;padding-bottom:8px}::ng-deep .thumb{width:24px;height:24px;top:0;border-radius:50%;box-shadow:0 0 0 .1rem #646b7240}::ng-deep .track{height:8px;border-radius:8px}\n"], dependencies: [{ kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsSliderComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: BsSliderComponent, isStandalone: false, selector: "bs-slider", inputs: { value: "value" }, outputs: { valueChange: "valueChange" }, host: { listeners: { "document:mousemove": "onPointerMove($event)", "document:mouseup": "onPointerUp($event)" }, properties: { "class.d-block": "this.dBlock", "class.position-relative": "this.positionRelative" } }, viewQueries: [{ propertyName: "track", first: true, predicate: ["track"], descendants: true }, { propertyName: "thumb", first: true, predicate: ["thumb"], descendants: true }], ngImport: i0, template: "<div class=\"wrapper d-block position-relative\">\n    <div #track class=\"track2\"\n        (mousedown)=\"onPointerDown($event)\"\n        (touchstart)=\"onPointerDown($event)\"\n        (touchmove)=\"onPointerMove($event)\"\n        (touchend)=\"onPointerUp($event)\">\n        <ng-content select=\"[bsTrack]\"></ng-content>\n    </div>\n    <div #thumb\n        (mousedown)=\"onPointerDown($event)\"\n        (touchstart)=\"onPointerDown($event)\"\n        (touchmove)=\"onPointerMove($event)\"\n        (touchend)=\"onPointerUp($event)\"\n        [class]=\"cursorClass$ | async\"\n        [style.margin-left.px]=\"thumbMarginLeft$ | async\">\n        <ng-content select=\"[bsThumb]\"></ng-content>\n    </div>\n</div>", styles: [".track2{height:8px}.wrapper{padding-top:8px;padding-bottom:8px}::ng-deep .thumb{width:24px;height:24px;top:0;border-radius:50%;box-shadow:0 0 0 .1rem #646b7240}::ng-deep .track{height:8px;border-radius:8px}\n"], dependencies: [{ kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsSliderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsSliderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bs-slider', standalone: false, template: "<div class=\"wrapper d-block position-relative\">\n    <div #track class=\"track2\"\n        (mousedown)=\"onPointerDown($event)\"\n        (touchstart)=\"onPointerDown($event)\"\n        (touchmove)=\"onPointerMove($event)\"\n        (touchend)=\"onPointerUp($event)\">\n        <ng-content select=\"[bsTrack]\"></ng-content>\n    </div>\n    <div #thumb\n        (mousedown)=\"onPointerDown($event)\"\n        (touchstart)=\"onPointerDown($event)\"\n        (touchmove)=\"onPointerMove($event)\"\n        (touchend)=\"onPointerUp($event)\"\n        [class]=\"cursorClass$ | async\"\n        [style.margin-left.px]=\"thumbMarginLeft$ | async\">\n        <ng-content select=\"[bsThumb]\"></ng-content>\n    </div>\n</div>", styles: [".track2{height:8px}.wrapper{padding-top:8px;padding-bottom:8px}::ng-deep .thumb{width:24px;height:24px;top:0;border-radius:50%;box-shadow:0 0 0 .1rem #646b7240}::ng-deep .track{height:8px;border-radius:8px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { dBlock: [{
@@ -414,10 +417,10 @@ class BsThumbDirective {
     constructor() {
         this.thumbClass = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsThumbDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.0", type: BsThumbDirective, isStandalone: false, selector: "[bsThumb]", host: { properties: { "class.thumb": "this.thumbClass", "class.position-absolute": "this.thumbClass" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsThumbDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.7", type: BsThumbDirective, isStandalone: false, selector: "[bsThumb]", host: { properties: { "class.thumb": "this.thumbClass", "class.position-absolute": "this.thumbClass" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsThumbDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsThumbDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[bsThumb]',
@@ -434,10 +437,10 @@ class BsTrackDirective {
     constructor() {
         this.trackClass = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsTrackDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.0", type: BsTrackDirective, isStandalone: false, selector: "[bsTrack]", host: { properties: { "class.track": "this.trackClass" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsTrackDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.7", type: BsTrackDirective, isStandalone: false, selector: "[bsTrack]", host: { properties: { "class.track": "this.trackClass" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsTrackDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsTrackDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[bsTrack]',
@@ -495,12 +498,14 @@ class BsLuminosityStripComponent {
         this.luminosity$.next(value);
     }
     ngAfterViewInit() {
-        this.canvasContext = this.canvas.nativeElement.getContext('2d', { willReadFrequently: true });
+        if (typeof window !== 'undefined') {
+            this.canvasContext = this.canvas.nativeElement.getContext('2d', { willReadFrequently: true });
+        }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsLuminosityStripComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.0", type: BsLuminosityStripComponent, isStandalone: false, selector: "bs-luminosity-strip", inputs: { hs: "hs", luminosity: "luminosity" }, outputs: { luminosityChange: "luminosityChange" }, viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true }], ngImport: i0, template: "<bs-slider [value]=\"(luminosity$ | async)!\" (valueChange)=\"luminosityChange.emit($event)\">\n    <canvas bsTrack class=\"position-absolute w-100\" #canvas></canvas>\n    <div bsThumb [style.background]=\"resultBackground$ | async\"></div>\n</bs-slider>", styles: [""], dependencies: [{ kind: "component", type: BsSliderComponent, selector: "bs-slider", inputs: ["value"], outputs: ["valueChange"] }, { kind: "directive", type: BsThumbDirective, selector: "[bsThumb]" }, { kind: "directive", type: BsTrackDirective, selector: "[bsTrack]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsLuminosityStripComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: BsLuminosityStripComponent, isStandalone: false, selector: "bs-luminosity-strip", inputs: { hs: "hs", luminosity: "luminosity" }, outputs: { luminosityChange: "luminosityChange" }, viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true }], ngImport: i0, template: "<bs-slider [value]=\"(luminosity$ | async)!\" (valueChange)=\"luminosityChange.emit($event)\">\n    <canvas bsTrack class=\"position-absolute w-100\" #canvas></canvas>\n    <div bsThumb [style.background]=\"resultBackground$ | async\"></div>\n</bs-slider>", styles: [""], dependencies: [{ kind: "component", type: BsSliderComponent, selector: "bs-slider", inputs: ["value"], outputs: ["valueChange"] }, { kind: "directive", type: BsThumbDirective, selector: "[bsThumb]" }, { kind: "directive", type: BsTrackDirective, selector: "[bsTrack]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsLuminosityStripComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsLuminosityStripComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bs-luminosity-strip', standalone: false, template: "<bs-slider [value]=\"(luminosity$ | async)!\" (valueChange)=\"luminosityChange.emit($event)\">\n    <canvas bsTrack class=\"position-absolute w-100\" #canvas></canvas>\n    <div bsThumb [style.background]=\"resultBackground$ | async\"></div>\n</bs-slider>" }]
         }], ctorParameters: () => [], propDecorators: { hs: [{
@@ -567,12 +572,14 @@ class BsAlphaStripComponent {
         this.alpha$.next(value);
     }
     ngAfterViewInit() {
-        this.canvasContext = this.canvas.nativeElement.getContext('2d', { willReadFrequently: true });
+        if (typeof window !== 'undefined') {
+            this.canvasContext = this.canvas.nativeElement.getContext('2d', { willReadFrequently: true });
+        }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsAlphaStripComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.0", type: BsAlphaStripComponent, isStandalone: false, selector: "bs-alpha-strip", inputs: { hs: "hs", luminosity: "luminosity", alpha: "alpha" }, outputs: { alphaChange: "alphaChange" }, viewQueries: [{ propertyName: "canvas", first: true, predicate: ["track"], descendants: true }], ngImport: i0, template: "<bs-slider [value]=\"(alpha$ | async)!\" (valueChange)=\"alphaChange.emit($event)\">\n    <canvas bsTrack class=\" track position-absolute w-100\" #track></canvas>\n\n    <!-- [style.background]=\"resultBackground$ | async\" -->\n    <div bsThumb [style.background]=\"resultBackground$ | async\"></div>\n</bs-slider>", styles: [".track{background-image:linear-gradient(45deg,#C0C0C0 25%,transparent 25%),linear-gradient(-45deg,#C0C0C0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#C0C0C0 75%),linear-gradient(-45deg,transparent 75%,#C0C0C0 75%);background-size:10px 10px;background-position:0 0,0 5px,5px -5px,-5px 0px}\n"], dependencies: [{ kind: "component", type: BsSliderComponent, selector: "bs-slider", inputs: ["value"], outputs: ["valueChange"] }, { kind: "directive", type: BsThumbDirective, selector: "[bsThumb]" }, { kind: "directive", type: BsTrackDirective, selector: "[bsTrack]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsAlphaStripComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: BsAlphaStripComponent, isStandalone: false, selector: "bs-alpha-strip", inputs: { hs: "hs", luminosity: "luminosity", alpha: "alpha" }, outputs: { alphaChange: "alphaChange" }, viewQueries: [{ propertyName: "canvas", first: true, predicate: ["track"], descendants: true }], ngImport: i0, template: "<bs-slider [value]=\"(alpha$ | async)!\" (valueChange)=\"alphaChange.emit($event)\">\n    <canvas bsTrack class=\" track position-absolute w-100\" #track></canvas>\n\n    <!-- [style.background]=\"resultBackground$ | async\" -->\n    <div bsThumb [style.background]=\"resultBackground$ | async\"></div>\n</bs-slider>", styles: [".track{background-image:linear-gradient(45deg,#C0C0C0 25%,transparent 25%),linear-gradient(-45deg,#C0C0C0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#C0C0C0 75%),linear-gradient(-45deg,transparent 75%,#C0C0C0 75%);background-size:10px 10px;background-position:0 0,0 5px,5px -5px,-5px 0px}\n"], dependencies: [{ kind: "component", type: BsSliderComponent, selector: "bs-slider", inputs: ["value"], outputs: ["valueChange"] }, { kind: "directive", type: BsThumbDirective, selector: "[bsThumb]" }, { kind: "directive", type: BsTrackDirective, selector: "[bsTrack]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsAlphaStripComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsAlphaStripComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bs-alpha-strip', standalone: false, template: "<bs-slider [value]=\"(alpha$ | async)!\" (valueChange)=\"alphaChange.emit($event)\">\n    <canvas bsTrack class=\" track position-absolute w-100\" #track></canvas>\n\n    <!-- [style.background]=\"resultBackground$ | async\" -->\n    <div bsThumb [style.background]=\"resultBackground$ | async\"></div>\n</bs-slider>", styles: [".track{background-image:linear-gradient(45deg,#C0C0C0 25%,transparent 25%),linear-gradient(-45deg,#C0C0C0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#C0C0C0 75%),linear-gradient(-45deg,transparent 75%,#C0C0C0 75%);background-size:10px 10px;background-position:0 0,0 5px,5px -5px,-5px 0px}\n"] }]
         }], ctorParameters: () => [], propDecorators: { hs: [{
@@ -613,10 +620,10 @@ class BsColorPickerComponent {
     set alpha(value) {
         this.alpha$.next(value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsColorPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: BsColorPickerComponent, isStandalone: false, selector: "bs-color-picker", inputs: { size: "size", allowAlpha: "allowAlpha", alpha: "alpha" }, outputs: { alphaChange: "alphaChange" }, viewQueries: [{ propertyName: "colorWheel", first: true, predicate: ["wheel"], descendants: true }], ngImport: i0, template: "@let letDisabled = (disabled$ | async)!;\n@let letHS = (hs$ | async)!;\n@let letLuminosity = (luminosity$ | async)!;\n@let letAlpha = (alpha$ | async)!;\n\n<bs-color-wheel [hs]=\"letHS\" (hsChange)=\"hs$.next($event)\" [luminosity]=\"letLuminosity\" [width]=\"(size$ | async) ?? 150\" [height]=\"(size$ | async) ?? 150\" #wheel></bs-color-wheel>\n<bs-luminosity-strip [hs]=\"letHS\" [luminosity]=\"letLuminosity\" (luminosityChange)=\"luminosity$.next($event)\" class=\"d-block mt-2\" [style.width.px]=\"size$ | async\" #strip></bs-luminosity-strip>\n@if (allowAlpha$ | async) {\n    <bs-alpha-strip [hs]=\"letHS\" [luminosity]=\"letLuminosity\" [alpha]=\"letAlpha\" (alphaChange)=\"alpha$.next($event)\" class=\"d-block mt-2\" [style.width.px]=\"size$ | async\" #alpha></bs-alpha-strip>\n}", styles: [""], dependencies: [{ kind: "component", type: BsColorWheelComponent, selector: "bs-color-wheel", inputs: ["diameterRatio", "width", "height", "hs", "luminosity"], outputs: ["hsChange"] }, { kind: "component", type: BsLuminosityStripComponent, selector: "bs-luminosity-strip", inputs: ["hs", "luminosity"], outputs: ["luminosityChange"] }, { kind: "component", type: BsAlphaStripComponent, selector: "bs-alpha-strip", inputs: ["hs", "luminosity", "alpha"], outputs: ["alphaChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsColorPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: BsColorPickerComponent, isStandalone: false, selector: "bs-color-picker", inputs: { size: "size", allowAlpha: "allowAlpha", alpha: "alpha" }, outputs: { alphaChange: "alphaChange" }, viewQueries: [{ propertyName: "colorWheel", first: true, predicate: ["wheel"], descendants: true }], ngImport: i0, template: "@let letDisabled = (disabled$ | async)!;\n@let letHS = (hs$ | async)!;\n@let letLuminosity = (luminosity$ | async)!;\n@let letAlpha = (alpha$ | async)!;\n\n<bs-color-wheel [hs]=\"letHS\" (hsChange)=\"hs$.next($event)\" [luminosity]=\"letLuminosity\" [width]=\"(size$ | async) ?? 150\" [height]=\"(size$ | async) ?? 150\" #wheel></bs-color-wheel>\n<bs-luminosity-strip [hs]=\"letHS\" [luminosity]=\"letLuminosity\" (luminosityChange)=\"luminosity$.next($event)\" class=\"d-block mt-2\" [style.width.px]=\"size$ | async\" #strip></bs-luminosity-strip>\n@if (allowAlpha$ | async) {\n    <bs-alpha-strip [hs]=\"letHS\" [luminosity]=\"letLuminosity\" [alpha]=\"letAlpha\" (alphaChange)=\"alpha$.next($event)\" class=\"d-block mt-2\" [style.width.px]=\"size$ | async\" #alpha></bs-alpha-strip>\n}", styles: [""], dependencies: [{ kind: "component", type: BsColorWheelComponent, selector: "bs-color-wheel", inputs: ["diameterRatio", "width", "height", "hs", "luminosity"], outputs: ["hsChange"] }, { kind: "component", type: BsLuminosityStripComponent, selector: "bs-luminosity-strip", inputs: ["hs", "luminosity"], outputs: ["luminosityChange"] }, { kind: "component", type: BsAlphaStripComponent, selector: "bs-alpha-strip", inputs: ["hs", "luminosity", "alpha"], outputs: ["alphaChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsColorPickerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsColorPickerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bs-color-picker', standalone: false, template: "@let letDisabled = (disabled$ | async)!;\n@let letHS = (hs$ | async)!;\n@let letLuminosity = (luminosity$ | async)!;\n@let letAlpha = (alpha$ | async)!;\n\n<bs-color-wheel [hs]=\"letHS\" (hsChange)=\"hs$.next($event)\" [luminosity]=\"letLuminosity\" [width]=\"(size$ | async) ?? 150\" [height]=\"(size$ | async) ?? 150\" #wheel></bs-color-wheel>\n<bs-luminosity-strip [hs]=\"letHS\" [luminosity]=\"letLuminosity\" (luminosityChange)=\"luminosity$.next($event)\" class=\"d-block mt-2\" [style.width.px]=\"size$ | async\" #strip></bs-luminosity-strip>\n@if (allowAlpha$ | async) {\n    <bs-alpha-strip [hs]=\"letHS\" [luminosity]=\"letLuminosity\" [alpha]=\"letAlpha\" (alphaChange)=\"alpha$.next($event)\" class=\"d-block mt-2\" [style.width.px]=\"size$ | async\" #alpha></bs-alpha-strip>\n}" }]
         }], ctorParameters: () => [], propDecorators: { colorWheel: [{
@@ -730,15 +737,15 @@ class BsColorPickerValueAccessor {
         h *= 360;
         return { h, s, l };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsColorPickerValueAccessor, deps: [{ token: forwardRef(() => BsColorPickerComponent) }, { token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.0", type: BsColorPickerValueAccessor, isStandalone: false, selector: "bs-color-picker", providers: [{
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsColorPickerValueAccessor, deps: [{ token: forwardRef(() => BsColorPickerComponent) }, { token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.7", type: BsColorPickerValueAccessor, isStandalone: false, selector: "bs-color-picker", providers: [{
                 provide: NG_VALUE_ACCESSOR,
                 // useExisting: BsColorPickerValueAccessor,
                 useExisting: forwardRef(() => BsColorPickerValueAccessor),
                 multi: true
             }], exportAs: ["bsColorPicker"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsColorPickerValueAccessor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsColorPickerValueAccessor, decorators: [{
             type: Directive,
             args: [{
                     selector: 'bs-color-picker',
@@ -757,8 +764,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImpor
                 }] }, { type: i0.DestroyRef }] });
 
 class BsColorPickerModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsColorPickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.0", ngImport: i0, type: BsColorPickerModule, declarations: [BsColorPickerComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsColorPickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.7", ngImport: i0, type: BsColorPickerModule, declarations: [BsColorPickerComponent,
             BsColorPickerValueAccessor,
             BsColorWheelComponent,
             BsLuminosityStripComponent,
@@ -774,9 +781,9 @@ class BsColorPickerModule {
             BsThumbDirective,
             BsTrackDirective,
             BsAlphaStripComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsColorPickerModule, imports: [FormsModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsColorPickerModule, imports: [FormsModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: BsColorPickerModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: BsColorPickerModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [