@ship-ui/core 0.18.4 → 0.18.5

package/fesm2022/ship-ui-core.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, computed, ElementRef, Renderer2, input, ChangeDetectionStrategy, Component, viewChild, effect, HostListener, NgModule, signal, Injectable, DOCUMENT, model, output, ApplicationRef, OutputEmitterRef, TemplateRef, createComponent, isSignal, DestroyRef, PLATFORM_ID, ViewChild, Directive, contentChild, contentChildren, afterNextRender, Injector, HostBinding, runInInjectionContext, ChangeDetectorRef, viewChildren, untracked, ViewContainerRef, EnvironmentInjector } from '@angular/core';
+import { InjectionToken, inject, computed, ElementRef, Renderer2, input, ChangeDetectionStrategy, Component, viewChild, effect, HostListener, NgModule, signal, Injectable, DOCUMENT, model, output, ApplicationRef, OutputEmitterRef, TemplateRef, createComponent, isSignal, DestroyRef, PLATFORM_ID, ViewChild, Directive, contentChild, contentChildren, afterNextRender, Injector, HostBinding, untracked, runInInjectionContext, ChangeDetectorRef, viewChildren, ViewContainerRef, EnvironmentInjector } from '@angular/core';
 import { isPlatformBrowser, JsonPipe, DatePipe, isPlatformServer, NgTemplateOutlet } from '@angular/common';
 import { NgModel } from '@angular/forms';
 import { SIGNAL } from '@angular/core/primitives/signals';
@@ -29,6 +29,9 @@ function shipComponentClasses(componentName, inputs) {
         }
         // Resolve color (Input > Component Config > empty)
         const color = inputs.color?.() || componentConfig?.color;
+        if (!variant) {
+            variant = 'base';
+        }
         // Resolve size (Input > Component Config > empty)
         const size = inputs.size?.() || componentConfig?.size;
         // Resolve sharp (Input > Component Config > false)
@@ -66,12 +69,10 @@ class ShipIcon {
     constructor() {
         this.#selfRef = inject(ElementRef);
         this.#renderer = inject(Renderer2);
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
-        this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('icon', {
             color: this.color,
-            variant: this.variant,
             size: this.size,
         });
     }
@@ -86,12 +87,12 @@ class ShipIcon {
             this.#renderer.addClass(this.#selfRef.nativeElement, potentialType);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipIcon, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ShipIcon, isStandalone: true, selector: "sh-icon", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipIcon, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: ShipIcon, isStandalone: true, selector: "sh-icon", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: `
     <ng-content />
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipIcon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipIcon, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-icon',
@@ -105,27 +106,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
                         '[class]': 'hostClasses()',
                     },
                 }]
-        }], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
+        }], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
 
 class ShipAlert {
     constructor() {
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('alert', {
             color: this.color,
             variant: this.variant,
         });
         this._el = inject(ElementRef); // Used by alert container
-        this.alertService = input(null, ...(ngDevMode ? [{ debugName: "alertService" }] : []));
-        this.id = input(null, ...(ngDevMode ? [{ debugName: "id" }] : []));
+        this.alertService = input(null, ...(ngDevMode ? [{ debugName: "alertService" }] : /* istanbul ignore next */ []));
+        this.id = input(null, ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
     }
     removeAlert() {
         if (this.id() && this.alertService()) {
             this.alertService()?.removeAlert(this.id());
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipAlert, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipAlert, isStandalone: true, selector: "sh-alert", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, alertService: { classPropertyName: "alertService", publicName: "alertService", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" }, classAttribute: "sh-sheet" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipAlert, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipAlert, isStandalone: true, selector: "sh-alert", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, alertService: { classPropertyName: "alertService", publicName: "alertService", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" }, classAttribute: "sh-sheet" }, ngImport: i0, template: `
     <div class="alert">
       <div #ref class="icon" [style.display]="!ref.children.length ? 'none' : 'block'">
         <ng-content select="[icon]" />
@@ -169,9 +170,9 @@ class ShipAlert {
         <ng-content select="p" />
       </div>
     </div>
-  `, isInline: true, dependencies: [{ kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "variant", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipAlert, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipAlert, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-alert',
@@ -231,10 +232,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 
 class ShipAlertContainer {
     constructor() {
-        this.inline = input(null, ...(ngDevMode ? [{ debugName: "inline" }] : []));
+        this.inline = input(null, ...(ngDevMode ? [{ debugName: "inline" }] : /* istanbul ignore next */ []));
         this.alerts = viewChild.required('alerts');
         this.scroller = viewChild.required('scroller');
-        this.alertService = input.required(...(ngDevMode ? [{ debugName: "alertService" }] : []));
+        this.alertService = input.required(...(ngDevMode ? [{ debugName: "alertService" }] : /* istanbul ignore next */ []));
         // alertHistory = this.alertService()?.alertHistory;
         // alertHistoryIsOpen = this.alertService()?.alertHistoryIsOpen;
         // alertHistoryIsHidden = this.alertService()?.alertHistoryIsHidden;
@@ -242,12 +243,12 @@ class ShipAlertContainer {
             return this.alertService()
                 .alertHistory()
                 .filter((x) => x.isOpen).length;
-        }, ...(ngDevMode ? [{ debugName: "numberOfOpenAlerts" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "numberOfOpenAlerts" }] : /* istanbul ignore next */ []));
         this.#e = effect(() => {
             this.alertService().alertHistory();
             this.alertService().alertHistoryIsOpen();
             this.#scrollToBottom();
-        }, ...(ngDevMode ? [{ debugName: "#e" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#e" }] : /* istanbul ignore next */ []));
     }
     #e;
     #scrollToBottom() {
@@ -288,10 +289,10 @@ class ShipAlertContainer {
             ? this.alertService().alertHistory().length - 1 * 40 + 'ms'
             : (this.numberOfOpenAlerts() - i) * 40 + 'ms';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipAlertContainer, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipAlertContainer, isStandalone: true, selector: "ship-alert-container", inputs: { inline: { classPropertyName: "inline", publicName: "inline", isSignal: true, isRequired: false, transformFunction: null }, alertService: { classPropertyName: "alertService", publicName: "alertService", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "mouseover": "onMouseOver()", "mouseout": "onMouseOut()" } }, viewQueries: [{ propertyName: "alerts", first: true, predicate: ["alerts"], descendants: true, isSignal: true }, { propertyName: "scroller", first: true, predicate: ["scroller"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"scroller\" #scroller>\n  <div class=\"container\">\n    @for (alert of this.alertService().alertHistory(); track $index) {\n      <sh-alert\n        #alerts\n        [class]=\"alert.type\"\n        [id]=\"alert.id\"\n        [alertService]=\"alertService()\"\n        [style.transition-delay]=\"transitionDelay($index, true)\"\n        [class.animate-in]=\"alert.animateIn\"\n        [class.animate-out]=\"alert.animateOut\"\n        [class.is-hidden]=\"this.alertService().alertHistoryIsHidden() && !alert.isOpen\">\n        <div title>{{ alert.title }}</div>\n\n        @if (alert.content) {\n          <div content>\n            {{ alert.content }}\n          </div>\n        }\n      </sh-alert>\n    }\n  </div>\n</div>\n<div\n  class=\"tray\"\n  [class.tray-is-hidden]=\"!this.alertService().alertHistoryIsHidden()\"\n  (mouseover)=\"this.onMouseOver()\"\n  (mouseout)=\"this.onMouseOut()\">\n  <sh-icon class=\"small\">info</sh-icon>\n</div>\n", dependencies: [{ kind: "component", type: ShipAlert, selector: "sh-alert", inputs: ["color", "variant", "alertService", "id"] }, { kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "variant", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipAlertContainer, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipAlertContainer, isStandalone: true, selector: "ship-alert-container", inputs: { inline: { classPropertyName: "inline", publicName: "inline", isSignal: true, isRequired: false, transformFunction: null }, alertService: { classPropertyName: "alertService", publicName: "alertService", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "mouseover": "onMouseOver()", "mouseout": "onMouseOut()" } }, viewQueries: [{ propertyName: "alerts", first: true, predicate: ["alerts"], descendants: true, isSignal: true }, { propertyName: "scroller", first: true, predicate: ["scroller"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"scroller\" #scroller>\n  <div class=\"container\">\n    @for (alert of this.alertService().alertHistory(); track $index) {\n      <sh-alert\n        #alerts\n        [class]=\"alert.type\"\n        [id]=\"alert.id\"\n        [alertService]=\"alertService()\"\n        [style.transition-delay]=\"transitionDelay($index, true)\"\n        [class.animate-in]=\"alert.animateIn\"\n        [class.animate-out]=\"alert.animateOut\"\n        [class.is-hidden]=\"this.alertService().alertHistoryIsHidden() && !alert.isOpen\">\n        <div title>{{ alert.title }}</div>\n\n        @if (alert.content) {\n          <div content>\n            {{ alert.content }}\n          </div>\n        }\n      </sh-alert>\n    }\n  </div>\n</div>\n<div\n  class=\"tray\"\n  [class.tray-is-hidden]=\"!this.alertService().alertHistoryIsHidden()\"\n  (mouseover)=\"this.onMouseOver()\"\n  (mouseout)=\"this.onMouseOut()\">\n  <sh-icon class=\"small\">info</sh-icon>\n</div>\n", dependencies: [{ kind: "component", type: ShipAlert, selector: "sh-alert", inputs: ["color", "variant", "alertService", "id"] }, { kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipAlertContainer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipAlertContainer, decorators: [{
             type: Component,
             args: [{ selector: 'ship-alert-container', imports: [ShipAlert, ShipIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"scroller\" #scroller>\n  <div class=\"container\">\n    @for (alert of this.alertService().alertHistory(); track $index) {\n      <sh-alert\n        #alerts\n        [class]=\"alert.type\"\n        [id]=\"alert.id\"\n        [alertService]=\"alertService()\"\n        [style.transition-delay]=\"transitionDelay($index, true)\"\n        [class.animate-in]=\"alert.animateIn\"\n        [class.animate-out]=\"alert.animateOut\"\n        [class.is-hidden]=\"this.alertService().alertHistoryIsHidden() && !alert.isOpen\">\n        <div title>{{ alert.title }}</div>\n\n        @if (alert.content) {\n          <div content>\n            {{ alert.content }}\n          </div>\n        }\n      </sh-alert>\n    }\n  </div>\n</div>\n<div\n  class=\"tray\"\n  [class.tray-is-hidden]=\"!this.alertService().alertHistoryIsHidden()\"\n  (mouseover)=\"this.onMouseOver()\"\n  (mouseout)=\"this.onMouseOut()\">\n  <sh-icon class=\"small\">info</sh-icon>\n</div>\n" }]
         }], propDecorators: { inline: [{ type: i0.Input, args: [{ isSignal: true, alias: "inline", required: false }] }], alerts: [{ type: i0.ViewChild, args: ['alerts', { isSignal: true }] }], scroller: [{ type: i0.ViewChild, args: ['scroller', { isSignal: true }] }], alertService: [{ type: i0.Input, args: [{ isSignal: true, alias: "alertService", required: true }] }], onMouseOver: [{
@@ -303,11 +304,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
             }] } });
 
 class ShipAlertModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.5", ngImport: i0, type: ShipAlertModule, imports: [ShipAlert, ShipAlertContainer], exports: [ShipAlert, ShipAlertContainer] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipAlertModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.5", ngImport: i0, type: ShipAlertModule, imports: [ShipAlert, ShipAlertContainer], exports: [ShipAlert, ShipAlertContainer] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipAlertModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipAlertModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipAlertModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [ShipAlert, ShipAlertContainer],
@@ -322,9 +323,9 @@ function generateUniqueId() {
 
 class ShipAlertService {
     constructor() {
-        this.alertHistory = signal([], ...(ngDevMode ? [{ debugName: "alertHistory" }] : []));
-        this.alertHistoryIsOpen = signal(false, ...(ngDevMode ? [{ debugName: "alertHistoryIsOpen" }] : []));
-        this.alertHistoryIsHidden = signal(true, ...(ngDevMode ? [{ debugName: "alertHistoryIsHidden" }] : []));
+        this.alertHistory = signal([], ...(ngDevMode ? [{ debugName: "alertHistory" }] : /* istanbul ignore next */ []));
+        this.alertHistoryIsOpen = signal(false, ...(ngDevMode ? [{ debugName: "alertHistoryIsOpen" }] : /* istanbul ignore next */ []));
+        this.alertHistoryIsHidden = signal(true, ...(ngDevMode ? [{ debugName: "alertHistoryIsHidden" }] : /* istanbul ignore next */ []));
     }
     error(message) {
         this.addAlert({
@@ -390,10 +391,10 @@ class ShipAlertService {
     setHidden(isHidden) {
         this.alertHistoryIsHidden.set(isHidden);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipAlertService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipAlertService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipAlertService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipAlertService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipAlertService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipAlertService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -414,15 +415,15 @@ class ShipDialog {
     constructor() {
         this.#document = inject(DOCUMENT);
         this.#shConfig = inject(SHIP_CONFIG, { optional: true });
-        this.dialogRef = viewChild('dialogRef', ...(ngDevMode ? [{ debugName: "dialogRef" }] : []));
-        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
-        this.options = input(...(ngDevMode ? [undefined, { debugName: "options" }] : []));
+        this.dialogRef = viewChild('dialogRef', ...(ngDevMode ? [{ debugName: "dialogRef" }] : /* istanbul ignore next */ []));
+        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+        this.options = input(...(ngDevMode ? [undefined, { debugName: "options" }] : /* istanbul ignore next */ []));
         this.closed = output();
         this.defaultOptionMerge = computed(() => ({
             ...DEFAULT_OPTIONS$1,
             ...{ class: this.#shConfig?.dialogType ?? 'default' },
             ...this.options(),
-        }), ...(ngDevMode ? [{ debugName: "defaultOptionMerge" }] : []));
+        }), ...(ngDevMode ? [{ debugName: "defaultOptionMerge" }] : /* istanbul ignore next */ []));
         this.abortController = null;
         this.isOpenEffect = effect(() => {
             const dialogEl = this.dialogRef()?.nativeElement;
@@ -455,15 +456,15 @@ class ShipDialog {
                 dialogEl.close();
                 queueMicrotask(() => this.closed.emit());
             }
-        }, ...(ngDevMode ? [{ debugName: "isOpenEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "isOpenEffect" }] : /* istanbul ignore next */ []));
     }
     #document;
     #shConfig;
     ngOnDestroy() {
         this.abortController?.abort();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipDialog, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipDialog, isStandalone: true, selector: "sh-dialog", inputs: { isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange", closed: "closed" }, viewQueries: [{ propertyName: "dialogRef", first: true, predicate: ["dialogRef"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipDialog, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipDialog, isStandalone: true, selector: "sh-dialog", inputs: { isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange", closed: "closed" }, viewQueries: [{ propertyName: "dialogRef", first: true, predicate: ["dialogRef"], descendants: true, isSignal: true }], ngImport: i0, template: `
     @let options = this.defaultOptionMerge();
 
     @if (isOpen()) {
@@ -486,7 +487,7 @@ class ShipDialog {
     }
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipDialog, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipDialog, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-dialog',
@@ -643,10 +644,10 @@ class ShipDialogService {
     ngOnDestroy() {
         this.#cleanupRefs(true);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipDialogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipDialogService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipDialogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipDialogService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipDialogService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipDialogService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -657,7 +658,7 @@ function classMutationSignal(_element = null) {
     const element = _element ?? inject(ElementRef).nativeElement;
     if (!element)
         return signal('');
-    const classListSignal = signal(element.className, ...(ngDevMode ? [{ debugName: "classListSignal" }] : []));
+    const classListSignal = signal(element.className, ...(ngDevMode ? [{ debugName: "classListSignal" }] : /* istanbul ignore next */ []));
     if (typeof MutationObserver === 'undefined')
         return classListSignal.asReadonly();
     const destroyRef = inject(DestroyRef);
@@ -896,37 +897,37 @@ class ShipBlueprint {
         this.#selfRef = inject((ElementRef));
         this.#currentClass = classMutationSignal();
         this.#htmlClass = classMutationSignal(this.#document.documentElement);
-        this.asDots = computed(() => this.#currentClass().includes('dots'), ...(ngDevMode ? [{ debugName: "asDots" }] : []));
-        this.lightMode = computed(() => this.#htmlClass().includes('light'), ...(ngDevMode ? [{ debugName: "lightMode" }] : []));
-        this.forceUnique = input(true, ...(ngDevMode ? [{ debugName: "forceUnique" }] : []));
-        this.autoLayout = input(false, ...(ngDevMode ? [{ debugName: "autoLayout" }] : []));
-        this.gridSize = input(20, ...(ngDevMode ? [{ debugName: "gridSize" }] : []));
-        this.snapToGrid = input(true, ...(ngDevMode ? [{ debugName: "snapToGrid" }] : []));
-        this.gridColor = input(['#d8d8d8', '#2c2c2c'], ...(ngDevMode ? [{ debugName: "gridColor" }] : []));
-        this.nodes = model([], ...(ngDevMode ? [{ debugName: "nodes" }] : []));
-        this.#currentGridColor = computed(() => this.gridColor()[this.lightMode() ? 0 : 1], ...(ngDevMode ? [{ debugName: "#currentGridColor" }] : []));
-        this.panX = signal(0, ...(ngDevMode ? [{ debugName: "panX" }] : []));
-        this.panY = signal(0, ...(ngDevMode ? [{ debugName: "panY" }] : []));
-        this.zoomLevel = signal(1, ...(ngDevMode ? [{ debugName: "zoomLevel" }] : []));
-        this.gridSnapSize = signal(20, ...(ngDevMode ? [{ debugName: "gridSnapSize" }] : []));
-        this.isHoveringNode = signal(false, ...(ngDevMode ? [{ debugName: "isHoveringNode" }] : []));
-        this.midpointDivPosition = signal(null, ...(ngDevMode ? [{ debugName: "midpointDivPosition" }] : []));
-        this.showMidpointDiv = signal(false, ...(ngDevMode ? [{ debugName: "showMidpointDiv" }] : []));
-        this.isLocked = signal(false, ...(ngDevMode ? [{ debugName: "isLocked" }] : []));
-        this.draggingConnection = signal(null, ...(ngDevMode ? [{ debugName: "draggingConnection" }] : []));
-        this.validationErrors = signal(null, ...(ngDevMode ? [{ debugName: "validationErrors" }] : []));
-        this.highlightedConnection = signal(null, ...(ngDevMode ? [{ debugName: "highlightedConnection" }] : []));
-        this.#draggingNodeCoordinates = signal(null, ...(ngDevMode ? [{ debugName: "#draggingNodeCoordinates" }] : []));
-        this.#isDragging = signal(false, ...(ngDevMode ? [{ debugName: "#isDragging" }] : []));
-        this.#lastMouseX = signal(0, ...(ngDevMode ? [{ debugName: "#lastMouseX" }] : []));
-        this.#lastMouseY = signal(0, ...(ngDevMode ? [{ debugName: "#lastMouseY" }] : []));
-        this.#initialPinchDistance = signal(0, ...(ngDevMode ? [{ debugName: "#initialPinchDistance" }] : []));
-        this.#isNodeDragging = signal(false, ...(ngDevMode ? [{ debugName: "#isNodeDragging" }] : []));
-        this.#draggedNodeId = signal(null, ...(ngDevMode ? [{ debugName: "#draggedNodeId" }] : []));
-        this.#dragOffset = signal(null, ...(ngDevMode ? [{ debugName: "#dragOffset" }] : []));
-        this.#connections = signal([], ...(ngDevMode ? [{ debugName: "#connections" }] : []));
-        this.#canvasWidth = signal(0, ...(ngDevMode ? [{ debugName: "#canvasWidth" }] : []));
-        this.#canvasHeight = signal(0, ...(ngDevMode ? [{ debugName: "#canvasHeight" }] : []));
+        this.asDots = computed(() => this.#currentClass().includes('dots'), ...(ngDevMode ? [{ debugName: "asDots" }] : /* istanbul ignore next */ []));
+        this.lightMode = computed(() => this.#htmlClass().includes('light'), ...(ngDevMode ? [{ debugName: "lightMode" }] : /* istanbul ignore next */ []));
+        this.forceUnique = input(true, ...(ngDevMode ? [{ debugName: "forceUnique" }] : /* istanbul ignore next */ []));
+        this.autoLayout = input(false, ...(ngDevMode ? [{ debugName: "autoLayout" }] : /* istanbul ignore next */ []));
+        this.gridSize = input(20, ...(ngDevMode ? [{ debugName: "gridSize" }] : /* istanbul ignore next */ []));
+        this.snapToGrid = input(true, ...(ngDevMode ? [{ debugName: "snapToGrid" }] : /* istanbul ignore next */ []));
+        this.gridColor = input(['#d8d8d8', '#2c2c2c'], ...(ngDevMode ? [{ debugName: "gridColor" }] : /* istanbul ignore next */ []));
+        this.nodes = model([], ...(ngDevMode ? [{ debugName: "nodes" }] : /* istanbul ignore next */ []));
+        this.#currentGridColor = computed(() => this.gridColor()[this.lightMode() ? 0 : 1], ...(ngDevMode ? [{ debugName: "#currentGridColor" }] : /* istanbul ignore next */ []));
+        this.panX = signal(0, ...(ngDevMode ? [{ debugName: "panX" }] : /* istanbul ignore next */ []));
+        this.panY = signal(0, ...(ngDevMode ? [{ debugName: "panY" }] : /* istanbul ignore next */ []));
+        this.zoomLevel = signal(1, ...(ngDevMode ? [{ debugName: "zoomLevel" }] : /* istanbul ignore next */ []));
+        this.gridSnapSize = signal(20, ...(ngDevMode ? [{ debugName: "gridSnapSize" }] : /* istanbul ignore next */ []));
+        this.isHoveringNode = signal(false, ...(ngDevMode ? [{ debugName: "isHoveringNode" }] : /* istanbul ignore next */ []));
+        this.midpointDivPosition = signal(null, ...(ngDevMode ? [{ debugName: "midpointDivPosition" }] : /* istanbul ignore next */ []));
+        this.showMidpointDiv = signal(false, ...(ngDevMode ? [{ debugName: "showMidpointDiv" }] : /* istanbul ignore next */ []));
+        this.isLocked = signal(false, ...(ngDevMode ? [{ debugName: "isLocked" }] : /* istanbul ignore next */ []));
+        this.draggingConnection = signal(null, ...(ngDevMode ? [{ debugName: "draggingConnection" }] : /* istanbul ignore next */ []));
+        this.validationErrors = signal(null, ...(ngDevMode ? [{ debugName: "validationErrors" }] : /* istanbul ignore next */ []));
+        this.highlightedConnection = signal(null, ...(ngDevMode ? [{ debugName: "highlightedConnection" }] : /* istanbul ignore next */ []));
+        this.#draggingNodeCoordinates = signal(null, ...(ngDevMode ? [{ debugName: "#draggingNodeCoordinates" }] : /* istanbul ignore next */ []));
+        this.#isDragging = signal(false, ...(ngDevMode ? [{ debugName: "#isDragging" }] : /* istanbul ignore next */ []));
+        this.#lastMouseX = signal(0, ...(ngDevMode ? [{ debugName: "#lastMouseX" }] : /* istanbul ignore next */ []));
+        this.#lastMouseY = signal(0, ...(ngDevMode ? [{ debugName: "#lastMouseY" }] : /* istanbul ignore next */ []));
+        this.#initialPinchDistance = signal(0, ...(ngDevMode ? [{ debugName: "#initialPinchDistance" }] : /* istanbul ignore next */ []));
+        this.#isNodeDragging = signal(false, ...(ngDevMode ? [{ debugName: "#isNodeDragging" }] : /* istanbul ignore next */ []));
+        this.#draggedNodeId = signal(null, ...(ngDevMode ? [{ debugName: "#draggedNodeId" }] : /* istanbul ignore next */ []));
+        this.#dragOffset = signal(null, ...(ngDevMode ? [{ debugName: "#dragOffset" }] : /* istanbul ignore next */ []));
+        this.#connections = signal([], ...(ngDevMode ? [{ debugName: "#connections" }] : /* istanbul ignore next */ []));
+        this.#canvasWidth = signal(0, ...(ngDevMode ? [{ debugName: "#canvasWidth" }] : /* istanbul ignore next */ []));
+        this.#canvasHeight = signal(0, ...(ngDevMode ? [{ debugName: "#canvasHeight" }] : /* istanbul ignore next */ []));
         this.visibleNodes = computed(() => {
             const nodes = this.nodes();
             const panX = this.panX();
@@ -949,7 +950,7 @@ class ShipBlueprint {
                 const [x, y] = node.coordinates;
                 return x > viewbox.x1 && x < viewbox.x2 && y > viewbox.y1 && y < viewbox.y2;
             });
-        }, ...(ngDevMode ? [{ debugName: "visibleNodes" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "visibleNodes" }] : /* istanbul ignore next */ []));
         if (isPlatformBrowser(this.#platformId)) {
             effect(() => {
                 this.asDots();
@@ -1581,8 +1582,8 @@ class ShipBlueprint {
     #clamp(value, min, max) {
         return Math.max(min, Math.min(max, value));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipBlueprint, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipBlueprint, isStandalone: true, selector: "sh-blueprint", inputs: { forceUnique: { classPropertyName: "forceUnique", publicName: "forceUnique", isSignal: true, isRequired: false, transformFunction: null }, autoLayout: { classPropertyName: "autoLayout", publicName: "autoLayout", isSignal: true, isRequired: false, transformFunction: null }, gridSize: { classPropertyName: "gridSize", publicName: "gridSize", isSignal: true, isRequired: false, transformFunction: null }, snapToGrid: { classPropertyName: "snapToGrid", publicName: "snapToGrid", isSignal: true, isRequired: false, transformFunction: null }, gridColor: { classPropertyName: "gridColor", publicName: "gridColor", isSignal: true, isRequired: false, transformFunction: null }, nodes: { classPropertyName: "nodes", publicName: "nodes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { nodes: "nodesChange" }, host: { listeners: { "document:mouseup": "onMouseUp($event)", "document:click": "onClick($event)", "document:keydown.escape": "onEscape()", "document:mousemove": "onMouseMove($event)", "document:touchmove": "onTouchMove($event)", "document:touchend": "onDocumentTouchEnd($event)" } }, viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["blueprintCanvas"], descendants: true, static: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipBlueprint, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipBlueprint, isStandalone: true, selector: "sh-blueprint", inputs: { forceUnique: { classPropertyName: "forceUnique", publicName: "forceUnique", isSignal: true, isRequired: false, transformFunction: null }, autoLayout: { classPropertyName: "autoLayout", publicName: "autoLayout", isSignal: true, isRequired: false, transformFunction: null }, gridSize: { classPropertyName: "gridSize", publicName: "gridSize", isSignal: true, isRequired: false, transformFunction: null }, snapToGrid: { classPropertyName: "snapToGrid", publicName: "snapToGrid", isSignal: true, isRequired: false, transformFunction: null }, gridColor: { classPropertyName: "gridColor", publicName: "gridColor", isSignal: true, isRequired: false, transformFunction: null }, nodes: { classPropertyName: "nodes", publicName: "nodes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { nodes: "nodesChange" }, host: { listeners: { "document:mouseup": "onMouseUp($event)", "document:click": "onClick($event)", "document:keydown.escape": "onEscape()", "document:mousemove": "onMouseMove($event)", "document:touchmove": "onTouchMove($event)", "document:touchend": "onDocumentTouchEnd($event)" } }, viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["blueprintCanvas"], descendants: true, static: true }], ngImport: i0, template: `
     <div
       class="canvas-container"
       [class.locked]="isLocked()"
@@ -1668,9 +1669,9 @@ class ShipBlueprint {
         </div>
       }
     </div>
-  `, isInline: true, dependencies: [{ kind: "component", type: ShipCard, selector: "sh-card", inputs: ["color", "variant"] }, { kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "variant", "size"] }, { kind: "component", type: ShipButton, selector: "[shButton]", inputs: ["color", "variant", "size", "readonly"] }, { kind: "pipe", type: JsonPipe, name: "json" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: ShipCard, selector: "sh-card", inputs: ["color", "variant"] }, { kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "size"] }, { kind: "component", type: ShipButton, selector: "[shButton]", inputs: ["color", "variant", "size", "readonly"] }, { kind: "pipe", type: JsonPipe, name: "json" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipBlueprint, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipBlueprint, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-blueprint',
@@ -1790,7 +1791,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 function contentProjectionSignal(querySelector, options = { childList: true }) {
     const hostElement = inject((ElementRef)).nativeElement;
     const destroyRef = inject(DestroyRef);
-    const projectedElementsSignal = signal([], ...(ngDevMode ? [{ debugName: "projectedElementsSignal" }] : []));
+    const projectedElementsSignal = signal([], ...(ngDevMode ? [{ debugName: "projectedElementsSignal" }] : /* istanbul ignore next */ []));
     const updateElements = () => {
         projectedElementsSignal.set(Array.from(hostElement.querySelectorAll(querySelector)));
     };
@@ -1813,7 +1814,7 @@ class ShipSelectionGroup {
         this.itemSelector = itemSelector;
         this.activeClass = activeClass;
         this.hostElement = inject((ElementRef)).nativeElement;
-        this.value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
+        this.value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
         this.items = contentProjectionSignal(this.itemSelector, {
             childList: true,
             subtree: true,
@@ -1875,10 +1876,10 @@ class ShipSelectionGroup {
             nextItem.focus();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipSelectionGroup, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ShipSelectionGroup, isStandalone: true, inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { listeners: { "click": "onClick($event.target)", "keydown": "onKeyDown($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipSelectionGroup, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.5", type: ShipSelectionGroup, isStandalone: true, inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { listeners: { "click": "onClick($event.target)", "keydown": "onKeyDown($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipSelectionGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipSelectionGroup, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: undefined }, { type: undefined }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], onClick: [{
                 type: HostListener,
@@ -1892,21 +1893,21 @@ class ShipButtonGroup extends ShipSelectionGroup {
     constructor() {
         super('button', 'active');
         this.id = '--' + Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 12);
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
-        this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+        this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('buttonGroup', {
             color: this.color,
             variant: this.variant,
             size: this.size,
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipButtonGroup, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ShipButtonGroup, isStandalone: true, selector: "sh-button-group", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "style.--btng-id": "id" } }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipButtonGroup, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: ShipButtonGroup, isStandalone: true, selector: "sh-button-group", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "style.--btng-id": "id" } }, usesInheritance: true, ngImport: i0, template: `
     <ng-content />
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipButtonGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipButtonGroup, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-button-group',
@@ -1924,10 +1925,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 
 class ShipButton {
     constructor() {
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
-        this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : []));
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+        this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('button', {
             color: this.color,
             variant: this.variant,
@@ -1935,10 +1936,10 @@ class ShipButton {
             readonly: this.readonly,
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ShipButton, isStandalone: true, selector: "[shButton]", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" }, classAttribute: "sh-sheet-h" }, ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: ShipButton, isStandalone: true, selector: "[shButton]", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" }, classAttribute: "sh-sheet-h" }, ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipButton, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipButton, decorators: [{
             type: Component,
             args: [{
                     selector: '[shButton]',
@@ -1954,19 +1955,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 
 class ShipCard {
     constructor() {
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('card', {
             color: this.color,
             variant: this.variant,
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipCard, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ShipCard, isStandalone: true, selector: "sh-card", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipCard, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: ShipCard, isStandalone: true, selector: "sh-card", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: `
     <ng-content />
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipCard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipCard, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-card',
@@ -1984,18 +1985,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 class ShipCheckbox {
     constructor() {
         this._elementRef = inject(ElementRef);
-        this.internalInput = viewChild('internalInput', ...(ngDevMode ? [{ debugName: "internalInput" }] : []));
+        this.internalInput = viewChild('internalInput', ...(ngDevMode ? [{ debugName: "internalInput" }] : /* istanbul ignore next */ []));
         this.projectedInputs = contentProjectionSignal('input:not(.internal-input)', {
             childList: true,
             attributes: true,
         });
-        this.checked = model(false, ...(ngDevMode ? [{ debugName: "checked" }] : []));
+        this.checked = model(false, ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
         this.currentClassList = classMutationSignal();
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
-        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
-        this.noInternalInput = input(false, ...(ngDevMode ? [{ debugName: "noInternalInput" }] : []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+        this.noInternalInput = input(false, ...(ngDevMode ? [{ debugName: "noInternalInput" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('checkbox', {
             color: this.color,
             variant: this.variant,
@@ -2018,8 +2019,8 @@ class ShipCheckbox {
         }
         event.preventDefault();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipCheckbox, isStandalone: true, selector: "sh-checkbox", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, noInternalInput: { classPropertyName: "noInternalInput", publicName: "noInternalInput", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange" }, host: { listeners: { "keydown.enter": "onEnter($event)" }, properties: { "class": "hostClasses()", "attr.disabled": "disabled() ? \"\" : null" } }, viewQueries: [{ propertyName: "internalInput", first: true, predicate: ["internalInput"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipCheckbox, isStandalone: true, selector: "sh-checkbox", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, noInternalInput: { classPropertyName: "noInternalInput", publicName: "noInternalInput", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange" }, host: { listeners: { "keydown.enter": "onEnter($event)" }, properties: { "class": "hostClasses()", "attr.disabled": "disabled() ? \"\" : null" } }, viewQueries: [{ propertyName: "internalInput", first: true, predicate: ["internalInput"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <div class="box sh-sheet" [class]="currentClassList()">
       <sh-icon class="inherit default-indicator">check-bold</sh-icon>
       <sh-icon class="inherit indeterminate-indicator">minus-bold</sh-icon>
@@ -2038,9 +2039,9 @@ class ShipCheckbox {
         [checked]="checked()"
         (change)="onInternalInputChange($event)" />
     }
-  `, isInline: true, dependencies: [{ kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "variant", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipCheckbox, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipCheckbox, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-checkbox',
@@ -2078,12 +2079,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 
 class ShipChip {
     constructor() {
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
-        this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : []));
-        this.sharp = input(undefined, ...(ngDevMode ? [{ debugName: "sharp" }] : []));
-        this.dynamic = input(undefined, ...(ngDevMode ? [{ debugName: "dynamic" }] : []));
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+        this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+        this.sharp = input(undefined, ...(ngDevMode ? [{ debugName: "sharp" }] : /* istanbul ignore next */ []));
+        this.dynamic = input(undefined, ...(ngDevMode ? [{ debugName: "dynamic" }] : /* istanbul ignore next */ []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('chip', {
             color: this.color,
             variant: this.variant,
@@ -2093,10 +2094,10 @@ class ShipChip {
             readonly: this.readonly,
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipChip, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ShipChip, isStandalone: true, selector: "sh-chip", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, sharp: { classPropertyName: "sharp", publicName: "sharp", isSignal: true, isRequired: false, transformFunction: null }, dynamic: { classPropertyName: "dynamic", publicName: "dynamic", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" }, classAttribute: "sh-sheet" }, ngImport: i0, template: '<div><ng-content /></div>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipChip, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: ShipChip, isStandalone: true, selector: "sh-chip", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, sharp: { classPropertyName: "sharp", publicName: "sharp", isSignal: true, isRequired: false, transformFunction: null }, dynamic: { classPropertyName: "dynamic", publicName: "dynamic", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" }, classAttribute: "sh-sheet" }, ngImport: i0, template: '<div><ng-content /></div>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipChip, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipChip, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-chip',
@@ -2118,22 +2119,22 @@ class ShipColorPicker {
     constructor() {
         this.#document = inject(DOCUMENT);
         this.canvasRef = viewChild.required('colorCanvas');
-        this.canvasData = signal(null, ...(ngDevMode ? [{ debugName: "canvasData" }] : []));
-        this.showDarkColors = input(false, ...(ngDevMode ? [{ debugName: "showDarkColors" }] : []));
-        this.renderingType = input('hsl', ...(ngDevMode ? [{ debugName: "renderingType" }] : []));
-        this.gridSize = input(20, ...(ngDevMode ? [{ debugName: "gridSize" }] : []));
-        this.hue = input(0, ...(ngDevMode ? [{ debugName: "hue" }] : []));
-        this.direction = input('horizontal', ...(ngDevMode ? [{ debugName: "direction" }] : []));
-        this.selectedColor = model([255, 255, 255], ...(ngDevMode ? [{ debugName: "selectedColor" }] : []));
+        this.canvasData = signal(null, ...(ngDevMode ? [{ debugName: "canvasData" }] : /* istanbul ignore next */ []));
+        this.showDarkColors = input(false, ...(ngDevMode ? [{ debugName: "showDarkColors" }] : /* istanbul ignore next */ []));
+        this.renderingType = input('hsl', ...(ngDevMode ? [{ debugName: "renderingType" }] : /* istanbul ignore next */ []));
+        this.gridSize = input(20, ...(ngDevMode ? [{ debugName: "gridSize" }] : /* istanbul ignore next */ []));
+        this.hue = input(0, ...(ngDevMode ? [{ debugName: "hue" }] : /* istanbul ignore next */ []));
+        this.direction = input('horizontal', ...(ngDevMode ? [{ debugName: "direction" }] : /* istanbul ignore next */ []));
+        this.selectedColor = model([255, 255, 255], ...(ngDevMode ? [{ debugName: "selectedColor" }] : /* istanbul ignore next */ []));
         this.currentColor = output();
-        this.centerLightness = computed(() => (this.showDarkColors() ? 200 : 100), ...(ngDevMode ? [{ debugName: "centerLightness" }] : []));
-        this.isDragging = signal(false, ...(ngDevMode ? [{ debugName: "isDragging" }] : []));
-        this.markerPosition = signal({ x: '50%', y: '50%' }, ...(ngDevMode ? [{ debugName: "markerPosition" }] : []));
+        this.centerLightness = computed(() => (this.showDarkColors() ? 200 : 100), ...(ngDevMode ? [{ debugName: "centerLightness" }] : /* istanbul ignore next */ []));
+        this.isDragging = signal(false, ...(ngDevMode ? [{ debugName: "isDragging" }] : /* istanbul ignore next */ []));
+        this.markerPosition = signal({ x: '50%', y: '50%' }, ...(ngDevMode ? [{ debugName: "markerPosition" }] : /* istanbul ignore next */ []));
         this._pos = { x: '0', y: '0' };
-        this._markerPosition = effect(() => (this._pos = this.markerPosition()), ...(ngDevMode ? [{ debugName: "_markerPosition" }] : []));
-        this.selectedColorRgb = computed(() => `rgb(${this.selectedColor().join(',')})`, ...(ngDevMode ? [{ debugName: "selectedColorRgb" }] : []));
-        this.selectedColorHex = computed(() => this.rgbToHex(...this.selectedColor()), ...(ngDevMode ? [{ debugName: "selectedColorHex" }] : []));
-        this.selectedColorHsl = computed(() => this.rgbToHsl(...this.selectedColor()), ...(ngDevMode ? [{ debugName: "selectedColorHsl" }] : []));
+        this._markerPosition = effect(() => (this._pos = this.markerPosition()), ...(ngDevMode ? [{ debugName: "_markerPosition" }] : /* istanbul ignore next */ []));
+        this.selectedColorRgb = computed(() => `rgb(${this.selectedColor().join(',')})`, ...(ngDevMode ? [{ debugName: "selectedColorRgb" }] : /* istanbul ignore next */ []));
+        this.selectedColorHex = computed(() => this.rgbToHex(...this.selectedColor()), ...(ngDevMode ? [{ debugName: "selectedColorHex" }] : /* istanbul ignore next */ []));
+        this.selectedColorHsl = computed(() => this.rgbToHsl(...this.selectedColor()), ...(ngDevMode ? [{ debugName: "selectedColorHsl" }] : /* istanbul ignore next */ []));
         this.selectedColorEffect = effect(() => {
             const selectedColor = this.selectedColor();
             const hsl = this.rgbToHsl(...selectedColor);
@@ -2146,7 +2147,7 @@ class ShipColorPicker {
                 hue: hsl.match(/\d+/g).map(Number)[0],
                 saturation: hsl.match(/\d+/g).map(Number)[1],
             });
-        }, ...(ngDevMode ? [{ debugName: "selectedColorEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "selectedColorEffect" }] : /* istanbul ignore next */ []));
         this.renderingTypeEffect = effect(() => {
             const currentRenderingType = this.renderingType();
             if (this.canvasData()) {
@@ -2159,7 +2160,7 @@ class ShipColorPicker {
                     this.updateMarkerFromColor(this.selectedColor());
                 }
             }
-        }, ...(ngDevMode ? [{ debugName: "renderingTypeEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "renderingTypeEffect" }] : /* istanbul ignore next */ []));
         this.initColor = null;
     }
     #document;
@@ -2425,8 +2426,8 @@ class ShipColorPicker {
         }
         return `hsl(${Math.floor(h * 360)}, ${Math.round(s * 100)}%, ${Math.round(l * 100)}%)`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.5", type: ShipColorPicker, isStandalone: true, selector: "sh-color-picker", inputs: { showDarkColors: { classPropertyName: "showDarkColors", publicName: "showDarkColors", isSignal: true, isRequired: false, transformFunction: null }, renderingType: { classPropertyName: "renderingType", publicName: "renderingType", isSignal: true, isRequired: false, transformFunction: null }, gridSize: { classPropertyName: "gridSize", publicName: "gridSize", isSignal: true, isRequired: false, transformFunction: null }, hue: { classPropertyName: "hue", publicName: "hue", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, selectedColor: { classPropertyName: "selectedColor", publicName: "selectedColor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedColor: "selectedColorChange", currentColor: "currentColor" }, host: { listeners: { "window:resize": "onResize()" }, properties: { "class": "renderingType()", "class.vertical": "(renderingType() === \"hue\" || renderingType() === \"saturation\") && direction() === \"vertical\"" } }, viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["colorCanvas"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.5", type: ShipColorPicker, isStandalone: true, selector: "sh-color-picker", inputs: { showDarkColors: { classPropertyName: "showDarkColors", publicName: "showDarkColors", isSignal: true, isRequired: false, transformFunction: null }, renderingType: { classPropertyName: "renderingType", publicName: "renderingType", isSignal: true, isRequired: false, transformFunction: null }, gridSize: { classPropertyName: "gridSize", publicName: "gridSize", isSignal: true, isRequired: false, transformFunction: null }, hue: { classPropertyName: "hue", publicName: "hue", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, selectedColor: { classPropertyName: "selectedColor", publicName: "selectedColor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedColor: "selectedColorChange", currentColor: "currentColor" }, host: { listeners: { "window:resize": "onResize()" }, properties: { "class": "renderingType()", "class.vertical": "(renderingType() === \"hue\" || renderingType() === \"saturation\") && direction() === \"vertical\"" } }, viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["colorCanvas"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <canvas #colorCanvas></canvas>
     <div
       class="marker"
@@ -2435,7 +2436,7 @@ class ShipColorPicker {
       [style.background]="selectedColorRgb()"></div>
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipColorPicker, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipColorPicker, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-color-picker',
@@ -2462,34 +2463,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 class ShipDatepicker {
     constructor() {
         this.#INIT_DATE = new Date(new Date().setHours(0, 0, 0, 0));
-        this.date = model(null, ...(ngDevMode ? [{ debugName: "date" }] : []));
-        this.endDate = model(null, ...(ngDevMode ? [{ debugName: "endDate" }] : []));
-        this.asRange = input(false, ...(ngDevMode ? [{ debugName: "asRange" }] : []));
-        this.monthsToShow = input(1, ...(ngDevMode ? [{ debugName: "monthsToShow" }] : []));
-        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
-        this.startOfWeek = input(1, ...(ngDevMode ? [{ debugName: "startOfWeek" }] : []));
-        this.weekdayLabels = input(['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'], ...(ngDevMode ? [{ debugName: "weekdayLabels" }] : []));
-        this.daysRef = viewChild('daysRef', ...(ngDevMode ? [{ debugName: "daysRef" }] : []));
-        this.currentDate = signal(this.date() ?? this.#INIT_DATE, ...(ngDevMode ? [{ debugName: "currentDate" }] : []));
+        this.date = model(null, ...(ngDevMode ? [{ debugName: "date" }] : /* istanbul ignore next */ []));
+        this.endDate = model(null, ...(ngDevMode ? [{ debugName: "endDate" }] : /* istanbul ignore next */ []));
+        this.asRange = input(false, ...(ngDevMode ? [{ debugName: "asRange" }] : /* istanbul ignore next */ []));
+        this.monthsToShow = input(1, ...(ngDevMode ? [{ debugName: "monthsToShow" }] : /* istanbul ignore next */ []));
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+        this.startOfWeek = input(1, ...(ngDevMode ? [{ debugName: "startOfWeek" }] : /* istanbul ignore next */ []));
+        this.weekdayLabels = input(['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'], ...(ngDevMode ? [{ debugName: "weekdayLabels" }] : /* istanbul ignore next */ []));
+        this.daysRef = viewChild('daysRef', ...(ngDevMode ? [{ debugName: "daysRef" }] : /* istanbul ignore next */ []));
+        this.currentDate = signal(this.date() ?? this.#INIT_DATE, ...(ngDevMode ? [{ debugName: "currentDate" }] : /* istanbul ignore next */ []));
         this.monthOffsets = computed(() => {
             return Array.from({ length: this.monthsToShow() }, (_, i) => i);
-        }, ...(ngDevMode ? [{ debugName: "monthOffsets" }] : []));
-        this.selectedDateStylePosition = signal(null, ...(ngDevMode ? [{ debugName: "selectedDateStylePosition" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "monthOffsets" }] : /* istanbul ignore next */ []));
+        this.selectedDateStylePosition = signal(null, ...(ngDevMode ? [{ debugName: "selectedDateStylePosition" }] : /* istanbul ignore next */ []));
         this.weekdays = computed(() => {
             const startOfWeek = this.startOfWeek();
             const weekdayLabels = this.weekdayLabels();
             return weekdayLabels.slice(startOfWeek).concat(weekdayLabels.slice(0, startOfWeek));
-        }, ...(ngDevMode ? [{ debugName: "weekdays" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "weekdays" }] : /* istanbul ignore next */ []));
         this.currentClasses = classMutationSignal();
         this.someEffect = effect(() => {
             const _ = this.currentClasses();
             this.#findSelectedAndCalc();
-        }, ...(ngDevMode ? [{ debugName: "someEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "someEffect" }] : /* istanbul ignore next */ []));
         this.#newDateEffect = effect(() => {
             if (this.monthsToShow() > 1)
                 return;
             this.#setDateAsCurrent();
-        }, ...(ngDevMode ? [{ debugName: "#newDateEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#newDateEffect" }] : /* istanbul ignore next */ []));
     }
     #INIT_DATE;
     getLastVisibleMonth() {
@@ -2680,8 +2681,8 @@ class ShipDatepicker {
         const offsetDate = this.getOffsetDate(monthOffset);
         return date.getMonth() === offsetDate.getMonth();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipDatepicker, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipDatepicker, isStandalone: true, selector: "sh-datepicker", inputs: { date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: false, transformFunction: null }, endDate: { classPropertyName: "endDate", publicName: "endDate", isSignal: true, isRequired: false, transformFunction: null }, asRange: { classPropertyName: "asRange", publicName: "asRange", isSignal: true, isRequired: false, transformFunction: null }, monthsToShow: { classPropertyName: "monthsToShow", publicName: "monthsToShow", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, startOfWeek: { classPropertyName: "startOfWeek", publicName: "startOfWeek", isSignal: true, isRequired: false, transformFunction: null }, weekdayLabels: { classPropertyName: "weekdayLabels", publicName: "weekdayLabels", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { date: "dateChange", endDate: "endDateChange" }, host: { properties: { "class.as-range": "asRange()", "class": "\"columns-\" + monthsToShow()", "class.disabled": "disabled()" } }, viewQueries: [{ propertyName: "daysRef", first: true, predicate: ["daysRef"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipDatepicker, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipDatepicker, isStandalone: true, selector: "sh-datepicker", inputs: { date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: false, transformFunction: null }, endDate: { classPropertyName: "endDate", publicName: "endDate", isSignal: true, isRequired: false, transformFunction: null }, asRange: { classPropertyName: "asRange", publicName: "asRange", isSignal: true, isRequired: false, transformFunction: null }, monthsToShow: { classPropertyName: "monthsToShow", publicName: "monthsToShow", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, startOfWeek: { classPropertyName: "startOfWeek", publicName: "startOfWeek", isSignal: true, isRequired: false, transformFunction: null }, weekdayLabels: { classPropertyName: "weekdayLabels", publicName: "weekdayLabels", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { date: "dateChange", endDate: "endDateChange" }, host: { properties: { "class.as-range": "asRange()", "class": "\"columns-\" + monthsToShow()", "class.disabled": "disabled()" } }, viewQueries: [{ propertyName: "daysRef", first: true, predicate: ["daysRef"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <header>
       <button (click)="previousMonth()"><sh-icon>caret-left</sh-icon></button>
       <div class="title">
@@ -2723,9 +2724,9 @@ class ShipDatepicker {
         </div>
       }
     </section>
-  `, isInline: true, dependencies: [{ kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "variant", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipDatepicker, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipDatepicker, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-datepicker',
@@ -2794,20 +2795,20 @@ class ShipPopover {
     constructor() {
         this.#document = inject(DOCUMENT);
         this.SUPPORTS_ANCHOR = typeof CSS !== 'undefined' && CSS.supports('position-anchor', '--abc') && CSS.supports('anchor-name', '--abc');
-        this.asMultiLayer = input(false, ...(ngDevMode ? [{ debugName: "asMultiLayer" }] : []));
-        this.disableOpenByClick = input(false, ...(ngDevMode ? [{ debugName: "disableOpenByClick" }] : []));
-        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
-        this.options = input(...(ngDevMode ? [undefined, { debugName: "options" }] : []));
+        this.asMultiLayer = input(false, ...(ngDevMode ? [{ debugName: "asMultiLayer" }] : /* istanbul ignore next */ []));
+        this.disableOpenByClick = input(false, ...(ngDevMode ? [{ debugName: "disableOpenByClick" }] : /* istanbul ignore next */ []));
+        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+        this.options = input(...(ngDevMode ? [undefined, { debugName: "options" }] : /* istanbul ignore next */ []));
         this.closed = output();
         this.defaultOptionMerge = computed(() => ({
             ...DEFAULT_OPTIONS,
             ...this.options(),
-        }), ...(ngDevMode ? [{ debugName: "defaultOptionMerge" }] : []));
+        }), ...(ngDevMode ? [{ debugName: "defaultOptionMerge" }] : /* istanbul ignore next */ []));
         this.triggerRef = viewChild.required('triggerRef');
-        this.popoverRef = viewChild('popoverRef', ...(ngDevMode ? [{ debugName: "popoverRef" }] : []));
-        this.popoverContentRef = viewChild('popoverContentRef', ...(ngDevMode ? [{ debugName: "popoverContentRef" }] : []));
-        this.id = signal('--' + generateUniqueId(), ...(ngDevMode ? [{ debugName: "id" }] : []));
-        this.menuStyle = signal(null, ...(ngDevMode ? [{ debugName: "menuStyle" }] : []));
+        this.popoverRef = viewChild('popoverRef', ...(ngDevMode ? [{ debugName: "popoverRef" }] : /* istanbul ignore next */ []));
+        this.popoverContentRef = viewChild('popoverContentRef', ...(ngDevMode ? [{ debugName: "popoverContentRef" }] : /* istanbul ignore next */ []));
+        this.id = signal('--' + generateUniqueId(), ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+        this.menuStyle = signal(null, ...(ngDevMode ? [{ debugName: "menuStyle" }] : /* istanbul ignore next */ []));
         this.openAbort = null;
         this.openEffect = effect(() => {
             const open = this.isOpen();
@@ -2856,7 +2857,7 @@ class ShipPopover {
                     this.openAbort = null;
                 }
             });
-        }, ...(ngDevMode ? [{ debugName: "openEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "openEffect" }] : /* istanbul ignore next */ []));
     }
     #document;
     toggleIsOpen(event) {
@@ -2987,8 +2988,8 @@ class ShipPopover {
         this.openAbort?.abort();
         this.openAbort = null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipPopover, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipPopover, isStandalone: true, selector: "sh-popover", inputs: { asMultiLayer: { classPropertyName: "asMultiLayer", publicName: "asMultiLayer", isSignal: true, isRequired: false, transformFunction: null }, disableOpenByClick: { classPropertyName: "disableOpenByClick", publicName: "disableOpenByClick", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange", closed: "closed" }, host: { properties: { "class.multi-layer": "asMultiLayer()" } }, viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerRef"], descendants: true, isSignal: true }, { propertyName: "popoverRef", first: true, predicate: ["popoverRef"], descendants: true, isSignal: true }, { propertyName: "popoverContentRef", first: true, predicate: ["popoverContentRef"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipPopover, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipPopover, isStandalone: true, selector: "sh-popover", inputs: { asMultiLayer: { classPropertyName: "asMultiLayer", publicName: "asMultiLayer", isSignal: true, isRequired: false, transformFunction: null }, disableOpenByClick: { classPropertyName: "disableOpenByClick", publicName: "disableOpenByClick", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange", closed: "closed" }, host: { properties: { "class.multi-layer": "asMultiLayer()" } }, viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerRef"], descendants: true, isSignal: true }, { propertyName: "popoverRef", first: true, predicate: ["popoverRef"], descendants: true, isSignal: true }, { propertyName: "popoverContentRef", first: true, predicate: ["popoverContentRef"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <div class="trigger" #triggerRef [attr.popovertarget]="id() + 'hello'" (click)="toggleIsOpen($event)">
       <div class="trigger-wrapper">
         <ng-content select="[trigger]" />
@@ -3008,7 +3009,7 @@ class ShipPopover {
     }
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipPopover, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipPopover, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-popover',
@@ -3042,7 +3043,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 class ShipFormFieldPopover {
     constructor() {
         this.#selfRef = inject(ElementRef);
-        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
+        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
         this.closed = output();
     }
     #selfRef;
@@ -3082,8 +3083,8 @@ class ShipFormFieldPopover {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipFormFieldPopover, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ShipFormFieldPopover, isStandalone: true, selector: "sh-form-field-popover", inputs: { isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange", closed: "closed" }, host: { listeners: { "click": "onClick()" } }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipFormFieldPopover, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: ShipFormFieldPopover, isStandalone: true, selector: "sh-form-field-popover", inputs: { isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange", closed: "closed" }, host: { listeners: { "click": "onClick()" } }, ngImport: i0, template: `
     <ng-content select="label"></ng-content>
 
     <sh-popover
@@ -3123,7 +3124,7 @@ class ShipFormFieldPopover {
     </div>
   `, isInline: true, dependencies: [{ kind: "component", type: ShipPopover, selector: "sh-popover", inputs: ["asMultiLayer", "disableOpenByClick", "isOpen", "options"], outputs: ["isOpenChange", "closed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipFormFieldPopover, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipFormFieldPopover, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-form-field-popover',
@@ -3177,10 +3178,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 class ShipDatepickerInput {
     constructor() {
         // #INIT_DATE = this.#getUTCDate(new Date());
-        this.ngModels = contentChild(NgModel, ...(ngDevMode ? [{ debugName: "ngModels" }] : []));
+        this.ngModels = contentChild(NgModel, ...(ngDevMode ? [{ debugName: "ngModels" }] : /* istanbul ignore next */ []));
         this.#datePipe = inject(DatePipe);
-        this.#inputRef = signal(null, ...(ngDevMode ? [{ debugName: "#inputRef" }] : []));
-        this.masking = input('mediumDate', ...(ngDevMode ? [{ debugName: "masking" }] : []));
+        this.#inputRef = signal(null, ...(ngDevMode ? [{ debugName: "#inputRef" }] : /* istanbul ignore next */ []));
+        this.masking = input('mediumDate', ...(ngDevMode ? [{ debugName: "masking" }] : /* istanbul ignore next */ []));
         this.closed = output();
         this._maskedDate = computed(() => {
             const date = this.internalDate();
@@ -3190,9 +3191,9 @@ class ShipDatepickerInput {
             if (!date)
                 return null;
             return this.#datePipe.transform(date, mask);
-        }, ...(ngDevMode ? [{ debugName: "_maskedDate" }] : []));
-        this.internalDate = signal(null, ...(ngDevMode ? [{ debugName: "internalDate" }] : []));
-        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "_maskedDate" }] : /* istanbul ignore next */ []));
+        this.internalDate = signal(null, ...(ngDevMode ? [{ debugName: "internalDate" }] : /* istanbul ignore next */ []));
+        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
         this.currentClass = classMutationSignal();
         this.#inputObserver = contentProjectionSignal('#input-wrap input');
         this.#inputRefEffect = effect(() => {
@@ -3215,7 +3216,7 @@ class ShipDatepickerInput {
             if (typeof input.value === 'string') {
                 this.internalDate.set(input.value ? new Date(input.value) : null);
             }
-        }, ...(ngDevMode ? [{ debugName: "#inputRefEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#inputRefEffect" }] : /* istanbul ignore next */ []));
     }
     #datePipe;
     #inputRef;
@@ -3255,8 +3256,8 @@ class ShipDatepickerInput {
         });
         return input;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipDatepickerInput, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipDatepickerInput, isStandalone: true, selector: "sh-datepicker-input", inputs: { masking: { classPropertyName: "masking", publicName: "masking", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed", isOpen: "isOpenChange" }, providers: [DatePipe], queries: [{ propertyName: "ngModels", first: true, predicate: NgModel, descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipDatepickerInput, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipDatepickerInput, isStandalone: true, selector: "sh-datepicker-input", inputs: { masking: { classPropertyName: "masking", publicName: "masking", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed", isOpen: "isOpenChange" }, providers: [DatePipe], queries: [{ propertyName: "ngModels", first: true, predicate: NgModel, descendants: true, isSignal: true }], ngImport: i0, template: `
     <sh-form-field-popover (closed)="close()" [(isOpen)]="isOpen">
       <ng-content select="label" ngProjectAs="label" />
 
@@ -3284,9 +3285,9 @@ class ShipDatepickerInput {
     </sh-form-field-popover>
 
     <ng-template #defaultIndicator></ng-template>
-  `, isInline: true, dependencies: [{ kind: "component", type: ShipDatepicker, selector: "sh-datepicker", inputs: ["date", "endDate", "asRange", "monthsToShow", "disabled", "startOfWeek", "weekdayLabels"], outputs: ["dateChange", "endDateChange"] }, { kind: "component", type: ShipFormFieldPopover, selector: "sh-form-field-popover", inputs: ["isOpen"], outputs: ["isOpenChange", "closed"] }, { kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "variant", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: ShipDatepicker, selector: "sh-datepicker", inputs: ["date", "endDate", "asRange", "monthsToShow", "disabled", "startOfWeek", "weekdayLabels"], outputs: ["dateChange", "endDateChange"] }, { kind: "component", type: ShipFormFieldPopover, selector: "sh-form-field-popover", inputs: ["isOpen"], outputs: ["isOpenChange", "closed"] }, { kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipDatepickerInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipDatepickerInput, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-datepicker-input',
@@ -3333,29 +3334,29 @@ class ShipDaterangeInput {
     }
     constructor() {
         this.#selfRef = inject(ElementRef);
-        this.startDateInputs = contentChildren('startDate', ...(ngDevMode ? [{ debugName: "startDateInputs" }] : []));
-        this.endDateInputs = contentChildren('endDate', ...(ngDevMode ? [{ debugName: "endDateInputs" }] : []));
+        this.startDateInputs = contentChildren('startDate', ...(ngDevMode ? [{ debugName: "startDateInputs" }] : /* istanbul ignore next */ []));
+        this.endDateInputs = contentChildren('endDate', ...(ngDevMode ? [{ debugName: "endDateInputs" }] : /* istanbul ignore next */ []));
         this.#datePipe = inject(DatePipe);
-        this.monthsToShow = input(1, ...(ngDevMode ? [{ debugName: "monthsToShow" }] : []));
-        this.masking = input('mediumDate', ...(ngDevMode ? [{ debugName: "masking" }] : []));
+        this.monthsToShow = input(1, ...(ngDevMode ? [{ debugName: "monthsToShow" }] : /* istanbul ignore next */ []));
+        this.masking = input('mediumDate', ...(ngDevMode ? [{ debugName: "masking" }] : /* istanbul ignore next */ []));
         this.closed = output();
-        this.startDate = signal(null, ...(ngDevMode ? [{ debugName: "startDate" }] : []));
-        this.endDate = signal(null, ...(ngDevMode ? [{ debugName: "endDate" }] : []));
-        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
+        this.startDate = signal(null, ...(ngDevMode ? [{ debugName: "startDate" }] : /* istanbul ignore next */ []));
+        this.endDate = signal(null, ...(ngDevMode ? [{ debugName: "endDate" }] : /* istanbul ignore next */ []));
+        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
         this._maskedStartDate = computed(() => {
             const date = this.startDate();
             const mask = this.masking();
             if (!mask || !date)
                 return null;
             return this.#datePipe.transform(date, mask);
-        }, ...(ngDevMode ? [{ debugName: "_maskedStartDate" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "_maskedStartDate" }] : /* istanbul ignore next */ []));
         this._maskedEndDate = computed(() => {
             const date = this.endDate();
             const mask = this.masking();
             if (!mask || !date)
                 return null;
             return this.#datePipe.transform(date, mask);
-        }, ...(ngDevMode ? [{ debugName: "_maskedEndDate" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "_maskedEndDate" }] : /* istanbul ignore next */ []));
         effect(() => {
             // Setup start date inputs
             this.startDateInputs().forEach((input) => {
@@ -3424,8 +3425,8 @@ class ShipDaterangeInput {
             end: this.endDate(),
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipDaterangeInput, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipDaterangeInput, isStandalone: true, selector: "sh-daterange-input", inputs: { monthsToShow: { classPropertyName: "monthsToShow", publicName: "monthsToShow", isSignal: true, isRequired: false, transformFunction: null }, masking: { classPropertyName: "masking", publicName: "masking", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed", isOpen: "isOpenChange" }, providers: [DatePipe], queries: [{ propertyName: "startDateInputs", predicate: ["startDate"], isSignal: true }, { propertyName: "endDateInputs", predicate: ["endDate"], isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipDaterangeInput, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipDaterangeInput, isStandalone: true, selector: "sh-daterange-input", inputs: { monthsToShow: { classPropertyName: "monthsToShow", publicName: "monthsToShow", isSignal: true, isRequired: false, transformFunction: null }, masking: { classPropertyName: "masking", publicName: "masking", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed", isOpen: "isOpenChange" }, providers: [DatePipe], queries: [{ propertyName: "startDateInputs", predicate: ["startDate"], isSignal: true }, { propertyName: "endDateInputs", predicate: ["endDate"], isSignal: true }], ngImport: i0, template: `
     <sh-form-field-popover [class]="'columns-' + monthsToShow()" (closed)="close()" [(isOpen)]="isOpen">
       <ng-content select="label" ngProjectAs="label" />
 
@@ -3456,9 +3457,9 @@ class ShipDaterangeInput {
         }
       </div>
     </sh-form-field-popover>
-  `, isInline: true, dependencies: [{ kind: "component", type: ShipDatepicker, selector: "sh-datepicker", inputs: ["date", "endDate", "asRange", "monthsToShow", "disabled", "startOfWeek", "weekdayLabels"], outputs: ["dateChange", "endDateChange"] }, { kind: "component", type: ShipFormFieldPopover, selector: "sh-form-field-popover", inputs: ["isOpen"], outputs: ["isOpenChange", "closed"] }, { kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "variant", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: ShipDatepicker, selector: "sh-datepicker", inputs: ["date", "endDate", "asRange", "monthsToShow", "disabled", "startOfWeek", "weekdayLabels"], outputs: ["dateChange", "endDateChange"] }, { kind: "component", type: ShipFormFieldPopover, selector: "sh-form-field-popover", inputs: ["isOpen"], outputs: ["isOpenChange", "closed"] }, { kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipDaterangeInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipDaterangeInput, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-daterange-input',
@@ -3501,12 +3502,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
         }], ctorParameters: () => [], propDecorators: { startDateInputs: [{ type: i0.ContentChildren, args: ['startDate', { isSignal: true }] }], endDateInputs: [{ type: i0.ContentChildren, args: ['endDate', { isSignal: true }] }], monthsToShow: [{ type: i0.Input, args: [{ isSignal: true, alias: "monthsToShow", required: false }] }], masking: [{ type: i0.Input, args: [{ isSignal: true, alias: "masking", required: false }] }], closed: [{ type: i0.Output, args: ["closed"] }], isOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOpen", required: false }] }, { type: i0.Output, args: ["isOpenChange"] }] } });
 
 class ShipDivider {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipDivider, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.5", type: ShipDivider, isStandalone: true, selector: "sh-divider", ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipDivider, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.5", type: ShipDivider, isStandalone: true, selector: "sh-divider", ngImport: i0, template: `
     <ng-content />
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipDivider, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipDivider, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-divider',
@@ -3520,15 +3521,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 
 class ShipEventCard {
     constructor() {
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('event-card', {
             color: this.color,
             variant: this.variant,
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipEventCard, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ShipEventCard, isStandalone: true, selector: "sh-event-card", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" }, classAttribute: "sh-sheet" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipEventCard, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: ShipEventCard, isStandalone: true, selector: "sh-event-card", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" }, classAttribute: "sh-sheet" }, ngImport: i0, template: `
     <div class="content">
       <ng-content />
     </div>
@@ -3539,7 +3540,7 @@ class ShipEventCard {
     </div>
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipEventCard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipEventCard, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-event-card',
@@ -3574,10 +3575,10 @@ class ShipFormField {
     }
     constructor() {
         this.#selfRef = inject(ElementRef);
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
-        this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : []));
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+        this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('formField', {
             color: this.color,
             variant: this.variant,
@@ -3607,8 +3608,8 @@ class ShipFormField {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipFormField, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ShipFormField, isStandalone: true, selector: "sh-form-field", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick()" }, properties: { "class": "hostClasses()" } }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipFormField, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: ShipFormField, isStandalone: true, selector: "sh-form-field", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick()" }, properties: { "class": "hostClasses()" } }, ngImport: i0, template: `
     <ng-content select="label"></ng-content>
 
     <div class="input-wrap">
@@ -3639,7 +3640,7 @@ class ShipFormField {
     </div>
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipFormField, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipFormField, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-form-field',
@@ -3688,13 +3689,13 @@ class ShipFileUpload {
     constructor() {
         this._el = inject(ElementRef);
         this.inputRef = viewChild.required('input');
-        this.filesOver = signal(false, ...(ngDevMode ? [{ debugName: "filesOver" }] : []));
-        this.multiple = input(...(ngDevMode ? [undefined, { debugName: "multiple" }] : []));
-        this.accept = input(null, ...(ngDevMode ? [{ debugName: "accept" }] : []));
-        this.placeholder = model('Click or drag files here', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
-        this.overlayText = input('Drop files here', ...(ngDevMode ? [{ debugName: "overlayText" }] : []));
-        this.files = model([], ...(ngDevMode ? [{ debugName: "files" }] : []));
-        this.fileUploadClasses = computed(() => this._el.nativeElement.classList.toString(), ...(ngDevMode ? [{ debugName: "fileUploadClasses" }] : []));
+        this.filesOver = signal(false, ...(ngDevMode ? [{ debugName: "filesOver" }] : /* istanbul ignore next */ []));
+        this.multiple = input(...(ngDevMode ? [undefined, { debugName: "multiple" }] : /* istanbul ignore next */ []));
+        this.accept = input(null, ...(ngDevMode ? [{ debugName: "accept" }] : /* istanbul ignore next */ []));
+        this.placeholder = model('Click or drag files here', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+        this.overlayText = input('Drop files here', ...(ngDevMode ? [{ debugName: "overlayText" }] : /* istanbul ignore next */ []));
+        this.files = model([], ...(ngDevMode ? [{ debugName: "files" }] : /* istanbul ignore next */ []));
+        this.fileUploadClasses = computed(() => this._el.nativeElement.classList.toString(), ...(ngDevMode ? [{ debugName: "fileUploadClasses" }] : /* istanbul ignore next */ []));
         this.inputEffect = effect(() => {
             const input = this.inputRef().nativeElement;
             if (!input)
@@ -3723,7 +3724,7 @@ class ShipFileUpload {
                 e.preventDefault();
                 this.handleFileUpload(Array.from(e.target.files));
             });
-        }, ...(ngDevMode ? [{ debugName: "inputEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "inputEffect" }] : /* istanbul ignore next */ []));
     }
     handleFileUpload(newFiles) {
         if (this.multiple()) {
@@ -3733,8 +3734,8 @@ class ShipFileUpload {
             this.files.set(newFiles);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipFileUpload, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipFileUpload, isStandalone: true, selector: "sh-file-upload", inputs: { multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, overlayText: { classPropertyName: "overlayText", publicName: "overlayText", isSignal: true, isRequired: false, transformFunction: null }, files: { classPropertyName: "files", publicName: "files", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { placeholder: "placeholderChange", files: "filesChange" }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["input"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipFileUpload, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipFileUpload, isStandalone: true, selector: "sh-file-upload", inputs: { multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, overlayText: { classPropertyName: "overlayText", publicName: "overlayText", isSignal: true, isRequired: false, transformFunction: null }, files: { classPropertyName: "files", publicName: "files", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { placeholder: "placeholderChange", files: "filesChange" }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["input"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <sh-form-field [class]="fileUploadClasses()">
       <ng-content select="label" ngProjectAs="label"></ng-content>
 
@@ -3752,9 +3753,9 @@ class ShipFileUpload {
 
       <sh-icon suffix>upload-simple</sh-icon>
     </sh-form-field>
-  `, isInline: true, dependencies: [{ kind: "component", type: ShipFormField, selector: "sh-form-field", inputs: ["color", "variant", "size", "readonly"] }, { kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "variant", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: ShipFormField, selector: "sh-form-field", inputs: ["color", "variant", "size", "readonly"] }, { kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipFileUpload, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipFileUpload, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-file-upload',
@@ -3782,13 +3783,131 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
                 }]
         }], propDecorators: { inputRef: [{ type: i0.ViewChild, args: ['input', { isSignal: true }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }, { type: i0.Output, args: ["placeholderChange"] }], overlayText: [{ type: i0.Input, args: [{ isSignal: true, alias: "overlayText", required: false }] }], files: [{ type: i0.Input, args: [{ isSignal: true, alias: "files", required: false }] }, { type: i0.Output, args: ["filesChange"] }] } });
 
+class ShipAccordion {
+    constructor() {
+        this.selfElement = inject((ElementRef)).nativeElement;
+        this.name = input(`sh-accordion-${Math.random().toString(36).substring(2, 9)}`, ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+        this.value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+        this.allowMultiple = input(false, ...(ngDevMode ? [{ debugName: "allowMultiple" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+        this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+        this.hostClasses = shipComponentClasses('accordion', {
+            variant: this.variant,
+            size: this.size,
+        });
+        this.items = contentProjectionSignal('details', {
+            childList: true,
+            subtree: true,
+            attributes: true,
+            attributeFilter: ['open', 'value'],
+        });
+        this.selfElement.addEventListener('toggle', this.onToggle.bind(this), true);
+        effect(() => {
+            const isMultiple = this.allowMultiple();
+            const groupName = this.name();
+            const valStr = this.value();
+            const vals = valStr ? valStr.split(',').filter((v) => v !== '') : [];
+            this.items().forEach((details) => {
+                if (!isMultiple) {
+                    details.setAttribute('name', groupName);
+                }
+                else {
+                    details.removeAttribute('name');
+                }
+                const summary = details.querySelector('summary');
+                if (summary && !summary.querySelector('sh-icon')) {
+                    const icon = document.createElement('sh-icon');
+                    icon.textContent = 'caret-down';
+                    summary.appendChild(icon);
+                }
+                let contentWrapper = details.querySelector(':scope > .content');
+                if (!contentWrapper) {
+                    const newWrapper = document.createElement('div');
+                    newWrapper.className = 'content';
+                    const childrenToMove = Array.from(details.childNodes).filter((node) => {
+                        if (node.nodeType === Node.ELEMENT_NODE &&
+                            node.tagName.toLowerCase() === 'summary') {
+                            return false;
+                        }
+                        return true;
+                    });
+                    childrenToMove.forEach((child) => newWrapper.appendChild(child));
+                    details.appendChild(newWrapper);
+                    contentWrapper = newWrapper;
+                }
+                const itemVal = details.getAttribute('value');
+                if (itemVal && vals.includes(itemVal)) {
+                    // Avoid triggering endless loops by only setting open if it actually changed
+                    if (!details.open)
+                        details.open = true;
+                }
+                else if (itemVal) {
+                    if (details.open)
+                        details.open = false;
+                }
+            });
+        });
+    }
+    onToggle(event) {
+        const target = event.target;
+        if (target.tagName !== 'DETAILS')
+            return;
+        if (!this.selfElement.contains(target))
+            return;
+        const itemVal = target.getAttribute('value');
+        if (!itemVal)
+            return; // Uncontrolled details element
+        const isOpen = target.open;
+        if (this.allowMultiple()) {
+            let vals = this.value()
+                ? this.value()
+                    .split(',')
+                    .filter((v) => v !== '')
+                : [];
+            if (isOpen && !vals.includes(itemVal))
+                vals.push(itemVal);
+            if (!isOpen)
+                vals = vals.filter((v) => v !== itemVal);
+            this.value.set(vals.join(','));
+        }
+        else {
+            if (isOpen) {
+                this.value.set(itemVal);
+            }
+            else {
+                if (this.value() === itemVal) {
+                    this.value.set(null);
+                }
+            }
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipAccordion, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: ShipAccordion, isStandalone: true, selector: "sh-accordion", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, allowMultiple: { classPropertyName: "allowMultiple", publicName: "allowMultiple", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "class.sh-accordion": "true", "class": "hostClasses()" } }, ngImport: i0, template: `
+    <ng-content></ng-content>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipAccordion, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'sh-accordion',
+                    template: `
+    <ng-content></ng-content>
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: {
+                        '[class.sh-accordion]': 'true',
+                        '[class]': 'hostClasses()',
+                    },
+                }]
+        }], ctorParameters: () => [], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], allowMultiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowMultiple", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
+
 class ShipList {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipList, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.5", type: ShipList, isStandalone: true, selector: "sh-list", ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipList, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.5", type: ShipList, isStandalone: true, selector: "sh-list", ngImport: i0, template: `
     <ng-content />
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipList, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipList, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-list',
@@ -3801,7 +3920,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
         }] });
 
 function observeFirstChild(parentEl, elementTags) {
-    const elementSignal = signal(null, ...(ngDevMode ? [{ debugName: "elementSignal" }] : []));
+    const elementSignal = signal(null, ...(ngDevMode ? [{ debugName: "elementSignal" }] : /* istanbul ignore next */ []));
     const _upperCaseElementTags = elementTags.map((tag) => tag.toUpperCase());
     const injector = inject(Injector);
     const destroyRef = injector.get(DestroyRef);
@@ -3835,7 +3954,7 @@ function observeFirstChild(parentEl, elementTags) {
 function observeChildren(parentEl, elementTags) {
     const injector = inject(Injector);
     const destroyRef = injector.get(DestroyRef);
-    const elementsSignal = signal([], ...(ngDevMode ? [{ debugName: "elementsSignal" }] : []));
+    const elementsSignal = signal([], ...(ngDevMode ? [{ debugName: "elementsSignal" }] : /* istanbul ignore next */ []));
     let effectOnSignal = null;
     let observer = null;
     const setupObserver = (el, elementTags) => {
@@ -3888,10 +4007,10 @@ function observeChildren(parentEl, elementTags) {
 
 function createFormInputSignal(formEl, elementTags = ['input', 'textarea']) {
     const elementRefSignal = formEl ? formEl : observeFirstChild(inject(ElementRef), elementTags);
-    const valueSignal = signal(undefined, ...(ngDevMode ? [{ debugName: "valueSignal" }] : []));
+    const valueSignal = signal(undefined, ...(ngDevMode ? [{ debugName: "valueSignal" }] : /* istanbul ignore next */ []));
     const injector = inject(Injector);
     const destroyRef = injector.get(DestroyRef);
-    const firstInputEl = signal(null, ...(ngDevMode ? [{ debugName: "firstInputEl" }] : []));
+    const firstInputEl = signal(null, ...(ngDevMode ? [{ debugName: "firstInputEl" }] : /* istanbul ignore next */ []));
     effect((onCleanup) => {
         const elRef = elementRefSignal();
         if (!elRef)
@@ -3973,18 +4092,18 @@ class ShipMenu {
     constructor() {
         this.#document = inject(DOCUMENT);
         this.#renderer = inject(Renderer2);
-        this.asMultiLayer = input(false, ...(ngDevMode ? [{ debugName: "asMultiLayer" }] : []));
-        this.openIndicator = input(false, ...(ngDevMode ? [{ debugName: "openIndicator" }] : []));
-        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
-        this.customOptionElementSelectors = input(['button'], ...(ngDevMode ? [{ debugName: "customOptionElementSelectors" }] : []));
-        this.keepClickedOptionActive = input(false, ...(ngDevMode ? [{ debugName: "keepClickedOptionActive" }] : []));
-        this.closeOnClick = input(true, ...(ngDevMode ? [{ debugName: "closeOnClick" }] : []));
-        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
+        this.asMultiLayer = input(false, ...(ngDevMode ? [{ debugName: "asMultiLayer" }] : /* istanbul ignore next */ []));
+        this.openIndicator = input(false, ...(ngDevMode ? [{ debugName: "openIndicator" }] : /* istanbul ignore next */ []));
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+        this.customOptionElementSelectors = input(['button'], ...(ngDevMode ? [{ debugName: "customOptionElementSelectors" }] : /* istanbul ignore next */ []));
+        this.keepClickedOptionActive = input(false, ...(ngDevMode ? [{ debugName: "keepClickedOptionActive" }] : /* istanbul ignore next */ []));
+        this.closeOnClick = input(true, ...(ngDevMode ? [{ debugName: "closeOnClick" }] : /* istanbul ignore next */ []));
+        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
         this.closed = output();
-        this.searchable = input(false, ...(ngDevMode ? [{ debugName: "searchable" }] : []));
-        this.activeOptionIndex = signal(-1, ...(ngDevMode ? [{ debugName: "activeOptionIndex" }] : []));
-        this.inputRef = viewChild('inputRef', ...(ngDevMode ? [{ debugName: "inputRef" }] : []));
-        this.optionsRef = viewChild('optionsRef', ...(ngDevMode ? [{ debugName: "optionsRef" }] : []));
+        this.searchable = input(false, ...(ngDevMode ? [{ debugName: "searchable" }] : /* istanbul ignore next */ []));
+        this.activeOptionIndex = signal(-1, ...(ngDevMode ? [{ debugName: "activeOptionIndex" }] : /* istanbul ignore next */ []));
+        this.inputRef = viewChild('inputRef', ...(ngDevMode ? [{ debugName: "inputRef" }] : /* istanbul ignore next */ []));
+        this.optionsRef = viewChild('optionsRef', ...(ngDevMode ? [{ debugName: "optionsRef" }] : /* istanbul ignore next */ []));
         this.openMenusEffect = effect((onCleanup) => {
             if (this.isOpen()) {
                 ShipMenu.openMenus.push(this);
@@ -3995,12 +4114,12 @@ class ShipMenu {
                     ShipMenu.openMenus.splice(index, 1);
                 }
             });
-        }, ...(ngDevMode ? [{ debugName: "openMenusEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "openMenusEffect" }] : /* istanbul ignore next */ []));
         this.options = observeChildren(this.optionsRef, this.customOptionElementSelectors);
-        this.optionsEl = computed(() => this.options.signal().filter((x) => !x.disabled), ...(ngDevMode ? [{ debugName: "optionsEl" }] : []));
+        this.optionsEl = computed(() => this.options.signal().filter((x) => !x.disabled), ...(ngDevMode ? [{ debugName: "optionsEl" }] : /* istanbul ignore next */ []));
         this.inputValue = createFormInputSignal(this.inputRef);
         this.optionsId = generateUniqueId();
-        this.activeOptionId = signal(undefined, ...(ngDevMode ? [{ debugName: "activeOptionId" }] : []));
+        this.activeOptionId = signal(undefined, ...(ngDevMode ? [{ debugName: "activeOptionId" }] : /* istanbul ignore next */ []));
         this.abortController = null;
         this.optionsEffect = effect(() => {
             if (this.abortController !== null) {
@@ -4040,7 +4159,7 @@ class ShipMenu {
                     }
                 });
             }
-        }, ...(ngDevMode ? [{ debugName: "optionsEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "optionsEffect" }] : /* istanbul ignore next */ []));
         this.keyDownEventListener = (e) => {
             // Only handle events if this is the most recently opened menu
             if (ShipMenu.openMenus.at(-1) !== this)
@@ -4105,7 +4224,7 @@ class ShipMenu {
             }
         };
         this._lastElementList = [];
-        this.activeElements = signal([], ...(ngDevMode ? [{ debugName: "activeElements" }] : []));
+        this.activeElements = signal([], ...(ngDevMode ? [{ debugName: "activeElements" }] : /* istanbul ignore next */ []));
         this.lastInputValue = '';
         this.inputValueEffect = effect(() => {
             const searchable = this.searchable();
@@ -4153,7 +4272,7 @@ class ShipMenu {
                 }
                 optionElements[i].setAttribute('role', 'option');
             }
-        }, ...(ngDevMode ? [{ debugName: "inputValueEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "inputValueEffect" }] : /* istanbul ignore next */ []));
         this.activeOptionIndexEffect = effect(() => {
             const optionElements = this.activeElements();
             const activeOptionIndex = this.activeOptionIndex();
@@ -4171,7 +4290,7 @@ class ShipMenu {
             else {
                 this.activeOptionId.set(undefined);
             }
-        }, ...(ngDevMode ? [{ debugName: "activeOptionIndexEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "activeOptionIndexEffect" }] : /* istanbul ignore next */ []));
     }
     #document;
     #renderer;
@@ -4302,8 +4421,8 @@ class ShipMenu {
             ShipMenu.openMenus.splice(index, 1);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipMenu, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipMenu, isStandalone: true, selector: "sh-menu", inputs: { asMultiLayer: { classPropertyName: "asMultiLayer", publicName: "asMultiLayer", isSignal: true, isRequired: false, transformFunction: null }, openIndicator: { classPropertyName: "openIndicator", publicName: "openIndicator", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, customOptionElementSelectors: { classPropertyName: "customOptionElementSelectors", publicName: "customOptionElementSelectors", isSignal: true, isRequired: false, transformFunction: null }, keepClickedOptionActive: { classPropertyName: "keepClickedOptionActive", publicName: "keepClickedOptionActive", isSignal: true, isRequired: false, transformFunction: null }, closeOnClick: { classPropertyName: "closeOnClick", publicName: "closeOnClick", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange", closed: "closed" }, host: { listeners: { "ship-menu-open": "onShipMenuOpen($event)" }, properties: { "class.disabled": "disabled()", "class.has-search": "searchable()", "class.multi-layer": "asMultiLayer()" } }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputRef"], descendants: true, isSignal: true }, { propertyName: "optionsRef", first: true, predicate: ["optionsRef"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipMenu, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipMenu, isStandalone: true, selector: "sh-menu", inputs: { asMultiLayer: { classPropertyName: "asMultiLayer", publicName: "asMultiLayer", isSignal: true, isRequired: false, transformFunction: null }, openIndicator: { classPropertyName: "openIndicator", publicName: "openIndicator", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, customOptionElementSelectors: { classPropertyName: "customOptionElementSelectors", publicName: "customOptionElementSelectors", isSignal: true, isRequired: false, transformFunction: null }, keepClickedOptionActive: { classPropertyName: "keepClickedOptionActive", publicName: "keepClickedOptionActive", isSignal: true, isRequired: false, transformFunction: null }, closeOnClick: { classPropertyName: "closeOnClick", publicName: "closeOnClick", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange", closed: "closed" }, host: { listeners: { "ship-menu-open": "onShipMenuOpen($event)" }, properties: { "class.disabled": "disabled()", "class.has-search": "searchable()", "class.multi-layer": "asMultiLayer()" } }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputRef"], descendants: true, isSignal: true }, { propertyName: "optionsRef", first: true, predicate: ["optionsRef"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <sh-popover
       #formFieldWrapper
       [(isOpen)]="isOpen"
@@ -4355,9 +4474,9 @@ class ShipMenu {
         <ng-content select="[menu]" />
       </div>
     </sh-popover>
-  `, isInline: true, dependencies: [{ kind: "component", type: ShipPopover, selector: "sh-popover", inputs: ["asMultiLayer", "disableOpenByClick", "isOpen", "options"], outputs: ["isOpenChange", "closed"] }, { kind: "component", type: ShipFormField, selector: "sh-form-field", inputs: ["color", "variant", "size", "readonly"] }, { kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "variant", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: ShipPopover, selector: "sh-popover", inputs: ["asMultiLayer", "disableOpenByClick", "isOpen", "options"], outputs: ["isOpenChange", "closed"] }, { kind: "component", type: ShipFormField, selector: "sh-form-field", inputs: ["color", "variant", "size", "readonly"] }, { kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipMenu, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipMenu, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-menu',
@@ -4429,20 +4548,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 
 class ShipProgressBar {
     constructor() {
-        this.value = input(undefined, ...(ngDevMode ? [{ debugName: "value" }] : []));
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
+        this.value = input(undefined, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('progressBar', {
             color: this.color,
             variant: this.variant,
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipProgressBar, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ShipProgressBar, isStandalone: true, selector: "sh-progress-bar", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipProgressBar, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: ShipProgressBar, isStandalone: true, selector: "sh-progress-bar", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: `
     <div class="progress-bar" [style.width.%]="value()"></div>
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipProgressBar, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipProgressBar, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-progress-bar',
@@ -4460,18 +4579,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 class ShipRadio {
     constructor() {
         this._elementRef = inject(ElementRef);
-        this.internalInput = viewChild('internalInput', ...(ngDevMode ? [{ debugName: "internalInput" }] : []));
+        this.internalInput = viewChild('internalInput', ...(ngDevMode ? [{ debugName: "internalInput" }] : /* istanbul ignore next */ []));
         this.projectedInputs = contentProjectionSignal('input:not(.internal-input)', {
             childList: true,
             attributes: true,
         });
-        this.checked = model(false, ...(ngDevMode ? [{ debugName: "checked" }] : []));
+        this.checked = model(false, ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
         this.currentClassList = classMutationSignal();
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
-        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
-        this.noInternalInput = input(false, ...(ngDevMode ? [{ debugName: "noInternalInput" }] : []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+        this.noInternalInput = input(false, ...(ngDevMode ? [{ debugName: "noInternalInput" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('radio', {
             color: this.color,
             variant: this.variant,
@@ -4494,8 +4613,8 @@ class ShipRadio {
         }
         event.preventDefault();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipRadio, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipRadio, isStandalone: true, selector: "sh-radio", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, noInternalInput: { classPropertyName: "noInternalInput", publicName: "noInternalInput", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange" }, host: { listeners: { "keydown.enter": "onEnter($event)" }, properties: { "class": "hostClasses()", "attr.disabled": "disabled() ? \"\" : null" } }, viewQueries: [{ propertyName: "internalInput", first: true, predicate: ["internalInput"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipRadio, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipRadio, isStandalone: true, selector: "sh-radio", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, noInternalInput: { classPropertyName: "noInternalInput", publicName: "noInternalInput", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange" }, host: { listeners: { "keydown.enter": "onEnter($event)" }, properties: { "class": "hostClasses()", "attr.disabled": "disabled() ? \"\" : null" } }, viewQueries: [{ propertyName: "internalInput", first: true, predicate: ["internalInput"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <div class="radio sh-sheet" [class]="currentClassList()"></div>
 
     <ng-content />
@@ -4511,7 +4630,7 @@ class ShipRadio {
     }
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipRadio, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipRadio, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-radio',
@@ -4548,13 +4667,13 @@ class ShipRangeSlider {
         this.#observer = null;
         this.#inputElement = null;
         this.#initialDefaultValue = 0;
-        this.unit = input('', ...(ngDevMode ? [{ debugName: "unit" }] : []));
-        this.value = model(this.#initialDefaultValue, ...(ngDevMode ? [{ debugName: "value" }] : []));
+        this.unit = input('', ...(ngDevMode ? [{ debugName: "unit" }] : /* istanbul ignore next */ []));
+        this.value = model(this.#initialDefaultValue, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
         this.inputState = signal({
             min: 0,
             max: 100,
             step: 1,
-        }, ...(ngDevMode ? [{ debugName: "inputState" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "inputState" }] : /* istanbul ignore next */ []));
         this.valuePercentage = computed(() => {
             const { min, max } = this.inputState();
             const currentValue = this.value() ?? min;
@@ -4565,9 +4684,9 @@ class ShipRangeSlider {
                 return 0;
             const percentage = ((currentValue - min) / range) * 100;
             return Math.max(0, Math.min(100, percentage));
-        }, ...(ngDevMode ? [{ debugName: "valuePercentage" }] : []));
-        this.trackFilledPercentage = computed(() => this.valuePercentage(), ...(ngDevMode ? [{ debugName: "trackFilledPercentage" }] : []));
-        this.thumbPositionPercentage = computed(() => this.valuePercentage(), ...(ngDevMode ? [{ debugName: "thumbPositionPercentage" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "valuePercentage" }] : /* istanbul ignore next */ []));
+        this.trackFilledPercentage = computed(() => this.valuePercentage(), ...(ngDevMode ? [{ debugName: "trackFilledPercentage" }] : /* istanbul ignore next */ []));
+        this.thumbPositionPercentage = computed(() => this.valuePercentage(), ...(ngDevMode ? [{ debugName: "thumbPositionPercentage" }] : /* istanbul ignore next */ []));
         this.syncModelToInputEffect = effect(() => {
             const modelValue = this.value();
             if (this.#inputElement) {
@@ -4576,7 +4695,7 @@ class ShipRangeSlider {
                     this.#inputElement.value = String(modelValue);
                 }
             }
-        }, ...(ngDevMode ? [{ debugName: "syncModelToInputEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "syncModelToInputEffect" }] : /* istanbul ignore next */ []));
     }
     #selfRef;
     #observer;
@@ -4723,8 +4842,8 @@ class ShipRangeSlider {
             this.#inputElement.oninput = null;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipRangeSlider, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ShipRangeSlider, isStandalone: true, selector: "sh-range-slider", inputs: { unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "class.has-input": "this.hasInputElement" } }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipRangeSlider, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: ShipRangeSlider, isStandalone: true, selector: "sh-range-slider", inputs: { unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "class.has-input": "this.hasInputElement" } }, ngImport: i0, template: `
     <div class="label">
       <ng-content select="label"></ng-content>
     </div>
@@ -4750,7 +4869,7 @@ class ShipRangeSlider {
     </div>
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipRangeSlider, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipRangeSlider, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-range-slider',
@@ -4789,15 +4908,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 
 class ShipSpinner {
     constructor() {
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('spinner', {
             color: this.color,
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipSpinner, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ShipSpinner, isStandalone: true, selector: "sh-spinner", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipSpinner, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: ShipSpinner, isStandalone: true, selector: "sh-spinner", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipSpinner, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipSpinner, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-spinner',
@@ -4813,29 +4932,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 class ShipSelect {
     constructor() {
         this.#selfRef = inject((ElementRef));
-        this.value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
-        this.label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : []));
-        this.asFreeText = input(false, ...(ngDevMode ? [{ debugName: "asFreeText" }] : []));
-        this.optionTitle = input(null, ...(ngDevMode ? [{ debugName: "optionTitle" }] : []));
-        this.freeTextTitle = input(null, ...(ngDevMode ? [{ debugName: "freeTextTitle" }] : []));
-        this.freeTextPlaceholder = input('Type to create a new option', ...(ngDevMode ? [{ debugName: "freeTextPlaceholder" }] : []));
-        this.validateFreeText = input(...(ngDevMode ? [undefined, { debugName: "validateFreeText" }] : []));
-        this.placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : []));
-        this.readonly = model(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
-        this.disabled = model(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
-        this.lazySearch = input(false, ...(ngDevMode ? [{ debugName: "lazySearch" }] : []));
-        this.inlineSearch = input(false, ...(ngDevMode ? [{ debugName: "inlineSearch" }] : []));
-        this.asText = input(false, ...(ngDevMode ? [{ debugName: "asText" }] : []));
-        this.isClearable = input(true, ...(ngDevMode ? [{ debugName: "isClearable" }] : []));
-        this.selectMultiple = input(false, ...(ngDevMode ? [{ debugName: "selectMultiple" }] : []));
-        this.optionTemplate = input(null, ...(ngDevMode ? [{ debugName: "optionTemplate" }] : []));
-        this.selectedOptionTemplate = input(null, ...(ngDevMode ? [{ debugName: "selectedOptionTemplate" }] : []));
-        this.placeholderTemplate = input(null, ...(ngDevMode ? [{ debugName: "placeholderTemplate" }] : []));
-        this.freeTextOptionTemplate = input(null, ...(ngDevMode ? [{ debugName: "freeTextOptionTemplate" }] : []));
-        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
-        this.isLoading = model(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
-        this.options = model([], ...(ngDevMode ? [{ debugName: "options" }] : []));
-        this.selectedOptions = model([], ...(ngDevMode ? [{ debugName: "selectedOptions" }] : []));
+        this.value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
+        this.label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
+        this.asFreeText = input(false, ...(ngDevMode ? [{ debugName: "asFreeText" }] : /* istanbul ignore next */ []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+        this.size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+        this.optionTitle = input(null, ...(ngDevMode ? [{ debugName: "optionTitle" }] : /* istanbul ignore next */ []));
+        this.freeTextTitle = input(null, ...(ngDevMode ? [{ debugName: "freeTextTitle" }] : /* istanbul ignore next */ []));
+        this.freeTextPlaceholder = input('Type to create a new option', ...(ngDevMode ? [{ debugName: "freeTextPlaceholder" }] : /* istanbul ignore next */ []));
+        this.validateFreeText = input(...(ngDevMode ? [undefined, { debugName: "validateFreeText" }] : /* istanbul ignore next */ []));
+        this.placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
+        this.readonly = model(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
+        this.disabled = model(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+        this.hostClasses = shipComponentClasses('select', {
+            color: this.color,
+            variant: this.variant,
+            size: this.size,
+            readonly: this.readonly,
+        });
+        this.lazySearch = input(false, ...(ngDevMode ? [{ debugName: "lazySearch" }] : /* istanbul ignore next */ []));
+        this.inlineSearch = input(false, ...(ngDevMode ? [{ debugName: "inlineSearch" }] : /* istanbul ignore next */ []));
+        this.asText = input(false, ...(ngDevMode ? [{ debugName: "asText" }] : /* istanbul ignore next */ []));
+        this.isClearable = input(true, ...(ngDevMode ? [{ debugName: "isClearable" }] : /* istanbul ignore next */ []));
+        this.selectMultiple = input(false, ...(ngDevMode ? [{ debugName: "selectMultiple" }] : /* istanbul ignore next */ []));
+        this.optionTemplate = input(null, ...(ngDevMode ? [{ debugName: "optionTemplate" }] : /* istanbul ignore next */ []));
+        this.selectedOptionTemplate = input(null, ...(ngDevMode ? [{ debugName: "selectedOptionTemplate" }] : /* istanbul ignore next */ []));
+        this.placeholderTemplate = input(null, ...(ngDevMode ? [{ debugName: "placeholderTemplate" }] : /* istanbul ignore next */ []));
+        this.freeTextOptionTemplate = input(null, ...(ngDevMode ? [{ debugName: "freeTextOptionTemplate" }] : /* istanbul ignore next */ []));
+        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+        this.isLoading = model(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : /* istanbul ignore next */ []));
+        this.options = model([], ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
+        this.selectedOptions = model([], ...(ngDevMode ? [{ debugName: "selectedOptions" }] : /* istanbul ignore next */ []));
         this.cleared = output();
         this.onAddNewFreeTextOption = output();
         this.computedFreeTextOption = computed(() => {
@@ -4846,11 +4974,11 @@ class ShipSelect {
                 newOption[valueKey] = inputValue;
             }
             return newOption;
-        }, ...(ngDevMode ? [{ debugName: "computedFreeTextOption" }] : []));
-        this.#previousSelectedOptions = signal(null, ...(ngDevMode ? [{ debugName: "#previousSelectedOptions" }] : []));
-        this.inlineTemplate = contentChild(TemplateRef, ...(ngDevMode ? [{ debugName: "inlineTemplate" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "computedFreeTextOption" }] : /* istanbul ignore next */ []));
+        this.#previousSelectedOptions = signal(null, ...(ngDevMode ? [{ debugName: "#previousSelectedOptions" }] : /* istanbul ignore next */ []));
+        this.inlineTemplate = contentChild(TemplateRef, ...(ngDevMode ? [{ debugName: "inlineTemplate" }] : /* istanbul ignore next */ []));
         this.optionsWrapRef = viewChild.required('optionsWrap');
-        this.inputRefInput = signal(null, ...(ngDevMode ? [{ debugName: "inputRefInput" }] : []));
+        this.inputRefInput = signal(null, ...(ngDevMode ? [{ debugName: "inputRefInput" }] : /* istanbul ignore next */ []));
         this.#inputObserver = typeof MutationObserver !== 'undefined' &&
             new MutationObserver((mutations) => {
                 for (var mutation of mutations) {
@@ -4860,25 +4988,25 @@ class ShipSelect {
                     }
                 }
             });
-        this.inputValue = signal('', ...(ngDevMode ? [{ debugName: "inputValue" }] : []));
-        this.prevInputValue = signal(null, ...(ngDevMode ? [{ debugName: "prevInputValue" }] : []));
-        this.focusedOptionIndex = signal(-1, ...(ngDevMode ? [{ debugName: "focusedOptionIndex" }] : []));
-        this._isClearable = computed(() => this.selectMultiple() || this.isClearable(), ...(ngDevMode ? [{ debugName: "_isClearable" }] : []));
-        this.selectClasses = computed(() => this.#selfRef.nativeElement.classList.toString(), ...(ngDevMode ? [{ debugName: "selectClasses" }] : []));
-        this.stretch = computed(() => this.selectClasses().includes('stretch'), ...(ngDevMode ? [{ debugName: "stretch" }] : []));
-        this.small = computed(() => this.selectClasses().includes('small'), ...(ngDevMode ? [{ debugName: "small" }] : []));
+        this.inputValue = signal('', ...(ngDevMode ? [{ debugName: "inputValue" }] : /* istanbul ignore next */ []));
+        this.prevInputValue = signal(null, ...(ngDevMode ? [{ debugName: "prevInputValue" }] : /* istanbul ignore next */ []));
+        this.focusedOptionIndex = signal(-1, ...(ngDevMode ? [{ debugName: "focusedOptionIndex" }] : /* istanbul ignore next */ []));
+        this._isClearable = computed(() => this.selectMultiple() || this.isClearable(), ...(ngDevMode ? [{ debugName: "_isClearable" }] : /* istanbul ignore next */ []));
+        this.selectClasses = computed(() => this.#selfRef.nativeElement.classList.toString(), ...(ngDevMode ? [{ debugName: "selectClasses" }] : /* istanbul ignore next */ []));
+        this.stretch = computed(() => this.selectClasses().includes('stretch'), ...(ngDevMode ? [{ debugName: "stretch" }] : /* istanbul ignore next */ []));
+        this.small = computed(() => this.selectClasses().includes('small'), ...(ngDevMode ? [{ debugName: "small" }] : /* istanbul ignore next */ []));
         this.placeholderText = computed(() => {
             const placeholder = this.placeholder();
             const inputRefEl = this.inputRefEl();
             return placeholder || inputRefEl?.placeholder || null;
-        }, ...(ngDevMode ? [{ debugName: "placeholderText" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "placeholderText" }] : /* istanbul ignore next */ []));
         this.selectedOptionValues = computed(() => {
             const selectedOptions = this.selectedOptions();
             const valueKey = this.value();
             return valueKey
                 ? selectedOptions.map((selectedOption) => this.#getProperty(selectedOption, valueKey))
                 : selectedOptions;
-        }, ...(ngDevMode ? [{ debugName: "selectedOptionValues" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "selectedOptionValues" }] : /* istanbul ignore next */ []));
         this.filteredOptions = computed(() => {
             const opts = this.options() || [];
             const label = this.label();
@@ -4914,7 +5042,7 @@ class ShipSelect {
             });
             scoredOptions.sort((a, b) => b.score - a.score);
             return scoredOptions.map((scoredOption) => scoredOption.item);
-        }, ...(ngDevMode ? [{ debugName: "filteredOptions" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "filteredOptions" }] : /* istanbul ignore next */ []));
         this.#componentId = generateUniqueId();
         this.inputRefEl = computed(() => {
             const inputRefInput = this.inputRefInput();
@@ -4948,18 +5076,15 @@ class ShipSelect {
             input.addEventListener('inputValueChanged', (event) => {
                 const newInputValue = event.detail.value;
                 const inputValue = this.inputValue();
-                if (newInputValue === inputValue)
+                const selectedOptionsLength = untracked(() => this.selectedOptions().length);
+                if (newInputValue === inputValue && (newInputValue !== '' || selectedOptionsLength > 0))
                     return;
-                if (newInputValue === '') {
-                    this.clear();
-                    return;
-                }
                 this.setSelectedOptionsFromValue(newInputValue);
                 this.setInputValueFromOptions(this.selectedOptions());
                 this.#setFirstSelectedOptionAsFocused();
             });
             return input;
-        }, ...(ngDevMode ? [{ debugName: "inputRefEl" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "inputRefEl" }] : /* istanbul ignore next */ []));
         this.focusEffect = effect(() => {
             const input = this.inputRefEl();
             if (!input)
@@ -4971,7 +5096,7 @@ class ShipSelect {
             else {
                 input.removeAttribute('aria-activedescendant');
             }
-        }, ...(ngDevMode ? [{ debugName: "focusEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "focusEffect" }] : /* istanbul ignore next */ []));
         this.openAbortController = null;
         this.isOpenEffect = effect(() => {
             const isOpen = this.isOpen();
@@ -5018,22 +5143,25 @@ class ShipSelect {
                     this.openAbortController = null;
                 }
             }
-        }, ...(ngDevMode ? [{ debugName: "isOpenEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "isOpenEffect" }] : /* istanbul ignore next */ []));
         this._inputValue = '';
         this.inputValueEffect = effect(() => {
             const inputValue = this.inputValue();
             this._inputValue = inputValue;
-        }, ...(ngDevMode ? [{ debugName: "inputValueEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "inputValueEffect" }] : /* istanbul ignore next */ []));
         this.inputRefElEffect = effect(() => {
             const input = this.inputRefEl();
             if (!input)
                 return;
-            if (input.value === this._inputValue)
+            const selectedOptionsLength = untracked(() => this.selectedOptions().length);
+            if (input.value === this._inputValue && (input.value !== '' || selectedOptionsLength > 0))
                 return;
             this.disabled.set(input.disabled);
-            this.setSelectedOptionsFromValue(input.value);
-            this.setInputValueFromOptions(this.selectedOptions());
-        }, ...(ngDevMode ? [{ debugName: "inputRefElEffect" }] : []));
+            untracked(() => {
+                this.setSelectedOptionsFromValue(input.value);
+                this.setInputValueFromOptions(this.selectedOptions());
+            });
+        }, ...(ngDevMode ? [{ debugName: "inputRefElEffect" }] : /* istanbul ignore next */ []));
         this.selectedLabels = computed(() => {
             const selected = this.selectedOptions();
             const label = this.label();
@@ -5041,7 +5169,7 @@ class ShipSelect {
                 return selected.join(', ');
             }
             return selected.map((selected) => this.getLabel(selected)).join(', ');
-        }, ...(ngDevMode ? [{ debugName: "selectedLabels" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "selectedLabels" }] : /* istanbul ignore next */ []));
         this.inputState = computed(() => {
             if ((this.selectedOptions().length > 0 || (this.asFreeText() && this.inputValue().length > 0)) && !this.isOpen()) {
                 return 'selected';
@@ -5059,8 +5187,8 @@ class ShipSelect {
                 return 'searching';
             }
             return 'closed';
-        }, ...(ngDevMode ? [{ debugName: "inputState" }] : []));
-        this.hasSearch = computed(() => this.inlineSearch() || this.lazySearch(), ...(ngDevMode ? [{ debugName: "hasSearch" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "inputState" }] : /* istanbul ignore next */ []));
+        this.hasSearch = computed(() => this.inlineSearch() || this.lazySearch(), ...(ngDevMode ? [{ debugName: "hasSearch" }] : /* istanbul ignore next */ []));
         this.#selectedOptionsEffect = effect(() => {
             if (this.selectMultiple() && this.hasSearch()) {
                 return;
@@ -5074,7 +5202,7 @@ class ShipSelect {
             })
                 .join(',');
             this.inputValue.set(inputValue);
-        }, ...(ngDevMode ? [{ debugName: "#selectedOptionsEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#selectedOptionsEffect" }] : /* istanbul ignore next */ []));
     }
     #selfRef;
     #previousSelectedOptions;
@@ -5149,9 +5277,10 @@ class ShipSelect {
         const inputAsArray = selectMultiple ? inputValueAsString : [inputValueAsString[0]];
         const selectedOptions = options.filter((option) => {
             const optionValue = valueKey ? this.#getProperty(option, valueKey)?.toString() : option?.toString();
-            return optionValue && inputAsArray.includes(optionValue);
+            return optionValue !== undefined && optionValue !== null && inputAsArray.includes(optionValue);
         });
-        this.selectedOptions.set(selectMultiple ? selectedOptions : [selectedOptions[0]]);
+        const isMatched = selectedOptions.length > 0;
+        this.selectedOptions.set(selectMultiple ? selectedOptions : isMatched ? [selectedOptions[0]] : []);
     }
     setInputValueFromOptions(options) {
         const valueKey = this.value();
@@ -5373,8 +5502,8 @@ class ShipSelect {
             this.#inputObserver.disconnect();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipSelect, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipSelect, isStandalone: true, selector: "sh-select", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, asFreeText: { classPropertyName: "asFreeText", publicName: "asFreeText", isSignal: true, isRequired: false, transformFunction: null }, optionTitle: { classPropertyName: "optionTitle", publicName: "optionTitle", isSignal: true, isRequired: false, transformFunction: null }, freeTextTitle: { classPropertyName: "freeTextTitle", publicName: "freeTextTitle", isSignal: true, isRequired: false, transformFunction: null }, freeTextPlaceholder: { classPropertyName: "freeTextPlaceholder", publicName: "freeTextPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, validateFreeText: { classPropertyName: "validateFreeText", publicName: "validateFreeText", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, lazySearch: { classPropertyName: "lazySearch", publicName: "lazySearch", isSignal: true, isRequired: false, transformFunction: null }, inlineSearch: { classPropertyName: "inlineSearch", publicName: "inlineSearch", isSignal: true, isRequired: false, transformFunction: null }, asText: { classPropertyName: "asText", publicName: "asText", isSignal: true, isRequired: false, transformFunction: null }, isClearable: { classPropertyName: "isClearable", publicName: "isClearable", isSignal: true, isRequired: false, transformFunction: null }, selectMultiple: { classPropertyName: "selectMultiple", publicName: "selectMultiple", isSignal: true, isRequired: false, transformFunction: null }, optionTemplate: { classPropertyName: "optionTemplate", publicName: "optionTemplate", isSignal: true, isRequired: false, transformFunction: null }, selectedOptionTemplate: { classPropertyName: "selectedOptionTemplate", publicName: "selectedOptionTemplate", isSignal: true, isRequired: false, transformFunction: null }, placeholderTemplate: { classPropertyName: "placeholderTemplate", publicName: "placeholderTemplate", isSignal: true, isRequired: false, transformFunction: null }, freeTextOptionTemplate: { classPropertyName: "freeTextOptionTemplate", publicName: "freeTextOptionTemplate", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, selectedOptions: { classPropertyName: "selectedOptions", publicName: "selectedOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { readonly: "readonlyChange", disabled: "disabledChange", isOpen: "isOpenChange", isLoading: "isLoadingChange", options: "optionsChange", selectedOptions: "selectedOptionsChange", cleared: "cleared", onAddNewFreeTextOption: "onAddNewFreeTextOption" }, host: { properties: { "class.multiple": "selectMultiple()" } }, queries: [{ propertyName: "inlineTemplate", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "optionsWrapRef", first: true, predicate: ["optionsWrap"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipSelect, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipSelect, isStandalone: true, selector: "sh-select", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, asFreeText: { classPropertyName: "asFreeText", publicName: "asFreeText", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, optionTitle: { classPropertyName: "optionTitle", publicName: "optionTitle", isSignal: true, isRequired: false, transformFunction: null }, freeTextTitle: { classPropertyName: "freeTextTitle", publicName: "freeTextTitle", isSignal: true, isRequired: false, transformFunction: null }, freeTextPlaceholder: { classPropertyName: "freeTextPlaceholder", publicName: "freeTextPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, validateFreeText: { classPropertyName: "validateFreeText", publicName: "validateFreeText", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, lazySearch: { classPropertyName: "lazySearch", publicName: "lazySearch", isSignal: true, isRequired: false, transformFunction: null }, inlineSearch: { classPropertyName: "inlineSearch", publicName: "inlineSearch", isSignal: true, isRequired: false, transformFunction: null }, asText: { classPropertyName: "asText", publicName: "asText", isSignal: true, isRequired: false, transformFunction: null }, isClearable: { classPropertyName: "isClearable", publicName: "isClearable", isSignal: true, isRequired: false, transformFunction: null }, selectMultiple: { classPropertyName: "selectMultiple", publicName: "selectMultiple", isSignal: true, isRequired: false, transformFunction: null }, optionTemplate: { classPropertyName: "optionTemplate", publicName: "optionTemplate", isSignal: true, isRequired: false, transformFunction: null }, selectedOptionTemplate: { classPropertyName: "selectedOptionTemplate", publicName: "selectedOptionTemplate", isSignal: true, isRequired: false, transformFunction: null }, placeholderTemplate: { classPropertyName: "placeholderTemplate", publicName: "placeholderTemplate", isSignal: true, isRequired: false, transformFunction: null }, freeTextOptionTemplate: { classPropertyName: "freeTextOptionTemplate", publicName: "freeTextOptionTemplate", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, selectedOptions: { classPropertyName: "selectedOptions", publicName: "selectedOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { readonly: "readonlyChange", disabled: "disabledChange", isOpen: "isOpenChange", isLoading: "isLoadingChange", options: "optionsChange", selectedOptions: "selectedOptionsChange", cleared: "cleared", onAddNewFreeTextOption: "onAddNewFreeTextOption" }, host: { properties: { "class.multiple": "selectMultiple()", "class": "hostClasses()" } }, queries: [{ propertyName: "inlineTemplate", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "optionsWrapRef", first: true, predicate: ["optionsWrap"], descendants: true, isSignal: true }], ngImport: i0, template: `
     @let _placeholderTemplate = placeholderTemplate();
     @let _optionTemplate = optionTemplate();
     @let _freeTextOptionTemplate = freeTextOptionTemplate();
@@ -5400,6 +5529,9 @@ class ShipSelect {
       <sh-form-field
         trigger
         (click)="open()"
+        [color]="color()"
+        [variant]="variant()"
+        [size]="size()"
         [class.stretch]="stretch()"
         [class.small]="small()"
         [class.readonly]="readonly() || disabled()">
@@ -5527,9 +5659,9 @@ class ShipSelect {
         }
       </div>
     </sh-popover>
-  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ShipPopover, selector: "sh-popover", inputs: ["asMultiLayer", "disableOpenByClick", "isOpen", "options"], outputs: ["isOpenChange", "closed"] }, { kind: "component", type: ShipFormField, selector: "sh-form-field", inputs: ["color", "variant", "size", "readonly"] }, { kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "variant", "size"] }, { kind: "component", type: ShipCheckbox, selector: "sh-checkbox", inputs: ["checked", "color", "variant", "readonly", "disabled", "noInternalInput"], outputs: ["checkedChange"] }, { kind: "component", type: ShipSpinner, selector: "sh-spinner", inputs: ["color"] }, { kind: "component", type: ShipChip, selector: "sh-chip", inputs: ["color", "variant", "size", "sharp", "dynamic", "readonly"] }, { kind: "component", type: ShipDivider, selector: "sh-divider" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ShipPopover, selector: "sh-popover", inputs: ["asMultiLayer", "disableOpenByClick", "isOpen", "options"], outputs: ["isOpenChange", "closed"] }, { kind: "component", type: ShipFormField, selector: "sh-form-field", inputs: ["color", "variant", "size", "readonly"] }, { kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "size"] }, { kind: "component", type: ShipCheckbox, selector: "sh-checkbox", inputs: ["checked", "color", "variant", "readonly", "disabled", "noInternalInput"], outputs: ["checkedChange"] }, { kind: "component", type: ShipSpinner, selector: "sh-spinner", inputs: ["color"] }, { kind: "component", type: ShipChip, selector: "sh-chip", inputs: ["color", "variant", "size", "sharp", "dynamic", "readonly"] }, { kind: "component", type: ShipDivider, selector: "sh-divider" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipSelect, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipSelect, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-select',
@@ -5560,6 +5692,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
       <sh-form-field
         trigger
         (click)="open()"
+        [color]="color()"
+        [variant]="variant()"
+        [size]="size()"
         [class.stretch]="stretch()"
         [class.small]="small()"
         [class.readonly]="readonly() || disabled()">
@@ -5690,15 +5825,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
   `,
                     host: {
                         '[class.multiple]': 'selectMultiple()',
+                        '[class]': 'hostClasses()',
                     },
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
-        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], asFreeText: [{ type: i0.Input, args: [{ isSignal: true, alias: "asFreeText", required: false }] }], optionTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionTitle", required: false }] }], freeTextTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "freeTextTitle", required: false }] }], freeTextPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "freeTextPlaceholder", required: false }] }], validateFreeText: [{ type: i0.Input, args: [{ isSignal: true, alias: "validateFreeText", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }, { type: i0.Output, args: ["readonlyChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], lazySearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "lazySearch", required: false }] }], inlineSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "inlineSearch", required: false }] }], asText: [{ type: i0.Input, args: [{ isSignal: true, alias: "asText", required: false }] }], isClearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "isClearable", required: false }] }], selectMultiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectMultiple", required: false }] }], optionTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionTemplate", required: false }] }], selectedOptionTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedOptionTemplate", required: false }] }], placeholderTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholderTemplate", required: false }] }], freeTextOptionTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "freeTextOptionTemplate", required: false }] }], isOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOpen", required: false }] }, { type: i0.Output, args: ["isOpenChange"] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }, { type: i0.Output, args: ["isLoadingChange"] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }, { type: i0.Output, args: ["optionsChange"] }], selectedOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedOptions", required: false }] }, { type: i0.Output, args: ["selectedOptionsChange"] }], cleared: [{ type: i0.Output, args: ["cleared"] }], onAddNewFreeTextOption: [{ type: i0.Output, args: ["onAddNewFreeTextOption"] }], inlineTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TemplateRef), { isSignal: true }] }], optionsWrapRef: [{ type: i0.ViewChild, args: ['optionsWrap', { isSignal: true }] }] } });
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], asFreeText: [{ type: i0.Input, args: [{ isSignal: true, alias: "asFreeText", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], optionTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionTitle", required: false }] }], freeTextTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "freeTextTitle", required: false }] }], freeTextPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "freeTextPlaceholder", required: false }] }], validateFreeText: [{ type: i0.Input, args: [{ isSignal: true, alias: "validateFreeText", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }, { type: i0.Output, args: ["readonlyChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], lazySearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "lazySearch", required: false }] }], inlineSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "inlineSearch", required: false }] }], asText: [{ type: i0.Input, args: [{ isSignal: true, alias: "asText", required: false }] }], isClearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "isClearable", required: false }] }], selectMultiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectMultiple", required: false }] }], optionTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionTemplate", required: false }] }], selectedOptionTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedOptionTemplate", required: false }] }], placeholderTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholderTemplate", required: false }] }], freeTextOptionTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "freeTextOptionTemplate", required: false }] }], isOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOpen", required: false }] }, { type: i0.Output, args: ["isOpenChange"] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }, { type: i0.Output, args: ["isLoadingChange"] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }, { type: i0.Output, args: ["optionsChange"] }], selectedOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedOptions", required: false }] }, { type: i0.Output, args: ["selectedOptionsChange"] }], cleared: [{ type: i0.Output, args: ["cleared"] }], onAddNewFreeTextOption: [{ type: i0.Output, args: ["onAddNewFreeTextOption"] }], inlineTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TemplateRef), { isSignal: true }] }], optionsWrapRef: [{ type: i0.ViewChild, args: ['optionsWrap', { isSignal: true }] }] } });
 
 function watchHostClass(className) {
     const elementRef = inject(ElementRef);
     const destroyRef = inject(DestroyRef);
-    const hasClass = signal(false, ...(ngDevMode ? [{ debugName: "hasClass" }] : []));
+    const hasClass = signal(false, ...(ngDevMode ? [{ debugName: "hasClass" }] : /* istanbul ignore next */ []));
     const observer = typeof MutationObserver !== 'undefined' &&
         new MutationObserver((mutations) => {
             mutations.forEach((mutation) => {
@@ -5726,16 +5862,16 @@ class ShipSidenav {
         this.#selfRef = inject(ElementRef);
         this.openWidth = 280;
         this.openWidthTreshold = this.openWidth * 0.5;
-        this.disableDrag = input(false, ...(ngDevMode ? [{ debugName: "disableDrag" }] : []));
-        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
+        this.disableDrag = input(false, ...(ngDevMode ? [{ debugName: "disableDrag" }] : /* istanbul ignore next */ []));
+        this.isOpen = model(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
         this.isOverlay = watchHostClass('overlay');
         this.#closestParent = this.#selfRef.nativeElement.parentElement;
         this.#closestParentRect = this.#closestParent.getBoundingClientRect && this.#closestParent.getBoundingClientRect();
         this.dragImageElement = viewChild.required('dragImageElement');
-        this.dragIsEnding = signal(false, ...(ngDevMode ? [{ debugName: "dragIsEnding" }] : []));
-        this.dragIsOnScreen = signal(true, ...(ngDevMode ? [{ debugName: "dragIsOnScreen" }] : []));
-        this.isDragging = signal(false, ...(ngDevMode ? [{ debugName: "isDragging" }] : []));
-        this.dragPositionX = signal(0, ...(ngDevMode ? [{ debugName: "dragPositionX" }] : []));
+        this.dragIsEnding = signal(false, ...(ngDevMode ? [{ debugName: "dragIsEnding" }] : /* istanbul ignore next */ []));
+        this.dragIsOnScreen = signal(true, ...(ngDevMode ? [{ debugName: "dragIsOnScreen" }] : /* istanbul ignore next */ []));
+        this.isDragging = signal(false, ...(ngDevMode ? [{ debugName: "isDragging" }] : /* istanbul ignore next */ []));
+        this.dragPositionX = signal(0, ...(ngDevMode ? [{ debugName: "dragPositionX" }] : /* istanbul ignore next */ []));
         this.dragActualPositionX = computed(() => {
             const dragPosition = this.dragPositionX();
             const openWidth = 280;
@@ -5757,7 +5893,7 @@ class ShipSidenav {
                 return deadZoneStart - dampenedDistance;
             }
             return dragPosition;
-        }, ...(ngDevMode ? [{ debugName: "dragActualPositionX" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "dragActualPositionX" }] : /* istanbul ignore next */ []));
         this.draggingStyle = computed(() => {
             if (!this.isOverlay() || this.disableDrag())
                 return null;
@@ -5765,7 +5901,7 @@ class ShipSidenav {
                 return `translateX(${this.dragActualPositionX()}px)`;
             }
             return this.isOpen() ? `translateX(${this.openWidth}px)` : `translateX(0px)`;
-        }, ...(ngDevMode ? [{ debugName: "draggingStyle" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "draggingStyle" }] : /* istanbul ignore next */ []));
         this.draggingEffect = effect(() => {
             if (this.disableDrag())
                 return;
@@ -5775,7 +5911,7 @@ class ShipSidenav {
             else {
                 this.#document.body.classList.remove('dragging');
             }
-        }, ...(ngDevMode ? [{ debugName: "draggingEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "draggingEffect" }] : /* istanbul ignore next */ []));
     }
     #document;
     #selfRef;
@@ -5841,8 +5977,8 @@ class ShipSidenav {
         e.stopPropagation();
         this.isDragging.set(false);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipSidenav, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipSidenav, isStandalone: true, selector: "sh-sidenav", inputs: { disableDrag: { classPropertyName: "disableDrag", publicName: "disableDrag", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange" }, host: { properties: { "class.open": "isOpen()", "class.closed": "!isOpen()", "class.is-dragging": "isDragging()" } }, viewQueries: [{ propertyName: "dragImageElement", first: true, predicate: ["dragImageElement"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipSidenav, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipSidenav, isStandalone: true, selector: "sh-sidenav", inputs: { disableDrag: { classPropertyName: "disableDrag", publicName: "disableDrag", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange" }, host: { properties: { "class.open": "isOpen()", "class.closed": "!isOpen()", "class.is-dragging": "isDragging()" } }, viewQueries: [{ propertyName: "dragImageElement", first: true, predicate: ["dragImageElement"], descendants: true, isSignal: true }], ngImport: i0, template: `
     @if (isOverlay() && !disableDrag()) {
       <div #dragImageElement class="drag-image"></div>
     }
@@ -5879,7 +6015,7 @@ class ShipSidenav {
     </div>
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipSidenav, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipSidenav, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-sidenav',
@@ -5958,10 +6094,10 @@ class GridSortable {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: GridSortable, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.5", type: GridSortable, isStandalone: true, selector: "[shGridSortable]", host: { listeners: { "dragstart": "onDragStart($event)", "dragover": "onDragOver($event)", "dragenter": "onDragEnter($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: GridSortable, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.5", type: GridSortable, isStandalone: true, selector: "[shGridSortable]", host: { listeners: { "dragstart": "onDragStart($event)", "dragover": "onDragOver($event)", "dragenter": "onDragEnter($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: GridSortable, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: GridSortable, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -5983,12 +6119,12 @@ class ShipSortable {
         this.#document = inject(DOCUMENT);
         this.#selfEl = inject((ElementRef));
         this.#renderer = inject(Renderer2);
-        this.#placeholderEl = signal(null, ...(ngDevMode ? [{ debugName: "#placeholderEl" }] : []));
-        this.#ghostEl = signal(null, ...(ngDevMode ? [{ debugName: "#ghostEl" }] : []));
-        this.#parentGap = signal(0, ...(ngDevMode ? [{ debugName: "#parentGap" }] : []));
-        this.dragStartIndex = signal(-1, ...(ngDevMode ? [{ debugName: "dragStartIndex" }] : []));
-        this.dragToIndex = signal(-1, ...(ngDevMode ? [{ debugName: "dragToIndex" }] : []));
-        this.dragables = signal([], ...(ngDevMode ? [{ debugName: "dragables" }] : []));
+        this.#placeholderEl = signal(null, ...(ngDevMode ? [{ debugName: "#placeholderEl" }] : /* istanbul ignore next */ []));
+        this.#ghostEl = signal(null, ...(ngDevMode ? [{ debugName: "#ghostEl" }] : /* istanbul ignore next */ []));
+        this.#parentGap = signal(0, ...(ngDevMode ? [{ debugName: "#parentGap" }] : /* istanbul ignore next */ []));
+        this.dragStartIndex = signal(-1, ...(ngDevMode ? [{ debugName: "dragStartIndex" }] : /* istanbul ignore next */ []));
+        this.dragToIndex = signal(-1, ...(ngDevMode ? [{ debugName: "dragToIndex" }] : /* istanbul ignore next */ []));
+        this.dragables = signal([], ...(ngDevMode ? [{ debugName: "dragables" }] : /* istanbul ignore next */ []));
         this.afterDrop = output();
         this.abortController = null;
         this.isDropping = false;
@@ -6035,7 +6171,7 @@ class ShipSortable {
                     }
                 }
             }
-        }, ...(ngDevMode ? [{ debugName: "draggingEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "draggingEffect" }] : /* istanbul ignore next */ []));
         this.draggablesEffect = effect(() => {
             const els = this.dragables();
             if (this.abortController) {
@@ -6046,7 +6182,7 @@ class ShipSortable {
                 el.addEventListener('dragstart', (e) => this.dragStart(e), { signal: this.abortController.signal });
                 el.addEventListener('dragend', () => this.dragEnd(), { signal: this.abortController.signal });
             }
-        }, ...(ngDevMode ? [{ debugName: "draggablesEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "draggablesEffect" }] : /* istanbul ignore next */ []));
         this.#dragableObserver = typeof MutationObserver !== 'undefined' &&
             new MutationObserver((mutations) => {
                 for (const mutation of mutations) {
@@ -6194,10 +6330,10 @@ class ShipSortable {
         this.#dragableObserver?.disconnect();
         this.abortController?.abort();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipSortable, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.5", type: ShipSortable, isStandalone: true, selector: "[shSortable]", outputs: { afterDrop: "afterDrop" }, host: { listeners: { "dragover": "dragOver($event)", "drop": "drop()" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipSortable, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.5", type: ShipSortable, isStandalone: true, selector: "[shSortable]", outputs: { afterDrop: "afterDrop" }, host: { listeners: { "dragover": "dragOver($event)", "drop": "drop()" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipSortable, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipSortable, decorators: [{
             type: Directive,
             args: [{
                     selector: '[shSortable]',
@@ -6224,7 +6360,7 @@ function moveIndex(array, event) {
 class ShipStepper extends ShipSelectionGroup {
     constructor() {
         super('[value], [step], [routerLinkActive], button, a', 'active');
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('stepper', {
             color: this.color,
         });
@@ -6241,12 +6377,12 @@ class ShipStepper extends ShipSelectionGroup {
             });
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipStepper, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ShipStepper, isStandalone: true, selector: "sh-stepper", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipStepper, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: ShipStepper, isStandalone: true, selector: "sh-stepper", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, usesInheritance: true, ngImport: i0, template: `
     <ng-content />
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipStepper, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipStepper, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-stepper',
@@ -6266,9 +6402,9 @@ class ShipResize {
         this.#el = inject(ElementRef);
         this.#renderer = inject(Renderer2);
         this.#table = inject(ShipTable);
-        this.resizable = input(true, ...(ngDevMode ? [{ debugName: "resizable" }] : []));
-        this.minWidth = input(50, ...(ngDevMode ? [{ debugName: "minWidth" }] : []));
-        this.maxWidth = input(null, ...(ngDevMode ? [{ debugName: "maxWidth" }] : []));
+        this.resizable = input(true, ...(ngDevMode ? [{ debugName: "resizable" }] : /* istanbul ignore next */ []));
+        this.minWidth = input(50, ...(ngDevMode ? [{ debugName: "minWidth" }] : /* istanbul ignore next */ []));
+        this.maxWidth = input(null, ...(ngDevMode ? [{ debugName: "maxWidth" }] : /* istanbul ignore next */ []));
         this.#resizing = false;
         this.#animationFrameRequest = null; // Store request ID
     }
@@ -6340,10 +6476,10 @@ class ShipResize {
             cancelAnimationFrame(this.#animationFrameRequest);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipResize, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ShipResize, isStandalone: true, selector: "[shResize]", inputs: { resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "document:mousemove": "onMouseMove($event)", "document:mouseup": "onMouseUp($event)", "document:click": "onClick($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipResize, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.5", type: ShipResize, isStandalone: true, selector: "[shResize]", inputs: { resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "document:mousemove": "onMouseMove($event)", "document:mouseup": "onMouseUp($event)", "document:click": "onClick($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipResize, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipResize, decorators: [{
             type: Directive,
             args: [{
                     selector: '[shResize]',
@@ -6362,21 +6498,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 class ShipSort {
     constructor() {
         this.#table = inject(ShipTable);
-        this.shSort = input(...(ngDevMode ? [undefined, { debugName: "shSort" }] : []));
+        this.shSort = input(...(ngDevMode ? [undefined, { debugName: "shSort" }] : /* istanbul ignore next */ []));
         this.sortAsc = computed(() => {
             const currentSort = this.#table.sortByColumn();
             const thisColumn = this.shSort();
             if (!currentSort || !thisColumn)
                 return false;
             return currentSort === thisColumn;
-        }, ...(ngDevMode ? [{ debugName: "sortAsc" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "sortAsc" }] : /* istanbul ignore next */ []));
         this.sortDesc = computed(() => {
             const currentSort = this.#table.sortByColumn();
             const thisColumn = this.shSort();
             if (!currentSort || !thisColumn)
                 return false;
             return currentSort === `-${thisColumn}`;
-        }, ...(ngDevMode ? [{ debugName: "sortDesc" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "sortDesc" }] : /* istanbul ignore next */ []));
     }
     #table;
     toggleSort() {
@@ -6385,10 +6521,10 @@ class ShipSort {
             return;
         this.#table.toggleSort(sortCol);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipSort, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ShipSort, isStandalone: true, selector: "[shSort]", inputs: { shSort: { classPropertyName: "shSort", publicName: "shSort", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mousedown": "toggleSort()" }, properties: { "class.sort-asc": "sortAsc()", "class.sort-desc": "sortDesc()" }, classAttribute: "sortable" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipSort, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.5", type: ShipSort, isStandalone: true, selector: "[shSort]", inputs: { shSort: { classPropertyName: "shSort", publicName: "shSort", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mousedown": "toggleSort()" }, properties: { "class.sort-asc": "sortAsc()", "class.sort-desc": "sortDesc()" }, classAttribute: "sortable" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipSort, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipSort, decorators: [{
             type: Directive,
             args: [{
                     selector: '[shSort]',
@@ -6405,7 +6541,7 @@ class ShipStickyColumns {
     constructor() {
         this.#elementRef = inject(ElementRef);
         this.#renderer = inject(Renderer2);
-        this.shStickyColumns = input('start', ...(ngDevMode ? [{ debugName: "shStickyColumns" }] : []));
+        this.shStickyColumns = input('start', ...(ngDevMode ? [{ debugName: "shStickyColumns" }] : /* istanbul ignore next */ []));
     }
     #elementRef;
     #renderer;
@@ -6421,10 +6557,10 @@ class ShipStickyColumns {
             this.#renderer.setStyle(nativeElement, 'grid-column', position === 'end' ? `-${columnSpanCount + 1} / -1` : `1 / ${columnSpanCount + 1}`);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipStickyColumns, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ShipStickyColumns, isStandalone: true, selector: "[shStickyColumns]", inputs: { shStickyColumns: { classPropertyName: "shStickyColumns", publicName: "shStickyColumns", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.sticky": "shStickyColumns() === \"start\"", "class.sticky-end": "shStickyColumns() === \"end\"" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipStickyColumns, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.5", type: ShipStickyColumns, isStandalone: true, selector: "[shStickyColumns]", inputs: { shStickyColumns: { classPropertyName: "shStickyColumns", publicName: "shStickyColumns", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.sticky": "shStickyColumns() === \"start\"", "class.sticky-end": "shStickyColumns() === \"end\"" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipStickyColumns, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipStickyColumns, decorators: [{
             type: Directive,
             args: [{
                     selector: '[shStickyColumns]',
@@ -6438,24 +6574,24 @@ const SCROLL_TOLERANCE = 1.5;
 class ShipTable {
     constructor() {
         this.#el = inject(ElementRef);
-        this.loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
-        this.data = input([], ...(ngDevMode ? [{ debugName: "data" }] : []));
+        this.loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
+        this.data = input([], ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
         this.dataChange = output();
-        this.sortByColumn = model(null, ...(ngDevMode ? [{ debugName: "sortByColumn" }] : []));
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
+        this.sortByColumn = model(null, ...(ngDevMode ? [{ debugName: "sortByColumn" }] : /* istanbul ignore next */ []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('table', {
             color: this.color,
             variant: this.variant,
         });
-        this.thead = viewChild('thead', ...(ngDevMode ? [{ debugName: "thead" }] : []));
-        this.tbody = viewChild('tbody', ...(ngDevMode ? [{ debugName: "tbody" }] : []));
+        this.thead = viewChild('thead', ...(ngDevMode ? [{ debugName: "thead" }] : /* istanbul ignore next */ []));
+        this.tbody = viewChild('tbody', ...(ngDevMode ? [{ debugName: "tbody" }] : /* istanbul ignore next */ []));
         this.columns = observeChildren(this.thead, ['tr:first-child th']);
         this.stickyHeaderHeight = computed(() => {
             const _ = this.hostClasses();
             const height = this.thead()?.nativeElement?.clientHeight;
             return height ?? 0;
-        }, ...(ngDevMode ? [{ debugName: "stickyHeaderHeight" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "stickyHeaderHeight" }] : /* istanbul ignore next */ []));
         this.bodyEffect = effect(() => {
             const body = this.tbody()?.nativeElement;
             const head = this.thead()?.nativeElement;
@@ -6472,15 +6608,15 @@ class ShipTable {
                     }
                 }
             });
-        }, ...(ngDevMode ? [{ debugName: "bodyEffect" }] : []));
-        this.resizing = signal(false, ...(ngDevMode ? [{ debugName: "resizing" }] : []));
-        this.sizeTrigger = signal(true, ...(ngDevMode ? [{ debugName: "sizeTrigger" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "bodyEffect" }] : /* istanbul ignore next */ []));
+        this.resizing = signal(false, ...(ngDevMode ? [{ debugName: "resizing" }] : /* istanbul ignore next */ []));
+        this.sizeTrigger = signal(true, ...(ngDevMode ? [{ debugName: "sizeTrigger" }] : /* istanbul ignore next */ []));
         this.#initialData = null;
-        this.#initialDataSet = signal(false, ...(ngDevMode ? [{ debugName: "#initialDataSet" }] : []));
-        this.scrollXState = signal(-1, ...(ngDevMode ? [{ debugName: "scrollXState" }] : []));
-        this.scrollYState = signal(-1, ...(ngDevMode ? [{ debugName: "scrollYState" }] : []));
-        this.canScrollX = signal(false, ...(ngDevMode ? [{ debugName: "canScrollX" }] : []));
-        this.canScrollY = signal(false, ...(ngDevMode ? [{ debugName: "canScrollY" }] : []));
+        this.#initialDataSet = signal(false, ...(ngDevMode ? [{ debugName: "#initialDataSet" }] : /* istanbul ignore next */ []));
+        this.scrollXState = signal(-1, ...(ngDevMode ? [{ debugName: "scrollXState" }] : /* istanbul ignore next */ []));
+        this.scrollYState = signal(-1, ...(ngDevMode ? [{ debugName: "scrollYState" }] : /* istanbul ignore next */ []));
+        this.canScrollX = signal(false, ...(ngDevMode ? [{ debugName: "canScrollX" }] : /* istanbul ignore next */ []));
+        this.canScrollY = signal(false, ...(ngDevMode ? [{ debugName: "canScrollY" }] : /* istanbul ignore next */ []));
         this.columnSizes = computed(() => {
             this.sizeTrigger();
             const colSignal = this.columns.signal();
@@ -6499,7 +6635,7 @@ class ShipTable {
                 }
                 return `${acc} 1fr`;
             }, '');
-        }, ...(ngDevMode ? [{ debugName: "columnSizes" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "columnSizes" }] : /* istanbul ignore next */ []));
         this.e = effect(() => {
             const sortByColumn = this.sortByColumn();
             if (sortByColumn === null) {
@@ -6527,7 +6663,7 @@ class ShipTable {
                 return isDescending ? -comparison : comparison;
             });
             this.dataChange.emit(sortedData);
-        }, ...(ngDevMode ? [{ debugName: "e" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "e" }] : /* istanbul ignore next */ []));
     }
     #el;
     #initialData;
@@ -6580,8 +6716,8 @@ class ShipTable {
         this.scrollYState.set(nextYState);
         this.canScrollY.set(canScrollY);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipTable, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipTable, isStandalone: true, selector: "sh-table", inputs: { loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, sortByColumn: { classPropertyName: "sortByColumn", publicName: "sortByColumn", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dataChange: "dataChange", sortByColumn: "sortByColumnChange" }, host: { listeners: { "scroll": "onScroll()", "window:resize": "onResize($event)" }, properties: { "class": "hostClasses()", "style.grid-template-columns": "columnSizes()", "class.resizing": "resizing()", "class.can-scroll-x": "canScrollX()", "class.can-scroll-y": "canScrollY()", "class.scrolled-x": "scrollXState() >= 0", "class.scrolled-x-end": "scrollXState() === 1", "class.scrolled-y": "scrollYState() >= 0", "class.scrolled-y-end": "scrollYState() === 1" } }, viewQueries: [{ propertyName: "thead", first: true, predicate: ["thead"], descendants: true, isSignal: true }, { propertyName: "tbody", first: true, predicate: ["tbody"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipTable, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipTable, isStandalone: true, selector: "sh-table", inputs: { loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, sortByColumn: { classPropertyName: "sortByColumn", publicName: "sortByColumn", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dataChange: "dataChange", sortByColumn: "sortByColumnChange" }, host: { listeners: { "scroll": "onScroll()", "window:resize": "onResize($event)" }, properties: { "class": "hostClasses()", "style.grid-template-columns": "columnSizes()", "class.resizing": "resizing()", "class.can-scroll-x": "canScrollX()", "class.can-scroll-y": "canScrollY()", "class.scrolled-x": "scrollXState() >= 0", "class.scrolled-x-end": "scrollXState() === 1", "class.scrolled-y": "scrollYState() >= 0", "class.scrolled-y-end": "scrollYState() === 1" } }, viewQueries: [{ propertyName: "thead", first: true, predicate: ["thead"], descendants: true, isSignal: true }, { propertyName: "tbody", first: true, predicate: ["tbody"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <div class="actionbar">
       <ng-content select="[actionbar]" />
     </div>
@@ -6606,7 +6742,7 @@ class ShipTable {
     }
   `, isInline: true, dependencies: [{ kind: "component", type: ShipProgressBar, selector: "sh-progress-bar", inputs: ["value", "color", "variant"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipTable, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipTable, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-table',
@@ -6658,19 +6794,19 @@ class ShipTabs extends ShipSelectionGroup {
     constructor() {
         super('[value], [tab], button, a', 'active');
         this.id = '--' + Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 12);
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('tabs', {
             color: this.color,
             variant: this.variant,
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipTabs, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ShipTabs, isStandalone: true, selector: "sh-tabs", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "style.--tabs-id": "id" } }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipTabs, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.5", type: ShipTabs, isStandalone: true, selector: "sh-tabs", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "style.--tabs-id": "id" } }, usesInheritance: true, ngImport: i0, template: `
     <ng-content />
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipTabs, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipTabs, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-tabs',
@@ -6697,7 +6833,7 @@ class ShipThemeState {
         this.#window = inject(WINDOW);
         this.#platformId = inject(PLATFORM_ID);
         this.#storedDarkMode = this.localStorage()?.getItem('shipTheme');
-        this.#theme = signal(this.#storedDarkMode, ...(ngDevMode ? [{ debugName: "#theme" }] : []));
+        this.#theme = signal(this.#storedDarkMode, ...(ngDevMode ? [{ debugName: "#theme" }] : /* istanbul ignore next */ []));
         this.theme = this.#theme.asReadonly();
         this.darkModeEffect = effect(() => {
             const theme = this.#theme();
@@ -6714,7 +6850,7 @@ class ShipThemeState {
                 this.#document.documentElement.classList.add('light');
                 this.#document.documentElement.classList.remove('dark');
             }
-        }, ...(ngDevMode ? [{ debugName: "darkModeEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "darkModeEffect" }] : /* istanbul ignore next */ []));
     }
     #document;
     #window;
@@ -6739,10 +6875,10 @@ class ShipThemeState {
         this.localStorage()?.setItem('shipTheme', theme);
         this.#theme.set(theme);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipThemeState, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipThemeState, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipThemeState, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipThemeState, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipThemeState, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipThemeState, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -6761,8 +6897,8 @@ class ShipThemeToggle {
     setTheme(theme) {
         this.#themeState.setTheme(theme);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipThemeToggle, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipThemeToggle, isStandalone: true, selector: "ship-theme-toggle", ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipThemeToggle, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipThemeToggle, isStandalone: true, selector: "ship-theme-toggle", ngImport: i0, template: `
     <button shButton size="small" (click)="toggleTheme()">
       @if (theme() === 'dark') {
         <sh-icon>moon-bold</sh-icon>
@@ -6773,9 +6909,9 @@ class ShipThemeToggle {
         <sh-icon class="small-icon">moon-bold</sh-icon>
       }
     </button>
-  `, isInline: true, dependencies: [{ kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "variant", "size"] }, { kind: "component", type: ShipButton, selector: "[shButton]", inputs: ["color", "variant", "size", "readonly"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "size"] }, { kind: "component", type: ShipButton, selector: "[shButton]", inputs: ["color", "variant", "size", "readonly"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipThemeToggle, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipThemeToggle, decorators: [{
             type: Component,
             args: [{
                     selector: 'ship-theme-toggle',
@@ -6798,15 +6934,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 
 class ShipToggleCard {
     constructor() {
-        this.disableToggle = input(false, ...(ngDevMode ? [{ debugName: "disableToggle" }] : []));
-        this.isActive = model(...(ngDevMode ? [undefined, { debugName: "isActive" }] : []));
+        this.disableToggle = input(false, ...(ngDevMode ? [{ debugName: "disableToggle" }] : /* istanbul ignore next */ []));
+        this.isActive = model(...(ngDevMode ? [undefined, { debugName: "isActive" }] : /* istanbul ignore next */ []));
         this.#disabledEffect = effect(() => {
             if (this.disableToggle()) {
                 this.isActive.set(true);
             }
-        }, ...(ngDevMode ? [{ debugName: "#disabledEffect" }] : []));
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#disabledEffect" }] : /* istanbul ignore next */ []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('card', {
             color: this.color,
             variant: this.variant,
@@ -6816,8 +6952,8 @@ class ShipToggleCard {
     toggle() {
         this.isActive.set(!this.isActive());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipToggleCard, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipToggleCard, isStandalone: true, selector: "sh-toggle-card", inputs: { disableToggle: { classPropertyName: "disableToggle", publicName: "disableToggle", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isActive: "isActiveChange" }, host: { properties: { "class.active": "isActive()", "class": "hostClasses()" } }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipToggleCard, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipToggleCard, isStandalone: true, selector: "sh-toggle-card", inputs: { disableToggle: { classPropertyName: "disableToggle", publicName: "disableToggle", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isActive: "isActiveChange" }, host: { properties: { "class.active": "isActive()", "class": "hostClasses()" } }, ngImport: i0, template: `
     <h3 (click)="!disableToggle() && toggle()">
       <ng-content select="[title]">Title</ng-content>
 
@@ -6831,9 +6967,9 @@ class ShipToggleCard {
         <ng-content />
       </div>
     </div>
-  `, isInline: true, dependencies: [{ kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "variant", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: ShipIcon, selector: "sh-icon", inputs: ["color", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipToggleCard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipToggleCard, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-toggle-card',
@@ -6864,17 +7000,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 class ShipToggle {
     constructor() {
         this._elementRef = inject(ElementRef);
-        this.internalInput = viewChild('internalInput', ...(ngDevMode ? [{ debugName: "internalInput" }] : []));
+        this.internalInput = viewChild('internalInput', ...(ngDevMode ? [{ debugName: "internalInput" }] : /* istanbul ignore next */ []));
         this.projectedInputs = contentProjectionSignal('input:not(.internal-input)', {
             childList: true,
             attributes: true,
         });
-        this.checked = model(false, ...(ngDevMode ? [{ debugName: "checked" }] : []));
-        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : []));
-        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : []));
-        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
-        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
-        this.noInternalInput = input(false, ...(ngDevMode ? [{ debugName: "noInternalInput" }] : []));
+        this.checked = model(false, ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
+        this.color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
+        this.variant = input(null, ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+        this.noInternalInput = input(false, ...(ngDevMode ? [{ debugName: "noInternalInput" }] : /* istanbul ignore next */ []));
         this.hostClasses = shipComponentClasses('toggle', {
             color: this.color,
             variant: this.variant,
@@ -6897,8 +7033,8 @@ class ShipToggle {
         }
         event.preventDefault();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipToggle, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipToggle, isStandalone: true, selector: "sh-toggle", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, noInternalInput: { classPropertyName: "noInternalInput", publicName: "noInternalInput", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange" }, host: { listeners: { "keydown.enter": "onEnter($event)" }, properties: { "class": "hostClasses()", "attr.disabled": "disabled() ? \"\" : null" } }, viewQueries: [{ propertyName: "internalInput", first: true, predicate: ["internalInput"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipToggle, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipToggle, isStandalone: true, selector: "sh-toggle", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, noInternalInput: { classPropertyName: "noInternalInput", publicName: "noInternalInput", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange" }, host: { listeners: { "keydown.enter": "onEnter($event)" }, properties: { "class": "hostClasses()", "attr.disabled": "disabled() ? \"\" : null" } }, viewQueries: [{ propertyName: "internalInput", first: true, predicate: ["internalInput"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <div class="box">
       <div class="knob"></div>
     </div>
@@ -6916,7 +7052,7 @@ class ShipToggle {
     }
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipToggle, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipToggle, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-toggle',
@@ -6955,14 +7091,14 @@ class ShipVirtualScroll {
         this.#renderer = inject(Renderer2);
         this.#hostElement = inject(ElementRef);
         this.viewportRef = viewChild.required('viewport');
-        this.itemElements = viewChildren('item', ...(ngDevMode ? [{ debugName: "itemElements" }] : []));
-        this.bufferSize = signal(10, ...(ngDevMode ? [{ debugName: "bufferSize" }] : []));
-        this.itemHeights = signal([], ...(ngDevMode ? [{ debugName: "itemHeights" }] : []));
-        this.startIndex = signal(0, ...(ngDevMode ? [{ debugName: "startIndex" }] : []));
-        this.endIndex = signal(0, ...(ngDevMode ? [{ debugName: "endIndex" }] : []));
-        this.translateY = signal(0, ...(ngDevMode ? [{ debugName: "translateY" }] : []));
-        this.totalHeight = computed(() => this.itemHeights().reduce((sum, height) => sum + height, 0), ...(ngDevMode ? [{ debugName: "totalHeight" }] : []));
-        this.numberOfRenderedItems = signal(0, ...(ngDevMode ? [{ debugName: "numberOfRenderedItems" }] : []));
+        this.itemElements = viewChildren('item', ...(ngDevMode ? [{ debugName: "itemElements" }] : /* istanbul ignore next */ []));
+        this.bufferSize = signal(10, ...(ngDevMode ? [{ debugName: "bufferSize" }] : /* istanbul ignore next */ []));
+        this.itemHeights = signal([], ...(ngDevMode ? [{ debugName: "itemHeights" }] : /* istanbul ignore next */ []));
+        this.startIndex = signal(0, ...(ngDevMode ? [{ debugName: "startIndex" }] : /* istanbul ignore next */ []));
+        this.endIndex = signal(0, ...(ngDevMode ? [{ debugName: "endIndex" }] : /* istanbul ignore next */ []));
+        this.translateY = signal(0, ...(ngDevMode ? [{ debugName: "translateY" }] : /* istanbul ignore next */ []));
+        this.totalHeight = computed(() => this.itemHeights().reduce((sum, height) => sum + height, 0), ...(ngDevMode ? [{ debugName: "totalHeight" }] : /* istanbul ignore next */ []));
+        this.numberOfRenderedItems = signal(0, ...(ngDevMode ? [{ debugName: "numberOfRenderedItems" }] : /* istanbul ignore next */ []));
         this.#resizeObserver = null;
         this.#hostResizeObserver = null;
         this.#itemHeightsEffect = effect(() => {
@@ -6976,11 +7112,11 @@ class ShipVirtualScroll {
                 }
                 this.translateY.set(newTranslateY);
             }
-        }, ...(ngDevMode ? [{ debugName: "#itemHeightsEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#itemHeightsEffect" }] : /* istanbul ignore next */ []));
         this.#totalHeightEffect = effect(() => {
             const _ = this.totalHeight();
             this.#changeRef.detectChanges();
-        }, ...(ngDevMode ? [{ debugName: "#totalHeightEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#totalHeightEffect" }] : /* istanbul ignore next */ []));
         this.#itemElementsEffect = effect(() => {
             const itemElements = this.itemElements();
             if (this.#resizeObserver && itemElements) {
@@ -6995,7 +7131,7 @@ class ShipVirtualScroll {
                 this.itemHeights.set(heights);
                 this.#calculateVisibleItems();
             }
-        }, ...(ngDevMode ? [{ debugName: "#itemElementsEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#itemElementsEffect" }] : /* istanbul ignore next */ []));
     }
     #changeRef;
     #renderer;
@@ -7089,8 +7225,8 @@ class ShipVirtualScroll {
         this.#cleanupResizeObserver();
         this.#cleanupHostResizeObserver();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipVirtualScroll, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.5", type: ShipVirtualScroll, isStandalone: true, selector: "sh-virtual-scroll", viewQueries: [{ propertyName: "viewportRef", first: true, predicate: ["viewport"], descendants: true, isSignal: true }, { propertyName: "itemElements", predicate: ["item"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipVirtualScroll, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.5", type: ShipVirtualScroll, isStandalone: true, selector: "sh-virtual-scroll", viewQueries: [{ propertyName: "viewportRef", first: true, predicate: ["viewport"], descendants: true, isSignal: true }, { propertyName: "itemElements", predicate: ["item"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <div class="viewport" #viewport (scroll)="onScroll()">
       <div class="total-height" [style.height]="totalHeight() + 'px'"></div>
       <div class="items-container" [style.transform]="'translateY(' + translateY() + 'px)'">
@@ -7099,7 +7235,7 @@ class ShipVirtualScroll {
     </div>
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipVirtualScroll, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipVirtualScroll, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-virtual-scroll',
@@ -7121,19 +7257,19 @@ class ShipFormFieldExperimental {
         this.firstInput = createFormInputSignal();
         this.hello = effect(() => {
             console.log('hello', this.firstInput());
-        }, ...(ngDevMode ? [{ debugName: "hello" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "hello" }] : /* istanbul ignore next */ []));
     }
     myClick() {
         this.firstInput.update((x) => x + 'hello');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipFormFieldExperimental, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.5", type: ShipFormFieldExperimental, isStandalone: true, selector: "sh-form-field-experimental", ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipFormFieldExperimental, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.5", type: ShipFormFieldExperimental, isStandalone: true, selector: "sh-form-field-experimental", ngImport: i0, template: `
     <ng-content></ng-content>
 
     <button (click)="myClick()">hello</button>
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipFormFieldExperimental, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipFormFieldExperimental, decorators: [{
             type: Component,
             args: [{
                     selector: 'sh-form-field-experimental',
@@ -7149,7 +7285,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 
 class ShipFileDragDrop {
     constructor() {
-        this.filesOver = signal(false, ...(ngDevMode ? [{ debugName: "filesOver" }] : []));
+        this.filesOver = signal(false, ...(ngDevMode ? [{ debugName: "filesOver" }] : /* istanbul ignore next */ []));
         this.filesDropped = output();
     }
     onDragOver(e) {
@@ -7171,10 +7307,10 @@ class ShipFileDragDrop {
             this.filesDropped.emit(files);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipFileDragDrop, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.5", type: ShipFileDragDrop, isStandalone: true, selector: "[shDragDrop]", outputs: { filesDropped: "filesDropped" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "ondrop($event)" }, properties: { "class.filesover": "filesOver()" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipFileDragDrop, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.5", type: ShipFileDragDrop, isStandalone: true, selector: "[shDragDrop]", outputs: { filesDropped: "filesDropped" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "ondrop($event)" }, properties: { "class.filesover": "filesOver()" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipFileDragDrop, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipFileDragDrop, decorators: [{
             type: Directive,
             args: [{
                     selector: '[shDragDrop]',
@@ -7198,7 +7334,7 @@ class ShipInputMask {
     constructor() {
         this.#selfRef = inject(ElementRef);
         this.#renderer = inject(Renderer2);
-        this.shInputMask = input('(999) 999-9999', ...(ngDevMode ? [{ debugName: "shInputMask" }] : []));
+        this.shInputMask = input('(999) 999-9999', ...(ngDevMode ? [{ debugName: "shInputMask" }] : /* istanbul ignore next */ []));
     }
     #selfRef;
     #renderer;
@@ -7256,10 +7392,10 @@ class ShipInputMask {
         }
         return masked;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipInputMask, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ShipInputMask, isStandalone: true, selector: "[shInputMask]", inputs: { shInputMask: { classPropertyName: "shInputMask", publicName: "shInputMask", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "input": "onInput($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipInputMask, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.5", type: ShipInputMask, isStandalone: true, selector: "[shInputMask]", inputs: { shInputMask: { classPropertyName: "shInputMask", publicName: "shInputMask", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "input": "onInput($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipInputMask, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipInputMask, decorators: [{
             type: Directive,
             args: [{
                     selector: '[shInputMask]',
@@ -7274,10 +7410,10 @@ class ShipPreventWheel {
     wheel(event) {
         event.preventDefault();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipPreventWheel, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.5", type: ShipPreventWheel, isStandalone: true, selector: "[shPreventWheel]", host: { listeners: { "wheel": "wheel($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipPreventWheel, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.5", type: ShipPreventWheel, isStandalone: true, selector: "[shPreventWheel]", host: { listeners: { "wheel": "wheel($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipPreventWheel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipPreventWheel, decorators: [{
             type: Directive,
             args: [{
                     selector: '[shPreventWheel]',
@@ -7290,21 +7426,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 
 class ShipTooltipWrapper {
     constructor() {
-        this.positionAnchorName = input.required(...(ngDevMode ? [{ debugName: "positionAnchorName" }] : []));
-        this.anchorEl = input.required(...(ngDevMode ? [{ debugName: "anchorEl" }] : []));
-        this.isOpen = input(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
-        this.content = input(...(ngDevMode ? [undefined, { debugName: "content" }] : []));
-        this.close = input(() => { }, ...(ngDevMode ? [{ debugName: "close" }] : []));
+        this.positionAnchorName = input.required(...(ngDevMode ? [{ debugName: "positionAnchorName" }] : /* istanbul ignore next */ []));
+        this.anchorEl = input.required(...(ngDevMode ? [{ debugName: "anchorEl" }] : /* istanbul ignore next */ []));
+        this.isOpen = input(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+        this.content = input(...(ngDevMode ? [undefined, { debugName: "content" }] : /* istanbul ignore next */ []));
+        this.close = input(() => { }, ...(ngDevMode ? [{ debugName: "close" }] : /* istanbul ignore next */ []));
         this.tooltipContext = {
             close: () => this.close()(),
         };
-        this.isTemplate = computed(() => this.content() instanceof TemplateRef, ...(ngDevMode ? [{ debugName: "isTemplate" }] : []));
+        this.isTemplate = computed(() => this.content() instanceof TemplateRef, ...(ngDevMode ? [{ debugName: "isTemplate" }] : /* istanbul ignore next */ []));
         this.#document = inject(DOCUMENT);
         this.#selfRef = inject((ElementRef));
         this.#renderer = inject(Renderer2);
         this.#positionAbort = null;
         this.SUPPORTS_ANCHOR = typeof CSS !== 'undefined' && CSS.supports('position-anchor', '--abc') && CSS.supports('anchor-name', '--abc');
-        this.isBelow = signal(false, ...(ngDevMode ? [{ debugName: "isBelow" }] : []));
+        this.isBelow = signal(false, ...(ngDevMode ? [{ debugName: "isBelow" }] : /* istanbul ignore next */ []));
         this.openEffect = effect(() => {
             if (this.isOpen()) {
                 queueMicrotask(() => {
@@ -7347,7 +7483,7 @@ class ShipTooltipWrapper {
                 this.#positionAbort?.abort();
                 this.#positionAbort = null;
             }
-        }, ...(ngDevMode ? [{ debugName: "openEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "openEffect" }] : /* istanbul ignore next */ []));
         this.calculateTooltipPosition = () => {
             if (!this.anchorEl())
                 return;
@@ -7422,8 +7558,8 @@ class ShipTooltipWrapper {
             top: Math.max(0, Math.min(pos.top, window.innerHeight - m.height)),
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipTooltipWrapper, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ShipTooltipWrapper, isStandalone: true, selector: "ship-tooltip-wrapper", inputs: { positionAnchorName: { classPropertyName: "positionAnchorName", publicName: "positionAnchorName", isSignal: true, isRequired: true, transformFunction: null }, anchorEl: { classPropertyName: "anchorEl", publicName: "anchorEl", isSignal: true, isRequired: true, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, close: { classPropertyName: "close", publicName: "close", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "tooltip" }, properties: { "attr.popover": "\"manual\"", "style.position-anchor": "positionAnchorName()", "class.below": "isBelow()" } }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipTooltipWrapper, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ShipTooltipWrapper, isStandalone: true, selector: "ship-tooltip-wrapper", inputs: { positionAnchorName: { classPropertyName: "positionAnchorName", publicName: "positionAnchorName", isSignal: true, isRequired: true, transformFunction: null }, anchorEl: { classPropertyName: "anchorEl", publicName: "anchorEl", isSignal: true, isRequired: true, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, close: { classPropertyName: "close", publicName: "close", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "tooltip" }, properties: { "attr.popover": "\"manual\"", "style.position-anchor": "positionAnchorName()", "class.below": "isBelow()" } }, ngImport: i0, template: `
     <div class="tooltip-content">
       @if (isTemplate()) {
         <ng-container *ngTemplateOutlet="$any(content()); context: { $implicit: tooltipContext }" />
@@ -7433,7 +7569,7 @@ class ShipTooltipWrapper {
     </div>
   `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipTooltipWrapper, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipTooltipWrapper, decorators: [{
             type: Component,
             args: [{
                     selector: 'ship-tooltip-wrapper',
@@ -7459,7 +7595,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
 let openRef = null;
 class ShipTooltip {
     constructor() {
-        this.shTooltip = input.required(...(ngDevMode ? [{ debugName: "shTooltip" }] : []));
+        this.shTooltip = input.required(...(ngDevMode ? [{ debugName: "shTooltip" }] : /* istanbul ignore next */ []));
         this.#contentReplacedEffect = effect(() => {
             const content = this.shTooltip();
             untracked(() => {
@@ -7468,14 +7604,14 @@ class ShipTooltip {
                     openRef.wrapperComponentRef.changeDetectorRef.detectChanges();
                 }
             });
-        }, ...(ngDevMode ? [{ debugName: "#contentReplacedEffect" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "#contentReplacedEffect" }] : /* istanbul ignore next */ []));
         this.#elementRef = inject((ElementRef));
         this.#viewContainerRef = inject(ViewContainerRef);
         this.#environmentInjector = inject(EnvironmentInjector);
         this.debounceTimer = null;
         this.DEBOUNCE_DELAY = 50;
         this.anchorName = `--${generateUniqueId()}`;
-        this.isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
+        this.isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
         this.destroyTimeout = null;
     }
     #contentReplacedEffect;
@@ -7561,10 +7697,10 @@ class ShipTooltip {
             }, this.DEBOUNCE_DELAY);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipTooltip, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ShipTooltip, isStandalone: true, selector: "[shTooltip]", inputs: { shTooltip: { classPropertyName: "shTooltip", publicName: "shTooltip", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "mouseenter": "onMouseEnter($event)", "mouseleave": "onMouseLeave($event)" }, properties: { "style.anchor-name": "anchorName", "class.active": "isOpen()" }, classAttribute: "tooltip" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipTooltip, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.5", type: ShipTooltip, isStandalone: true, selector: "[shTooltip]", inputs: { shTooltip: { classPropertyName: "shTooltip", publicName: "shTooltip", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "mouseenter": "onMouseEnter($event)", "mouseleave": "onMouseLeave($event)" }, properties: { "style.anchor-name": "anchorName", "class.active": "isOpen()" }, classAttribute: "tooltip" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ShipTooltip, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ShipTooltip, decorators: [{
             type: Directive,
             args: [{
                     selector: '[shTooltip]',
@@ -7591,5 +7727,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { GridSortable, SHIP_CONFIG, ShipAlert, ShipAlertContainer, ShipAlertModule, ShipAlertService, ShipBlueprint, ShipButton, ShipButtonGroup, ShipCard, ShipCheckbox, ShipChip, ShipColorPicker, ShipDatepicker, ShipDatepickerInput, ShipDaterangeInput, ShipDialog, ShipDialogService, ShipDivider, ShipEventCard, ShipFileDragDrop, ShipFileUpload, ShipFormField, ShipFormFieldExperimental, ShipIcon, ShipInputMask, ShipList, ShipMenu, ShipPopover, ShipPreventWheel, ShipProgressBar, ShipRadio, ShipRangeSlider, ShipResize, ShipSelect, ShipSidenav, ShipSort, ShipSortable, ShipSpinner, ShipStepper, ShipStickyColumns, ShipTable, ShipTabs, ShipThemeToggle, ShipToggle, ShipToggleCard, ShipTooltip, ShipTooltipWrapper, ShipVirtualScroll, TEST_NODES, moveIndex, watchHostClass };
+export { GridSortable, SHIP_CONFIG, ShipAccordion, ShipAlert, ShipAlertContainer, ShipAlertModule, ShipAlertService, ShipBlueprint, ShipButton, ShipButtonGroup, ShipCard, ShipCheckbox, ShipChip, ShipColorPicker, ShipDatepicker, ShipDatepickerInput, ShipDaterangeInput, ShipDialog, ShipDialogService, ShipDivider, ShipEventCard, ShipFileDragDrop, ShipFileUpload, ShipFormField, ShipFormFieldExperimental, ShipIcon, ShipInputMask, ShipList, ShipMenu, ShipPopover, ShipPreventWheel, ShipProgressBar, ShipRadio, ShipRangeSlider, ShipResize, ShipSelect, ShipSidenav, ShipSort, ShipSortable, ShipSpinner, ShipStepper, ShipStickyColumns, ShipTable, ShipTabs, ShipThemeToggle, ShipToggle, ShipToggleCard, ShipTooltip, ShipTooltipWrapper, ShipVirtualScroll, TEST_NODES, moveIndex, watchHostClass };
 //# sourceMappingURL=ship-ui-core.mjs.map