ngx-com 0.0.20 → 0.0.21

package/fesm2022/ngx-com-components-checkbox.mjs

@@ -127,8 +127,13 @@ class ComCheckbox {
     checked = model(false, ...(ngDevMode ? [{ debugName: "checked" }] : []));
     indeterminate = model(false, ...(ngDevMode ? [{ debugName: "indeterminate" }] : []));
     disabled = model(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
-    value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
+    htmlValue = input(undefined, { ...(ngDevMode ? { debugName: "htmlValue" } : {}), alias: 'value' });
     name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : []));
+    // Signal Forms inputs — set automatically by [formField] via setInputOnDirectives
+    touched = model(false, ...(ngDevMode ? [{ debugName: "touched" }] : []));
+    invalid = input(false, ...(ngDevMode ? [{ debugName: "invalid" }] : []));
+    sfErrors = input([], { ...(ngDevMode ? { debugName: "sfErrors" } : {}), alias: 'errors' });
+    sfRequired = input(false, { ...(ngDevMode ? { debugName: "sfRequired" } : {}), alias: 'required' });
     id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
     ariaLabel = input(null, { ...(ngDevMode ? { debugName: "ariaLabel" } : {}), alias: 'aria-label' });
     ariaLabelledby = input(null, { ...(ngDevMode ? { debugName: "ariaLabelledby" } : {}), alias: 'aria-labelledby' });
@@ -170,6 +175,10 @@ class ComCheckbox {
         this.disabled.set(isDisabled);
     }
     // Event handlers
+    onBlur() {
+        this.onTouched();
+        this.touched.set(true);
+    }
     onInputChange(event) {
         const input = event.target;
         const newChecked = input.checked;
@@ -199,7 +208,7 @@ class ComCheckbox {
         this.changed.emit({ checked: newChecked, source: this });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: ComCheckbox, isStandalone: true, selector: "com-checkbox", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "aria-labelledby", isSignal: true, isRequired: false, transformFunction: null }, ariaDescribedby: { classPropertyName: "ariaDescribedby", publicName: "aria-describedby", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange", indeterminate: "indeterminateChange", disabled: "disabledChange", changed: "changed" }, host: { properties: { "class.com-checkbox--disabled": "disabled()", "class.com-checkbox--checked": "checked()", "class.com-checkbox--indeterminate": "indeterminate()" }, classAttribute: "com-checkbox inline-block align-middle" }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }], exportAs: ["comCheckbox"], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: ComCheckbox, isStandalone: true, selector: "com-checkbox", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, htmlValue: { classPropertyName: "htmlValue", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, sfErrors: { classPropertyName: "sfErrors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, sfRequired: { classPropertyName: "sfRequired", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "aria-labelledby", isSignal: true, isRequired: false, transformFunction: null }, ariaDescribedby: { classPropertyName: "ariaDescribedby", publicName: "aria-describedby", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange", indeterminate: "indeterminateChange", disabled: "disabledChange", touched: "touchedChange", changed: "changed" }, host: { properties: { "class.com-checkbox--disabled": "disabled()", "class.com-checkbox--checked": "checked()", "class.com-checkbox--indeterminate": "indeterminate()" }, classAttribute: "com-checkbox inline-block align-middle" }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }], exportAs: ["comCheckbox"], ngImport: i0, template: `
     <label
       class="group relative inline-flex items-center"
       [class.cursor-pointer]="!disabled()"
@@ -213,12 +222,12 @@ class ComCheckbox {
         [checked]="checked()"
         [disabled]="disabled()"
         [attr.name]="name()"
-        [attr.value]="value()"
+        [attr.value]="htmlValue()"
         [attr.aria-label]="ariaLabel()"
         [attr.aria-labelledby]="ariaLabelledby()"
         [attr.aria-describedby]="ariaDescribedby()"
         (change)="onInputChange($event)"
-        (blur)="onTouched()"
+        (blur)="onBlur()"
       /></span>
       <span [class]="boxClasses()">
         @if (checked() && !indeterminate()) {
@@ -278,12 +287,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         [checked]="checked()"
         [disabled]="disabled()"
         [attr.name]="name()"
-        [attr.value]="value()"
+        [attr.value]="htmlValue()"
         [attr.aria-label]="ariaLabel()"
         [attr.aria-labelledby]="ariaLabelledby()"
         [attr.aria-describedby]="ariaDescribedby()"
         (change)="onInputChange($event)"
-        (blur)="onTouched()"
+        (blur)="onBlur()"
       /></span>
       <span [class]="boxClasses()">
         @if (checked() && !indeterminate()) {
@@ -331,7 +340,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                         '[class.com-checkbox--checked]': 'checked()',
                         '[class.com-checkbox--indeterminate]': 'indeterminate()',
                     }, styles: [".sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { inputRef: [{ type: i0.ViewChild, args: ['inputElement', { isSignal: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }, { type: i0.Output, args: ["checkedChange"] }], indeterminate: [{ type: i0.Input, args: [{ isSignal: true, alias: "indeterminate", required: false }] }, { type: i0.Output, args: ["indeterminateChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-labelledby", required: false }] }], ariaDescribedby: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-describedby", required: false }] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
+        }], ctorParameters: () => [], propDecorators: { inputRef: [{ type: i0.ViewChild, args: ['inputElement', { isSignal: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }, { type: i0.Output, args: ["checkedChange"] }], indeterminate: [{ type: i0.Input, args: [{ isSignal: true, alias: "indeterminate", required: false }] }, { type: i0.Output, args: ["indeterminateChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], htmlValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], sfErrors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], sfRequired: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-labelledby", required: false }] }], ariaDescribedby: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-describedby", required: false }] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
 
 // Public API for the checkbox component
 // Main component

package/fesm2022/ngx-com-components-checkbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngx-com-components-checkbox.mjs","sources":["../../../projects/com/components/checkbox/checkbox.variants.ts","../../../projects/com/components/checkbox/checkbox.component.ts","../../../projects/com/components/checkbox/index.ts","../../../projects/com/components/checkbox/ngx-com-components-checkbox.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\n/** Checkbox size variants. */\nexport type CheckboxSize = 'sm' | 'md' | 'lg';\n\n/** Checkbox color variants. */\nexport type CheckboxVariant = 'primary' | 'accent' | 'warn';\n\n/**\n * CVA variants for the visual checkbox box.\n *\n * Uses `peer` selectors to style based on native input state:\n * - `peer-checked:` for checked state\n * - `peer-indeterminate:` for indeterminate state\n * - `peer-focus-visible:` for keyboard focus\n * - `peer-disabled:` for disabled state\n *\n * @tokens `--color-border`, `--color-primary`, `--color-primary-foreground`, `--color-primary-hover`,\n *         `--color-accent`, `--color-accent-foreground`, `--color-accent-hover`,\n *         `--color-warn`, `--color-warn-foreground`, `--color-warn-hover`,\n *         `--color-disabled`, `--color-disabled-foreground`, `--color-ring`, `--radius-interactive-sm`\n */\nexport const checkboxBoxVariants: (props?: {\n  variant?: CheckboxVariant;\n  size?: CheckboxSize;\n}) => string = cva(\n  [\n    'com-checkbox__box',\n    'inline-flex shrink-0 items-center justify-center',\n    'rounded-interactive-sm border-2 border-border',\n    'transition-colors duration-150',\n    'peer-focus-visible:outline-[1px] peer-focus-visible:outline-offset-2 peer-focus-visible:outline-ring',\n    'peer-disabled:cursor-not-allowed peer-disabled:border-disabled peer-disabled:bg-disabled peer-disabled:text-disabled-foreground',\n  ],\n  {\n    variants: {\n      variant: {\n        primary: [\n          'peer-checked:border-primary peer-checked:bg-primary peer-checked:text-primary-foreground',\n          'peer-indeterminate:border-primary peer-indeterminate:bg-primary peer-indeterminate:text-primary-foreground',\n          'group-hover:border-primary-hover',\n          'peer-checked:group-hover:bg-primary-hover peer-checked:group-hover:border-primary-hover',\n          'peer-indeterminate:group-hover:bg-primary-hover peer-indeterminate:group-hover:border-primary-hover',\n        ],\n        accent: [\n          'peer-checked:border-accent peer-checked:bg-accent peer-checked:text-accent-foreground',\n          'peer-indeterminate:border-accent peer-indeterminate:bg-accent peer-indeterminate:text-accent-foreground',\n          'group-hover:border-accent-hover',\n          'peer-checked:group-hover:bg-accent-hover peer-checked:group-hover:border-accent-hover',\n          'peer-indeterminate:group-hover:bg-accent-hover peer-indeterminate:group-hover:border-accent-hover',\n        ],\n        warn: [\n          'peer-checked:border-warn peer-checked:bg-warn peer-checked:text-warn-foreground',\n          'peer-indeterminate:border-warn peer-indeterminate:bg-warn peer-indeterminate:text-warn-foreground',\n          'group-hover:border-warn-hover',\n          'peer-checked:group-hover:bg-warn-hover peer-checked:group-hover:border-warn-hover',\n          'peer-indeterminate:group-hover:bg-warn-hover peer-indeterminate:group-hover:border-warn-hover',\n        ],\n      },\n      size: {\n        sm: 'size-4',\n        md: 'size-5',\n        lg: 'size-6',\n      },\n    },\n    defaultVariants: {\n      variant: 'primary',\n      size: 'md',\n    },\n  }\n);\n\n/** Size-based classes for the checkmark SVG icon. */\nexport const CHECKBOX_ICON_SIZES: Record<CheckboxSize, string> = {\n  sm: 'size-3',\n  md: 'size-3.5',\n  lg: 'size-4',\n};\n\n/** Size-based classes for the label content. */\nexport const CHECKBOX_LABEL_SIZES: Record<CheckboxSize, string> = {\n  sm: 'text-sm ms-2',\n  md: 'text-base ms-2.5',\n  lg: 'text-lg ms-3',\n};\n","import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  effect,\n  ElementRef,\n  inject,\n  input,\n  model,\n  output,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport type {\n  InputSignal,\n  ModelSignal,\n  OutputEmitterRef,\n  Signal,\n} from '@angular/core';\nimport { NgControl } from '@angular/forms';\nimport type { ControlValueAccessor } from '@angular/forms';\nimport {\n  checkboxBoxVariants,\n  CHECKBOX_ICON_SIZES,\n  CHECKBOX_LABEL_SIZES,\n} from './checkbox.variants';\nimport type { CheckboxSize, CheckboxVariant } from './checkbox.variants';\n\n/** Event emitted when checkbox state changes. */\nexport interface CheckboxChange {\n  checked: boolean;\n  source: ComCheckbox;\n}\n\n/** Auto-incrementing ID counter for unique checkbox IDs. */\nlet nextId = 0;\n\n/**\n * Production-grade checkbox component with full accessibility support.\n *\n * Uses a native `<input type=\"checkbox\">` for built-in keyboard handling,\n * `:checked` and `:indeterminate` pseudo-classes, and screen reader support.\n *\n * Implements `ControlValueAccessor` for Reactive Forms integration via\n * `NgControl` injection pattern (no `NG_VALUE_ACCESSOR` provider).\n *\n * @tokens `--color-border`, `--color-primary`, `--color-primary-foreground`, `--color-primary-hover`,\n *         `--color-accent`, `--color-accent-foreground`, `--color-accent-hover`,\n *         `--color-warn`, `--color-warn-foreground`, `--color-warn-hover`,\n *         `--color-disabled`, `--color-disabled-foreground`, `--color-ring`\n *\n * @example Basic usage\n * ```html\n * <com-checkbox [(checked)]=\"isActive\">Enable feature</com-checkbox>\n * ```\n *\n * @example With reactive forms\n * ```html\n * <com-checkbox formControlName=\"acceptTerms\">\n *   I accept the <a href=\"/terms\">terms and conditions</a>\n * </com-checkbox>\n * ```\n *\n * @example Indeterminate state\n * ```html\n * <com-checkbox [(indeterminate)]=\"hasPartialSelection\" (changed)=\"onSelectAll($event)\">\n *   Select all\n * </com-checkbox>\n * ```\n *\n * @example Variants and sizes\n * ```html\n * <com-checkbox variant=\"accent\" size=\"lg\">Large accent checkbox</com-checkbox>\n * <com-checkbox variant=\"warn\" size=\"sm\">Small warning checkbox</com-checkbox>\n * ```\n */\n@Component({\n  selector: 'com-checkbox',\n  exportAs: 'comCheckbox',\n  template: `\n    <label\n      class=\"group relative inline-flex items-center\"\n      [class.cursor-pointer]=\"!disabled()\"\n      [class.cursor-not-allowed]=\"disabled()\"\n    >\n      <span><input\n        #inputElement\n        type=\"checkbox\"\n        class=\"peer sr-only\"\n        [id]=\"inputId()\"\n        [checked]=\"checked()\"\n        [disabled]=\"disabled()\"\n        [attr.name]=\"name()\"\n        [attr.value]=\"value()\"\n        [attr.aria-label]=\"ariaLabel()\"\n        [attr.aria-labelledby]=\"ariaLabelledby()\"\n        [attr.aria-describedby]=\"ariaDescribedby()\"\n        (change)=\"onInputChange($event)\"\n        (blur)=\"onTouched()\"\n      /></span>\n      <span [class]=\"boxClasses()\">\n        @if (checked() && !indeterminate()) {\n          <svg\n            class=\"pointer-events-none\"\n            [class]=\"iconSizeClass()\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"3\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            aria-hidden=\"true\"\n            focusable=\"false\"\n          >\n            <polyline points=\"4 12 9 17 20 6\" />\n          </svg>\n        }\n        @if (indeterminate()) {\n          <svg\n            class=\"pointer-events-none\"\n            [class]=\"iconSizeClass()\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"3\"\n            stroke-linecap=\"round\"\n            aria-hidden=\"true\"\n            focusable=\"false\"\n          >\n            <line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\" />\n          </svg>\n        }\n      </span>\n      <span\n        class=\"com-checkbox__label select-none peer-disabled:cursor-not-allowed peer-disabled:text-disabled-foreground\"\n        [class]=\"labelSizeClass()\"\n      >\n        <ng-content />\n      </span>\n    </label>\n  `,\n  styles: `\n    .sr-only {\n      position: absolute;\n      width: 1px;\n      height: 1px;\n      padding: 0;\n      margin: -1px;\n      overflow: hidden;\n      clip: rect(0, 0, 0, 0);\n      white-space: nowrap;\n      border: 0;\n    }\n  `,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    class: 'com-checkbox inline-block align-middle',\n    '[class.com-checkbox--disabled]': 'disabled()',\n    '[class.com-checkbox--checked]': 'checked()',\n    '[class.com-checkbox--indeterminate]': 'indeterminate()',\n  },\n})\nexport class ComCheckbox implements ControlValueAccessor {\n  /** Optional NgControl for reactive forms integration. */\n  readonly ngControl: NgControl | null = inject(NgControl, { optional: true, self: true });\n\n  /** Reference to the native input element. */\n  readonly inputRef: Signal<ElementRef<HTMLInputElement> | undefined> =\n    viewChild<ElementRef<HTMLInputElement>>('inputElement');\n\n  /** Unique ID for this checkbox instance. */\n  private readonly uniqueId: string = `com-checkbox-${nextId++}`;\n\n  // Inputs\n  readonly size: InputSignal<CheckboxSize> = input<CheckboxSize>('md');\n  readonly variant: InputSignal<CheckboxVariant> = input<CheckboxVariant>('primary');\n  readonly checked: ModelSignal<boolean> = model<boolean>(false);\n  readonly indeterminate: ModelSignal<boolean> = model<boolean>(false);\n  readonly disabled: ModelSignal<boolean> = model<boolean>(false);\n  readonly value: InputSignal<string | undefined> = input<string>();\n  readonly name: InputSignal<string | undefined> = input<string>();\n  readonly id: InputSignal<string | undefined> = input<string>();\n  readonly ariaLabel: InputSignal<string | null> = input<string | null>(null, { alias: 'aria-label' });\n  readonly ariaLabelledby: InputSignal<string | null> = input<string | null>(null, { alias: 'aria-labelledby' });\n  readonly ariaDescribedby: InputSignal<string | null> = input<string | null>(null, { alias: 'aria-describedby' });\n\n  // Outputs\n  readonly changed: OutputEmitterRef<CheckboxChange> = output<CheckboxChange>();\n\n  // Computed state\n  readonly inputId: Signal<string> = computed(() => this.id() ?? this.uniqueId);\n\n  protected readonly boxClasses: Signal<string> = computed(() =>\n    checkboxBoxVariants({ variant: this.variant(), size: this.size() })\n  );\n\n  protected readonly iconSizeClass: Signal<string> = computed(() => CHECKBOX_ICON_SIZES[this.size()]);\n  protected readonly labelSizeClass: Signal<string> = computed(() => CHECKBOX_LABEL_SIZES[this.size()]);\n\n  // CVA callbacks\n  private onChange: (value: boolean) => void = () => {};\n  protected onTouched: () => void = () => {};\n\n  constructor() {\n    if (this.ngControl) {\n      this.ngControl.valueAccessor = this;\n    }\n\n    // Sync indeterminate state to DOM (needed because [indeterminate] is a property, not attribute)\n    effect(() => {\n      const isIndeterminate = this.indeterminate();\n      const inputEl = this.inputRef()?.nativeElement;\n      if (inputEl) {\n        inputEl.indeterminate = isIndeterminate;\n      }\n    });\n  }\n\n  // ControlValueAccessor implementation\n  writeValue(value: boolean): void {\n    this.checked.set(value ?? false);\n  }\n\n  registerOnChange(fn: (value: boolean) => void): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: () => void): void {\n    this.onTouched = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.disabled.set(isDisabled);\n  }\n\n  // Event handlers\n  protected onInputChange(event: Event): void {\n    const input = event.target as HTMLInputElement;\n    const newChecked = input.checked;\n\n    // Clear indeterminate on user interaction\n    if (this.indeterminate()) {\n      this.indeterminate.set(false);\n      input.indeterminate = false;\n    }\n\n    this.checked.set(newChecked);\n    this.onChange(newChecked);\n    this.changed.emit({ checked: newChecked, source: this });\n  }\n\n  // Public API\n  /** Focuses this checkbox's input element. */\n  focus(): void {\n    this.inputRef()?.nativeElement.focus();\n  }\n\n  /** Toggles the checkbox state programmatically. */\n  toggle(): void {\n    if (this.disabled()) {\n      return;\n    }\n\n    const newChecked = !this.checked();\n    this.checked.set(newChecked);\n    this.indeterminate.set(false);\n    this.onChange(newChecked);\n    this.changed.emit({ checked: newChecked, source: this });\n  }\n}\n","// Public API for the checkbox component\n\n// Main component\nexport { ComCheckbox } from './checkbox.component';\n\n// Types\nexport type { CheckboxChange } from './checkbox.component';\n\n// Variants (for advanced customization)\nexport {\n  checkboxBoxVariants,\n  CHECKBOX_ICON_SIZES,\n  CHECKBOX_LABEL_SIZES,\n} from './checkbox.variants';\n\nexport type { CheckboxSize, CheckboxVariant } from './checkbox.variants';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ngx-com-components-checkbox.mjs","sources":["../../../projects/com/components/checkbox/checkbox.variants.ts","../../../projects/com/components/checkbox/checkbox.component.ts","../../../projects/com/components/checkbox/index.ts","../../../projects/com/components/checkbox/ngx-com-components-checkbox.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\n\n/** Checkbox size variants. */\nexport type CheckboxSize = 'sm' | 'md' | 'lg';\n\n/** Checkbox color variants. */\nexport type CheckboxVariant = 'primary' | 'accent' | 'warn';\n\n/**\n * CVA variants for the visual checkbox box.\n *\n * Uses `peer` selectors to style based on native input state:\n * - `peer-checked:` for checked state\n * - `peer-indeterminate:` for indeterminate state\n * - `peer-focus-visible:` for keyboard focus\n * - `peer-disabled:` for disabled state\n *\n * @tokens `--color-border`, `--color-primary`, `--color-primary-foreground`, `--color-primary-hover`,\n *         `--color-accent`, `--color-accent-foreground`, `--color-accent-hover`,\n *         `--color-warn`, `--color-warn-foreground`, `--color-warn-hover`,\n *         `--color-disabled`, `--color-disabled-foreground`, `--color-ring`, `--radius-interactive-sm`\n */\nexport const checkboxBoxVariants: (props?: {\n  variant?: CheckboxVariant;\n  size?: CheckboxSize;\n}) => string = cva(\n  [\n    'com-checkbox__box',\n    'inline-flex shrink-0 items-center justify-center',\n    'rounded-interactive-sm border-2 border-border',\n    'transition-colors duration-150',\n    'peer-focus-visible:outline-[1px] peer-focus-visible:outline-offset-2 peer-focus-visible:outline-ring',\n    'peer-disabled:cursor-not-allowed peer-disabled:border-disabled peer-disabled:bg-disabled peer-disabled:text-disabled-foreground',\n  ],\n  {\n    variants: {\n      variant: {\n        primary: [\n          'peer-checked:border-primary peer-checked:bg-primary peer-checked:text-primary-foreground',\n          'peer-indeterminate:border-primary peer-indeterminate:bg-primary peer-indeterminate:text-primary-foreground',\n          'group-hover:border-primary-hover',\n          'peer-checked:group-hover:bg-primary-hover peer-checked:group-hover:border-primary-hover',\n          'peer-indeterminate:group-hover:bg-primary-hover peer-indeterminate:group-hover:border-primary-hover',\n        ],\n        accent: [\n          'peer-checked:border-accent peer-checked:bg-accent peer-checked:text-accent-foreground',\n          'peer-indeterminate:border-accent peer-indeterminate:bg-accent peer-indeterminate:text-accent-foreground',\n          'group-hover:border-accent-hover',\n          'peer-checked:group-hover:bg-accent-hover peer-checked:group-hover:border-accent-hover',\n          'peer-indeterminate:group-hover:bg-accent-hover peer-indeterminate:group-hover:border-accent-hover',\n        ],\n        warn: [\n          'peer-checked:border-warn peer-checked:bg-warn peer-checked:text-warn-foreground',\n          'peer-indeterminate:border-warn peer-indeterminate:bg-warn peer-indeterminate:text-warn-foreground',\n          'group-hover:border-warn-hover',\n          'peer-checked:group-hover:bg-warn-hover peer-checked:group-hover:border-warn-hover',\n          'peer-indeterminate:group-hover:bg-warn-hover peer-indeterminate:group-hover:border-warn-hover',\n        ],\n      },\n      size: {\n        sm: 'size-4',\n        md: 'size-5',\n        lg: 'size-6',\n      },\n    },\n    defaultVariants: {\n      variant: 'primary',\n      size: 'md',\n    },\n  }\n);\n\n/** Size-based classes for the checkmark SVG icon. */\nexport const CHECKBOX_ICON_SIZES: Record<CheckboxSize, string> = {\n  sm: 'size-3',\n  md: 'size-3.5',\n  lg: 'size-4',\n};\n\n/** Size-based classes for the label content. */\nexport const CHECKBOX_LABEL_SIZES: Record<CheckboxSize, string> = {\n  sm: 'text-sm ms-2',\n  md: 'text-base ms-2.5',\n  lg: 'text-lg ms-3',\n};\n","import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  effect,\n  ElementRef,\n  inject,\n  input,\n  model,\n  output,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport type {\n  InputSignal,\n  ModelSignal,\n  OutputEmitterRef,\n  Signal,\n} from '@angular/core';\nimport { NgControl } from '@angular/forms';\nimport type { ControlValueAccessor } from '@angular/forms';\nimport {\n  checkboxBoxVariants,\n  CHECKBOX_ICON_SIZES,\n  CHECKBOX_LABEL_SIZES,\n} from './checkbox.variants';\nimport type { CheckboxSize, CheckboxVariant } from './checkbox.variants';\n\n/** Event emitted when checkbox state changes. */\nexport interface CheckboxChange {\n  checked: boolean;\n  source: ComCheckbox;\n}\n\n/** Auto-incrementing ID counter for unique checkbox IDs. */\nlet nextId = 0;\n\n/**\n * Production-grade checkbox component with full accessibility support.\n *\n * Uses a native `<input type=\"checkbox\">` for built-in keyboard handling,\n * `:checked` and `:indeterminate` pseudo-classes, and screen reader support.\n *\n * Implements `ControlValueAccessor` for Reactive Forms integration via\n * `NgControl` injection pattern (no `NG_VALUE_ACCESSOR` provider).\n *\n * @tokens `--color-border`, `--color-primary`, `--color-primary-foreground`, `--color-primary-hover`,\n *         `--color-accent`, `--color-accent-foreground`, `--color-accent-hover`,\n *         `--color-warn`, `--color-warn-foreground`, `--color-warn-hover`,\n *         `--color-disabled`, `--color-disabled-foreground`, `--color-ring`\n *\n * @example Basic usage\n * ```html\n * <com-checkbox [(checked)]=\"isActive\">Enable feature</com-checkbox>\n * ```\n *\n * @example With reactive forms\n * ```html\n * <com-checkbox formControlName=\"acceptTerms\">\n *   I accept the <a href=\"/terms\">terms and conditions</a>\n * </com-checkbox>\n * ```\n *\n * @example Indeterminate state\n * ```html\n * <com-checkbox [(indeterminate)]=\"hasPartialSelection\" (changed)=\"onSelectAll($event)\">\n *   Select all\n * </com-checkbox>\n * ```\n *\n * @example Variants and sizes\n * ```html\n * <com-checkbox variant=\"accent\" size=\"lg\">Large accent checkbox</com-checkbox>\n * <com-checkbox variant=\"warn\" size=\"sm\">Small warning checkbox</com-checkbox>\n * ```\n */\n@Component({\n  selector: 'com-checkbox',\n  exportAs: 'comCheckbox',\n  template: `\n    <label\n      class=\"group relative inline-flex items-center\"\n      [class.cursor-pointer]=\"!disabled()\"\n      [class.cursor-not-allowed]=\"disabled()\"\n    >\n      <span><input\n        #inputElement\n        type=\"checkbox\"\n        class=\"peer sr-only\"\n        [id]=\"inputId()\"\n        [checked]=\"checked()\"\n        [disabled]=\"disabled()\"\n        [attr.name]=\"name()\"\n        [attr.value]=\"htmlValue()\"\n        [attr.aria-label]=\"ariaLabel()\"\n        [attr.aria-labelledby]=\"ariaLabelledby()\"\n        [attr.aria-describedby]=\"ariaDescribedby()\"\n        (change)=\"onInputChange($event)\"\n        (blur)=\"onBlur()\"\n      /></span>\n      <span [class]=\"boxClasses()\">\n        @if (checked() && !indeterminate()) {\n          <svg\n            class=\"pointer-events-none\"\n            [class]=\"iconSizeClass()\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"3\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            aria-hidden=\"true\"\n            focusable=\"false\"\n          >\n            <polyline points=\"4 12 9 17 20 6\" />\n          </svg>\n        }\n        @if (indeterminate()) {\n          <svg\n            class=\"pointer-events-none\"\n            [class]=\"iconSizeClass()\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"3\"\n            stroke-linecap=\"round\"\n            aria-hidden=\"true\"\n            focusable=\"false\"\n          >\n            <line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\" />\n          </svg>\n        }\n      </span>\n      <span\n        class=\"com-checkbox__label select-none peer-disabled:cursor-not-allowed peer-disabled:text-disabled-foreground\"\n        [class]=\"labelSizeClass()\"\n      >\n        <ng-content />\n      </span>\n    </label>\n  `,\n  styles: `\n    .sr-only {\n      position: absolute;\n      width: 1px;\n      height: 1px;\n      padding: 0;\n      margin: -1px;\n      overflow: hidden;\n      clip: rect(0, 0, 0, 0);\n      white-space: nowrap;\n      border: 0;\n    }\n  `,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    class: 'com-checkbox inline-block align-middle',\n    '[class.com-checkbox--disabled]': 'disabled()',\n    '[class.com-checkbox--checked]': 'checked()',\n    '[class.com-checkbox--indeterminate]': 'indeterminate()',\n  },\n})\nexport class ComCheckbox implements ControlValueAccessor {\n  /** Optional NgControl for reactive forms integration. */\n  readonly ngControl: NgControl | null = inject(NgControl, { optional: true, self: true });\n\n  /** Reference to the native input element. */\n  readonly inputRef: Signal<ElementRef<HTMLInputElement> | undefined> =\n    viewChild<ElementRef<HTMLInputElement>>('inputElement');\n\n  /** Unique ID for this checkbox instance. */\n  private readonly uniqueId: string = `com-checkbox-${nextId++}`;\n\n  // Inputs\n  readonly size: InputSignal<CheckboxSize> = input<CheckboxSize>('md');\n  readonly variant: InputSignal<CheckboxVariant> = input<CheckboxVariant>('primary');\n  readonly checked: ModelSignal<boolean> = model<boolean>(false);\n  readonly indeterminate: ModelSignal<boolean> = model<boolean>(false);\n  readonly disabled: ModelSignal<boolean> = model<boolean>(false);\n  readonly htmlValue: InputSignal<string | undefined> = input<string | undefined>(undefined, { alias: 'value' });\n  readonly name: InputSignal<string | undefined> = input<string>();\n\n  // Signal Forms inputs — set automatically by [formField] via setInputOnDirectives\n  readonly touched: ModelSignal<boolean> = model<boolean>(false);\n  readonly invalid: InputSignal<boolean> = input<boolean>(false);\n  readonly sfErrors: InputSignal<readonly unknown[]> = input<readonly unknown[]>([], { alias: 'errors' });\n  readonly sfRequired: InputSignal<boolean> = input<boolean>(false, { alias: 'required' });\n  readonly id: InputSignal<string | undefined> = input<string>();\n  readonly ariaLabel: InputSignal<string | null> = input<string | null>(null, { alias: 'aria-label' });\n  readonly ariaLabelledby: InputSignal<string | null> = input<string | null>(null, { alias: 'aria-labelledby' });\n  readonly ariaDescribedby: InputSignal<string | null> = input<string | null>(null, { alias: 'aria-describedby' });\n\n  // Outputs\n  readonly changed: OutputEmitterRef<CheckboxChange> = output<CheckboxChange>();\n\n  // Computed state\n  readonly inputId: Signal<string> = computed(() => this.id() ?? this.uniqueId);\n\n  protected readonly boxClasses: Signal<string> = computed(() =>\n    checkboxBoxVariants({ variant: this.variant(), size: this.size() })\n  );\n\n  protected readonly iconSizeClass: Signal<string> = computed(() => CHECKBOX_ICON_SIZES[this.size()]);\n  protected readonly labelSizeClass: Signal<string> = computed(() => CHECKBOX_LABEL_SIZES[this.size()]);\n\n  // CVA callbacks\n  private onChange: (value: boolean) => void = () => {};\n  protected onTouched: () => void = () => {};\n\n  constructor() {\n    if (this.ngControl) {\n      this.ngControl.valueAccessor = this;\n    }\n\n    // Sync indeterminate state to DOM (needed because [indeterminate] is a property, not attribute)\n    effect(() => {\n      const isIndeterminate = this.indeterminate();\n      const inputEl = this.inputRef()?.nativeElement;\n      if (inputEl) {\n        inputEl.indeterminate = isIndeterminate;\n      }\n    });\n  }\n\n  // ControlValueAccessor implementation\n  writeValue(value: boolean): void {\n    this.checked.set(value ?? false);\n  }\n\n  registerOnChange(fn: (value: boolean) => void): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: () => void): void {\n    this.onTouched = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.disabled.set(isDisabled);\n  }\n\n  // Event handlers\n  protected onBlur(): void {\n    this.onTouched();\n    this.touched.set(true);\n  }\n\n  protected onInputChange(event: Event): void {\n    const input = event.target as HTMLInputElement;\n    const newChecked = input.checked;\n\n    // Clear indeterminate on user interaction\n    if (this.indeterminate()) {\n      this.indeterminate.set(false);\n      input.indeterminate = false;\n    }\n\n    this.checked.set(newChecked);\n    this.onChange(newChecked);\n    this.changed.emit({ checked: newChecked, source: this });\n  }\n\n  // Public API\n  /** Focuses this checkbox's input element. */\n  focus(): void {\n    this.inputRef()?.nativeElement.focus();\n  }\n\n  /** Toggles the checkbox state programmatically. */\n  toggle(): void {\n    if (this.disabled()) {\n      return;\n    }\n\n    const newChecked = !this.checked();\n    this.checked.set(newChecked);\n    this.indeterminate.set(false);\n    this.onChange(newChecked);\n    this.changed.emit({ checked: newChecked, source: this });\n  }\n}\n","// Public API for the checkbox component\n\n// Main component\nexport { ComCheckbox } from './checkbox.component';\n\n// Types\nexport type { CheckboxChange } from './checkbox.component';\n\n// Variants (for advanced customization)\nexport {\n  checkboxBoxVariants,\n  CHECKBOX_ICON_SIZES,\n  CHECKBOX_LABEL_SIZES,\n} from './checkbox.variants';\n\nexport type { CheckboxSize, CheckboxVariant } from './checkbox.variants';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngx-com-components-dropdown.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { viewChild, input, output, computed, ChangeDetectionStrategy, Component, inject, DestroyRef, signal, TemplateRef, Directive, ElementRef, ViewContainerRef, contentChild, linkedSignal, forwardRef } from '@angular/core';
+import { viewChild, input, output, computed, ChangeDetectionStrategy, Component, inject, DestroyRef, signal, TemplateRef, Directive, ElementRef, ViewContainerRef, contentChild, model, linkedSignal, forwardRef } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { NgTemplateOutlet } from '@angular/common';
 import { NgForm, FormGroupDirective, NgControl } from '@angular/forms';
@@ -1602,7 +1602,7 @@ class ComDropdown {
     /** Array of options to display. */
     options = input([], ...(ngDevMode ? [{ debugName: "options" }] : []));
     /** Current value (single or array for multiple). */
-    value = input(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
+    value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
     /** Placeholder text when no value is selected. */
     placeholder = input('Select...', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
     /** Enable multi-select mode. */
@@ -1647,9 +1647,11 @@ class ComDropdown {
     maxVisibleTags = input(2, ...(ngDevMode ? [{ debugName: "maxVisibleTags" }] : []));
     /** Custom error state matcher for determining when to show errors. */
     errorStateMatcher = input(...(ngDevMode ? [undefined, { debugName: "errorStateMatcher" }] : []));
+    // Signal Forms inputs — set automatically by [formField] via setInputOnDirectives
+    touched = model(false, ...(ngDevMode ? [{ debugName: "touched" }] : []));
+    invalid = input(false, ...(ngDevMode ? [{ debugName: "invalid" }] : []));
+    sfErrors = input([], { ...(ngDevMode ? { debugName: "sfErrors" } : {}), alias: 'errors' });
     // ============ OUTPUTS ============
-    /** Emitted when the value changes. */
-    valueChange = output();
     /** Emitted when search query changes. */
     searchChange = output();
     /** Emitted when panel opens. */
@@ -1697,13 +1699,19 @@ class ComDropdown {
     shouldLabelFloat = computed(() => this.focused() || this.hasValue(), ...(ngDevMode ? [{ debugName: "shouldLabelFloat" }] : []));
     /** Whether the control is in an error state. Implements FormFieldControl. */
     errorState = computed(() => {
-        // Read reactive dependencies to trigger re-evaluation
+        if (!this.ngControl) {
+            // Signal Forms: gate on invalid AND touched (mirrors ErrorStateMatcher default)
+            return this.invalid() && this.touched();
+        }
+        // Reactive Forms: use ErrorStateMatcher (existing logic)
         this.isOpen();
         this.hasValue();
         const matcher = this.errorStateMatcher() ?? this.defaultErrorStateMatcher;
         const form = this.parentFormGroup ?? this.parentForm;
-        return matcher.isErrorState(this.ngControl?.control ?? null, form);
+        return matcher.isErrorState(this.ngControl.control ?? null, form);
     }, ...(ngDevMode ? [{ debugName: "errorState" }] : []));
+    /** Structured validation errors from Signal Forms, exposed for the parent form field. */
+    errors = computed(() => !this.ngControl ? this.sfErrors() : null, ...(ngDevMode ? [{ debugName: "errors" }] : []));
     /** Unique ID for the control. Implements FormFieldControl. */
     id = this.triggerId;
     /**
@@ -1932,6 +1940,7 @@ class ComDropdown {
         this.activeOptionId.set(null);
         this.closed.emit();
         this.onTouched();
+        this.touched.set(true);
     }
     /** Toggles the dropdown panel. */
     toggle() {
@@ -2168,9 +2177,8 @@ class ComDropdown {
         return { width: config };
     }
     updateValue(value) {
-        this.internalValue.set(value);
+        this.value.set(value);
         this.onChange(value);
-        this.valueChange.emit(value);
         // Announce selection
         if (value !== null && !Array.isArray(value)) {
             this.announce(`${this.displayWith()(value)} selected`);
@@ -2272,7 +2280,7 @@ class ComDropdown {
         this.liveAnnouncer.announce(message, 'polite');
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ComDropdown, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: ComDropdown, isStandalone: true, selector: "com-dropdown", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, displayWith: { classPropertyName: "displayWith", publicName: "displayWith", isSignal: true, isRequired: false, transformFunction: null }, filterWith: { classPropertyName: "filterWith", publicName: "filterWith", isSignal: true, isRequired: false, transformFunction: null }, groupBy: { classPropertyName: "groupBy", publicName: "groupBy", 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 }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, panelWidth: { classPropertyName: "panelWidth", publicName: "panelWidth", isSignal: true, isRequired: false, transformFunction: null }, searchDebounceMs: { classPropertyName: "searchDebounceMs", publicName: "searchDebounceMs", isSignal: true, isRequired: false, transformFunction: null }, virtualScrollThreshold: { classPropertyName: "virtualScrollThreshold", publicName: "virtualScrollThreshold", isSignal: true, isRequired: false, transformFunction: null }, maxVisibleTags: { classPropertyName: "maxVisibleTags", publicName: "maxVisibleTags", isSignal: true, isRequired: false, transformFunction: null }, errorStateMatcher: { classPropertyName: "errorStateMatcher", publicName: "errorStateMatcher", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", searchChange: "searchChange", opened: "opened", closed: "closed" }, host: { properties: { "class.com-dropdown-disabled": "disabled()", "class.com-dropdown-open": "isOpen()" }, classAttribute: "com-dropdown-host inline-block" }, providers: [{ provide: FormFieldControl, useExisting: forwardRef(() => ComDropdown) }], queries: [{ propertyName: "optionTemplate", first: true, predicate: (ComDropdownOptionTpl), descendants: true, isSignal: true }, { propertyName: "selectedTemplate", first: true, predicate: (ComDropdownSelectedTpl), descendants: true, isSignal: true }, { propertyName: "emptyTemplate", first: true, predicate: ComDropdownEmptyTpl, descendants: true, isSignal: true }, { propertyName: "groupTemplate", first: true, predicate: ComDropdownGroupTpl, descendants: true, isSignal: true }, { propertyName: "tagTemplate", first: true, predicate: (ComDropdownTagTpl), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerElement"], descendants: true, isSignal: true }, { propertyName: "panelTemplateRef", first: true, predicate: ["panelTemplate"], descendants: true, isSignal: true }], exportAs: ["comDropdown"], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: ComDropdown, isStandalone: true, selector: "com-dropdown", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, displayWith: { classPropertyName: "displayWith", publicName: "displayWith", isSignal: true, isRequired: false, transformFunction: null }, filterWith: { classPropertyName: "filterWith", publicName: "filterWith", isSignal: true, isRequired: false, transformFunction: null }, groupBy: { classPropertyName: "groupBy", publicName: "groupBy", 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 }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, panelWidth: { classPropertyName: "panelWidth", publicName: "panelWidth", isSignal: true, isRequired: false, transformFunction: null }, searchDebounceMs: { classPropertyName: "searchDebounceMs", publicName: "searchDebounceMs", isSignal: true, isRequired: false, transformFunction: null }, virtualScrollThreshold: { classPropertyName: "virtualScrollThreshold", publicName: "virtualScrollThreshold", isSignal: true, isRequired: false, transformFunction: null }, maxVisibleTags: { classPropertyName: "maxVisibleTags", publicName: "maxVisibleTags", isSignal: true, isRequired: false, transformFunction: null }, errorStateMatcher: { classPropertyName: "errorStateMatcher", publicName: "errorStateMatcher", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, sfErrors: { classPropertyName: "sfErrors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange", searchChange: "searchChange", opened: "opened", closed: "closed" }, host: { properties: { "class.com-dropdown-disabled": "disabled()", "class.com-dropdown-open": "isOpen()" }, classAttribute: "com-dropdown-host inline-block" }, providers: [{ provide: FormFieldControl, useExisting: forwardRef(() => ComDropdown) }], queries: [{ propertyName: "optionTemplate", first: true, predicate: (ComDropdownOptionTpl), descendants: true, isSignal: true }, { propertyName: "selectedTemplate", first: true, predicate: (ComDropdownSelectedTpl), descendants: true, isSignal: true }, { propertyName: "emptyTemplate", first: true, predicate: ComDropdownEmptyTpl, descendants: true, isSignal: true }, { propertyName: "groupTemplate", first: true, predicate: ComDropdownGroupTpl, descendants: true, isSignal: true }, { propertyName: "tagTemplate", first: true, predicate: (ComDropdownTagTpl), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerElement"], descendants: true, isSignal: true }, { propertyName: "panelTemplateRef", first: true, predicate: ["panelTemplate"], descendants: true, isSignal: true }], exportAs: ["comDropdown"], ngImport: i0, template: `
     <!-- Trigger button -->
     <button
       #triggerElement
@@ -2678,7 +2686,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                         '[class.com-dropdown-disabled]': 'disabled()',
                         '[class.com-dropdown-open]': 'isOpen()',
                     }, styles: [".sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { triggerRef: [{ type: i0.ViewChild, args: ['triggerElement', { isSignal: true }] }], panelTemplateRef: [{ type: i0.ViewChild, args: ['panelTemplate', { isSignal: true }] }], optionTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComDropdownOptionTpl), { isSignal: true }] }], selectedTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComDropdownSelectedTpl), { isSignal: true }] }], emptyTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComDropdownEmptyTpl), { isSignal: true }] }], groupTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComDropdownGroupTpl), { isSignal: true }] }], tagTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComDropdownTagTpl), { isSignal: true }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], compareWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "compareWith", required: false }] }], displayWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayWith", required: false }] }], filterWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterWith", required: false }] }], groupBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupBy", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], panelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelClass", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], panelWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelWidth", required: false }] }], searchDebounceMs: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchDebounceMs", required: false }] }], virtualScrollThreshold: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScrollThreshold", required: false }] }], maxVisibleTags: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisibleTags", required: false }] }], errorStateMatcher: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorStateMatcher", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], searchChange: [{ type: i0.Output, args: ["searchChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
+        }], ctorParameters: () => [], propDecorators: { triggerRef: [{ type: i0.ViewChild, args: ['triggerElement', { isSignal: true }] }], panelTemplateRef: [{ type: i0.ViewChild, args: ['panelTemplate', { isSignal: true }] }], optionTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComDropdownOptionTpl), { isSignal: true }] }], selectedTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComDropdownSelectedTpl), { isSignal: true }] }], emptyTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComDropdownEmptyTpl), { isSignal: true }] }], groupTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComDropdownGroupTpl), { isSignal: true }] }], tagTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ComDropdownTagTpl), { isSignal: true }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], compareWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "compareWith", required: false }] }], displayWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayWith", required: false }] }], filterWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterWith", required: false }] }], groupBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupBy", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], panelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelClass", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], panelWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelWidth", required: false }] }], searchDebounceMs: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchDebounceMs", required: false }] }], virtualScrollThreshold: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScrollThreshold", required: false }] }], maxVisibleTags: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisibleTags", required: false }] }], errorStateMatcher: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorStateMatcher", required: false }] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], sfErrors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], searchChange: [{ type: i0.Output, args: ["searchChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
 
 // Public API for the dropdown component
 // Main component