@ngbase/adk 0.1.11 → 0.1.12

package/fesm2022/ngbase-adk-chip.mjs

@@ -6,16 +6,16 @@ class NgbChipRemove {
     constructor() {
         this.chip = inject((NgbChip));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgbChipRemove, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0", type: NgbChipRemove, isStandalone: true, selector: "[ngbChipRemove]", host: { attributes: { "type": "button" }, listeners: { "click": "chip.close.emit($event)" }, properties: { "attr.data-dir": "chip.dir.isRtl() ? \"rtl\" : \"ltr\"" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbChipRemove, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0", type: NgbChipRemove, isStandalone: true, selector: "[ngbChipRemove]", host: { attributes: { "type": "button" }, listeners: { "click": "chip.close.emit()" }, properties: { "attr.data-dir": "chip.dir.isRtl() ? \"rtl\" : \"ltr\"" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgbChipRemove, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbChipRemove, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbChipRemove]',
                     host: {
                         type: 'button',
-                        '(click)': 'chip.close.emit($event)',
+                        '(click)': 'chip.close.emit()',
                         '[attr.data-dir]': 'chip.dir.isRtl() ? "rtl" : "ltr"',
                     },
                 }]
@@ -23,14 +23,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImpor
 class NgbChip {
     constructor() {
         this.dir = inject(Directionality);
-        this.removable = input(true, { transform: booleanAttribute });
-        this.value = input();
+        this.removable = input(true, ...(ngDevMode ? [{ debugName: "removable", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+        this.value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
         this.close = output();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgbChip, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.0", type: NgbChip, isStandalone: true, selector: "[ngbChip]", inputs: { removable: { classPropertyName: "removable", publicName: "removable", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { close: "close" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbChip, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.0", type: NgbChip, isStandalone: true, selector: "[ngbChip]", inputs: { removable: { classPropertyName: "removable", publicName: "removable", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { close: "close" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgbChip, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbChip, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbChip]',
@@ -42,12 +42,12 @@ function aliasChip(chip) {
 
 class NgbChipGroup {
     constructor() {
-        this.chips = contentChildren((NgbChip));
+        this.chips = contentChildren((NgbChip), ...(ngDevMode ? [{ debugName: "chips" }] : []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgbChipGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "19.0.0", type: NgbChipGroup, isStandalone: true, selector: "[ngbChipGroup]", queries: [{ propertyName: "chips", predicate: (NgbChip), isSignal: true }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbChipGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "20.2.0", type: NgbChipGroup, isStandalone: true, selector: "[ngbChipGroup]", queries: [{ propertyName: "chips", predicate: (NgbChip), isSignal: true }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgbChipGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbChipGroup, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbChipGroup]',

package/fesm2022/ngbase-adk-chip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngbase-adk-chip.mjs","sources":["../../../projects/adk/chip/chip.ts","../../../projects/adk/chip/chip-group.ts","../../../projects/adk/chip/ngbase-adk-chip.ts"],"sourcesContent":["import { booleanAttribute, Directive, inject, input, output } from '@angular/core';\nimport { Directionality } from '@ngbase/adk/bidi';\n\n@Directive({\n  selector: '[ngbChipRemove]',\n  host: {\n    type: 'button',\n    '(click)': 'chip.close.emit($event)',\n    '[attr.data-dir]': 'chip.dir.isRtl() ? \"rtl\" : \"ltr\"',\n  },\n})\nexport class NgbChipRemove {\n  readonly chip = inject(NgbChip<any>);\n}\n\n@Directive({\n  selector: '[ngbChip]',\n})\nexport class NgbChip<T = any> {\n  readonly dir = inject(Directionality);\n\n  readonly removable = input(true, { transform: booleanAttribute });\n  readonly value = input<T>();\n  readonly close = output();\n}\n\nexport function aliasChip(chip: typeof NgbChip) {\n  return { provide: NgbChip, useExisting: chip };\n}\n","import { contentChildren, Directive, effect, untracked } from '@angular/core';\n// import { Autocomplete } from '@ngbase/adk/autocomplete';\nimport { NgbChip } from './chip';\n\n@Directive({\n  selector: '[ngbChipGroup]',\n})\nexport class NgbChipGroup<T> {\n  readonly chips = contentChildren(NgbChip<T>);\n  // readonly autoComplete = inject(Autocomplete);\n\n  // constructor() {\n  //   effect(() => {\n  //     const chips = this.chips();\n  //     untracked(() => {\n  //       chips.forEach(chip => {\n  //         chip.close.subscribe(() => {\n  //           this.autoComplete.removeValue(chip.value());\n  //         });\n  //       });\n  //     });\n  //   });\n  // }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ngbase-adk-chip.mjs","sources":["../../../projects/adk/chip/chip.ts","../../../projects/adk/chip/chip-group.ts","../../../projects/adk/chip/ngbase-adk-chip.ts"],"sourcesContent":["import { booleanAttribute, Directive, inject, input, output } from '@angular/core';\nimport { Directionality } from '@ngbase/adk/bidi';\n\n@Directive({\n  selector: '[ngbChipRemove]',\n  host: {\n    type: 'button',\n    '(click)': 'chip.close.emit()',\n    '[attr.data-dir]': 'chip.dir.isRtl() ? \"rtl\" : \"ltr\"',\n  },\n})\nexport class NgbChipRemove {\n  readonly chip = inject(NgbChip<any>);\n}\n\n@Directive({\n  selector: '[ngbChip]',\n})\nexport class NgbChip<T = any> {\n  readonly dir = inject(Directionality);\n\n  readonly removable = input(true, { transform: booleanAttribute });\n  readonly value = input<T>();\n  readonly close = output();\n}\n\nexport function aliasChip(chip: typeof NgbChip) {\n  return { provide: NgbChip, useExisting: chip };\n}\n","import { contentChildren, Directive, effect, untracked } from '@angular/core';\n// import { Autocomplete } from '@ngbase/adk/autocomplete';\nimport { NgbChip } from './chip';\n\n@Directive({\n  selector: '[ngbChipGroup]',\n})\nexport class NgbChipGroup<T> {\n  readonly chips = contentChildren(NgbChip<T>);\n  // readonly autoComplete = inject(Autocomplete);\n\n  // constructor() {\n  //   effect(() => {\n  //     const chips = this.chips();\n  //     untracked(() => {\n  //       chips.forEach(chip => {\n  //         chip.close.subscribe(() => {\n  //           this.autoComplete.removeValue(chip.value());\n  //         });\n  //       });\n  //     });\n  //   });\n  // }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngbase-adk-clipboard.mjs

@@ -3,26 +3,41 @@ import { input, Directive } from '@angular/core';
 
 class CopyToClipboard {
     constructor() {
-        this.ngbCopyToClipboard = input();
+        this.ngbCopyToClipboard = input(...(ngDevMode ? [undefined, { debugName: "ngbCopyToClipboard" }] : []));
     }
     onClick(event) {
         event.preventDefault();
         const textToCopy = this.ngbCopyToClipboard();
         if (!textToCopy)
             return;
-        navigator.clipboard
-            .writeText(textToCopy)
-            .then(() => {
-            console.log('Text copied to clipboard');
-        })
-            .catch(err => {
-            console.error('Failed to copy text: ', err);
-        });
+        this._copyToClipboard(textToCopy);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: CopyToClipboard, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.0", type: CopyToClipboard, isStandalone: true, selector: "[ngbCopyToClipboard]", inputs: { ngbCopyToClipboard: { classPropertyName: "ngbCopyToClipboard", publicName: "ngbCopyToClipboard", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick($event)" }, classAttribute: "cursor-pointer" }, ngImport: i0 }); }
+    async _copyToClipboard(text) {
+        try {
+            if (navigator.clipboard && window.isSecureContext) {
+                await navigator.clipboard.writeText(text);
+            }
+            else {
+                // Fallback for older browsers
+                const textarea = document.createElement('textarea');
+                textarea.style.position = 'fixed';
+                textarea.style.opacity = '0';
+                textarea.style.left = '-9999px';
+                textarea.value = text;
+                document.body.appendChild(textarea);
+                textarea.select();
+                document.execCommand('copy'); // Fallback for older browsers
+                document.body.removeChild(textarea);
+            }
+        }
+        catch (error) {
+            console.warn('Failed to copy to clipboard:', error);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: CopyToClipboard, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.0", type: CopyToClipboard, isStandalone: true, selector: "[ngbCopyToClipboard]", inputs: { ngbCopyToClipboard: { classPropertyName: "ngbCopyToClipboard", publicName: "ngbCopyToClipboard", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick($event)" }, classAttribute: "cursor-pointer" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: CopyToClipboard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: CopyToClipboard, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbCopyToClipboard]',

package/fesm2022/ngbase-adk-clipboard.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngbase-adk-clipboard.mjs","sources":["../../../projects/adk/clipboard/clipboard.ts","../../../projects/adk/clipboard/ngbase-adk-clipboard.ts"],"sourcesContent":["import { Directive, input } from '@angular/core';\n\n@Directive({\n  selector: '[ngbCopyToClipboard]',\n  host: {\n    class: 'cursor-pointer',\n    '(click)': 'onClick($event)',\n  },\n})\nexport class CopyToClipboard {\n  readonly ngbCopyToClipboard = input<string>();\n\n  onClick(event: MouseEvent): void {\n    event.preventDefault();\n    const textToCopy = this.ngbCopyToClipboard();\n    if (!textToCopy) return;\n\n    navigator.clipboard\n      .writeText(textToCopy)\n      .then(() => {\n        console.log('Text copied to clipboard');\n      })\n      .catch(err => {\n        console.error('Failed to copy text: ', err);\n      });\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MASa,eAAe,CAAA;AAP5B,IAAA,WAAA,GAAA;QAQW,IAAkB,CAAA,kBAAA,GAAG,KAAK,EAAU;AAgB9C;AAdC,IAAA,OAAO,CAAC,KAAiB,EAAA;QACvB,KAAK,CAAC,cAAc,EAAE;AACtB,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,kBAAkB,EAAE;AAC5C,QAAA,IAAI,CAAC,UAAU;YAAE;AAEjB,QAAA,SAAS,CAAC;aACP,SAAS,CAAC,UAAU;aACpB,IAAI,CAAC,MAAK;AACT,YAAA,OAAO,CAAC,GAAG,CAAC,0BAA0B,CAAC;AACzC,SAAC;aACA,KAAK,CAAC,GAAG,IAAG;AACX,YAAA,OAAO,CAAC,KAAK,CAAC,uBAAuB,EAAE,GAAG,CAAC;AAC7C,SAAC,CAAC;;8GAfK,eAAe,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAf,eAAe,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBAAA,EAAA,oBAAA,EAAA,UAAA,EAAA,oBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAAf,eAAe,EAAA,UAAA,EAAA,CAAA;kBAP3B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,sBAAsB;AAChC,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,gBAAgB;AACvB,wBAAA,SAAS,EAAE,iBAAiB;AAC7B,qBAAA;AACF,iBAAA;;;ACRD;;AAEG;;;;"}
+{"version":3,"file":"ngbase-adk-clipboard.mjs","sources":["../../../projects/adk/clipboard/clipboard.ts","../../../projects/adk/clipboard/ngbase-adk-clipboard.ts"],"sourcesContent":["import { Directive, input } from '@angular/core';\n\n@Directive({\n  selector: '[ngbCopyToClipboard]',\n  host: {\n    class: 'cursor-pointer',\n    '(click)': 'onClick($event)',\n  },\n})\nexport class CopyToClipboard {\n  readonly ngbCopyToClipboard = input<string>();\n\n  onClick(event: MouseEvent): void {\n    event.preventDefault();\n    const textToCopy = this.ngbCopyToClipboard();\n    if (!textToCopy) return;\n\n    this._copyToClipboard(textToCopy);\n  }\n\n  async _copyToClipboard(text: string): Promise<void> {\n    try {\n      if (navigator.clipboard && window.isSecureContext) {\n        await navigator.clipboard.writeText(text);\n      } else {\n        // Fallback for older browsers\n        const textarea = document.createElement('textarea');\n        textarea.style.position = 'fixed';\n        textarea.style.opacity = '0';\n        textarea.style.left = '-9999px';\n        textarea.value = text;\n\n        document.body.appendChild(textarea);\n        textarea.select();\n        document.execCommand('copy'); // Fallback for older browsers\n        document.body.removeChild(textarea);\n      }\n    } catch (error) {\n      console.warn('Failed to copy to clipboard:', error);\n    }\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MASa,eAAe,CAAA;AAP5B,IAAA,WAAA,GAAA;QAQW,IAAkB,CAAA,kBAAA,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,oBAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;AA+B9C;AA7BC,IAAA,OAAO,CAAC,KAAiB,EAAA;QACvB,KAAK,CAAC,cAAc,EAAE;AACtB,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,kBAAkB,EAAE;AAC5C,QAAA,IAAI,CAAC,UAAU;YAAE;AAEjB,QAAA,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC;;IAGnC,MAAM,gBAAgB,CAAC,IAAY,EAAA;AACjC,QAAA,IAAI;YACF,IAAI,SAAS,CAAC,SAAS,IAAI,MAAM,CAAC,eAAe,EAAE;gBACjD,MAAM,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC;;iBACpC;;gBAEL,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC;AACnD,gBAAA,QAAQ,CAAC,KAAK,CAAC,QAAQ,GAAG,OAAO;AACjC,gBAAA,QAAQ,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG;AAC5B,gBAAA,QAAQ,CAAC,KAAK,CAAC,IAAI,GAAG,SAAS;AAC/B,gBAAA,QAAQ,CAAC,KAAK,GAAG,IAAI;AAErB,gBAAA,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC;gBACnC,QAAQ,CAAC,MAAM,EAAE;AACjB,gBAAA,QAAQ,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;AAC7B,gBAAA,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC;;;QAErC,OAAO,KAAK,EAAE;AACd,YAAA,OAAO,CAAC,IAAI,CAAC,8BAA8B,EAAE,KAAK,CAAC;;;8GA7B5C,eAAe,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAf,eAAe,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBAAA,EAAA,oBAAA,EAAA,UAAA,EAAA,oBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAAf,eAAe,EAAA,UAAA,EAAA,CAAA;kBAP3B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,sBAAsB;AAChC,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,gBAAgB;AACvB,wBAAA,SAAS,EAAE,iBAAiB;AAC7B,qBAAA;AACF,iBAAA;;;ACRD;;AAEG;;;;"}

package/fesm2022/ngbase-adk-collections.mjs

@@ -4,11 +4,11 @@ class SelectionModel {
     constructor(multiple = false, selected = [], items = signal([])) {
         this.multiple = multiple;
         this.items = items;
-        this.selected = signal([]);
-        this.hasValue = computed(() => this.selected().length > 0);
-        this.isEmpty = computed(() => this.selected().length === 0);
-        this.isAllSelected = computed(() => this.selected().length > 0 && this.selected().length === this.items().length);
-        this.isIndeterminate = computed(() => this.selected().length > 0 && !this.isAllSelected());
+        this.selected = signal([], ...(ngDevMode ? [{ debugName: "selected" }] : []));
+        this.hasValue = computed(() => this.selected().length > 0, ...(ngDevMode ? [{ debugName: "hasValue" }] : []));
+        this.isEmpty = computed(() => this.selected().length === 0, ...(ngDevMode ? [{ debugName: "isEmpty" }] : []));
+        this.isAllSelected = computed(() => this.selected().length > 0 && this.selected().length === this.items().length, ...(ngDevMode ? [{ debugName: "isAllSelected" }] : []));
+        this.isIndeterminate = computed(() => this.selected().length > 0 && !this.isAllSelected(), ...(ngDevMode ? [{ debugName: "isIndeterminate" }] : []));
         this.selected.set(selected);
     }
     clear() {

package/fesm2022/ngbase-adk-collections.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngbase-adk-collections.mjs","sources":["../../../projects/adk/collections/SelectionModel.ts","../../../projects/adk/collections/ngbase-adk-collections.ts"],"sourcesContent":["import { computed, signal, Signal } from '@angular/core';\n\nexport class SelectionModel<T> {\n  readonly selected = signal<T[]>([]);\n  readonly hasValue = computed(() => this.selected().length > 0);\n  readonly isEmpty = computed(() => this.selected().length === 0);\n  readonly isAllSelected = computed(\n    () => this.selected().length > 0 && this.selected().length === this.items().length,\n  );\n  readonly isIndeterminate = computed(() => this.selected().length > 0 && !this.isAllSelected());\n\n  constructor(\n    public multiple = false,\n    selected: T[] = [],\n    public items: Signal<T[]> = signal([]),\n  ) {\n    this.selected.set(selected);\n  }\n\n  clear() {\n    this.selected.set([]);\n  }\n\n  select(item: T) {\n    this.selected.update(selected => (this.multiple ? [...selected, item] : [item]));\n  }\n\n  deselect(item: T) {\n    this.selected.update(selected => (this.multiple ? selected.filter(i => i !== item) : []));\n  }\n\n  selectAll(items: T[]) {\n    this.selected.update(selected => (this.multiple ? [...selected, ...items] : items));\n  }\n\n  isSelected(item: T) {\n    return this.selected().includes(item);\n  }\n\n  toggle(item: T) {\n    this.selected.update(selected =>\n      selected.includes(item) ? selected.filter(i => i !== item) : [...selected, item],\n    );\n  }\n\n  toggleAll() {\n    const isAll = this.isIndeterminate() || !this.isAllSelected();\n    this.selected.update(x =>\n      isAll ? (this.multiple ? [...x, ...this.items()] : this.items()) : [],\n    );\n  }\n\n  sort(fn: (a: T, b: T) => number) {\n    this.selected.update(selected => selected.sort(fn));\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;MAEa,cAAc,CAAA;IASzB,WACS,CAAA,QAAA,GAAW,KAAK,EACvB,QAAgB,GAAA,EAAE,EACX,KAAqB,GAAA,MAAM,CAAC,EAAE,CAAC,EAAA;QAF/B,IAAQ,CAAA,QAAA,GAAR,QAAQ;QAER,IAAK,CAAA,KAAA,GAAL,KAAK;AAXL,QAAA,IAAA,CAAA,QAAQ,GAAG,MAAM,CAAM,EAAE,CAAC;AAC1B,QAAA,IAAA,CAAA,QAAQ,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,QAAQ,EAAE,CAAC,MAAM,GAAG,CAAC,CAAC;AACrD,QAAA,IAAA,CAAA,OAAO,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,QAAQ,EAAE,CAAC,MAAM,KAAK,CAAC,CAAC;AACtD,QAAA,IAAA,CAAA,aAAa,GAAG,QAAQ,CAC/B,MAAM,IAAI,CAAC,QAAQ,EAAE,CAAC,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC,MAAM,KAAK,IAAI,CAAC,KAAK,EAAE,CAAC,MAAM,CACnF;QACQ,IAAe,CAAA,eAAA,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,QAAQ,EAAE,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;AAO5F,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,CAAC;;IAG7B,KAAK,GAAA;AACH,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;;AAGvB,IAAA,MAAM,CAAC,IAAO,EAAA;AACZ,QAAA,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,QAAQ,KAAK,IAAI,CAAC,QAAQ,GAAG,CAAC,GAAG,QAAQ,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC;;AAGlF,IAAA,QAAQ,CAAC,IAAO,EAAA;AACd,QAAA,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,QAAQ,KAAK,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;;AAG3F,IAAA,SAAS,CAAC,KAAU,EAAA;AAClB,QAAA,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,QAAQ,KAAK,IAAI,CAAC,QAAQ,GAAG,CAAC,GAAG,QAAQ,EAAE,GAAG,KAAK,CAAC,GAAG,KAAK,CAAC,CAAC;;AAGrF,IAAA,UAAU,CAAC,IAAO,EAAA;QAChB,OAAO,IAAI,CAAC,QAAQ,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC;;AAGvC,IAAA,MAAM,CAAC,IAAO,EAAA;AACZ,QAAA,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,QAAQ,IAC3B,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,GAAG,CAAC,GAAG,QAAQ,EAAE,IAAI,CAAC,CACjF;;IAGH,SAAS,GAAA;AACP,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;AAC7D,QAAA,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,IACpB,KAAK,IAAI,IAAI,CAAC,QAAQ,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,GAAG,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,CACtE;;AAGH,IAAA,IAAI,CAAC,EAA0B,EAAA;AAC7B,QAAA,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,QAAQ,IAAI,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;;AAEtD;;ACvDD;;AAEG;;;;"}
+{"version":3,"file":"ngbase-adk-collections.mjs","sources":["../../../projects/adk/collections/SelectionModel.ts","../../../projects/adk/collections/ngbase-adk-collections.ts"],"sourcesContent":["import { computed, signal, Signal } from '@angular/core';\n\nexport class SelectionModel<T> {\n  readonly selected = signal<T[]>([]);\n  readonly hasValue = computed(() => this.selected().length > 0);\n  readonly isEmpty = computed(() => this.selected().length === 0);\n  readonly isAllSelected = computed(\n    () => this.selected().length > 0 && this.selected().length === this.items().length,\n  );\n  readonly isIndeterminate = computed(() => this.selected().length > 0 && !this.isAllSelected());\n\n  constructor(\n    public multiple = false,\n    selected: T[] = [],\n    public items: Signal<T[]> = signal([]),\n  ) {\n    this.selected.set(selected);\n  }\n\n  clear() {\n    this.selected.set([]);\n  }\n\n  select(item: T) {\n    this.selected.update(selected => (this.multiple ? [...selected, item] : [item]));\n  }\n\n  deselect(item: T) {\n    this.selected.update(selected => (this.multiple ? selected.filter(i => i !== item) : []));\n  }\n\n  selectAll(items: T[]) {\n    this.selected.update(selected => (this.multiple ? [...selected, ...items] : items));\n  }\n\n  isSelected(item: T) {\n    return this.selected().includes(item);\n  }\n\n  toggle(item: T) {\n    this.selected.update(selected =>\n      selected.includes(item) ? selected.filter(i => i !== item) : [...selected, item],\n    );\n  }\n\n  toggleAll() {\n    const isAll = this.isIndeterminate() || !this.isAllSelected();\n    this.selected.update(x =>\n      isAll ? (this.multiple ? [...x, ...this.items()] : this.items()) : [],\n    );\n  }\n\n  sort(fn: (a: T, b: T) => number) {\n    this.selected.update(selected => selected.sort(fn));\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngbase-adk-color-picker.mjs

@@ -211,10 +211,10 @@ function roundTo2Decimals(num) {
 }
 
 class ColorSpectrum {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorSpectrum, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0", type: ColorSpectrum, isStandalone: true, selector: "[ngbColorSpectrum]", host: { styleAttribute: "background-image: linear-gradient(0deg, rgb(0, 0, 0), transparent), linear-gradient(90deg, rgb(255, 255, 255), rgba(255, 255, 255, 0)); background-color: var(--hue-color);" }, hostDirectives: [{ directive: i1.Drag }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorSpectrum, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0", type: ColorSpectrum, isStandalone: true, selector: "[ngbColorSpectrum]", host: { styleAttribute: "background-image: linear-gradient(0deg, rgb(0, 0, 0), transparent), linear-gradient(90deg, rgb(255, 255, 255), rgba(255, 255, 255, 0)); background-color: var(--hue-color);" }, hostDirectives: [{ directive: i1.Drag }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorSpectrum, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorSpectrum, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbColorSpectrum]',
@@ -225,10 +225,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImpor
                 }]
         }] });
 class ColorSpectrumSelector {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorSpectrumSelector, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0", type: ColorSpectrumSelector, isStandalone: true, selector: "[ngbColorSpectrumSelector]", host: { attributes: { "type": "button" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorSpectrumSelector, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0", type: ColorSpectrumSelector, isStandalone: true, selector: "[ngbColorSpectrumSelector]", host: { attributes: { "type": "button" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorSpectrumSelector, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorSpectrumSelector, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbColorSpectrumSelector]',
@@ -238,18 +238,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImpor
                 }]
         }] });
 class ColorSelected {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorSelected, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0", type: ColorSelected, isStandalone: true, selector: "[ngbColorSelected]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorSelected, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0", type: ColorSelected, isStandalone: true, selector: "[ngbColorSelected]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorSelected, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorSelected, decorators: [{
             type: Directive,
             args: [{ selector: '[ngbColorSelected]' }]
         }] });
 class ColorHue {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorHue, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0", type: ColorHue, isStandalone: true, selector: "[ngbColorHue]", host: { styleAttribute: "inset: 0px; background: linear-gradient(to right, rgb(255, 0, 0), rgb(255, 255, 0), rgb(0, 255, 0), rgb(0, 255, 255), rgb(0, 0, 255), rgb(255, 0, 255), rgb(255, 0, 0));" }, hostDirectives: [{ directive: i1.Drag }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorHue, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0", type: ColorHue, isStandalone: true, selector: "[ngbColorHue]", host: { styleAttribute: "inset: 0px; background: linear-gradient(to right, rgb(255, 0, 0), rgb(255, 255, 0), rgb(0, 255, 0), rgb(0, 255, 255), rgb(0, 0, 255), rgb(255, 0, 255), rgb(255, 0, 0));" }, hostDirectives: [{ directive: i1.Drag }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorHue, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorHue, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbColorHue]',
@@ -260,10 +260,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImpor
                 }]
         }] });
 class ColorHueThumb {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorHueThumb, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0", type: ColorHueThumb, isStandalone: true, selector: "[ngbColorHueThumb]", host: { attributes: { "type": "button" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorHueThumb, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0", type: ColorHueThumb, isStandalone: true, selector: "[ngbColorHueThumb]", host: { attributes: { "type": "button" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorHueThumb, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorHueThumb, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbColorHueThumb]',
@@ -273,14 +273,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImpor
                 }]
         }] });
 class ColorAlpha {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorAlpha, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.0", type: ColorAlpha, isStandalone: true, selector: "[ngbColorAlpha]", host: { styleAttribute: "\n      background-image: conic-gradient(\n        rgba(0, 0, 0, 0.06) 0 25%,\n        transparent 0 50%,\n        rgba(0, 0, 0, 0.06) 0 75%,\n        transparent 0\n      );\n      background-size: 8px 8px;\n    " }, hostDirectives: [{ directive: i1.Drag }], ngImport: i0, template: ` <div
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorAlpha, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.0", type: ColorAlpha, isStandalone: true, selector: "[ngbColorAlpha]", host: { styleAttribute: "\n      background-image: conic-gradient(\n        rgba(0, 0, 0, 0.06) 0 25%,\n        transparent 0 50%,\n        rgba(0, 0, 0, 0.06) 0 75%,\n        transparent 0\n      );\n      background-size: 8px 8px;\n    " }, hostDirectives: [{ directive: i1.Drag }], ngImport: i0, template: ` <div
     style="height: 100%; inset: 0px; background: linear-gradient(to right, rgba(255, 0, 4, 0), var(--hue-color));"
   >
     <ng-content />
   </div>`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorAlpha, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorAlpha, decorators: [{
             type: Component,
             args: [{
                     selector: '[ngbColorAlpha]',
@@ -304,10 +304,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImpor
                 }]
         }] });
 class ColorAlphaThumb {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorAlphaThumb, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0", type: ColorAlphaThumb, isStandalone: true, selector: "[ngbColorAlphaThumb]", host: { attributes: { "type": "button" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorAlphaThumb, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.2.0", type: ColorAlphaThumb, isStandalone: true, selector: "[ngbColorAlphaThumb]", host: { attributes: { "type": "button" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorAlphaThumb, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorAlphaThumb, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbColorAlphaThumb]',
@@ -331,8 +331,8 @@ class NgbColorPicker {
         this.alphaDiv = viewChild.required(ColorAlpha, { read: Drag });
         this.alphaSelector = viewChild.required(ColorAlphaThumb, { read: ElementRef });
         this.valueChange = output();
-        this.format = input(this.dialogRef?.data.format || 'hex');
-        this.presetColors = input(this.dialogRef?.data.presetColors || []);
+        this.format = input(this.dialogRef?.data.format || 'hex', ...(ngDevMode ? [{ debugName: "format" }] : []));
+        this.presetColors = input(this.dialogRef?.data.presetColors || [], ...(ngDevMode ? [{ debugName: "presetColors" }] : []));
         this.hue = 0;
         this.saturation = 0;
         this.brightness = 0;
@@ -470,10 +470,10 @@ class NgbColorPicker {
         };
         return formatters[this.format()]?.() || '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgbColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "19.0.0", type: NgbColorPicker, isStandalone: true, selector: "ngb-color-picker-container", inputs: { format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, presetColors: { classPropertyName: "presetColors", publicName: "presetColors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, host: { styleAttribute: "\n      --hue-color: rgb(255, 0, 0);\n      --spectrum-color: rgb(0, 0, 0);\n    " }, viewQueries: [{ propertyName: "hueDiv", first: true, predicate: ColorHue, descendants: true, read: Drag, isSignal: true }, { propertyName: "hueSelector", first: true, predicate: ColorHueThumb, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "spectrumDiv", first: true, predicate: ColorSpectrum, descendants: true, read: Drag, isSignal: true }, { propertyName: "spectrumSelector", first: true, predicate: ColorSpectrumSelector, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "selectedColor", first: true, predicate: ColorSelected, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "alphaDiv", first: true, predicate: ColorAlpha, descendants: true, read: Drag, isSignal: true }, { propertyName: "alphaSelector", first: true, predicate: ColorAlphaThumb, descendants: true, read: ElementRef, isSignal: true }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "20.2.0", type: NgbColorPicker, isStandalone: true, selector: "ngb-color-picker-container", inputs: { format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, presetColors: { classPropertyName: "presetColors", publicName: "presetColors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, host: { styleAttribute: "\n      --hue-color: rgb(255, 0, 0);\n      --spectrum-color: rgb(0, 0, 0);\n    " }, viewQueries: [{ propertyName: "hueDiv", first: true, predicate: ColorHue, descendants: true, read: Drag, isSignal: true }, { propertyName: "hueSelector", first: true, predicate: ColorHueThumb, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "spectrumDiv", first: true, predicate: ColorSpectrum, descendants: true, read: Drag, isSignal: true }, { propertyName: "spectrumSelector", first: true, predicate: ColorSpectrumSelector, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "selectedColor", first: true, predicate: ColorSelected, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "alphaDiv", first: true, predicate: ColorAlpha, descendants: true, read: Drag, isSignal: true }, { propertyName: "alphaSelector", first: true, predicate: ColorAlphaThumb, descendants: true, read: ElementRef, isSignal: true }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgbColorPicker, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbColorPicker, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ngb-color-picker-container',
@@ -497,9 +497,9 @@ class ColorPickerTrigger {
         this.colorPicker = inject(ColorPicker, { optional: true }) ?? NgbColorPicker;
         this.popover = ngbPopoverPortal();
         this.injector = inject(Injector);
-        this.format = input('hex');
-        this.presetColors = input();
-        this.value = model();
+        this.format = input('hex', ...(ngDevMode ? [{ debugName: "format" }] : []));
+        this.presetColors = input(...(ngDevMode ? [undefined, { debugName: "presetColors" }] : []));
+        this.value = model(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
     }
     open() {
         const { childSignal } = this.popover.open(this.colorPicker, {
@@ -520,12 +520,12 @@ class ColorPickerTrigger {
                     });
                 });
             }
-        }, { injector: this.injector });
+        }, ...(ngDevMode ? [{ debugName: "effectRef", injector: this.injector }] : [{ injector: this.injector }]));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorPickerTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.0", type: ColorPickerTrigger, isStandalone: true, selector: "[ngbColorPickerTrigger]", inputs: { format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, presetColors: { classPropertyName: "presetColors", publicName: "presetColors", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { listeners: { "click": "open()" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorPickerTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.0", type: ColorPickerTrigger, isStandalone: true, selector: "[ngbColorPickerTrigger]", inputs: { format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, presetColors: { classPropertyName: "presetColors", publicName: "presetColors", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { listeners: { "click": "open()" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ColorPickerTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: ColorPickerTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbColorPickerTrigger]',
@@ -537,9 +537,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImpor
 
 class NgbColorInput {
     constructor() {
-        this.format = input('hex');
-        this.presetColors = input();
-        this.value = model('');
+        this.format = input('hex', ...(ngDevMode ? [{ debugName: "format" }] : []));
+        this.presetColors = input(...(ngDevMode ? [undefined, { debugName: "presetColors" }] : []));
+        this.value = model('', ...(ngDevMode ? [{ debugName: "value" }] : []));
         this.onChange = (_) => { };
         this.onTouched = () => { };
     }
@@ -557,10 +557,10 @@ class NgbColorInput {
     registerOnTouched(fn) {
         this.onTouched = fn;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgbColorInput, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.0", type: NgbColorInput, isStandalone: true, selector: "[ngbColorInput]", inputs: { format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, presetColors: { classPropertyName: "presetColors", publicName: "presetColors", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, providers: [provideValueAccessor(NgbColorInput)], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbColorInput, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.2.0", type: NgbColorInput, isStandalone: true, selector: "[ngbColorInput]", inputs: { format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, presetColors: { classPropertyName: "presetColors", publicName: "presetColors", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, providers: [provideValueAccessor(NgbColorInput)], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgbColorInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.0", ngImport: i0, type: NgbColorInput, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngbColorInput]',