@shival99/z-ui 2.0.7 → 2.0.8

package/assets/css/themes/hospital.css

@@ -11,17 +11,17 @@
     /* Primary: #2e37a4 converted to oklch */
     --primary: oklch(0.35 0.18 264);
     --primary-foreground: oklch(0.98 0 0);
-    /* Secondary: lighter shade */
-    --secondary: oklch(0.96 0.02 264);
-    --secondary-foreground: oklch(0.25 0.08 264);
-    --muted: oklch(0.967 0.003 264.542);
-    --muted-foreground: oklch(0.551 0.027 264.364);
-    --accent: oklch(0.96 0.02 264);
-    --accent-foreground: oklch(0.25 0.08 264);
+    /* Secondary: darker blue-tinted surfaces for better visibility */
+    --secondary: oklch(0.93 0.035 264);
+    --secondary-foreground: oklch(0.2 0.1 264);
+    --muted: oklch(0.945 0.018 264);
+    --muted-foreground: oklch(0.42 0.045 264);
+    --accent: oklch(0.93 0.035 264);
+    --accent-foreground: oklch(0.2 0.1 264);
     --destructive: oklch(0.577 0.245 27.325);
     --destructive-foreground: oklch(0.985 0 0);
-    --border: oklch(0.92 0.02 264);
-    --input: oklch(0.92 0.02 264);
+    --border: oklch(0.86 0.04 264);
+    --input: oklch(0.88 0.035 264);
     --input-autofill: oklch(1 0 0);
     --ring: oklch(0.45 0.15 264);
     /* Chart colors - hospital blue palette */

package/fesm2022/shival99-z-ui-components-z-accordion.mjs

@@ -188,7 +188,7 @@ class ZAccordionItemComponent {
         this._accordion.toggleItem(this.zId());
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZAccordionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.9", type: ZAccordionItemComponent, isStandalone: true, selector: "z-accordion-item", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zId: { classPropertyName: "zId", publicName: "zId", isSignal: true, isRequired: true, transformFunction: null }, zTitle: { classPropertyName: "zTitle", publicName: "zTitle", isSignal: true, isRequired: true, transformFunction: null }, zDisabled: { classPropertyName: "zDisabled", publicName: "zDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "itemClasses()" } }, ngImport: i0, template: "<div\n  [class]=\"triggerClasses()\"\n  (click)=\"toggle()\"\n  (keydown.enter)=\"toggle()\"\n  (keydown.space)=\"toggle()\"\n  tabindex=\"0\"\n  role=\"button\"\n  [attr.aria-expanded]=\"isOpen()\">\n  <span [class]=\"titleWrapperClasses()\">\n    <ng-content select=\"[zAccordionIcon]\" />\n    <span>{{ zTitle() }}</span>\n  </span>\n  <z-icon [zType]=\"iconType()\" zSize=\"16\" [class]=\"iconClasses()\" />\n</div>\n\n<div [class]=\"contentClasses()\" class=\"z-accordion-content\" [class.z-accordion-content-open]=\"isOpen()\">\n  <div class=\"z-accordion-content-inner\">\n    <div [class]=\"contentInnerClasses()\">\n      <ng-content />\n    </div>\n  </div>\n</div>\n", styles: [".z-accordion-content{display:grid;grid-template-rows:0fr;transition:grid-template-rows .2s ease-out}.z-accordion-content.z-accordion-content-open{grid-template-rows:1fr}.z-accordion-content>.z-accordion-content-inner{overflow:hidden;min-height:0}\n"], dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zSize", "zStrokeWidth", "zSvg"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.9", type: ZAccordionItemComponent, isStandalone: true, selector: "z-accordion-item", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zId: { classPropertyName: "zId", publicName: "zId", isSignal: true, isRequired: true, transformFunction: null }, zTitle: { classPropertyName: "zTitle", publicName: "zTitle", isSignal: true, isRequired: true, transformFunction: null }, zDisabled: { classPropertyName: "zDisabled", publicName: "zDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "itemClasses()" } }, ngImport: i0, template: "<div\n  [class]=\"triggerClasses()\"\n  (click)=\"toggle()\"\n  (keydown.enter)=\"toggle()\"\n  (keydown.space)=\"toggle()\"\n  tabindex=\"0\"\n  role=\"button\"\n  [attr.aria-expanded]=\"isOpen()\">\n  <span [class]=\"titleWrapperClasses()\">\n    <ng-content select=\"[zAccordionIcon]\" />\n    <span>{{ zTitle() }}</span>\n  </span>\n  <z-icon [zType]=\"iconType()\" zSize=\"16\" [class]=\"iconClasses()\" />\n</div>\n\n<div [class]=\"contentClasses()\" class=\"z-accordion-content\" [class.z-accordion-content-open]=\"isOpen()\">\n  <div class=\"z-accordion-content-inner\">\n    <div [class]=\"contentInnerClasses()\">\n      <ng-content />\n    </div>\n  </div>\n</div>\n", styles: [".z-accordion-content{display:grid;grid-template-rows:0fr;transition:grid-template-rows .2s ease-out}.z-accordion-content.z-accordion-content-open{grid-template-rows:1fr}.z-accordion-content>.z-accordion-content-inner{overflow:hidden;min-height:0}\n"], dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZAccordionItemComponent, decorators: [{
             type: Component,

package/fesm2022/shival99-z-ui-components-z-accordion.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"shival99-z-ui-components-z-accordion.mjs","sources":["../../../../libs/core-ui/components/z-accordion/z-accordion.variants.ts","../../../../libs/core-ui/components/z-accordion/z-accordion-item.component.ts","../../../../libs/core-ui/components/z-accordion/z-accordion-item.component.html","../../../../libs/core-ui/components/z-accordion/z-accordion.component.ts","../../../../libs/core-ui/components/z-accordion/shival99-z-ui-components-z-accordion.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zAccordionVariants = cva(['block w-full'], {\n  variants: {\n    zType: {\n      default: 'border border-border rounded-md overflow-hidden',\n      ghost: '',\n      outline: 'border border-border rounded-md overflow-hidden',\n      card: '',\n      elevated: 'space-y-2',\n      'icon-list': '',\n      bordered: 'rounded-md border border-border',\n      separated: 'space-y-2',\n    },\n  },\n  defaultVariants: {\n    zType: 'default',\n  },\n});\n\nexport const zAccordionItemVariants = cva(['block group transition-[box-shadow,background-color] duration-200'], {\n  variants: {\n    zType: {\n      default: 'border-b border-border last:border-b-0',\n      ghost: 'border-b border-border last:border-b-0',\n      outline: 'border-b border-border last:border-b-0',\n      card: 'last:border-b-0 rounded-md px-4 transition-colors duration-200',\n      elevated: 'last:border-b-0 rounded-md border-b-0 bg-card shadow-md',\n      'icon-list': 'border-b border-border last:border-b-0',\n      bordered: 'border-b border-border last:border-b-0',\n      separated: 'border border-border rounded-md',\n    },\n    isDisabled: {\n      true: 'cursor-not-allowed pointer-events-none opacity-50',\n      false: '',\n    },\n    isOpen: {\n      true: '',\n      false: '',\n    },\n  },\n  compoundVariants: [\n    {\n      zType: 'card',\n      isOpen: true,\n      class: 'bg-background ring-1 ring-border shadow-md',\n    },\n    {\n      zType: 'elevated',\n      isOpen: true,\n      class: 'shadow-lg',\n    },\n  ],\n  defaultVariants: {\n    zType: 'default',\n    isDisabled: false,\n    isOpen: false,\n  },\n});\n\nexport const zAccordionTriggerVariants = cva(\n  [\n    'flex w-full select-none items-center justify-between gap-4 text-sm font-medium text-left',\n    'cursor-pointer transition-[color,background-color,text-decoration-color] duration-200',\n    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n  ],\n  {\n    variants: {\n      zType: {\n        default: 'px-4 py-4 hover:bg-muted/50',\n        ghost: 'px-4 py-4 hover:bg-muted/50',\n        outline: 'px-4 py-4 hover:bg-muted/50',\n        card: 'rounded-md py-4',\n        elevated: 'items-start rounded-md px-4 py-4 hover:underline',\n        'icon-list': 'items-start px-4 py-4 [&[aria-expanded=true]>svg]:rotate-45',\n        bordered: 'items-start px-5 py-4 hover:underline [&[aria-expanded=true]>svg]:rotate-180',\n        separated: 'items-start px-5 py-4 hover:underline [&[aria-expanded=true]>svg]:rotate-180',\n      },\n      isOpen: {\n        true: 'text-foreground',\n        false: 'text-foreground',\n      },\n    },\n    defaultVariants: {\n      zType: 'default',\n      isOpen: false,\n    },\n  }\n);\n\nexport const zAccordionContentVariants = cva(['overflow-hidden text-sm'], {\n  variants: {\n    zType: {\n      default: '',\n      ghost: '',\n      outline: '',\n      card: 'text-muted-foreground',\n      elevated: 'text-muted-foreground',\n      'icon-list': 'text-muted-foreground',\n      bordered: 'text-muted-foreground',\n      separated: 'text-muted-foreground',\n    },\n    isOpen: {\n      true: '',\n      false: '',\n    },\n  },\n  defaultVariants: {\n    zType: 'default',\n    isOpen: false,\n  },\n});\n\nexport type ZAccordionVariants = VariantProps<typeof zAccordionVariants>;\nexport type ZAccordionItemVariants = VariantProps<typeof zAccordionItemVariants>;\nexport type ZAccordionTriggerVariants = VariantProps<typeof zAccordionTriggerVariants>;\nexport type ZAccordionContentVariants = VariantProps<typeof zAccordionContentVariants>;\n","import { ChangeDetectionStrategy, Component, computed, inject, input, ViewEncapsulation } from '@angular/core';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { zMergeClasses, zTransform } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { ZAccordionComponent } from './z-accordion.component';\nimport { zAccordionContentVariants, zAccordionItemVariants, zAccordionTriggerVariants } from './z-accordion.variants';\n\n@Component({\n  selector: 'z-accordion-item',\n  imports: [ZIconComponent],\n  standalone: true,\n  templateUrl: './z-accordion-item.component.html',\n  styleUrl: './z-accordion.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'itemClasses()',\n  },\n})\nexport class ZAccordionItemComponent {\n  private readonly _accordion = inject(ZAccordionComponent);\n\n  public readonly class = input<ClassValue>('');\n  public readonly zId = input.required<string>();\n  public readonly zTitle = input.required<string>();\n  public readonly zDisabled = input(false, { transform: zTransform });\n\n  protected readonly isOpen = computed(() => this._accordion.isItemOpen(this.zId()));\n  protected readonly accordionType = this._accordion.zType;\n\n  protected readonly itemClasses = computed(() =>\n    zMergeClasses(\n      zAccordionItemVariants({\n        zType: this.accordionType(),\n        isDisabled: this.zDisabled(),\n        isOpen: this.isOpen(),\n      }),\n      this.class()\n    )\n  );\n\n  protected readonly triggerClasses = computed(() =>\n    zAccordionTriggerVariants({\n      zType: this.accordionType(),\n      isOpen: this.isOpen(),\n    })\n  );\n\n  protected readonly contentClasses = computed(() =>\n    zAccordionContentVariants({\n      zType: this.accordionType(),\n      isOpen: this.isOpen(),\n    })\n  );\n\n  protected readonly contentInnerClasses = computed(() => {\n    if (this.accordionType() === 'card') {\n      return 'pt-0 pb-4';\n    }\n\n    if (this.accordionType() === 'elevated') {\n      return 'px-4 pt-0 pb-4';\n    }\n\n    if (this.accordionType() === 'icon-list') {\n      return 'px-4 pt-0 pb-4 pl-12 text-muted-foreground';\n    }\n\n    if (this.accordionType() === 'bordered' || this.accordionType() === 'separated') {\n      return 'px-5 pt-0 pb-4 text-muted-foreground';\n    }\n\n    return 'mt-2 px-4 pb-4';\n  });\n\n  protected readonly iconType = computed(() => {\n    if (this.accordionType() === 'card') {\n      return this.isOpen() ? 'lucideMinus' : 'lucidePlus';\n    }\n\n    if (this.accordionType() === 'elevated') {\n      return 'lucideChevronDown';\n    }\n\n    if (this.accordionType() === 'icon-list') {\n      return 'lucidePlus';\n    }\n\n    if (this.accordionType() === 'bordered' || this.accordionType() === 'separated') {\n      return 'lucideChevronDown';\n    }\n\n    return 'lucideChevronDown';\n  });\n\n  protected readonly iconClasses = computed(() => {\n    if (this.accordionType() === 'card') {\n      return 'text-muted-foreground pointer-events-none shrink-0';\n    }\n\n    if (this.accordionType() === 'elevated') {\n      return zMergeClasses(\n        'text-muted-foreground pointer-events-none shrink-0 translate-y-0.5 transition-transform duration-200',\n        this.isOpen() ? 'rotate-0' : 'rotate-90'\n      );\n    }\n\n    if (this.accordionType() === 'icon-list') {\n      return zMergeClasses(\n        'text-muted-foreground pointer-events-none shrink-0 transition-transform duration-200',\n        this.isOpen() ? 'rotate-45' : 'rotate-0'\n      );\n    }\n\n    if (this.accordionType() === 'bordered' || this.accordionType() === 'separated') {\n      return 'text-muted-foreground pointer-events-none shrink-0 translate-y-0.5 transition-transform duration-200';\n    }\n\n    return zMergeClasses(\n      'text-muted-foreground shrink-0 transition-transform duration-200',\n      this.isOpen() ? 'rotate-180' : ''\n    );\n  });\n\n  protected readonly titleWrapperClasses = computed(() => {\n    if (this.accordionType() === 'icon-list') {\n      return 'flex items-center gap-4';\n    }\n\n    return 'flex items-center gap-2';\n  });\n\n  protected toggle(): void {\n    if (this.zDisabled()) {\n      return;\n    }\n    this._accordion.toggleItem(this.zId());\n  }\n}\n","<div\n  [class]=\"triggerClasses()\"\n  (click)=\"toggle()\"\n  (keydown.enter)=\"toggle()\"\n  (keydown.space)=\"toggle()\"\n  tabindex=\"0\"\n  role=\"button\"\n  [attr.aria-expanded]=\"isOpen()\">\n  <span [class]=\"titleWrapperClasses()\">\n    <ng-content select=\"[zAccordionIcon]\" />\n    <span>{{ zTitle() }}</span>\n  </span>\n  <z-icon [zType]=\"iconType()\" zSize=\"16\" [class]=\"iconClasses()\" />\n</div>\n\n<div [class]=\"contentClasses()\" class=\"z-accordion-content\" [class.z-accordion-content-open]=\"isOpen()\">\n  <div class=\"z-accordion-content-inner\">\n    <div [class]=\"contentInnerClasses()\">\n      <ng-content />\n    </div>\n  </div>\n</div>\n","import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  contentChildren,\n  input,\n  signal,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { zMergeClasses, zTransform } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { ZAccordionItemComponent } from './z-accordion-item.component';\nimport { zAccordionVariants, type ZAccordionVariants } from './z-accordion.variants';\n\n@Component({\n  selector: 'z-accordion',\n  standalone: true,\n  template: '<ng-content />',\n  styleUrl: './z-accordion.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'zClasses()',\n  },\n})\nexport class ZAccordionComponent {\n  public readonly class = input<ClassValue>('');\n  public readonly zType = input<ZAccordionVariants['zType']>('default');\n  public readonly zMultiple = input(false, { transform: zTransform });\n  public readonly zCollapsible = input(true, { transform: zTransform });\n\n  protected readonly items = contentChildren(ZAccordionItemComponent);\n  private readonly _openItems = signal<Set<string>>(new Set());\n\n  protected readonly zClasses = computed(() =>\n    zMergeClasses(zAccordionVariants({ zType: this.zType() }), this.class())\n  );\n\n  public isItemOpen(itemId: string): boolean {\n    return this._openItems().has(itemId);\n  }\n\n  public toggleItem(itemId: string): void {\n    const current = new Set(this._openItems());\n    const isCurrentlyOpen = current.has(itemId);\n\n    if (isCurrentlyOpen && this.zCollapsible()) {\n      current.delete(itemId);\n      this._openItems.set(current);\n      return;\n    }\n\n    if (isCurrentlyOpen) {\n      return;\n    }\n\n    if (!this.zMultiple()) {\n      current.clear();\n    }\n    current.add(itemId);\n    this._openItems.set(current);\n  }\n\n  public openItem(itemId: string): void {\n    const current = new Set(this._openItems());\n    if (!this.zMultiple()) {\n      current.clear();\n    }\n    current.add(itemId);\n    this._openItems.set(current);\n  }\n\n  public closeItem(itemId: string): void {\n    if (!this.zCollapsible()) {\n      return;\n    }\n    const current = new Set(this._openItems());\n    current.delete(itemId);\n    this._openItems.set(current);\n  }\n\n  public closeAll(): void {\n    if (!this.zCollapsible()) {\n      return;\n    }\n    this._openItems.set(new Set());\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"shival99-z-ui-components-z-accordion.mjs","sources":["../../../../libs/core-ui/components/z-accordion/z-accordion.variants.ts","../../../../libs/core-ui/components/z-accordion/z-accordion-item.component.ts","../../../../libs/core-ui/components/z-accordion/z-accordion-item.component.html","../../../../libs/core-ui/components/z-accordion/z-accordion.component.ts","../../../../libs/core-ui/components/z-accordion/shival99-z-ui-components-z-accordion.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zAccordionVariants = cva(['block w-full'], {\n  variants: {\n    zType: {\n      default: 'border border-border rounded-md overflow-hidden',\n      ghost: '',\n      outline: 'border border-border rounded-md overflow-hidden',\n      card: '',\n      elevated: 'space-y-2',\n      'icon-list': '',\n      bordered: 'rounded-md border border-border',\n      separated: 'space-y-2',\n    },\n  },\n  defaultVariants: {\n    zType: 'default',\n  },\n});\n\nexport const zAccordionItemVariants = cva(['block group transition-[box-shadow,background-color] duration-200'], {\n  variants: {\n    zType: {\n      default: 'border-b border-border last:border-b-0',\n      ghost: 'border-b border-border last:border-b-0',\n      outline: 'border-b border-border last:border-b-0',\n      card: 'last:border-b-0 rounded-md px-4 transition-colors duration-200',\n      elevated: 'last:border-b-0 rounded-md border-b-0 bg-card shadow-md',\n      'icon-list': 'border-b border-border last:border-b-0',\n      bordered: 'border-b border-border last:border-b-0',\n      separated: 'border border-border rounded-md',\n    },\n    isDisabled: {\n      true: 'cursor-not-allowed pointer-events-none opacity-50',\n      false: '',\n    },\n    isOpen: {\n      true: '',\n      false: '',\n    },\n  },\n  compoundVariants: [\n    {\n      zType: 'card',\n      isOpen: true,\n      class: 'bg-background ring-1 ring-border shadow-md',\n    },\n    {\n      zType: 'elevated',\n      isOpen: true,\n      class: 'shadow-lg',\n    },\n  ],\n  defaultVariants: {\n    zType: 'default',\n    isDisabled: false,\n    isOpen: false,\n  },\n});\n\nexport const zAccordionTriggerVariants = cva(\n  [\n    'flex w-full select-none items-center justify-between gap-4 text-sm font-medium text-left',\n    'cursor-pointer transition-[color,background-color,text-decoration-color] duration-200',\n    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n  ],\n  {\n    variants: {\n      zType: {\n        default: 'px-4 py-4 hover:bg-muted/50',\n        ghost: 'px-4 py-4 hover:bg-muted/50',\n        outline: 'px-4 py-4 hover:bg-muted/50',\n        card: 'rounded-md py-4',\n        elevated: 'items-start rounded-md px-4 py-4 hover:underline',\n        'icon-list': 'items-start px-4 py-4 [&[aria-expanded=true]>svg]:rotate-45',\n        bordered: 'items-start px-5 py-4 hover:underline [&[aria-expanded=true]>svg]:rotate-180',\n        separated: 'items-start px-5 py-4 hover:underline [&[aria-expanded=true]>svg]:rotate-180',\n      },\n      isOpen: {\n        true: 'text-foreground',\n        false: 'text-foreground',\n      },\n    },\n    defaultVariants: {\n      zType: 'default',\n      isOpen: false,\n    },\n  }\n);\n\nexport const zAccordionContentVariants = cva(['overflow-hidden text-sm'], {\n  variants: {\n    zType: {\n      default: '',\n      ghost: '',\n      outline: '',\n      card: 'text-muted-foreground',\n      elevated: 'text-muted-foreground',\n      'icon-list': 'text-muted-foreground',\n      bordered: 'text-muted-foreground',\n      separated: 'text-muted-foreground',\n    },\n    isOpen: {\n      true: '',\n      false: '',\n    },\n  },\n  defaultVariants: {\n    zType: 'default',\n    isOpen: false,\n  },\n});\n\nexport type ZAccordionVariants = VariantProps<typeof zAccordionVariants>;\nexport type ZAccordionItemVariants = VariantProps<typeof zAccordionItemVariants>;\nexport type ZAccordionTriggerVariants = VariantProps<typeof zAccordionTriggerVariants>;\nexport type ZAccordionContentVariants = VariantProps<typeof zAccordionContentVariants>;\n","import { ChangeDetectionStrategy, Component, computed, inject, input, ViewEncapsulation } from '@angular/core';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { zMergeClasses, zTransform } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { ZAccordionComponent } from './z-accordion.component';\nimport { zAccordionContentVariants, zAccordionItemVariants, zAccordionTriggerVariants } from './z-accordion.variants';\n\n@Component({\n  selector: 'z-accordion-item',\n  imports: [ZIconComponent],\n  standalone: true,\n  templateUrl: './z-accordion-item.component.html',\n  styleUrl: './z-accordion.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'itemClasses()',\n  },\n})\nexport class ZAccordionItemComponent {\n  private readonly _accordion = inject(ZAccordionComponent);\n\n  public readonly class = input<ClassValue>('');\n  public readonly zId = input.required<string>();\n  public readonly zTitle = input.required<string>();\n  public readonly zDisabled = input(false, { transform: zTransform });\n\n  protected readonly isOpen = computed(() => this._accordion.isItemOpen(this.zId()));\n  protected readonly accordionType = this._accordion.zType;\n\n  protected readonly itemClasses = computed(() =>\n    zMergeClasses(\n      zAccordionItemVariants({\n        zType: this.accordionType(),\n        isDisabled: this.zDisabled(),\n        isOpen: this.isOpen(),\n      }),\n      this.class()\n    )\n  );\n\n  protected readonly triggerClasses = computed(() =>\n    zAccordionTriggerVariants({\n      zType: this.accordionType(),\n      isOpen: this.isOpen(),\n    })\n  );\n\n  protected readonly contentClasses = computed(() =>\n    zAccordionContentVariants({\n      zType: this.accordionType(),\n      isOpen: this.isOpen(),\n    })\n  );\n\n  protected readonly contentInnerClasses = computed(() => {\n    if (this.accordionType() === 'card') {\n      return 'pt-0 pb-4';\n    }\n\n    if (this.accordionType() === 'elevated') {\n      return 'px-4 pt-0 pb-4';\n    }\n\n    if (this.accordionType() === 'icon-list') {\n      return 'px-4 pt-0 pb-4 pl-12 text-muted-foreground';\n    }\n\n    if (this.accordionType() === 'bordered' || this.accordionType() === 'separated') {\n      return 'px-5 pt-0 pb-4 text-muted-foreground';\n    }\n\n    return 'mt-2 px-4 pb-4';\n  });\n\n  protected readonly iconType = computed(() => {\n    if (this.accordionType() === 'card') {\n      return this.isOpen() ? 'lucideMinus' : 'lucidePlus';\n    }\n\n    if (this.accordionType() === 'elevated') {\n      return 'lucideChevronDown';\n    }\n\n    if (this.accordionType() === 'icon-list') {\n      return 'lucidePlus';\n    }\n\n    if (this.accordionType() === 'bordered' || this.accordionType() === 'separated') {\n      return 'lucideChevronDown';\n    }\n\n    return 'lucideChevronDown';\n  });\n\n  protected readonly iconClasses = computed(() => {\n    if (this.accordionType() === 'card') {\n      return 'text-muted-foreground pointer-events-none shrink-0';\n    }\n\n    if (this.accordionType() === 'elevated') {\n      return zMergeClasses(\n        'text-muted-foreground pointer-events-none shrink-0 translate-y-0.5 transition-transform duration-200',\n        this.isOpen() ? 'rotate-0' : 'rotate-90'\n      );\n    }\n\n    if (this.accordionType() === 'icon-list') {\n      return zMergeClasses(\n        'text-muted-foreground pointer-events-none shrink-0 transition-transform duration-200',\n        this.isOpen() ? 'rotate-45' : 'rotate-0'\n      );\n    }\n\n    if (this.accordionType() === 'bordered' || this.accordionType() === 'separated') {\n      return 'text-muted-foreground pointer-events-none shrink-0 translate-y-0.5 transition-transform duration-200';\n    }\n\n    return zMergeClasses(\n      'text-muted-foreground shrink-0 transition-transform duration-200',\n      this.isOpen() ? 'rotate-180' : ''\n    );\n  });\n\n  protected readonly titleWrapperClasses = computed(() => {\n    if (this.accordionType() === 'icon-list') {\n      return 'flex items-center gap-4';\n    }\n\n    return 'flex items-center gap-2';\n  });\n\n  protected toggle(): void {\n    if (this.zDisabled()) {\n      return;\n    }\n    this._accordion.toggleItem(this.zId());\n  }\n}\n","<div\n  [class]=\"triggerClasses()\"\n  (click)=\"toggle()\"\n  (keydown.enter)=\"toggle()\"\n  (keydown.space)=\"toggle()\"\n  tabindex=\"0\"\n  role=\"button\"\n  [attr.aria-expanded]=\"isOpen()\">\n  <span [class]=\"titleWrapperClasses()\">\n    <ng-content select=\"[zAccordionIcon]\" />\n    <span>{{ zTitle() }}</span>\n  </span>\n  <z-icon [zType]=\"iconType()\" zSize=\"16\" [class]=\"iconClasses()\" />\n</div>\n\n<div [class]=\"contentClasses()\" class=\"z-accordion-content\" [class.z-accordion-content-open]=\"isOpen()\">\n  <div class=\"z-accordion-content-inner\">\n    <div [class]=\"contentInnerClasses()\">\n      <ng-content />\n    </div>\n  </div>\n</div>\n","import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  contentChildren,\n  input,\n  signal,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { zMergeClasses, zTransform } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { ZAccordionItemComponent } from './z-accordion-item.component';\nimport { zAccordionVariants, type ZAccordionVariants } from './z-accordion.variants';\n\n@Component({\n  selector: 'z-accordion',\n  standalone: true,\n  template: '<ng-content />',\n  styleUrl: './z-accordion.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    '[class]': 'zClasses()',\n  },\n})\nexport class ZAccordionComponent {\n  public readonly class = input<ClassValue>('');\n  public readonly zType = input<ZAccordionVariants['zType']>('default');\n  public readonly zMultiple = input(false, { transform: zTransform });\n  public readonly zCollapsible = input(true, { transform: zTransform });\n\n  protected readonly items = contentChildren(ZAccordionItemComponent);\n  private readonly _openItems = signal<Set<string>>(new Set());\n\n  protected readonly zClasses = computed(() =>\n    zMergeClasses(zAccordionVariants({ zType: this.zType() }), this.class())\n  );\n\n  public isItemOpen(itemId: string): boolean {\n    return this._openItems().has(itemId);\n  }\n\n  public toggleItem(itemId: string): void {\n    const current = new Set(this._openItems());\n    const isCurrentlyOpen = current.has(itemId);\n\n    if (isCurrentlyOpen && this.zCollapsible()) {\n      current.delete(itemId);\n      this._openItems.set(current);\n      return;\n    }\n\n    if (isCurrentlyOpen) {\n      return;\n    }\n\n    if (!this.zMultiple()) {\n      current.clear();\n    }\n    current.add(itemId);\n    this._openItems.set(current);\n  }\n\n  public openItem(itemId: string): void {\n    const current = new Set(this._openItems());\n    if (!this.zMultiple()) {\n      current.clear();\n    }\n    current.add(itemId);\n    this._openItems.set(current);\n  }\n\n  public closeItem(itemId: string): void {\n    if (!this.zCollapsible()) {\n      return;\n    }\n    const current = new Set(this._openItems());\n    current.delete(itemId);\n    this._openItems.set(current);\n  }\n\n  public closeAll(): void {\n    if (!this.zCollapsible()) {\n      return;\n    }\n    this._openItems.set(new Set());\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/shival99-z-ui-components-z-autocomplete.mjs

@@ -995,7 +995,7 @@ class ZAutocompleteComponent {
                 useExisting: forwardRef(() => ZAutocompleteComponent),
                 multi: true,
             },
-        ], queries: [{ propertyName: "customOptionDirective", first: true, predicate: (ZAutocompleteOptionDirective), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerEl"], descendants: true, isSignal: true }, { propertyName: "inputRef", first: true, predicate: ["inputEl"], descendants: true, isSignal: true }, { propertyName: "dropdownTpl", first: true, predicate: ["dropdownTpl"], descendants: true, isSignal: true }, { propertyName: "virtualScrollRef", first: true, predicate: ["virtualScrollElement"], descendants: true, isSignal: true }, { propertyName: "optionsContainerRef", first: true, predicate: ["optionsContainer"], descendants: true, isSignal: true }, { propertyName: "loadMoreSentinelRef", first: true, predicate: ["loadMoreSentinel"], descendants: true, isSignal: true }, { propertyName: "virtualOptionElements", predicate: ["virtualOptionEl"], descendants: true, isSignal: true }], exportAs: ["zAutocomplete"], ngImport: i0, template: "<div class=\"z-autocomplete-wrapper relative flex w-full flex-col gap-2\">\n  @if (zLabel()) {\n    <label [for]=\"autocompleteId\" class=\"text-xs leading-none font-medium\" [class]=\"zLabelClass()\">\n      {{ zLabel() }}\n      @if (zRequired()) {\n        <span class=\"text-destructive! ml-0.5\">*</span>\n      }\n    </label>\n  }\n\n  <div\n    #triggerEl\n    z-popover\n    [zPopoverContent]=\"dropdownTpl\"\n    [zOffset]=\"0\"\n    [zDisabled]=\"isInteractionDisabled()\"\n    zPopoverWidth=\"trigger\"\n    zTrigger=\"manual\"\n    zPosition=\"bottom\"\n    zClass=\"border-0 shadow-none bg-transparent p-0\"\n    (zControl)=\"onPopoverControl($event)\"\n    (zShow)=\"onPopoverShow()\"\n    (zHideStart)=\"onPopoverHideStart()\"\n    (zHide)=\"onPopoverHideEnd()\"\n    (zPositionChange)=\"onPositionChange($event)\"\n    class=\"z-autocomplete-trigger\"\n    [class]=\"inputClasses()\"\n    [class.z-autocomplete-open]=\"uiState().isOpen\"\n    [class.z-autocomplete-open-top]=\"uiState().isOpen && isPositionTop()\"\n    [class.z-autocomplete-open-bottom]=\"uiState().isOpen && !isPositionTop()\"\n    role=\"combobox\"\n    [attr.aria-expanded]=\"uiState().isOpen\"\n    [attr.aria-haspopup]=\"'listbox'\"\n    [attr.aria-controls]=\"dropdownId\">\n    @if (zPrefix()) {\n      <z-icon [zType]=\"zPrefix() || 'lucideSearch'\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n    }\n\n    <input\n      #inputEl\n      [id]=\"autocompleteId\"\n      type=\"text\"\n      class=\"z-autocomplete-input min-w-0 flex-1 bg-transparent outline-none\"\n      [class.text-sm]=\"zSize() === 'sm' || zSize() === 'default'\"\n      [placeholder]=\"zPlaceholder()\"\n      [disabled]=\"isDisabled()\"\n      [readOnly]=\"isReadonly()\"\n      [value]=\"inputValue()\"\n      (input)=\"onInput($event)\"\n      (focus)=\"onFocus($event)\"\n      (blur)=\"onBlur($event)\"\n      (click)=\"onInputClick()\"\n      (keydown)=\"onKeydown($event)\"\n      autocomplete=\"off\"\n      autocorrect=\"off\"\n      spellcheck=\"false\" />\n\n    @if (isLoading() || isLoadingState() || isLoadingMore()) {\n      <z-icon zType=\"lucideLoaderCircle\" zSize=\"16\" class=\"text-muted-foreground shrink-0 animate-spin\" />\n    } @else {\n      @if (zAllowClear() && hasValue() && !isDisabled() && !isReadonly()) {\n        <button\n          type=\"button\"\n          class=\"text-muted-foreground hover:text-foreground flex shrink-0 cursor-pointer items-center justify-center transition-colors\"\n          (mousedown)=\"clearInput($event)\"\n          tabindex=\"-1\">\n          <z-icon zType=\"lucideX\" zSize=\"18\" class=\"cursor-pointer!\" />\n        </button>\n      }\n\n      @if (zSuffix()) {\n        <z-icon [zType]=\"zSuffix() || 'lucideSearch'\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n      }\n    }\n  </div>\n</div>\n\n<ng-template #dropdownTpl let-close=\"close\">\n  <div\n    [id]=\"dropdownId\"\n    class=\"z-autocomplete-dropdown bg-popover border-ring overflow-hidden border shadow-lg\"\n    [class.z-autocomplete-dropdown-bottom]=\"!isPositionTop()\"\n    [class.rounded-b-sm]=\"!isPositionTop()\"\n    [class.rounded-t-sm]=\"isPositionTop()\"\n    [class.border-t-0]=\"!isPositionTop()\"\n    [class.border-b-0]=\"isPositionTop()\"\n    [style.width.px]=\"dropdownWidth()\"\n    role=\"listbox\"\n    (mousedown)=\"$event.preventDefault()\">\n    @if (isLoading() || isLoadingState()) {\n      <div\n        class=\"z-autocomplete-content-state flex flex-col items-center justify-center\"\n        [style.minHeight.px]=\"effectiveHeightExpand()\">\n        <z-loading [zLoading]=\"true\" zSize=\"default\" />\n      </div>\n    } @else {\n      @if (filteredOptions().length === 0) {\n        <!-- Empty State -->\n        <div\n          class=\"z-autocomplete-content-state flex flex-col items-center justify-center p-1\"\n          [style.minHeight.px]=\"effectiveHeightExpand()\">\n          @if (inputValue().trim() !== '') {\n            <!-- Searched but no results -->\n            <z-empty [zIcon]=\"zEmptyIcon()\" zSize=\"sm\" [zMessage]=\"effectiveEmptyText()\" />\n          } @else {\n            <!-- No data initially -->\n            <z-empty [zIcon]=\"zNoDataIcon()\" zSize=\"sm\" [zMessage]=\"effectiveNoDataText()\" />\n          }\n        </div>\n      } @else if (shouldUseVirtualScroll()) {\n        <!-- Virtual Scroll Mode -->\n        <div\n          #virtualScrollElement\n          class=\"z-autocomplete-content-state z-autocomplete-options z-autocomplete-virtual-scroll relative overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n          [style.height.px]=\"effectiveHeightExpand()\">\n          <div class=\"z-autocomplete-virtual-inner relative\" [style.height.px]=\"virtualizer.getTotalSize()\">\n            @for (virtualItem of virtualizer.getVirtualItems(); track virtualItem.index) {\n              @let opt = filteredOptions()[virtualItem.index];\n              @let isActive = activeIndex() === virtualItem.index;\n              <div\n                #virtualOptionEl\n                class=\"z-autocomplete-option absolute right-0 left-0 min-w-0\"\n                [ngClass]=\"getOptionClasses(opt, virtualItem.index)\"\n                [class.items-start]=\"hasCustomOptionTemplate()\"\n                [attr.data-index]=\"virtualItem.index\"\n                [style.height.px]=\"zDynamicSize() ? null : effectiveOptionHeight()\"\n                [style.minHeight.px]=\"zDynamicSize() ? effectiveOptionHeight() : null\"\n                [style.transform]=\"'translateY(' + virtualItem.start + 'px)'\"\n                [attr.aria-selected]=\"isActive\"\n                role=\"option\"\n                (mouseenter)=\"activeIndex.set(virtualItem.index)\"\n                (click)=\"selectOption(opt)\">\n                @if (effectiveOptionTemplate()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"effectiveOptionTemplate()!; context: { $implicit: opt, active: isActive }\" />\n                } @else {\n                  @if (opt.icon) {\n                    <z-icon [zType]=\"opt.icon\" zSize=\"16\" class=\"shrink-0\" />\n                  }\n                  <div class=\"min-w-0 flex-1\">\n                    <span\n                      class=\"block min-w-0 truncate\"\n                      z-tooltip\n                      [zContent]=\"opt.label\"\n                      zPosition=\"top\"\n                      [zHideDelay]=\"0\"\n                      [zOffset]=\"5\"\n                      [zArrow]=\"false\"\n                      [zTriggerElement]=\"virtualOptionEl\"\n                      [innerHTML]=\"\n                        config().highlightMatch ? (opt.label | zHighlight: highlightQuery() | zSafeHtml) : opt.label\n                      \"></span>\n                    @if (opt.description) {\n                      <span class=\"text-muted-foreground block min-w-0 truncate text-xs\">{{ opt.description }}</span>\n                    }\n                  </div>\n                }\n              </div>\n            }\n          </div>\n        </div>\n      } @else {\n        <!-- Normal Scroll Mode -->\n        <div\n          #optionsContainer\n          class=\"z-autocomplete-content-state z-autocomplete-options flex flex-col gap-0.75 overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n          [style.minHeight.px]=\"effectiveHeightExpand()\"\n          [style.maxHeight.px]=\"effectiveHeightExpand()\">\n          @for (item of optionViews(); track item.trackKey) {\n            @let opt = item.option;\n            @let i = item.index;\n            @let isActive = activeIndex() === i;\n            <div\n              #optionEl2\n              class=\"z-autocomplete-option relative min-w-0\"\n              [ngClass]=\"getOptionClasses(opt, i)\"\n              [class.items-start]=\"hasCustomOptionTemplate()\"\n              [style.minHeight.px]=\"effectiveOptionHeight()\"\n              [attr.aria-selected]=\"isActive\"\n              role=\"option\"\n              (mouseenter)=\"activeIndex.set(i)\"\n              (click)=\"selectOption(opt)\">\n              @if (effectiveOptionTemplate()) {\n                <ng-container\n                  *ngTemplateOutlet=\"effectiveOptionTemplate()!; context: { $implicit: opt, active: isActive }\" />\n              } @else {\n                @if (opt.icon) {\n                  <z-icon [zType]=\"opt.icon\" zSize=\"16\" class=\"shrink-0\" />\n                }\n                <div class=\"min-w-0 flex-1\">\n                  <span\n                    class=\"block min-w-0 truncate\"\n                    z-tooltip\n                    [zContent]=\"opt.label\"\n                    zPosition=\"top\"\n                    [zHideDelay]=\"0\"\n                    [zOffset]=\"5\"\n                    [zArrow]=\"false\"\n                    [zTriggerElement]=\"optionEl2\"\n                    [innerHTML]=\"\n                      config().highlightMatch ? (opt.label | zHighlight: highlightQuery() | zSafeHtml) : opt.label\n                    \"></span>\n                  @if (opt.description) {\n                    <span class=\"text-muted-foreground block min-w-0 truncate text-xs\">{{ opt.description }}</span>\n                  }\n                </div>\n              }\n            </div>\n          }\n          @if (canLoadMore()) {\n            <div #loadMoreSentinel class=\"h-px w-full shrink-0\"></div>\n          }\n        </div>\n      }\n\n      @if (isLoadingMore()) {\n        <div class=\"z-autocomplete-loading-more border-border/50 flex items-center justify-center border-t py-1.5\">\n          <z-loading zSize=\"xs\" [zLoading]=\"true\" />\n        </div>\n      }\n    }\n  </div>\n</ng-template>\n", styles: [".z-autocomplete-wrapper{width:100%}.z-autocomplete-trigger{-webkit-user-select:none;user-select:none}.z-autocomplete-trigger:focus-within{outline:none}.z-autocomplete-trigger *{cursor:inherit}.z-autocomplete-input{text-overflow:ellipsis;overflow:hidden}.z-autocomplete-input::placeholder{color:hsl(var(--muted-foreground))}.z-autocomplete-input:disabled{cursor:not-allowed}.z-autocomplete-open-bottom{border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}.z-autocomplete-open-top{border-top-left-radius:0!important;border-top-right-radius:0!important}.z-autocomplete-dropdown{animation:z-autocomplete-dropdown-from-top .15s ease-out}.z-autocomplete-dropdown-bottom{animation:z-autocomplete-dropdown-from-bottom .15s ease-out}@keyframes z-autocomplete-dropdown-from-top{0%{opacity:0;transform:translateY(-.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes z-autocomplete-dropdown-from-bottom{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}.z-autocomplete-separator{display:none}.z-autocomplete-options{overflow-x:hidden!important}.z-autocomplete-scrollbar{--scrollbar-padding: 0;--scrollbar-track-color: transparent;--scrollbar-thumb-color: hsl(var(--muted-foreground) / .3);--scrollbar-thumb-hover-color: hsl(var(--muted-foreground) / .5);--scrollbar-size: 6px}.z-autocomplete-virtual-scroll .z-autocomplete-virtual-inner{width:100%}.z-autocomplete-content-state{animation:z-autocomplete-content-fade-in .15s ease-out}@keyframes z-autocomplete-content-fade-in{0%{opacity:0}to{opacity:1}}.z-autocomplete-option mark{background:transparent;color:hsl(var(--primary));font-weight:600}.z-autocomplete-option{transition:background-color .1s ease,color .1s ease}.z-autocomplete-options:not(.z-autocomplete-virtual-scroll) .z-autocomplete-option{animation:z-autocomplete-option-enter .12s ease-out;animation-fill-mode:both}@keyframes z-autocomplete-option-enter{0%{opacity:0}to{opacity:1}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "component", type: ZLoadingComponent, selector: "z-loading", inputs: ["class", "zSpinner", "zSize", "zColor", "zText", "zOverlay", "zOverlayType", "zFullscreen", "zLoading"] }, { kind: "directive", type: ZPopoverDirective, selector: "[z-popover]", inputs: ["zPopoverContent", "zPosition", "zTrigger", "zClass", "zShowDelay", "zHideDelay", "zDisabled", "zOffset", "zPopoverWidth", "zTriggerRef", "zManualClose", "zScrollClose", "zShowArrow"], outputs: ["zShow", "zHide", "zHideStart", "zControl", "zPositionChange"], exportAs: ["zPopover"] }, { kind: "directive", type: ZTooltipDirective, selector: "[z-tooltip], [zTooltip]", inputs: ["zContent", "zPosition", "zTrigger", "zTooltipType", "zTooltipSize", "zClass", "zShowDelay", "zHideDelay", "zArrow", "zDisabled", "zOffset", "zAutoDetect", "zTriggerElement", "zAlwaysShow", "zMaxWidth"], outputs: ["zShow", "zHide"], exportAs: ["zTooltip"] }, { kind: "component", type: ZEmptyComponent, selector: "z-empty", inputs: ["class", "zType", "zIcon", "zIconSize", "zSize", "zMessage", "zDescription"] }, { kind: "pipe", type: ZHighlightPipe, name: "zHighlight" }, { kind: "pipe", type: ZSafeHtmlPipe, name: "zSafeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], queries: [{ propertyName: "customOptionDirective", first: true, predicate: (ZAutocompleteOptionDirective), descendants: true, isSignal: true }], viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerEl"], descendants: true, isSignal: true }, { propertyName: "inputRef", first: true, predicate: ["inputEl"], descendants: true, isSignal: true }, { propertyName: "dropdownTpl", first: true, predicate: ["dropdownTpl"], descendants: true, isSignal: true }, { propertyName: "virtualScrollRef", first: true, predicate: ["virtualScrollElement"], descendants: true, isSignal: true }, { propertyName: "optionsContainerRef", first: true, predicate: ["optionsContainer"], descendants: true, isSignal: true }, { propertyName: "loadMoreSentinelRef", first: true, predicate: ["loadMoreSentinel"], descendants: true, isSignal: true }, { propertyName: "virtualOptionElements", predicate: ["virtualOptionEl"], descendants: true, isSignal: true }], exportAs: ["zAutocomplete"], ngImport: i0, template: "<div class=\"z-autocomplete-wrapper relative flex w-full flex-col gap-2\">\n  @if (zLabel()) {\n    <label [for]=\"autocompleteId\" class=\"text-xs leading-none font-medium\" [class]=\"zLabelClass()\">\n      {{ zLabel() }}\n      @if (zRequired()) {\n        <span class=\"text-destructive! ml-0.5\">*</span>\n      }\n    </label>\n  }\n\n  <div\n    #triggerEl\n    z-popover\n    [zPopoverContent]=\"dropdownTpl\"\n    [zOffset]=\"0\"\n    [zDisabled]=\"isInteractionDisabled()\"\n    zPopoverWidth=\"trigger\"\n    zTrigger=\"manual\"\n    zPosition=\"bottom\"\n    zClass=\"border-0 shadow-none bg-transparent p-0\"\n    (zControl)=\"onPopoverControl($event)\"\n    (zShow)=\"onPopoverShow()\"\n    (zHideStart)=\"onPopoverHideStart()\"\n    (zHide)=\"onPopoverHideEnd()\"\n    (zPositionChange)=\"onPositionChange($event)\"\n    class=\"z-autocomplete-trigger\"\n    [class]=\"inputClasses()\"\n    [class.z-autocomplete-open]=\"uiState().isOpen\"\n    [class.z-autocomplete-open-top]=\"uiState().isOpen && isPositionTop()\"\n    [class.z-autocomplete-open-bottom]=\"uiState().isOpen && !isPositionTop()\"\n    role=\"combobox\"\n    [attr.aria-expanded]=\"uiState().isOpen\"\n    [attr.aria-haspopup]=\"'listbox'\"\n    [attr.aria-controls]=\"dropdownId\">\n    @if (zPrefix()) {\n      <z-icon [zType]=\"zPrefix() || 'lucideSearch'\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n    }\n\n    <input\n      #inputEl\n      [id]=\"autocompleteId\"\n      type=\"text\"\n      class=\"z-autocomplete-input placeholder:text-muted-foreground min-w-0 flex-1 overflow-hidden bg-transparent text-ellipsis whitespace-nowrap outline-none\"\n      [class.text-sm]=\"zSize() === 'sm' || zSize() === 'default'\"\n      [placeholder]=\"zPlaceholder()\"\n      [disabled]=\"isDisabled()\"\n      [readOnly]=\"isReadonly()\"\n      [value]=\"inputValue()\"\n      (input)=\"onInput($event)\"\n      (focus)=\"onFocus($event)\"\n      (blur)=\"onBlur($event)\"\n      (click)=\"onInputClick()\"\n      (keydown)=\"onKeydown($event)\"\n      autocomplete=\"off\"\n      autocorrect=\"off\"\n      spellcheck=\"false\" />\n\n    @if (isLoading() || isLoadingState() || isLoadingMore()) {\n      <z-icon zType=\"lucideLoaderCircle\" zSize=\"16\" class=\"text-muted-foreground shrink-0 animate-spin\" />\n    } @else {\n      @if (zAllowClear() && hasValue() && !isDisabled() && !isReadonly()) {\n        <button\n          type=\"button\"\n          class=\"text-muted-foreground hover:text-foreground flex shrink-0 cursor-pointer items-center justify-center transition-colors\"\n          (mousedown)=\"clearInput($event)\"\n          tabindex=\"-1\">\n          <z-icon zType=\"lucideX\" zSize=\"18\" class=\"cursor-pointer!\" />\n        </button>\n      }\n\n      @if (zSuffix()) {\n        <z-icon [zType]=\"zSuffix() || 'lucideSearch'\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n      }\n    }\n  </div>\n</div>\n\n<ng-template #dropdownTpl let-close=\"close\">\n  <div\n    [id]=\"dropdownId\"\n    class=\"z-autocomplete-dropdown bg-popover border-ring overflow-hidden border shadow-lg\"\n    [class.z-autocomplete-dropdown-bottom]=\"!isPositionTop()\"\n    [class.rounded-b-sm]=\"!isPositionTop()\"\n    [class.rounded-t-sm]=\"isPositionTop()\"\n    [class.border-t-0]=\"!isPositionTop()\"\n    [class.border-b-0]=\"isPositionTop()\"\n    [style.width.px]=\"dropdownWidth()\"\n    role=\"listbox\"\n    (mousedown)=\"$event.preventDefault()\">\n    @if (isLoading() || isLoadingState()) {\n      <div\n        class=\"z-autocomplete-content-state flex flex-col items-center justify-center\"\n        [style.minHeight.px]=\"effectiveHeightExpand()\">\n        <z-loading [zLoading]=\"true\" zSize=\"default\" />\n      </div>\n    } @else {\n      @if (filteredOptions().length === 0) {\n        <!-- Empty State -->\n        <div\n          class=\"z-autocomplete-content-state flex flex-col items-center justify-center p-1\"\n          [style.minHeight.px]=\"effectiveHeightExpand()\">\n          @if (inputValue().trim() !== '') {\n            <!-- Searched but no results -->\n            <z-empty [zIcon]=\"zEmptyIcon()\" zSize=\"sm\" [zMessage]=\"effectiveEmptyText()\" />\n          } @else {\n            <!-- No data initially -->\n            <z-empty [zIcon]=\"zNoDataIcon()\" zSize=\"sm\" [zMessage]=\"effectiveNoDataText()\" />\n          }\n        </div>\n      } @else if (shouldUseVirtualScroll()) {\n        <!-- Virtual Scroll Mode -->\n        <div\n          #virtualScrollElement\n          class=\"z-autocomplete-content-state z-autocomplete-options z-autocomplete-virtual-scroll relative overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n          [style.height.px]=\"effectiveHeightExpand()\">\n          <div class=\"z-autocomplete-virtual-inner relative\" [style.height.px]=\"virtualizer.getTotalSize()\">\n            @for (virtualItem of virtualizer.getVirtualItems(); track virtualItem.index) {\n              @let opt = filteredOptions()[virtualItem.index];\n              @let isActive = activeIndex() === virtualItem.index;\n              <div\n                #virtualOptionEl\n                class=\"z-autocomplete-option absolute right-0 left-0 min-w-0\"\n                [ngClass]=\"getOptionClasses(opt, virtualItem.index)\"\n                [class.items-start]=\"hasCustomOptionTemplate()\"\n                [attr.data-index]=\"virtualItem.index\"\n                [style.height.px]=\"zDynamicSize() ? null : effectiveOptionHeight()\"\n                [style.minHeight.px]=\"zDynamicSize() ? effectiveOptionHeight() : null\"\n                [style.transform]=\"'translateY(' + virtualItem.start + 'px)'\"\n                [attr.aria-selected]=\"isActive\"\n                role=\"option\"\n                (mouseenter)=\"activeIndex.set(virtualItem.index)\"\n                (click)=\"selectOption(opt)\">\n                @if (effectiveOptionTemplate()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"effectiveOptionTemplate()!; context: { $implicit: opt, active: isActive }\" />\n                } @else {\n                  @if (opt.icon) {\n                    <z-icon [zType]=\"opt.icon\" zSize=\"16\" class=\"shrink-0\" />\n                  }\n                  <div class=\"min-w-0 flex-1\">\n                    <span\n                      class=\"block min-w-0 truncate\"\n                      z-tooltip\n                      [zContent]=\"opt.label\"\n                      zPosition=\"top\"\n                      [zHideDelay]=\"0\"\n                      [zOffset]=\"5\"\n                      [zArrow]=\"false\"\n                      [zTriggerElement]=\"virtualOptionEl\"\n                      [innerHTML]=\"\n                        config().highlightMatch ? (opt.label | zHighlight: highlightQuery() | zSafeHtml) : opt.label\n                      \"></span>\n                    @if (opt.description) {\n                      <span class=\"text-muted-foreground block min-w-0 truncate text-xs\">{{ opt.description }}</span>\n                    }\n                  </div>\n                }\n              </div>\n            }\n          </div>\n        </div>\n      } @else {\n        <!-- Normal Scroll Mode -->\n        <div\n          #optionsContainer\n          class=\"z-autocomplete-content-state z-autocomplete-options flex flex-col gap-0.75 overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n          [style.minHeight.px]=\"effectiveHeightExpand()\"\n          [style.maxHeight.px]=\"effectiveHeightExpand()\">\n          @for (item of optionViews(); track item.trackKey) {\n            @let opt = item.option;\n            @let i = item.index;\n            @let isActive = activeIndex() === i;\n            <div\n              #optionEl2\n              class=\"z-autocomplete-option relative min-w-0\"\n              [ngClass]=\"getOptionClasses(opt, i)\"\n              [class.items-start]=\"hasCustomOptionTemplate()\"\n              [style.minHeight.px]=\"effectiveOptionHeight()\"\n              [attr.aria-selected]=\"isActive\"\n              role=\"option\"\n              (mouseenter)=\"activeIndex.set(i)\"\n              (click)=\"selectOption(opt)\">\n              @if (effectiveOptionTemplate()) {\n                <ng-container\n                  *ngTemplateOutlet=\"effectiveOptionTemplate()!; context: { $implicit: opt, active: isActive }\" />\n              } @else {\n                @if (opt.icon) {\n                  <z-icon [zType]=\"opt.icon\" zSize=\"16\" class=\"shrink-0\" />\n                }\n                <div class=\"min-w-0 flex-1\">\n                  <span\n                    class=\"block min-w-0 truncate\"\n                    z-tooltip\n                    [zContent]=\"opt.label\"\n                    zPosition=\"top\"\n                    [zHideDelay]=\"0\"\n                    [zOffset]=\"5\"\n                    [zArrow]=\"false\"\n                    [zTriggerElement]=\"optionEl2\"\n                    [innerHTML]=\"\n                      config().highlightMatch ? (opt.label | zHighlight: highlightQuery() | zSafeHtml) : opt.label\n                    \"></span>\n                  @if (opt.description) {\n                    <span class=\"text-muted-foreground block min-w-0 truncate text-xs\">{{ opt.description }}</span>\n                  }\n                </div>\n              }\n            </div>\n          }\n          @if (canLoadMore()) {\n            <div #loadMoreSentinel class=\"h-px w-full shrink-0\"></div>\n          }\n        </div>\n      }\n\n      @if (isLoadingMore()) {\n        <div class=\"z-autocomplete-loading-more border-border/50 flex items-center justify-center border-t py-1.5\">\n          <z-loading zSize=\"xs\" [zLoading]=\"true\" />\n        </div>\n      }\n    }\n  </div>\n</ng-template>\n", styles: [".z-autocomplete-wrapper{width:100%}.z-autocomplete-trigger{-webkit-user-select:none;user-select:none}.z-autocomplete-trigger:focus-within{outline:none}.z-autocomplete-trigger *{cursor:inherit}.z-autocomplete-input{text-overflow:ellipsis;overflow:hidden}.z-autocomplete-input::placeholder{color:hsl(var(--muted-foreground))}.z-autocomplete-input:disabled{cursor:not-allowed}.z-autocomplete-open-bottom{border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}.z-autocomplete-open-top{border-top-left-radius:0!important;border-top-right-radius:0!important}.z-autocomplete-dropdown{animation:z-autocomplete-dropdown-from-top .15s ease-out}.z-autocomplete-dropdown-bottom{animation:z-autocomplete-dropdown-from-bottom .15s ease-out}@keyframes z-autocomplete-dropdown-from-top{0%{opacity:0;transform:translateY(-.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes z-autocomplete-dropdown-from-bottom{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}.z-autocomplete-separator{display:none}.z-autocomplete-options{overflow-x:hidden!important}.z-autocomplete-scrollbar{--scrollbar-padding: 0;--scrollbar-track-color: transparent;--scrollbar-thumb-color: hsl(var(--muted-foreground) / .3);--scrollbar-thumb-hover-color: hsl(var(--muted-foreground) / .5);--scrollbar-size: 6px}.z-autocomplete-virtual-scroll .z-autocomplete-virtual-inner{width:100%}.z-autocomplete-content-state{animation:z-autocomplete-content-fade-in .15s ease-out}@keyframes z-autocomplete-content-fade-in{0%{opacity:0}to{opacity:1}}.z-autocomplete-option mark{background:transparent;color:hsl(var(--primary));font-weight:600}.z-autocomplete-option{transition:background-color .1s ease,color .1s ease}.z-autocomplete-options:not(.z-autocomplete-virtual-scroll) .z-autocomplete-option{animation:z-autocomplete-option-enter .12s ease-out;animation-fill-mode:both}@keyframes z-autocomplete-option-enter{0%{opacity:0}to{opacity:1}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "component", type: ZLoadingComponent, selector: "z-loading", inputs: ["class", "zSpinner", "zSize", "zColor", "zText", "zOverlay", "zOverlayType", "zFullscreen", "zLoading"] }, { kind: "directive", type: ZPopoverDirective, selector: "[z-popover]", inputs: ["zPopoverContent", "zPosition", "zTrigger", "zClass", "zShowDelay", "zHideDelay", "zDisabled", "zOffset", "zPopoverWidth", "zTriggerRef", "zManualClose", "zOutsideClickClose", "zScrollClose", "zShowArrow"], outputs: ["zShow", "zHide", "zHideStart", "zControl", "zPositionChange"], exportAs: ["zPopover"] }, { kind: "directive", type: ZTooltipDirective, selector: "[z-tooltip], [zTooltip]", inputs: ["zContent", "zPosition", "zTrigger", "zTooltipType", "zTooltipSize", "zClass", "zShowDelay", "zHideDelay", "zArrow", "zDisabled", "zOffset", "zAutoDetect", "zTriggerElement", "zAlwaysShow", "zMaxWidth"], outputs: ["zShow", "zHide"], exportAs: ["zTooltip"] }, { kind: "component", type: ZEmptyComponent, selector: "z-empty", inputs: ["class", "zType", "zIcon", "zIconSize", "zSize", "zMessage", "zDescription"] }, { kind: "pipe", type: ZHighlightPipe, name: "zHighlight" }, { kind: "pipe", type: ZSafeHtmlPipe, name: "zSafeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZAutocompleteComponent, decorators: [{
             type: Component,
@@ -1016,7 +1016,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
                             useExisting: forwardRef(() => ZAutocompleteComponent),
                             multi: true,
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, exportAs: 'zAutocomplete', template: "<div class=\"z-autocomplete-wrapper relative flex w-full flex-col gap-2\">\n  @if (zLabel()) {\n    <label [for]=\"autocompleteId\" class=\"text-xs leading-none font-medium\" [class]=\"zLabelClass()\">\n      {{ zLabel() }}\n      @if (zRequired()) {\n        <span class=\"text-destructive! ml-0.5\">*</span>\n      }\n    </label>\n  }\n\n  <div\n    #triggerEl\n    z-popover\n    [zPopoverContent]=\"dropdownTpl\"\n    [zOffset]=\"0\"\n    [zDisabled]=\"isInteractionDisabled()\"\n    zPopoverWidth=\"trigger\"\n    zTrigger=\"manual\"\n    zPosition=\"bottom\"\n    zClass=\"border-0 shadow-none bg-transparent p-0\"\n    (zControl)=\"onPopoverControl($event)\"\n    (zShow)=\"onPopoverShow()\"\n    (zHideStart)=\"onPopoverHideStart()\"\n    (zHide)=\"onPopoverHideEnd()\"\n    (zPositionChange)=\"onPositionChange($event)\"\n    class=\"z-autocomplete-trigger\"\n    [class]=\"inputClasses()\"\n    [class.z-autocomplete-open]=\"uiState().isOpen\"\n    [class.z-autocomplete-open-top]=\"uiState().isOpen && isPositionTop()\"\n    [class.z-autocomplete-open-bottom]=\"uiState().isOpen && !isPositionTop()\"\n    role=\"combobox\"\n    [attr.aria-expanded]=\"uiState().isOpen\"\n    [attr.aria-haspopup]=\"'listbox'\"\n    [attr.aria-controls]=\"dropdownId\">\n    @if (zPrefix()) {\n      <z-icon [zType]=\"zPrefix() || 'lucideSearch'\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n    }\n\n    <input\n      #inputEl\n      [id]=\"autocompleteId\"\n      type=\"text\"\n      class=\"z-autocomplete-input min-w-0 flex-1 bg-transparent outline-none\"\n      [class.text-sm]=\"zSize() === 'sm' || zSize() === 'default'\"\n      [placeholder]=\"zPlaceholder()\"\n      [disabled]=\"isDisabled()\"\n      [readOnly]=\"isReadonly()\"\n      [value]=\"inputValue()\"\n      (input)=\"onInput($event)\"\n      (focus)=\"onFocus($event)\"\n      (blur)=\"onBlur($event)\"\n      (click)=\"onInputClick()\"\n      (keydown)=\"onKeydown($event)\"\n      autocomplete=\"off\"\n      autocorrect=\"off\"\n      spellcheck=\"false\" />\n\n    @if (isLoading() || isLoadingState() || isLoadingMore()) {\n      <z-icon zType=\"lucideLoaderCircle\" zSize=\"16\" class=\"text-muted-foreground shrink-0 animate-spin\" />\n    } @else {\n      @if (zAllowClear() && hasValue() && !isDisabled() && !isReadonly()) {\n        <button\n          type=\"button\"\n          class=\"text-muted-foreground hover:text-foreground flex shrink-0 cursor-pointer items-center justify-center transition-colors\"\n          (mousedown)=\"clearInput($event)\"\n          tabindex=\"-1\">\n          <z-icon zType=\"lucideX\" zSize=\"18\" class=\"cursor-pointer!\" />\n        </button>\n      }\n\n      @if (zSuffix()) {\n        <z-icon [zType]=\"zSuffix() || 'lucideSearch'\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n      }\n    }\n  </div>\n</div>\n\n<ng-template #dropdownTpl let-close=\"close\">\n  <div\n    [id]=\"dropdownId\"\n    class=\"z-autocomplete-dropdown bg-popover border-ring overflow-hidden border shadow-lg\"\n    [class.z-autocomplete-dropdown-bottom]=\"!isPositionTop()\"\n    [class.rounded-b-sm]=\"!isPositionTop()\"\n    [class.rounded-t-sm]=\"isPositionTop()\"\n    [class.border-t-0]=\"!isPositionTop()\"\n    [class.border-b-0]=\"isPositionTop()\"\n    [style.width.px]=\"dropdownWidth()\"\n    role=\"listbox\"\n    (mousedown)=\"$event.preventDefault()\">\n    @if (isLoading() || isLoadingState()) {\n      <div\n        class=\"z-autocomplete-content-state flex flex-col items-center justify-center\"\n        [style.minHeight.px]=\"effectiveHeightExpand()\">\n        <z-loading [zLoading]=\"true\" zSize=\"default\" />\n      </div>\n    } @else {\n      @if (filteredOptions().length === 0) {\n        <!-- Empty State -->\n        <div\n          class=\"z-autocomplete-content-state flex flex-col items-center justify-center p-1\"\n          [style.minHeight.px]=\"effectiveHeightExpand()\">\n          @if (inputValue().trim() !== '') {\n            <!-- Searched but no results -->\n            <z-empty [zIcon]=\"zEmptyIcon()\" zSize=\"sm\" [zMessage]=\"effectiveEmptyText()\" />\n          } @else {\n            <!-- No data initially -->\n            <z-empty [zIcon]=\"zNoDataIcon()\" zSize=\"sm\" [zMessage]=\"effectiveNoDataText()\" />\n          }\n        </div>\n      } @else if (shouldUseVirtualScroll()) {\n        <!-- Virtual Scroll Mode -->\n        <div\n          #virtualScrollElement\n          class=\"z-autocomplete-content-state z-autocomplete-options z-autocomplete-virtual-scroll relative overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n          [style.height.px]=\"effectiveHeightExpand()\">\n          <div class=\"z-autocomplete-virtual-inner relative\" [style.height.px]=\"virtualizer.getTotalSize()\">\n            @for (virtualItem of virtualizer.getVirtualItems(); track virtualItem.index) {\n              @let opt = filteredOptions()[virtualItem.index];\n              @let isActive = activeIndex() === virtualItem.index;\n              <div\n                #virtualOptionEl\n                class=\"z-autocomplete-option absolute right-0 left-0 min-w-0\"\n                [ngClass]=\"getOptionClasses(opt, virtualItem.index)\"\n                [class.items-start]=\"hasCustomOptionTemplate()\"\n                [attr.data-index]=\"virtualItem.index\"\n                [style.height.px]=\"zDynamicSize() ? null : effectiveOptionHeight()\"\n                [style.minHeight.px]=\"zDynamicSize() ? effectiveOptionHeight() : null\"\n                [style.transform]=\"'translateY(' + virtualItem.start + 'px)'\"\n                [attr.aria-selected]=\"isActive\"\n                role=\"option\"\n                (mouseenter)=\"activeIndex.set(virtualItem.index)\"\n                (click)=\"selectOption(opt)\">\n                @if (effectiveOptionTemplate()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"effectiveOptionTemplate()!; context: { $implicit: opt, active: isActive }\" />\n                } @else {\n                  @if (opt.icon) {\n                    <z-icon [zType]=\"opt.icon\" zSize=\"16\" class=\"shrink-0\" />\n                  }\n                  <div class=\"min-w-0 flex-1\">\n                    <span\n                      class=\"block min-w-0 truncate\"\n                      z-tooltip\n                      [zContent]=\"opt.label\"\n                      zPosition=\"top\"\n                      [zHideDelay]=\"0\"\n                      [zOffset]=\"5\"\n                      [zArrow]=\"false\"\n                      [zTriggerElement]=\"virtualOptionEl\"\n                      [innerHTML]=\"\n                        config().highlightMatch ? (opt.label | zHighlight: highlightQuery() | zSafeHtml) : opt.label\n                      \"></span>\n                    @if (opt.description) {\n                      <span class=\"text-muted-foreground block min-w-0 truncate text-xs\">{{ opt.description }}</span>\n                    }\n                  </div>\n                }\n              </div>\n            }\n          </div>\n        </div>\n      } @else {\n        <!-- Normal Scroll Mode -->\n        <div\n          #optionsContainer\n          class=\"z-autocomplete-content-state z-autocomplete-options flex flex-col gap-0.75 overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n          [style.minHeight.px]=\"effectiveHeightExpand()\"\n          [style.maxHeight.px]=\"effectiveHeightExpand()\">\n          @for (item of optionViews(); track item.trackKey) {\n            @let opt = item.option;\n            @let i = item.index;\n            @let isActive = activeIndex() === i;\n            <div\n              #optionEl2\n              class=\"z-autocomplete-option relative min-w-0\"\n              [ngClass]=\"getOptionClasses(opt, i)\"\n              [class.items-start]=\"hasCustomOptionTemplate()\"\n              [style.minHeight.px]=\"effectiveOptionHeight()\"\n              [attr.aria-selected]=\"isActive\"\n              role=\"option\"\n              (mouseenter)=\"activeIndex.set(i)\"\n              (click)=\"selectOption(opt)\">\n              @if (effectiveOptionTemplate()) {\n                <ng-container\n                  *ngTemplateOutlet=\"effectiveOptionTemplate()!; context: { $implicit: opt, active: isActive }\" />\n              } @else {\n                @if (opt.icon) {\n                  <z-icon [zType]=\"opt.icon\" zSize=\"16\" class=\"shrink-0\" />\n                }\n                <div class=\"min-w-0 flex-1\">\n                  <span\n                    class=\"block min-w-0 truncate\"\n                    z-tooltip\n                    [zContent]=\"opt.label\"\n                    zPosition=\"top\"\n                    [zHideDelay]=\"0\"\n                    [zOffset]=\"5\"\n                    [zArrow]=\"false\"\n                    [zTriggerElement]=\"optionEl2\"\n                    [innerHTML]=\"\n                      config().highlightMatch ? (opt.label | zHighlight: highlightQuery() | zSafeHtml) : opt.label\n                    \"></span>\n                  @if (opt.description) {\n                    <span class=\"text-muted-foreground block min-w-0 truncate text-xs\">{{ opt.description }}</span>\n                  }\n                </div>\n              }\n            </div>\n          }\n          @if (canLoadMore()) {\n            <div #loadMoreSentinel class=\"h-px w-full shrink-0\"></div>\n          }\n        </div>\n      }\n\n      @if (isLoadingMore()) {\n        <div class=\"z-autocomplete-loading-more border-border/50 flex items-center justify-center border-t py-1.5\">\n          <z-loading zSize=\"xs\" [zLoading]=\"true\" />\n        </div>\n      }\n    }\n  </div>\n</ng-template>\n", styles: [".z-autocomplete-wrapper{width:100%}.z-autocomplete-trigger{-webkit-user-select:none;user-select:none}.z-autocomplete-trigger:focus-within{outline:none}.z-autocomplete-trigger *{cursor:inherit}.z-autocomplete-input{text-overflow:ellipsis;overflow:hidden}.z-autocomplete-input::placeholder{color:hsl(var(--muted-foreground))}.z-autocomplete-input:disabled{cursor:not-allowed}.z-autocomplete-open-bottom{border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}.z-autocomplete-open-top{border-top-left-radius:0!important;border-top-right-radius:0!important}.z-autocomplete-dropdown{animation:z-autocomplete-dropdown-from-top .15s ease-out}.z-autocomplete-dropdown-bottom{animation:z-autocomplete-dropdown-from-bottom .15s ease-out}@keyframes z-autocomplete-dropdown-from-top{0%{opacity:0;transform:translateY(-.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes z-autocomplete-dropdown-from-bottom{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}.z-autocomplete-separator{display:none}.z-autocomplete-options{overflow-x:hidden!important}.z-autocomplete-scrollbar{--scrollbar-padding: 0;--scrollbar-track-color: transparent;--scrollbar-thumb-color: hsl(var(--muted-foreground) / .3);--scrollbar-thumb-hover-color: hsl(var(--muted-foreground) / .5);--scrollbar-size: 6px}.z-autocomplete-virtual-scroll .z-autocomplete-virtual-inner{width:100%}.z-autocomplete-content-state{animation:z-autocomplete-content-fade-in .15s ease-out}@keyframes z-autocomplete-content-fade-in{0%{opacity:0}to{opacity:1}}.z-autocomplete-option mark{background:transparent;color:hsl(var(--primary));font-weight:600}.z-autocomplete-option{transition:background-color .1s ease,color .1s ease}.z-autocomplete-options:not(.z-autocomplete-virtual-scroll) .z-autocomplete-option{animation:z-autocomplete-option-enter .12s ease-out;animation-fill-mode:both}@keyframes z-autocomplete-option-enter{0%{opacity:0}to{opacity:1}}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, exportAs: 'zAutocomplete', template: "<div class=\"z-autocomplete-wrapper relative flex w-full flex-col gap-2\">\n  @if (zLabel()) {\n    <label [for]=\"autocompleteId\" class=\"text-xs leading-none font-medium\" [class]=\"zLabelClass()\">\n      {{ zLabel() }}\n      @if (zRequired()) {\n        <span class=\"text-destructive! ml-0.5\">*</span>\n      }\n    </label>\n  }\n\n  <div\n    #triggerEl\n    z-popover\n    [zPopoverContent]=\"dropdownTpl\"\n    [zOffset]=\"0\"\n    [zDisabled]=\"isInteractionDisabled()\"\n    zPopoverWidth=\"trigger\"\n    zTrigger=\"manual\"\n    zPosition=\"bottom\"\n    zClass=\"border-0 shadow-none bg-transparent p-0\"\n    (zControl)=\"onPopoverControl($event)\"\n    (zShow)=\"onPopoverShow()\"\n    (zHideStart)=\"onPopoverHideStart()\"\n    (zHide)=\"onPopoverHideEnd()\"\n    (zPositionChange)=\"onPositionChange($event)\"\n    class=\"z-autocomplete-trigger\"\n    [class]=\"inputClasses()\"\n    [class.z-autocomplete-open]=\"uiState().isOpen\"\n    [class.z-autocomplete-open-top]=\"uiState().isOpen && isPositionTop()\"\n    [class.z-autocomplete-open-bottom]=\"uiState().isOpen && !isPositionTop()\"\n    role=\"combobox\"\n    [attr.aria-expanded]=\"uiState().isOpen\"\n    [attr.aria-haspopup]=\"'listbox'\"\n    [attr.aria-controls]=\"dropdownId\">\n    @if (zPrefix()) {\n      <z-icon [zType]=\"zPrefix() || 'lucideSearch'\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n    }\n\n    <input\n      #inputEl\n      [id]=\"autocompleteId\"\n      type=\"text\"\n      class=\"z-autocomplete-input placeholder:text-muted-foreground min-w-0 flex-1 overflow-hidden bg-transparent text-ellipsis whitespace-nowrap outline-none\"\n      [class.text-sm]=\"zSize() === 'sm' || zSize() === 'default'\"\n      [placeholder]=\"zPlaceholder()\"\n      [disabled]=\"isDisabled()\"\n      [readOnly]=\"isReadonly()\"\n      [value]=\"inputValue()\"\n      (input)=\"onInput($event)\"\n      (focus)=\"onFocus($event)\"\n      (blur)=\"onBlur($event)\"\n      (click)=\"onInputClick()\"\n      (keydown)=\"onKeydown($event)\"\n      autocomplete=\"off\"\n      autocorrect=\"off\"\n      spellcheck=\"false\" />\n\n    @if (isLoading() || isLoadingState() || isLoadingMore()) {\n      <z-icon zType=\"lucideLoaderCircle\" zSize=\"16\" class=\"text-muted-foreground shrink-0 animate-spin\" />\n    } @else {\n      @if (zAllowClear() && hasValue() && !isDisabled() && !isReadonly()) {\n        <button\n          type=\"button\"\n          class=\"text-muted-foreground hover:text-foreground flex shrink-0 cursor-pointer items-center justify-center transition-colors\"\n          (mousedown)=\"clearInput($event)\"\n          tabindex=\"-1\">\n          <z-icon zType=\"lucideX\" zSize=\"18\" class=\"cursor-pointer!\" />\n        </button>\n      }\n\n      @if (zSuffix()) {\n        <z-icon [zType]=\"zSuffix() || 'lucideSearch'\" zSize=\"16\" class=\"text-muted-foreground shrink-0\" />\n      }\n    }\n  </div>\n</div>\n\n<ng-template #dropdownTpl let-close=\"close\">\n  <div\n    [id]=\"dropdownId\"\n    class=\"z-autocomplete-dropdown bg-popover border-ring overflow-hidden border shadow-lg\"\n    [class.z-autocomplete-dropdown-bottom]=\"!isPositionTop()\"\n    [class.rounded-b-sm]=\"!isPositionTop()\"\n    [class.rounded-t-sm]=\"isPositionTop()\"\n    [class.border-t-0]=\"!isPositionTop()\"\n    [class.border-b-0]=\"isPositionTop()\"\n    [style.width.px]=\"dropdownWidth()\"\n    role=\"listbox\"\n    (mousedown)=\"$event.preventDefault()\">\n    @if (isLoading() || isLoadingState()) {\n      <div\n        class=\"z-autocomplete-content-state flex flex-col items-center justify-center\"\n        [style.minHeight.px]=\"effectiveHeightExpand()\">\n        <z-loading [zLoading]=\"true\" zSize=\"default\" />\n      </div>\n    } @else {\n      @if (filteredOptions().length === 0) {\n        <!-- Empty State -->\n        <div\n          class=\"z-autocomplete-content-state flex flex-col items-center justify-center p-1\"\n          [style.minHeight.px]=\"effectiveHeightExpand()\">\n          @if (inputValue().trim() !== '') {\n            <!-- Searched but no results -->\n            <z-empty [zIcon]=\"zEmptyIcon()\" zSize=\"sm\" [zMessage]=\"effectiveEmptyText()\" />\n          } @else {\n            <!-- No data initially -->\n            <z-empty [zIcon]=\"zNoDataIcon()\" zSize=\"sm\" [zMessage]=\"effectiveNoDataText()\" />\n          }\n        </div>\n      } @else if (shouldUseVirtualScroll()) {\n        <!-- Virtual Scroll Mode -->\n        <div\n          #virtualScrollElement\n          class=\"z-autocomplete-content-state z-autocomplete-options z-autocomplete-virtual-scroll relative overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n          [style.height.px]=\"effectiveHeightExpand()\">\n          <div class=\"z-autocomplete-virtual-inner relative\" [style.height.px]=\"virtualizer.getTotalSize()\">\n            @for (virtualItem of virtualizer.getVirtualItems(); track virtualItem.index) {\n              @let opt = filteredOptions()[virtualItem.index];\n              @let isActive = activeIndex() === virtualItem.index;\n              <div\n                #virtualOptionEl\n                class=\"z-autocomplete-option absolute right-0 left-0 min-w-0\"\n                [ngClass]=\"getOptionClasses(opt, virtualItem.index)\"\n                [class.items-start]=\"hasCustomOptionTemplate()\"\n                [attr.data-index]=\"virtualItem.index\"\n                [style.height.px]=\"zDynamicSize() ? null : effectiveOptionHeight()\"\n                [style.minHeight.px]=\"zDynamicSize() ? effectiveOptionHeight() : null\"\n                [style.transform]=\"'translateY(' + virtualItem.start + 'px)'\"\n                [attr.aria-selected]=\"isActive\"\n                role=\"option\"\n                (mouseenter)=\"activeIndex.set(virtualItem.index)\"\n                (click)=\"selectOption(opt)\">\n                @if (effectiveOptionTemplate()) {\n                  <ng-container\n                    *ngTemplateOutlet=\"effectiveOptionTemplate()!; context: { $implicit: opt, active: isActive }\" />\n                } @else {\n                  @if (opt.icon) {\n                    <z-icon [zType]=\"opt.icon\" zSize=\"16\" class=\"shrink-0\" />\n                  }\n                  <div class=\"min-w-0 flex-1\">\n                    <span\n                      class=\"block min-w-0 truncate\"\n                      z-tooltip\n                      [zContent]=\"opt.label\"\n                      zPosition=\"top\"\n                      [zHideDelay]=\"0\"\n                      [zOffset]=\"5\"\n                      [zArrow]=\"false\"\n                      [zTriggerElement]=\"virtualOptionEl\"\n                      [innerHTML]=\"\n                        config().highlightMatch ? (opt.label | zHighlight: highlightQuery() | zSafeHtml) : opt.label\n                      \"></span>\n                    @if (opt.description) {\n                      <span class=\"text-muted-foreground block min-w-0 truncate text-xs\">{{ opt.description }}</span>\n                    }\n                  </div>\n                }\n              </div>\n            }\n          </div>\n        </div>\n      } @else {\n        <!-- Normal Scroll Mode -->\n        <div\n          #optionsContainer\n          class=\"z-autocomplete-content-state z-autocomplete-options flex flex-col gap-0.75 overflow-x-hidden overflow-y-auto overscroll-y-contain p-1\"\n          [style.minHeight.px]=\"effectiveHeightExpand()\"\n          [style.maxHeight.px]=\"effectiveHeightExpand()\">\n          @for (item of optionViews(); track item.trackKey) {\n            @let opt = item.option;\n            @let i = item.index;\n            @let isActive = activeIndex() === i;\n            <div\n              #optionEl2\n              class=\"z-autocomplete-option relative min-w-0\"\n              [ngClass]=\"getOptionClasses(opt, i)\"\n              [class.items-start]=\"hasCustomOptionTemplate()\"\n              [style.minHeight.px]=\"effectiveOptionHeight()\"\n              [attr.aria-selected]=\"isActive\"\n              role=\"option\"\n              (mouseenter)=\"activeIndex.set(i)\"\n              (click)=\"selectOption(opt)\">\n              @if (effectiveOptionTemplate()) {\n                <ng-container\n                  *ngTemplateOutlet=\"effectiveOptionTemplate()!; context: { $implicit: opt, active: isActive }\" />\n              } @else {\n                @if (opt.icon) {\n                  <z-icon [zType]=\"opt.icon\" zSize=\"16\" class=\"shrink-0\" />\n                }\n                <div class=\"min-w-0 flex-1\">\n                  <span\n                    class=\"block min-w-0 truncate\"\n                    z-tooltip\n                    [zContent]=\"opt.label\"\n                    zPosition=\"top\"\n                    [zHideDelay]=\"0\"\n                    [zOffset]=\"5\"\n                    [zArrow]=\"false\"\n                    [zTriggerElement]=\"optionEl2\"\n                    [innerHTML]=\"\n                      config().highlightMatch ? (opt.label | zHighlight: highlightQuery() | zSafeHtml) : opt.label\n                    \"></span>\n                  @if (opt.description) {\n                    <span class=\"text-muted-foreground block min-w-0 truncate text-xs\">{{ opt.description }}</span>\n                  }\n                </div>\n              }\n            </div>\n          }\n          @if (canLoadMore()) {\n            <div #loadMoreSentinel class=\"h-px w-full shrink-0\"></div>\n          }\n        </div>\n      }\n\n      @if (isLoadingMore()) {\n        <div class=\"z-autocomplete-loading-more border-border/50 flex items-center justify-center border-t py-1.5\">\n          <z-loading zSize=\"xs\" [zLoading]=\"true\" />\n        </div>\n      }\n    }\n  </div>\n</ng-template>\n", styles: [".z-autocomplete-wrapper{width:100%}.z-autocomplete-trigger{-webkit-user-select:none;user-select:none}.z-autocomplete-trigger:focus-within{outline:none}.z-autocomplete-trigger *{cursor:inherit}.z-autocomplete-input{text-overflow:ellipsis;overflow:hidden}.z-autocomplete-input::placeholder{color:hsl(var(--muted-foreground))}.z-autocomplete-input:disabled{cursor:not-allowed}.z-autocomplete-open-bottom{border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}.z-autocomplete-open-top{border-top-left-radius:0!important;border-top-right-radius:0!important}.z-autocomplete-dropdown{animation:z-autocomplete-dropdown-from-top .15s ease-out}.z-autocomplete-dropdown-bottom{animation:z-autocomplete-dropdown-from-bottom .15s ease-out}@keyframes z-autocomplete-dropdown-from-top{0%{opacity:0;transform:translateY(-.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes z-autocomplete-dropdown-from-bottom{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}.z-autocomplete-separator{display:none}.z-autocomplete-options{overflow-x:hidden!important}.z-autocomplete-scrollbar{--scrollbar-padding: 0;--scrollbar-track-color: transparent;--scrollbar-thumb-color: hsl(var(--muted-foreground) / .3);--scrollbar-thumb-hover-color: hsl(var(--muted-foreground) / .5);--scrollbar-size: 6px}.z-autocomplete-virtual-scroll .z-autocomplete-virtual-inner{width:100%}.z-autocomplete-content-state{animation:z-autocomplete-content-fade-in .15s ease-out}@keyframes z-autocomplete-content-fade-in{0%{opacity:0}to{opacity:1}}.z-autocomplete-option mark{background:transparent;color:hsl(var(--primary));font-weight:600}.z-autocomplete-option{transition:background-color .1s ease,color .1s ease}.z-autocomplete-options:not(.z-autocomplete-virtual-scroll) .z-autocomplete-option{animation:z-autocomplete-option-enter .12s ease-out;animation-fill-mode:both}@keyframes z-autocomplete-option-enter{0%{opacity:0}to{opacity:1}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { triggerRef: [{ type: i0.ViewChild, args: ['triggerEl', { isSignal: true }] }], inputRef: [{ type: i0.ViewChild, args: ['inputEl', { isSignal: true }] }], dropdownTpl: [{ type: i0.ViewChild, args: ['dropdownTpl', { isSignal: true }] }], virtualScrollRef: [{ type: i0.ViewChild, args: ['virtualScrollElement', { isSignal: true }] }], optionsContainerRef: [{ type: i0.ViewChild, args: ['optionsContainer', { isSignal: true }] }], loadMoreSentinelRef: [{ type: i0.ViewChild, args: ['loadMoreSentinel', { isSignal: true }] }], virtualOptionElements: [{ type: i0.ViewChildren, args: ['virtualOptionEl', { isSignal: true }] }], customOptionDirective: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ZAutocompleteOptionDirective), { isSignal: true }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "zOptions", required: false }] }], zConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "zConfig", required: false }] }], zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zType: [{ type: i0.Input, args: [{ isSignal: true, alias: "zType", required: false }] }], zLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLabel", required: false }] }], zLabelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLabelClass", required: false }] }], zPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "zPlaceholder", required: false }] }], zDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDisabled", required: false }] }], zReadonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "zReadonly", required: false }] }], zLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLoading", required: false }] }], zRequired: [{ type: i0.Input, args: [{ isSignal: true, alias: "zRequired", required: false }] }], zPrefix: [{ type: i0.Input, args: [{ isSignal: true, alias: "zPrefix", required: false }] }], zSuffix: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSuffix", required: false }] }], zAllowClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAllowClear", required: false }] }], zVirtualScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "zVirtualScroll", required: false }] }], zDynamicSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDynamicSize", required: false }] }], zOptionHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "zOptionHeight", required: false }] }], zHeightExpand: [{ type: i0.Input, args: [{ isSignal: true, alias: "zHeightExpand", required: false }] }], zMaxVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMaxVisible", required: false }] }], zResetOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "zResetOnSelect", required: false }] }], zEmptyText: [{ type: i0.Input, args: [{ isSignal: true, alias: "zEmptyText", required: false }] }], zEmptyIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "zEmptyIcon", required: false }] }], zNoDataText: [{ type: i0.Input, args: [{ isSignal: true, alias: "zNoDataText", required: false }] }], zNoDataIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "zNoDataIcon", required: false }] }], zAllowCustomValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAllowCustomValue", required: false }] }], zDebounceTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDebounceTime", required: false }] }], zLoadingMore: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLoadingMore", required: false }] }], zEnableLoadMore: [{ type: i0.Input, args: [{ isSignal: true, alias: "zEnableLoadMore", required: false }] }], zScrollDistance: [{ type: i0.Input, args: [{ isSignal: true, alias: "zScrollDistance", required: false }] }], zKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "zKey", required: false }] }], zOptionTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "zOptionTemplate", required: false }] }], zOnSearch: [{ type: i0.Output, args: ["zOnSearch"] }], zOnLoadMore: [{ type: i0.Output, args: ["zOnLoadMore"] }], zOnSelect: [{ type: i0.Output, args: ["zOnSelect"] }], zOnEnter: [{ type: i0.Output, args: ["zOnEnter"] }], zOnCommit: [{ type: i0.Output, args: ["zOnCommit"] }], zValueChange: [{ type: i0.Output, args: ["zValueChange"] }], zOnBlur: [{ type: i0.Output, args: ["zOnBlur"] }], zOnFocus: [{ type: i0.Output, args: ["zOnFocus"] }], zControl: [{ type: i0.Output, args: ["zControl"] }], zEvent: [{ type: i0.Output, args: ["zEvent"] }] } });
 
 /**