npm - @shival99/z-ui - Versions diffs - 1.4.2 → 1.4.4 - Mend

@shival99/z-ui 1.4.2 → 1.4.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (74) hide show

package/fesm2022/shival99-z-ui-components-z-dropdown-menu.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"shival99-z-ui-components-z-dropdown-menu.mjs","sources":["../../../../libs/core-ui/components/z-dropdown-menu/z-dropdown-menu.component.ts","../../../../libs/core-ui/components/z-dropdown-menu/z-dropdown-menu.component.html","../../../../libs/core-ui/components/z-dropdown-menu/shival99-z-ui-components-z-dropdown-menu.ts"],"sourcesContent":["import {\n AfterContentInit,\n ChangeDetectionStrategy,\n Component,\n computed,\n ElementRef,\n input,\n output,\n signal,\n viewChild,\n} from '@angular/core';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { ZButtonComponent, ZButtonVariants } from '@shival99/z-ui/components/z-button';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { type ZIcon } from '@shival99/z-ui/components/z-icon';\nimport { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';\nimport { type ZPopoverPosition } from '@shival99/z-ui/components/z-popover';\nimport { ZTooltipDirective } from '@shival99/z-ui/components/z-tooltip';\nimport { ZDropdownMenuItem } from './z-dropdown-menu.types';\n\n@Component({\n selector: 'z-dropdown-menu',\n imports: [ZPopoverDirective, ZButtonComponent, ZIconComponent, ZTooltipDirective, TranslatePipe],\n standalone: true,\n templateUrl: './z-dropdown-menu.component.html',\n styleUrl: './z-dropdown-menu.component.scss',\n providers: [TranslatePipe],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ZDropdownMenuComponent implements AfterContentInit {\n public readonly zItems = input.required<ZDropdownMenuItem[]>();\n public readonly zLabel = input<string>();\n public readonly zIcon = input<ZIcon>('lucideMenu');\n public readonly zButtonType = input<'primary' \| 'secondary' \| 'outline' \| 'ghost'>('outline');\n public readonly zPosition = input<ZPopoverPosition>('bottom-right');\n public readonly zButtonSize = input<ZButtonVariants['zSize']>('default');\n public readonly zOffset = input<number>(4);\n public readonly zMinWidth = input<number>(224);\n public readonly zMaxWidth = input<number>(320);\n public readonly zDisabled = input<boolean>(false);\n\n protected readonly contentWrapper = viewChild<ElementRef<HTMLElement>>('contentWrapper');\n protected readonly hasContent = signal(false);\n public readonly zOnItemClick = output<ZDropdownMenuItem>();\n protected readonly popoverControl = signal<{ close: () => void; closeImmediate: () => void } \| null>(null);\n\n protected readonly visibleItems = computed(() => this.zItems().filter(item => !item.hidden));\n\n ngAfterContentInit(): void {\n const wrapper = this.contentWrapper();\n if (wrapper) {\n const hasProjectedContent = wrapper.nativeElement.children.length > 0;\n this.hasContent.set(hasProjectedContent);\n }\n }\n\n protected onItemClick(item: ZDropdownMenuItem): void {\n if (item.disabled) {\n return;\n }\n\n item.onClick?.();\n this.zOnItemClick.emit(item);\n this.popoverControl()?.closeImmediate();\n }\n\n protected onControl(control: { close: () => void; closeImmediate: () => void }): void {\n this.popoverControl.set(control);\n }\n}\n","<!-- Custom trigger via ng-content -->\n<div\n #contentWrapper\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n [zDisabled]=\"zDisabled()\"\n (zControl)=\"onControl($event)\"\n [class.hidden]=\"!hasContent()\">\n <ng-content />\n</div>\n\n<!-- Default button trigger -->\n@if (!hasContent()) {\n <button\n type=\"button\"\n z-button\n [zType]=\"zButtonType()\"\n [zSize]=\"zButtonSize()\"\n [zDisabled]=\"zDisabled()\"\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n [zTypeIcon]=\"zIcon()!\"\n (zControl)=\"onControl($event)\">\n @if (zLabel()) {\n {{ zLabel() \| translate }}\n }\n </button>\n}\n\n<!-- Menu content template -->\n<ng-template #menuContent let-close=\"close\">\n <div class=\"z-dropdown-menu-content p-1\" [style.min-width.px]=\"zMinWidth()\" [style.max-width.px]=\"zMaxWidth()\">\n @for (item of visibleItems(); track $index) {\n @if (item.divide === 'before' && $index > 0) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <!-- Menu item - check if has submenu -->\n @if (item.submenu && item.submenu.length > 0) {\n <!-- Menu item with nested submenu -->\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"submenuTemplate\"\n [zPosition]=\"item.submenuPosition \|\| 'right'\"\n zTrigger=\"hover\"\n [zShowDelay]=\"200\"\n [zHideDelay]=\"100\"\n [zOffset]=\"6\"\n [disabled]=\"item.disabled\"\n [class]=\"item.class\"\n class=\"hover:bg-accent data-[state=open]:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon\" [zSize]=\"item.iconSize \|\| '14'\" class=\"text-muted-foreground shrink-0\" />\n }\n <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n {{ item.label \| translate }}\n </span>\n @if (item.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">\n {{ item.shortcut \| translate }}\n </span>\n }\n <z-icon zType=\"lucideChevronRight\" zSize=\"14\" class=\"ml-auto shrink-0\" />\n </button>\n\n <!-- Submenu template -->\n <ng-template #submenuTemplate>\n <div\n class=\"p-1\"\n [style.min-width.px]=\"item.subMinWidth \|\| zMinWidth()\"\n [style.max-width.px]=\"item.subMaxWidth \|\| zMaxWidth()\">\n @for (subItem of item.submenu; track subItem.label) {\n <!-- Nested divider before -->\n @if (subItem.divide === 'before') {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"subItem.disabled\"\n [class]=\"subItem.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onItemClick(subItem)\">\n @if (subItem.icon) {\n <z-icon\n [zType]=\"subItem.icon\"\n [zSize]=\"subItem.iconSize \|\| '14'\"\n class=\"text-muted-foreground shrink-0\" />\n }\n <span\n class=\"truncate\"\n z-tooltip\n [zContent]=\"subItem.label\"\n [zShowDelay]=\"200\"\n zTrigger=\"hover\"\n zPosition=\"top\">\n {{ subItem.label }}\n </span>\n @if (subItem.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">\n {{ subItem.shortcut }}\n </span>\n }\n </button>\n\n <!-- Nested divider after -->\n @if (subItem.divide === 'after') {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n </ng-template>\n } @else {\n <!-- Regular menu item (no submenu) -->\n <button\n type=\"button\"\n [disabled]=\"item.disabled\"\n [class]=\"item.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onItemClick(item)\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon\" [zSize]=\"item.iconSize \|\| '14'\" class=\"text-muted-foreground shrink-0\" />\n }\n <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n {{ item.label }}\n </span>\n @if (item.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">{{ item.shortcut }}</span>\n }\n </button>\n }\n\n <!-- Divider after -->\n @if (item.divide === 'after' && $index < visibleItems().length - 1) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n</ng-template>\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"shival99-z-ui-components-z-dropdown-menu.mjs","sources":["../../../../libs/core-ui/components/z-dropdown-menu/z-dropdown-menu.component.ts","../../../../libs/core-ui/components/z-dropdown-menu/z-dropdown-menu.component.html","../../../../libs/core-ui/components/z-dropdown-menu/shival99-z-ui-components-z-dropdown-menu.ts"],"sourcesContent":["import {\n AfterContentInit,\n ChangeDetectionStrategy,\n Component,\n computed,\n ElementRef,\n input,\n output,\n signal,\n viewChild,\n} from '@angular/core';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { ZButtonComponent, ZButtonVariants } from '@shival99/z-ui/components/z-button';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { type ZIcon } from '@shival99/z-ui/components/z-icon';\nimport { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';\nimport { type ZPopoverPosition } from '@shival99/z-ui/components/z-popover';\nimport { ZTooltipDirective } from '@shival99/z-ui/components/z-tooltip';\nimport { ZDropdownMenuItem } from './z-dropdown-menu.types';\n\n@Component({\n selector: 'z-dropdown-menu',\n imports: [ZPopoverDirective, ZButtonComponent, ZIconComponent, ZTooltipDirective, TranslatePipe],\n standalone: true,\n templateUrl: './z-dropdown-menu.component.html',\n styleUrl: './z-dropdown-menu.component.scss',\n providers: [TranslatePipe],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ZDropdownMenuComponent implements AfterContentInit {\n protected readonly contentWrapper = viewChild<ElementRef<HTMLElement>>('contentWrapper');\n\n public readonly zOnItemClick = output<ZDropdownMenuItem>();\n\n public readonly zItems = input.required<ZDropdownMenuItem[]>();\n public readonly zLabel = input<string>();\n public readonly zIcon = input<ZIcon>('lucideMenu');\n public readonly zButtonType = input<'primary' \| 'secondary' \| 'outline' \| 'ghost'>('outline');\n public readonly zPosition = input<ZPopoverPosition>('bottom-right');\n public readonly zButtonSize = input<ZButtonVariants['zSize']>('default');\n public readonly zOffset = input<number>(4);\n public readonly zMinWidth = input<number>(224);\n public readonly zMaxWidth = input<number>(320);\n public readonly zDisabled = input<boolean>(false);\n\n protected readonly hasContent = signal(false);\n protected readonly popoverControl = signal<{ close: () => void; closeImmediate: () => void } \| null>(null);\n\n protected readonly visibleItems = computed(() => this.zItems().filter(item => !item.hidden));\n\n ngAfterContentInit(): void {\n const wrapper = this.contentWrapper();\n if (wrapper) {\n const hasProjectedContent = wrapper.nativeElement.children.length > 0;\n this.hasContent.set(hasProjectedContent);\n }\n }\n\n protected onItemClick(item: ZDropdownMenuItem): void {\n if (item.disabled) {\n return;\n }\n\n item.onClick?.();\n this.zOnItemClick.emit(item);\n this.popoverControl()?.closeImmediate();\n }\n\n protected onControl(control: { close: () => void; closeImmediate: () => void }): void {\n this.popoverControl.set(control);\n }\n}\n","<!-- Custom trigger via ng-content -->\n<div\n #contentWrapper\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n [zDisabled]=\"zDisabled()\"\n (zControl)=\"onControl($event)\"\n [class.hidden]=\"!hasContent()\">\n <ng-content />\n</div>\n\n<!-- Default button trigger -->\n@if (!hasContent()) {\n <button\n type=\"button\"\n z-button\n [zType]=\"zButtonType()\"\n [zSize]=\"zButtonSize()\"\n [zDisabled]=\"zDisabled()\"\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n [zTypeIcon]=\"zIcon()!\"\n (zControl)=\"onControl($event)\">\n @if (zLabel()) {\n {{ zLabel() \| translate }}\n }\n </button>\n}\n\n<!-- Menu content template -->\n<ng-template #menuContent let-close=\"close\">\n <div class=\"z-dropdown-menu-content p-1\" [style.min-width.px]=\"zMinWidth()\" [style.max-width.px]=\"zMaxWidth()\">\n @for (item of visibleItems(); track $index) {\n @if (item.divide === 'before' && $index > 0) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <!-- Menu item - check if has submenu -->\n @if (item.submenu && item.submenu.length > 0) {\n <!-- Menu item with nested submenu -->\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"submenuTemplate\"\n [zPosition]=\"item.submenuPosition \|\| 'right'\"\n zTrigger=\"hover\"\n [zShowDelay]=\"200\"\n [zHideDelay]=\"100\"\n [zOffset]=\"6\"\n [disabled]=\"item.disabled\"\n [class]=\"item.class\"\n class=\"hover:bg-accent data-[state=open]:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon\" [zSize]=\"item.iconSize \|\| '14'\" class=\"text-muted-foreground shrink-0\" />\n }\n <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n {{ item.label \| translate }}\n </span>\n @if (item.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">\n {{ item.shortcut \| translate }}\n </span>\n }\n <z-icon zType=\"lucideChevronRight\" zSize=\"14\" class=\"ml-auto shrink-0\" />\n </button>\n\n <!-- Submenu template -->\n <ng-template #submenuTemplate>\n <div\n class=\"p-1\"\n [style.min-width.px]=\"item.subMinWidth \|\| zMinWidth()\"\n [style.max-width.px]=\"item.subMaxWidth \|\| zMaxWidth()\">\n @for (subItem of item.submenu; track subItem.label) {\n <!-- Nested divider before -->\n @if (subItem.divide === 'before') {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"subItem.disabled\"\n [class]=\"subItem.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onItemClick(subItem)\">\n @if (subItem.icon) {\n <z-icon\n [zType]=\"subItem.icon\"\n [zSize]=\"subItem.iconSize \|\| '14'\"\n class=\"text-muted-foreground shrink-0\" />\n }\n <span\n class=\"truncate\"\n z-tooltip\n [zContent]=\"subItem.label\"\n [zShowDelay]=\"200\"\n zTrigger=\"hover\"\n zPosition=\"top\">\n {{ subItem.label }}\n </span>\n @if (subItem.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">\n {{ subItem.shortcut }}\n </span>\n }\n </button>\n\n <!-- Nested divider after -->\n @if (subItem.divide === 'after') {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n </ng-template>\n } @else {\n <!-- Regular menu item (no submenu) -->\n <button\n type=\"button\"\n [disabled]=\"item.disabled\"\n [class]=\"item.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onItemClick(item)\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon\" [zSize]=\"item.iconSize \|\| '14'\" class=\"text-muted-foreground shrink-0\" />\n }\n <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n {{ item.label }}\n </span>\n @if (item.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">{{ item.shortcut }}</span>\n }\n </button>\n }\n\n <!-- Divider after -->\n @if (item.divide === 'after' && $index < visibleItems().length - 1) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n</ng-template>\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-editor.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { output, input, signal, inject, Injector, DestroyRef, computed, forwardRef, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { inject, Injector, DestroyRef, output, input, signal, computed, forwardRef, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import * as i2 from '@angular/forms';
 import { NgControl, NgModel, PristineChangeEvent, TouchedChangeEvent, ReactiveFormsModule, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
@@ -50,6 +50,9 @@ const DEFAULT_TOOLBAR = [
     ['clean'],
 ];
 class ZEditorComponent {
+    _injector = inject(Injector);
+    _destroyRef = inject(DestroyRef);
+    _zTranslate = inject(ZTranslateService);
     zOnChange = output();
     zOnFocus = output();
     zOnBlur = output();
@@ -75,9 +78,6 @@ class ZEditorComponent {
     _formControl = signal(null, ...(ngDevMode ? [{ debugName: "_formControl" }] : []));
     _formStateVersion = signal(0, ...(ngDevMode ? [{ debugName: "_formStateVersion" }] : []));
     _isNgModel = signal(false, ...(ngDevMode ? [{ debugName: "_isNgModel" }] : []));
-    _injector = inject(Injector);
-    _destroyRef = inject(DestroyRef);
-    _zTranslate = inject(ZTranslateService);
     _onChange = () => void 0;
     _onTouched = () => void 0;
     _ngControl = null;

package/fesm2022/shival99-z-ui-components-z-editor.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"shival99-z-ui-components-z-editor.mjs","sources":["../../../../libs/core-ui/components/z-editor/z-editor.variants.ts","../../../../libs/core-ui/components/z-editor/z-editor.component.ts","../../../../libs/core-ui/components/z-editor/shival99-z-ui-components-z-editor.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zEditorVariants = cva(\n [\n 'z-editor block w-full rounded-[6px] border border-input bg-white shadow-xs',\n 'transition-[border-color,box-shadow,background-color,color,opacity] duration-200',\n 'dark:bg-input/30 dark:border-input',\n 'outline-none',\n ],\n {\n variants: {\n zSize: {\n sm: '[&_.ql-editor]:min-h-24 [&_.ql-editor]:text-sm',\n default: '[&_.ql-editor]:min-h-40 [&_.ql-editor]:text-sm',\n lg: '[&_.ql-editor]:min-h-60 [&_.ql-editor]:text-base',\n },\n zStatus: {\n default: 'focus-within:border-ring focus-within:ring-ring/50 focus-within:ring-[3px]',\n error:\n 'border-destructive! ring-destructive/20 ring-[3px] focus-within:border-destructive! focus-within:ring-destructive/30',\n disabled: 'opacity-50 cursor-not-allowed bg-muted! text-muted-foreground',\n readonly: 'bg-muted/50! text-muted-foreground cursor-default',\n },\n },\n defaultVariants: {\n zSize: 'default',\n zStatus: 'default',\n },\n }\n);\n\nexport type ZEditorVariants = VariantProps<typeof zEditorVariants>;\n","import {\n ChangeDetectionStrategy,\n Component,\n computed,\n DestroyRef,\n forwardRef,\n inject,\n Injector,\n input,\n type OnInit,\n output,\n signal,\n ViewEncapsulation,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport {\n type AbstractControl,\n ControlValueAccessor,\n NG_VALUE_ACCESSOR,\n NgControl,\n NgModel,\n PristineChangeEvent,\n ReactiveFormsModule,\n TouchedChangeEvent,\n} from '@angular/forms';\nimport { FormsModule } from '@angular/forms';\nimport { ZTranslateService } from '@shival99/z-ui/services';\nimport { zUuid, zMergeClasses, zTransform } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { ContentChange, QuillEditorComponent, QuillModule, type QuillModules } from 'ngx-quill';\nimport Quill from 'quill';\nimport QuillResizeImage from 'quill-resize-image';\nimport { filter, merge } from 'rxjs';\nimport type { ZEditorControl, ZEditorSize, ZEditorValidator } from './z-editor.types';\nimport { zEditorVariants } from './z-editor.variants';\n\nQuill.register('modules/resize', QuillResizeImage);\nconst DEFAULT_TOOLBAR = [\n ['bold', 'italic', 'underline', 'strike'],\n ['blockquote', 'code-block'],\n [{ header: 1 }, { header: 2 }],\n [{ list: 'ordered' }, { list: 'bullet' }],\n [{ indent: '-1' }, { indent: '+1' }],\n [{ align: [] }],\n [{ color: [] }, { background: [] }],\n ['link', 'image'],\n ['clean'],\n];\n\n@Component({\n selector: 'z-editor',\n imports: [QuillModule, ReactiveFormsModule, FormsModule],\n standalone: true,\n template: `\n <div [class]=\"wrapperClasses()\" [class.z-editor-disabled]=\"isDisabled()\" [class.z-editor-readonly]=\"zReadonly()\">\n @if (zLabel()) {\n <label [for]=\"editorId\" 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 <quill-editor\n [id]=\"editorId\"\n [class]=\"editorClasses()\"\n [modules]=\"effectiveModules()\"\n [placeholder]=\"effectivePlaceholder()\"\n [readOnly]=\"isDisabled() \|\| zReadonly()\"\n [formats]=\"zFormats()\"\n [bounds]=\"zBounds()\"\n [theme]=\"zTheme()\"\n [ngModel]=\"internalValue()\"\n (onContentChanged)=\"onContentChange($event)\"\n (onFocus)=\"onFocus()\"\n (onBlur)=\"onBlur()\"\n />\n\n @if (showError()) {\n <p class=\"text-destructive animate-in fade-in slide-in-from-top-1 m-0 text-xs duration-200\">\n {{ errorMessage() }}\n </p>\n }\n </div>\n `,\n styleUrl: './z-editor.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => ZEditorComponent),\n multi: true,\n },\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n exportAs: 'zEditor',\n})\nexport class ZEditorComponent implements OnInit, ControlValueAccessor {\n public readonly zOnChange = output<string>();\n public readonly zOnFocus = output<void>();\n public readonly zOnBlur = output<void>();\n public readonly zControl = output<ZEditorControl>();\n\n public readonly class = input<ClassValue>('');\n public readonly zSize = input<ZEditorSize>('default');\n public readonly zLabel = input<string>('');\n public readonly zLabelClass = input<string>('');\n public readonly zPlaceholder = input<string>('');\n public readonly zRequired = input(false, { transform: zTransform });\n public readonly zDisabled = input(false, { transform: zTransform });\n public readonly zReadonly = input(false, { transform: zTransform });\n public readonly zModules = input<QuillModules \| null>(null);\n public readonly zFormats = input<string[] \| null>(null);\n public readonly zBounds = input<string \| HTMLElement>('document.body');\n public readonly zTheme = input<'snow' \| 'bubble'>('snow');\n public readonly zValidators = input<ZEditorValidator[]>([]);\n protected readonly editorId = zUuid('z-editor');\n\n private readonly _value = signal<string>('');\n private readonly _touched = signal(false);\n private readonly _disabled = signal(false);\n private readonly _dirty = signal(false);\n private readonly _formControl = signal<AbstractControl \| null>(null);\n private readonly _formStateVersion = signal(0);\n private readonly _isNgModel = signal(false);\n\n private readonly _injector = inject(Injector);\n private readonly _destroyRef = inject(DestroyRef);\n private readonly _zTranslate = inject(ZTranslateService);\n\n private _onChange: (value: string) => void = () => void 0;\n private _onTouched: () => void = () => void 0;\n private _ngControl: NgControl \| null = null;\n private _editorInstance: QuillEditorComponent \| null = null;\n\n protected readonly isDisabled = computed(() => this._disabled() \|\| this.zDisabled());\n protected readonly internalValue = computed(() => this._value());\n protected readonly effectivePlaceholder = computed(() => {\n this._zTranslate.currentLang();\n return this.zPlaceholder() \|\| this._zTranslate.instant('i18n_z_ui_editor_placeholder');\n });\n\n protected readonly effectiveModules = computed<QuillModules>(() => {\n const customModules = this.zModules();\n if (customModules) {\n return customModules;\n }\n\n return {\n toolbar: DEFAULT_TOOLBAR,\n resize: {\n locale: {},\n },\n history: {\n delay: 1000,\n maxStack: 50,\n userOnly: true,\n },\n };\n });\n\n private readonly _shouldShowValidation = computed(() => {\n const control = this._formControl();\n this._formStateVersion();\n\n if (this._isNgModel()) {\n return this._dirty() \|\| this._touched();\n }\n\n if (control) {\n return control.dirty;\n }\n\n return this._dirty() \|\| this._touched();\n });\n\n private _getValidationErrors(): string[] {\n const errors: string[] = [];\n const value = this._value();\n const validators = this.zValidators();\n\n if (!this._shouldShowValidation()) {\n return errors;\n }\n\n for (const validator of validators) {\n if (validator.error === 'required' && this.zRequired()) {\n if (!value \|\| value.trim() === '' \|\| value === '<p><br></p>') {\n errors.push(validator.message);\n }\n continue;\n }\n\n if (validator.minLength && value.length < validator.minLength) {\n errors.push(validator.message);\n continue;\n }\n\n if (validator.maxLength && value.length > validator.maxLength) {\n errors.push(validator.message);\n continue;\n }\n\n if (validator.pattern && !validator.pattern.test(value)) {\n errors.push(validator.message);\n }\n }\n\n return errors;\n }\n\n protected readonly hasError = computed(() => {\n const customErrors = this._getValidationErrors();\n if (customErrors.length > 0) {\n return true;\n }\n\n const control = this._formControl();\n this._formStateVersion();\n\n if (!control) {\n return false;\n }\n\n return control.invalid && this._shouldShowValidation();\n });\n\n protected readonly showError = computed(() => this.hasError());\n\n protected readonly errorMessage = computed(() => {\n const customErrors = this._getValidationErrors();\n if (customErrors.length > 0) {\n return customErrors[0];\n }\n\n const control = this._formControl();\n const errors = control?.errors;\n\n if (!errors) {\n return '';\n }\n\n this._zTranslate.currentLang();\n if (errors['required']) {\n return this._zTranslate.instant('i18n_z_ui_editor_required');\n }\n\n if (errors['minlength']) {\n return this._zTranslate.instant('i18n_z_ui_editor_min_length', {\n min: errors['minlength'].requiredLength,\n });\n }\n\n if (errors['maxlength']) {\n return this._zTranslate.instant('i18n_z_ui_editor_max_length', {\n max: errors['maxlength'].requiredLength,\n });\n }\n\n return this._zTranslate.instant('i18n_z_ui_editor_invalid');\n });\n\n protected readonly currentStatus = computed(() => {\n if (this.isDisabled()) {\n return 'disabled';\n }\n\n if (this.zReadonly()) {\n return 'readonly';\n }\n\n if (this.hasError()) {\n return 'error';\n }\n\n return 'default';\n });\n\n protected readonly wrapperClasses = computed(() => 'z-editor-wrapper flex w-full flex-col gap-2');\n\n protected readonly labelClasses = computed(() =>\n zMergeClasses('mb-1.5 block text-sm font-medium text-foreground', this.zLabelClass())\n );\n\n protected readonly editorClasses = computed(() =>\n zMergeClasses(\n zEditorVariants({\n zSize: this.zSize(),\n zStatus: this.currentStatus(),\n }),\n this.class()\n )\n );\n\n ngOnInit(): void {\n queueMicrotask(() => {\n try {\n this._ngControl = this._injector.get(NgControl, null);\n this._isNgModel.set(this._ngControl instanceof NgModel);\n\n if (this._ngControl?.control) {\n const { control } = this._ngControl;\n this._formControl.set(control);\n merge(\n control.statusChanges,\n control.valueChanges,\n control.events.pipe(\n filter(event => event instanceof PristineChangeEvent \|\| event instanceof TouchedChangeEvent)\n )\n )\n .pipe(takeUntilDestroyed(this._destroyRef))\n .subscribe(() => {\n this._formStateVersion.update(v => v + 1);\n });\n }\n } catch {\n this._ngControl = null;\n }\n });\n\n setTimeout(() => this._emitControl());\n }\n\n public writeValue(value: string): void {\n this._value.set(value \|\| '');\n }\n\n public registerOnChange(fn: (value: string) => void): void {\n this._onChange = fn;\n }\n\n public registerOnTouched(fn: () => void): void {\n this._onTouched = fn;\n }\n\n public setDisabledState(isDisabled: boolean): void {\n this._disabled.set(isDisabled);\n }\n\n protected onContentChange(event: ContentChange): void {\n const html = event.html \|\| '';\n this._value.set(html);\n this._dirty.set(true);\n this._onChange(html);\n this.zOnChange.emit(html);\n }\n\n protected onFocus(): void {\n this.zOnFocus.emit();\n }\n\n protected onBlur(): void {\n if (this._dirty()) {\n this._touched.set(true);\n }\n\n this._onTouched();\n this.zOnBlur.emit();\n }\n\n public focus(): void {\n this._editorInstance?.quillEditor?.focus();\n }\n\n public blur(): void {\n this._editorInstance?.quillEditor?.blur();\n }\n\n public clear(): void {\n this._value.set('');\n this._onChange('');\n }\n\n public setContent(content: string): void {\n this._value.set(content);\n this._onChange(content);\n }\n\n public getContent(): string {\n return this._value();\n }\n\n public getText(): string {\n return this._editorInstance?.quillEditor?.getText() \|\| '';\n }\n\n public getLength(): number {\n return this._editorInstance?.quillEditor?.getLength() \|\| 0;\n }\n\n public markAsTouched(): void {\n this._touched.set(true);\n this._onTouched();\n }\n\n public markAsDirty(): void {\n this._dirty.set(true);\n }\n\n public markAsPristine(): void {\n this._dirty.set(false);\n }\n\n public markAsUntouched(): void {\n this._touched.set(false);\n }\n\n public setValue(content: string): void {\n this.setContent(content);\n }\n\n public validate(): void {\n this._touched.set(true);\n this._dirty.set(true);\n this._onTouched();\n\n if (this._ngControl?.control) {\n this._ngControl.control.markAsDirty();\n this._ngControl.control.markAsTouched();\n }\n }\n\n public reset(): void {\n this._value.set('');\n this._touched.set(false);\n this._dirty.set(false);\n this._onChange('');\n\n if (this._ngControl?.control) {\n this._ngControl.control.markAsPristine();\n this._ngControl.control.markAsUntouched();\n }\n }\n\n private _emitControl(): void {\n this.zControl.emit({\n focus: () => this.focus(),\n blur: () => this.blur(),\n clear: () => this.clear(),\n setContent: (content: string) => this.setContent(content),\n getContent: () => this.getContent(),\n getText: () => this.getText(),\n getLength: () => this.getLength(),\n validate: () => this.validate(),\n reset: () => this.reset(),\n markAsTouched: () => this.markAsTouched(),\n markAsUntouched: () => this.markAsUntouched(),\n markAsDirty: () => this.markAsDirty(),\n markAsPristine: () => this.markAsPristine(),\n setValue: (content: string) => this.setValue(content),\n hasError: this.hasError,\n value: this.internalValue,\n errorMessage: this.errorMessage,\n });\n }\n}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAEO,MAAM,eAAe,GAAG,GAAG,CAChC;IACE,4EAA4E;IAC5E,kFAAkF;IAClF,oCAAoC;IACpC,cAAc;CACf,EACD;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,EAAE,EAAE,gDAAgD;AACpD,YAAA,OAAO,EAAE,gDAAgD;AACzD,YAAA,EAAE,EAAE,kDAAkD;AACvD,SAAA;AACD,QAAA,OAAO,EAAE;AACP,YAAA,OAAO,EAAE,4EAA4E;AACrF,YAAA,KAAK,EACH,sHAAsH;AACxH,YAAA,QAAQ,EAAE,+DAA+D;AACzE,YAAA,QAAQ,EAAE,mDAAmD;AAC9D,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,OAAO,EAAE,SAAS;AACnB,KAAA;AACF,CAAA;;ACQH,KAAK,CAAC,QAAQ,CAAC,gBAAgB,EAAE,gBAAgB,CAAC;AAClD,MAAM,eAAe,GAAG;AACtB,IAAA,CAAC,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,CAAC;IACzC,CAAC,YAAY,EAAE,YAAY,CAAC;IAC5B,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC;IAC9B,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;IACzC,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC;AACpC,IAAA,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC;IACf,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC;IACnC,CAAC,MAAM,EAAE,OAAO,CAAC;AACjB,IAAA,CAAC,OAAO,CAAC;CACV;MAmDY,gBAAgB,CAAA;IACX,SAAS,GAAG,MAAM,EAAU;IAC5B,QAAQ,GAAG,MAAM,EAAQ;IACzB,OAAO,GAAG,MAAM,EAAQ;IACxB,QAAQ,GAAG,MAAM,EAAkB;AAEnC,IAAA,KAAK,GAAG,KAAK,CAAa,EAAE,iDAAC;AAC7B,IAAA,KAAK,GAAG,KAAK,CAAc,SAAS,iDAAC;AACrC,IAAA,MAAM,GAAG,KAAK,CAAS,EAAE,kDAAC;AAC1B,IAAA,WAAW,GAAG,KAAK,CAAS,EAAE,uDAAC;AAC/B,IAAA,YAAY,GAAG,KAAK,CAAS,EAAE,wDAAC;IAChC,SAAS,GAAG,KAAK,CAAC,KAAK,sDAAI,SAAS,EAAE,UAAU,EAAA,CAAG;IACnD,SAAS,GAAG,KAAK,CAAC,KAAK,sDAAI,SAAS,EAAE,UAAU,EAAA,CAAG;IACnD,SAAS,GAAG,KAAK,CAAC,KAAK,sDAAI,SAAS,EAAE,UAAU,EAAA,CAAG;AACnD,IAAA,QAAQ,GAAG,KAAK,CAAsB,IAAI,oDAAC;AAC3C,IAAA,QAAQ,GAAG,KAAK,CAAkB,IAAI,oDAAC;AACvC,IAAA,OAAO,GAAG,KAAK,CAAuB,eAAe,mDAAC;AACtD,IAAA,MAAM,GAAG,KAAK,CAAoB,MAAM,kDAAC;AACzC,IAAA,WAAW,GAAG,KAAK,CAAqB,EAAE,uDAAC;AACxC,IAAA,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC;AAE9B,IAAA,MAAM,GAAG,MAAM,CAAS,EAAE,kDAAC;AAC3B,IAAA,QAAQ,GAAG,MAAM,CAAC,KAAK,oDAAC;AACxB,IAAA,SAAS,GAAG,MAAM,CAAC,KAAK,qDAAC;AACzB,IAAA,MAAM,GAAG,MAAM,CAAC,KAAK,kDAAC;AACtB,IAAA,YAAY,GAAG,MAAM,CAAyB,IAAI,wDAAC;AACnD,IAAA,iBAAiB,GAAG,MAAM,CAAC,CAAC,6DAAC;AAC7B,IAAA,UAAU,GAAG,MAAM,CAAC,KAAK,sDAAC;AAE1B,IAAA,SAAS,GAAG,MAAM,CAAC,QAAQ,CAAC;AAC5B,IAAA,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC;AAChC,IAAA,WAAW,GAAG,MAAM,CAAC,iBAAiB,CAAC;AAEhD,IAAA,SAAS,GAA4B,MAAM,KAAK,CAAC;AACjD,IAAA,UAAU,GAAe,MAAM,KAAK,CAAC;IACrC,UAAU,GAAqB,IAAI;IACnC,eAAe,GAAgC,IAAI;AAExC,IAAA,UAAU,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,SAAS,EAAE,IAAI,IAAI,CAAC,SAAS,EAAE,sDAAC;IACjE,aAAa,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,MAAM,EAAE,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,eAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAC;AAC7C,IAAA,oBAAoB,GAAG,QAAQ,CAAC,MAAK;AACtD,QAAA,IAAI,CAAC,WAAW,CAAC,WAAW,EAAE;AAC9B,QAAA,OAAO,IAAI,CAAC,YAAY,EAAE,IAAI,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,8BAA8B,CAAC;AACxF,IAAA,CAAC,gEAAC;AAEiB,IAAA,gBAAgB,GAAG,QAAQ,CAAe,MAAK;AAChE,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,EAAE;QACrC,IAAI,aAAa,EAAE;AACjB,YAAA,OAAO,aAAa;QACtB;QAEA,OAAO;AACL,YAAA,OAAO,EAAE,eAAe;AACxB,YAAA,MAAM,EAAE;AACN,gBAAA,MAAM,EAAE,EAAE;AACX,aAAA;AACD,YAAA,OAAO,EAAE;AACP,gBAAA,KAAK,EAAE,IAAI;AACX,gBAAA,QAAQ,EAAE,EAAE;AACZ,gBAAA,QAAQ,EAAE,IAAI;AACf,aAAA;SACF;AACH,IAAA,CAAC,4DAAC;AAEe,IAAA,qBAAqB,GAAG,QAAQ,CAAC,MAAK;AACrD,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,EAAE;QACnC,IAAI,CAAC,iBAAiB,EAAE;AAExB,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE,EAAE;YACrB,OAAO,IAAI,CAAC,MAAM,EAAE,IAAI,IAAI,CAAC,QAAQ,EAAE;QACzC;QAEA,IAAI,OAAO,EAAE;YACX,OAAO,OAAO,CAAC,KAAK;QACtB;QAEA,OAAO,IAAI,CAAC,MAAM,EAAE,IAAI,IAAI,CAAC,QAAQ,EAAE;AACzC,IAAA,CAAC,iEAAC;IAEM,oBAAoB,GAAA;QAC1B,MAAM,MAAM,GAAa,EAAE;AAC3B,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,MAAM,EAAE;AAC3B,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,WAAW,EAAE;AAErC,QAAA,IAAI,CAAC,IAAI,CAAC,qBAAqB,EAAE,EAAE;AACjC,YAAA,OAAO,MAAM;QACf;AAEA,QAAA,KAAK,MAAM,SAAS,IAAI,UAAU,EAAE;YAClC,IAAI,SAAS,CAAC,KAAK,KAAK,UAAU,IAAI,IAAI,CAAC,SAAS,EAAE,EAAE;AACtD,gBAAA,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,KAAK,KAAK,aAAa,EAAE;AAC5D,oBAAA,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC;gBAChC;gBACA;YACF;AAEA,YAAA,IAAI,SAAS,CAAC,SAAS,IAAI,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,SAAS,EAAE;AAC7D,gBAAA,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC;gBAC9B;YACF;AAEA,YAAA,IAAI,SAAS,CAAC,SAAS,IAAI,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,SAAS,EAAE;AAC7D,gBAAA,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC;gBAC9B;YACF;AAEA,YAAA,IAAI,SAAS,CAAC,OAAO,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;AACvD,gBAAA,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC;YAChC;QACF;AAEA,QAAA,OAAO,MAAM;IACf;AAEmB,IAAA,QAAQ,GAAG,QAAQ,CAAC,MAAK;AAC1C,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,oBAAoB,EAAE;AAChD,QAAA,IAAI,YAAY,CAAC,MAAM,GAAG,CAAC,EAAE;AAC3B,YAAA,OAAO,IAAI;QACb;AAEA,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,EAAE;QACnC,IAAI,CAAC,iBAAiB,EAAE;QAExB,IAAI,CAAC,OAAO,EAAE;AACZ,YAAA,OAAO,KAAK;QACd;QAEA,OAAO,OAAO,CAAC,OAAO,IAAI,IAAI,CAAC,qBAAqB,EAAE;AACxD,IAAA,CAAC,oDAAC;IAEiB,SAAS,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,QAAQ,EAAE,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,WAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAC;AAE3C,IAAA,YAAY,GAAG,QAAQ,CAAC,MAAK;AAC9C,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,oBAAoB,EAAE;AAChD,QAAA,IAAI,YAAY,CAAC,MAAM,GAAG,CAAC,EAAE;AAC3B,YAAA,OAAO,YAAY,CAAC,CAAC,CAAC;QACxB;AAEA,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,EAAE;AACnC,QAAA,MAAM,MAAM,GAAG,OAAO,EAAE,MAAM;QAE9B,IAAI,CAAC,MAAM,EAAE;AACX,YAAA,OAAO,EAAE;QACX;AAEA,QAAA,IAAI,CAAC,WAAW,CAAC,WAAW,EAAE;AAC9B,QAAA,IAAI,MAAM,CAAC,UAAU,CAAC,EAAE;YACtB,OAAO,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,2BAA2B,CAAC;QAC9D;AAEA,QAAA,IAAI,MAAM,CAAC,WAAW,CAAC,EAAE;AACvB,YAAA,OAAO,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,6BAA6B,EAAE;AAC7D,gBAAA,GAAG,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,cAAc;AACxC,aAAA,CAAC;QACJ;AAEA,QAAA,IAAI,MAAM,CAAC,WAAW,CAAC,EAAE;AACvB,YAAA,OAAO,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,6BAA6B,EAAE;AAC7D,gBAAA,GAAG,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,cAAc;AACxC,aAAA,CAAC;QACJ;QAEA,OAAO,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,0BAA0B,CAAC;AAC7D,IAAA,CAAC,wDAAC;AAEiB,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAK;AAC/C,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE,EAAE;AACrB,YAAA,OAAO,UAAU;QACnB;AAEA,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE,EAAE;AACpB,YAAA,OAAO,UAAU;QACnB;AAEA,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE,EAAE;AACnB,YAAA,OAAO,OAAO;QAChB;AAEA,QAAA,OAAO,SAAS;AAClB,IAAA,CAAC,yDAAC;IAEiB,cAAc,GAAG,QAAQ,CAAC,MAAM,6CAA6C,0DAAC;AAE9E,IAAA,YAAY,GAAG,QAAQ,CAAC,MACzC,aAAa,CAAC,kDAAkD,EAAE,IAAI,CAAC,WAAW,EAAE,CAAC,wDACtF;IAEkB,aAAa,GAAG,QAAQ,CAAC,MAC1C,aAAa,CACX,eAAe,CAAC;AACd,QAAA,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE;AACnB,QAAA,OAAO,EAAE,IAAI,CAAC,aAAa,EAAE;AAC9B,KAAA,CAAC,EACF,IAAI,CAAC,KAAK,EAAE,CACb,yDACF;IAED,QAAQ,GAAA;QACN,cAAc,CAAC,MAAK;AAClB,YAAA,IAAI;AACF,gBAAA,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,SAAS,EAAE,IAAI,CAAC;gBACrD,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,UAAU,YAAY,OAAO,CAAC;AAEvD,gBAAA,IAAI,IAAI,CAAC,UAAU,EAAE,OAAO,EAAE;AAC5B,oBAAA,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,UAAU;AACnC,oBAAA,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC;AAC9B,oBAAA,KAAK,CACH,OAAO,CAAC,aAAa,EACrB,OAAO,CAAC,YAAY,EACpB,OAAO,CAAC,MAAM,CAAC,IAAI,CACjB,MAAM,CAAC,KAAK,IAAI,KAAK,YAAY,mBAAmB,IAAI,KAAK,YAAY,kBAAkB,CAAC,CAC7F;AAEA,yBAAA,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,WAAW,CAAC;yBACzC,SAAS,CAAC,MAAK;AACd,wBAAA,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAC3C,oBAAA,CAAC,CAAC;gBACN;YACF;AAAE,YAAA,MAAM;AACN,gBAAA,IAAI,CAAC,UAAU,GAAG,IAAI;YACxB;AACF,QAAA,CAAC,CAAC;QAEF,UAAU,CAAC,MAAM,IAAI,CAAC,YAAY,EAAE,CAAC;IACvC;AAEO,IAAA,UAAU,CAAC,KAAa,EAAA;QAC7B,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,IAAI,EAAE,CAAC;IAC9B;AAEO,IAAA,gBAAgB,CAAC,EAA2B,EAAA;AACjD,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE;IACrB;AAEO,IAAA,iBAAiB,CAAC,EAAc,EAAA;AACrC,QAAA,IAAI,CAAC,UAAU,GAAG,EAAE;IACtB;AAEO,IAAA,gBAAgB,CAAC,UAAmB,EAAA;AACzC,QAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC;IAChC;AAEU,IAAA,eAAe,CAAC,KAAoB,EAAA;AAC5C,QAAA,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,IAAI,EAAE;AAC7B,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC;AACrB,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC;AACrB,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;AACpB,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;IAC3B;IAEU,OAAO,GAAA;AACf,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE;IACtB;IAEU,MAAM,GAAA;AACd,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE,EAAE;AACjB,YAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC;QACzB;QAEA,IAAI,CAAC,UAAU,EAAE;AACjB,QAAA,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE;IACrB;IAEO,KAAK,GAAA;AACV,QAAA,IAAI,CAAC,eAAe,EAAE,WAAW,EAAE,KAAK,EAAE;IAC5C;IAEO,IAAI,GAAA;AACT,QAAA,IAAI,CAAC,eAAe,EAAE,WAAW,EAAE,IAAI,EAAE;IAC3C;IAEO,KAAK,GAAA;AACV,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC;AACnB,QAAA,IAAI,CAAC,SAAS,CAAC,EAAE,CAAC;IACpB;AAEO,IAAA,UAAU,CAAC,OAAe,EAAA;AAC/B,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC;AACxB,QAAA,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC;IACzB;IAEO,UAAU,GAAA;AACf,QAAA,OAAO,IAAI,CAAC,MAAM,EAAE;IACtB;IAEO,OAAO,GAAA;QACZ,OAAO,IAAI,CAAC,eAAe,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAE;IAC3D;IAEO,SAAS,GAAA;QACd,OAAO,IAAI,CAAC,eAAe,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,CAAC;IAC5D;IAEO,aAAa,GAAA;AAClB,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC;QACvB,IAAI,CAAC,UAAU,EAAE;IACnB;IAEO,WAAW,GAAA;AAChB,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC;IACvB;IAEO,cAAc,GAAA;AACnB,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC;IACxB;IAEO,eAAe,GAAA;AACpB,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC;IAC1B;AAEO,IAAA,QAAQ,CAAC,OAAe,EAAA;AAC7B,QAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC;IAC1B;IAEO,QAAQ,GAAA;AACb,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC;AACvB,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC;QACrB,IAAI,CAAC,UAAU,EAAE;AAEjB,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE,OAAO,EAAE;AAC5B,YAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,WAAW,EAAE;AACrC,YAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,aAAa,EAAE;QACzC;IACF;IAEO,KAAK,GAAA;AACV,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC;AACnB,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC;AACxB,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC;AACtB,QAAA,IAAI,CAAC,SAAS,CAAC,EAAE,CAAC;AAElB,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE,OAAO,EAAE;AAC5B,YAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,cAAc,EAAE;AACxC,YAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,eAAe,EAAE;QAC3C;IACF;IAEQ,YAAY,GAAA;AAClB,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;AACjB,YAAA,KAAK,EAAE,MAAM,IAAI,CAAC,KAAK,EAAE;AACzB,YAAA,IAAI,EAAE,MAAM,IAAI,CAAC,IAAI,EAAE;AACvB,YAAA,KAAK,EAAE,MAAM,IAAI,CAAC,KAAK,EAAE;YACzB,UAAU,EAAE,CAAC,OAAe,KAAK,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC;AACzD,YAAA,UAAU,EAAE,MAAM,IAAI,CAAC,UAAU,EAAE;AACnC,YAAA,OAAO,EAAE,MAAM,IAAI,CAAC,OAAO,EAAE;AAC7B,YAAA,SAAS,EAAE,MAAM,IAAI,CAAC,SAAS,EAAE;AACjC,YAAA,QAAQ,EAAE,MAAM,IAAI,CAAC,QAAQ,EAAE;AAC/B,YAAA,KAAK,EAAE,MAAM,IAAI,CAAC,KAAK,EAAE;AACzB,YAAA,aAAa,EAAE,MAAM,IAAI,CAAC,aAAa,EAAE;AACzC,YAAA,eAAe,EAAE,MAAM,IAAI,CAAC,eAAe,EAAE;AAC7C,YAAA,WAAW,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE;AACrC,YAAA,cAAc,EAAE,MAAM,IAAI,CAAC,cAAc,EAAE;YAC3C,QAAQ,EAAE,CAAC,OAAe,KAAK,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC;YACrD,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,KAAK,EAAE,IAAI,CAAC,aAAa;YACzB,YAAY,EAAE,IAAI,CAAC,YAAY;AAChC,SAAA,CAAC;IACJ;uGArWW,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,SAAA,EAAA,WAAA,EAAA,QAAA,EAAA,UAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,SAAA,EAXhB;AACT,YAAA;AACE,gBAAA,OAAO,EAAE,iBAAiB;AAC1B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,gBAAgB,CAAC;AAC/C,gBAAA,KAAK,EAAE,IAAI;AACZ,aAAA;SACF,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAxCS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,gk8BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAlCS,WAAW,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,cAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,mBAAmB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,WAAW,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,qDAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,gBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FA+C5C,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAjD5B,SAAS;+BACE,UAAU,EAAA,OAAA,EACX,CAAC,WAAW,EAAE,mBAAmB,EAAE,WAAW,CAAC,EAAA,UAAA,EAC5C,IAAI,EAAA,QAAA,EACN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCT,EAAA,SAAA,EAEU;AACT,wBAAA;AACE,4BAAA,OAAO,EAAE,iBAAiB;AAC1B,4BAAA,WAAW,EAAE,UAAU,CAAC,sBAAsB,CAAC;AAC/C,4BAAA,KAAK,EAAE,IAAI;AACZ,yBAAA;qBACF,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,YAC3B,SAAS,EAAA,MAAA,EAAA,CAAA,gk8BAAA,CAAA,EAAA;;;AChGrB;;AAEG;;;;"}
1	+ {"version":3,"file":"shival99-z-ui-components-z-editor.mjs","sources":["../../../../libs/core-ui/components/z-editor/z-editor.variants.ts","../../../../libs/core-ui/components/z-editor/z-editor.component.ts","../../../../libs/core-ui/components/z-editor/shival99-z-ui-components-z-editor.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zEditorVariants = cva(\n [\n 'z-editor block w-full rounded-[6px] border border-input bg-white shadow-xs',\n 'transition-[border-color,box-shadow,background-color,color,opacity] duration-200',\n 'dark:bg-input/30 dark:border-input',\n 'outline-none',\n ],\n {\n variants: {\n zSize: {\n sm: '[&_.ql-editor]:min-h-24 [&_.ql-editor]:text-sm',\n default: '[&_.ql-editor]:min-h-40 [&_.ql-editor]:text-sm',\n lg: '[&_.ql-editor]:min-h-60 [&_.ql-editor]:text-base',\n },\n zStatus: {\n default: 'focus-within:border-ring focus-within:ring-ring/50 focus-within:ring-[3px]',\n error:\n 'border-destructive! ring-destructive/20 ring-[3px] focus-within:border-destructive! focus-within:ring-destructive/30',\n disabled: 'opacity-50 cursor-not-allowed bg-muted! text-muted-foreground',\n readonly: 'bg-muted/50! text-muted-foreground cursor-default',\n },\n },\n defaultVariants: {\n zSize: 'default',\n zStatus: 'default',\n },\n }\n);\n\nexport type ZEditorVariants = VariantProps<typeof zEditorVariants>;\n","import {\n ChangeDetectionStrategy,\n Component,\n computed,\n DestroyRef,\n forwardRef,\n inject,\n Injector,\n input,\n type OnInit,\n output,\n signal,\n ViewEncapsulation,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport {\n type AbstractControl,\n ControlValueAccessor,\n NG_VALUE_ACCESSOR,\n NgControl,\n NgModel,\n PristineChangeEvent,\n ReactiveFormsModule,\n TouchedChangeEvent,\n} from '@angular/forms';\nimport { FormsModule } from '@angular/forms';\nimport { ZTranslateService } from '@shival99/z-ui/services';\nimport { zUuid, zMergeClasses, zTransform } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { ContentChange, QuillEditorComponent, QuillModule, type QuillModules } from 'ngx-quill';\nimport Quill from 'quill';\nimport QuillResizeImage from 'quill-resize-image';\nimport { filter, merge } from 'rxjs';\nimport type { ZEditorControl, ZEditorSize, ZEditorValidator } from './z-editor.types';\nimport { zEditorVariants } from './z-editor.variants';\n\nQuill.register('modules/resize', QuillResizeImage);\nconst DEFAULT_TOOLBAR = [\n ['bold', 'italic', 'underline', 'strike'],\n ['blockquote', 'code-block'],\n [{ header: 1 }, { header: 2 }],\n [{ list: 'ordered' }, { list: 'bullet' }],\n [{ indent: '-1' }, { indent: '+1' }],\n [{ align: [] }],\n [{ color: [] }, { background: [] }],\n ['link', 'image'],\n ['clean'],\n];\n\n@Component({\n selector: 'z-editor',\n imports: [QuillModule, ReactiveFormsModule, FormsModule],\n standalone: true,\n template: `\n <div [class]=\"wrapperClasses()\" [class.z-editor-disabled]=\"isDisabled()\" [class.z-editor-readonly]=\"zReadonly()\">\n @if (zLabel()) {\n <label [for]=\"editorId\" 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 <quill-editor\n [id]=\"editorId\"\n [class]=\"editorClasses()\"\n [modules]=\"effectiveModules()\"\n [placeholder]=\"effectivePlaceholder()\"\n [readOnly]=\"isDisabled() \|\| zReadonly()\"\n [formats]=\"zFormats()\"\n [bounds]=\"zBounds()\"\n [theme]=\"zTheme()\"\n [ngModel]=\"internalValue()\"\n (onContentChanged)=\"onContentChange($event)\"\n (onFocus)=\"onFocus()\"\n (onBlur)=\"onBlur()\"\n />\n\n @if (showError()) {\n <p class=\"text-destructive animate-in fade-in slide-in-from-top-1 m-0 text-xs duration-200\">\n {{ errorMessage() }}\n </p>\n }\n </div>\n `,\n styleUrl: './z-editor.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => ZEditorComponent),\n multi: true,\n },\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n exportAs: 'zEditor',\n})\nexport class ZEditorComponent implements OnInit, ControlValueAccessor {\n private readonly _injector = inject(Injector);\n private readonly _destroyRef = inject(DestroyRef);\n private readonly _zTranslate = inject(ZTranslateService);\n\n public readonly zOnChange = output<string>();\n public readonly zOnFocus = output<void>();\n public readonly zOnBlur = output<void>();\n public readonly zControl = output<ZEditorControl>();\n\n public readonly class = input<ClassValue>('');\n public readonly zSize = input<ZEditorSize>('default');\n public readonly zLabel = input<string>('');\n public readonly zLabelClass = input<string>('');\n public readonly zPlaceholder = input<string>('');\n public readonly zRequired = input(false, { transform: zTransform });\n public readonly zDisabled = input(false, { transform: zTransform });\n public readonly zReadonly = input(false, { transform: zTransform });\n public readonly zModules = input<QuillModules \| null>(null);\n public readonly zFormats = input<string[] \| null>(null);\n public readonly zBounds = input<string \| HTMLElement>('document.body');\n public readonly zTheme = input<'snow' \| 'bubble'>('snow');\n public readonly zValidators = input<ZEditorValidator[]>([]);\n\n protected readonly editorId = zUuid('z-editor');\n\n private readonly _value = signal<string>('');\n private readonly _touched = signal(false);\n private readonly _disabled = signal(false);\n private readonly _dirty = signal(false);\n private readonly _formControl = signal<AbstractControl \| null>(null);\n private readonly _formStateVersion = signal(0);\n private readonly _isNgModel = signal(false);\n private _onChange: (value: string) => void = () => void 0;\n private _onTouched: () => void = () => void 0;\n private _ngControl: NgControl \| null = null;\n private _editorInstance: QuillEditorComponent \| null = null;\n\n protected readonly isDisabled = computed(() => this._disabled() \|\| this.zDisabled());\n protected readonly internalValue = computed(() => this._value());\n protected readonly effectivePlaceholder = computed(() => {\n this._zTranslate.currentLang();\n return this.zPlaceholder() \|\| this._zTranslate.instant('i18n_z_ui_editor_placeholder');\n });\n\n protected readonly effectiveModules = computed<QuillModules>(() => {\n const customModules = this.zModules();\n if (customModules) {\n return customModules;\n }\n\n return {\n toolbar: DEFAULT_TOOLBAR,\n resize: {\n locale: {},\n },\n history: {\n delay: 1000,\n maxStack: 50,\n userOnly: true,\n },\n };\n });\n\n private readonly _shouldShowValidation = computed(() => {\n const control = this._formControl();\n this._formStateVersion();\n\n if (this._isNgModel()) {\n return this._dirty() \|\| this._touched();\n }\n\n if (control) {\n return control.dirty;\n }\n\n return this._dirty() \|\| this._touched();\n });\n\n private _getValidationErrors(): string[] {\n const errors: string[] = [];\n const value = this._value();\n const validators = this.zValidators();\n\n if (!this._shouldShowValidation()) {\n return errors;\n }\n\n for (const validator of validators) {\n if (validator.error === 'required' && this.zRequired()) {\n if (!value \|\| value.trim() === '' \|\| value === '<p><br></p>') {\n errors.push(validator.message);\n }\n continue;\n }\n\n if (validator.minLength && value.length < validator.minLength) {\n errors.push(validator.message);\n continue;\n }\n\n if (validator.maxLength && value.length > validator.maxLength) {\n errors.push(validator.message);\n continue;\n }\n\n if (validator.pattern && !validator.pattern.test(value)) {\n errors.push(validator.message);\n }\n }\n\n return errors;\n }\n\n protected readonly hasError = computed(() => {\n const customErrors = this._getValidationErrors();\n if (customErrors.length > 0) {\n return true;\n }\n\n const control = this._formControl();\n this._formStateVersion();\n\n if (!control) {\n return false;\n }\n\n return control.invalid && this._shouldShowValidation();\n });\n\n protected readonly showError = computed(() => this.hasError());\n\n protected readonly errorMessage = computed(() => {\n const customErrors = this._getValidationErrors();\n if (customErrors.length > 0) {\n return customErrors[0];\n }\n\n const control = this._formControl();\n const errors = control?.errors;\n\n if (!errors) {\n return '';\n }\n\n this._zTranslate.currentLang();\n if (errors['required']) {\n return this._zTranslate.instant('i18n_z_ui_editor_required');\n }\n\n if (errors['minlength']) {\n return this._zTranslate.instant('i18n_z_ui_editor_min_length', {\n min: errors['minlength'].requiredLength,\n });\n }\n\n if (errors['maxlength']) {\n return this._zTranslate.instant('i18n_z_ui_editor_max_length', {\n max: errors['maxlength'].requiredLength,\n });\n }\n\n return this._zTranslate.instant('i18n_z_ui_editor_invalid');\n });\n\n protected readonly currentStatus = computed(() => {\n if (this.isDisabled()) {\n return 'disabled';\n }\n\n if (this.zReadonly()) {\n return 'readonly';\n }\n\n if (this.hasError()) {\n return 'error';\n }\n\n return 'default';\n });\n\n protected readonly wrapperClasses = computed(() => 'z-editor-wrapper flex w-full flex-col gap-2');\n\n protected readonly labelClasses = computed(() =>\n zMergeClasses('mb-1.5 block text-sm font-medium text-foreground', this.zLabelClass())\n );\n\n protected readonly editorClasses = computed(() =>\n zMergeClasses(\n zEditorVariants({\n zSize: this.zSize(),\n zStatus: this.currentStatus(),\n }),\n this.class()\n )\n );\n\n ngOnInit(): void {\n queueMicrotask(() => {\n try {\n this._ngControl = this._injector.get(NgControl, null);\n this._isNgModel.set(this._ngControl instanceof NgModel);\n\n if (this._ngControl?.control) {\n const { control } = this._ngControl;\n this._formControl.set(control);\n merge(\n control.statusChanges,\n control.valueChanges,\n control.events.pipe(\n filter(event => event instanceof PristineChangeEvent \|\| event instanceof TouchedChangeEvent)\n )\n )\n .pipe(takeUntilDestroyed(this._destroyRef))\n .subscribe(() => {\n this._formStateVersion.update(v => v + 1);\n });\n }\n } catch {\n this._ngControl = null;\n }\n });\n\n setTimeout(() => this._emitControl());\n }\n\n public writeValue(value: string): void {\n this._value.set(value \|\| '');\n }\n\n public registerOnChange(fn: (value: string) => void): void {\n this._onChange = fn;\n }\n\n public registerOnTouched(fn: () => void): void {\n this._onTouched = fn;\n }\n\n public setDisabledState(isDisabled: boolean): void {\n this._disabled.set(isDisabled);\n }\n\n protected onContentChange(event: ContentChange): void {\n const html = event.html \|\| '';\n this._value.set(html);\n this._dirty.set(true);\n this._onChange(html);\n this.zOnChange.emit(html);\n }\n\n protected onFocus(): void {\n this.zOnFocus.emit();\n }\n\n protected onBlur(): void {\n if (this._dirty()) {\n this._touched.set(true);\n }\n\n this._onTouched();\n this.zOnBlur.emit();\n }\n\n public focus(): void {\n this._editorInstance?.quillEditor?.focus();\n }\n\n public blur(): void {\n this._editorInstance?.quillEditor?.blur();\n }\n\n public clear(): void {\n this._value.set('');\n this._onChange('');\n }\n\n public setContent(content: string): void {\n this._value.set(content);\n this._onChange(content);\n }\n\n public getContent(): string {\n return this._value();\n }\n\n public getText(): string {\n return this._editorInstance?.quillEditor?.getText() \|\| '';\n }\n\n public getLength(): number {\n return this._editorInstance?.quillEditor?.getLength() \|\| 0;\n }\n\n public markAsTouched(): void {\n this._touched.set(true);\n this._onTouched();\n }\n\n public markAsDirty(): void {\n this._dirty.set(true);\n }\n\n public markAsPristine(): void {\n this._dirty.set(false);\n }\n\n public markAsUntouched(): void {\n this._touched.set(false);\n }\n\n public setValue(content: string): void {\n this.setContent(content);\n }\n\n public validate(): void {\n this._touched.set(true);\n this._dirty.set(true);\n this._onTouched();\n\n if (this._ngControl?.control) {\n this._ngControl.control.markAsDirty();\n this._ngControl.control.markAsTouched();\n }\n }\n\n public reset(): void {\n this._value.set('');\n this._touched.set(false);\n this._dirty.set(false);\n this._onChange('');\n\n if (this._ngControl?.control) {\n this._ngControl.control.markAsPristine();\n this._ngControl.control.markAsUntouched();\n }\n }\n\n private _emitControl(): void {\n this.zControl.emit({\n focus: () => this.focus(),\n blur: () => this.blur(),\n clear: () => this.clear(),\n setContent: (content: string) => this.setContent(content),\n getContent: () => this.getContent(),\n getText: () => this.getText(),\n getLength: () => this.getLength(),\n validate: () => this.validate(),\n reset: () => this.reset(),\n markAsTouched: () => this.markAsTouched(),\n markAsUntouched: () => this.markAsUntouched(),\n markAsDirty: () => this.markAsDirty(),\n markAsPristine: () => this.markAsPristine(),\n setValue: (content: string) => this.setValue(content),\n hasError: this.hasError,\n value: this.internalValue,\n errorMessage: this.errorMessage,\n });\n }\n}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAEO,MAAM,eAAe,GAAG,GAAG,CAChC;IACE,4EAA4E;IAC5E,kFAAkF;IAClF,oCAAoC;IACpC,cAAc;CACf,EACD;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,EAAE,EAAE,gDAAgD;AACpD,YAAA,OAAO,EAAE,gDAAgD;AACzD,YAAA,EAAE,EAAE,kDAAkD;AACvD,SAAA;AACD,QAAA,OAAO,EAAE;AACP,YAAA,OAAO,EAAE,4EAA4E;AACrF,YAAA,KAAK,EACH,sHAAsH;AACxH,YAAA,QAAQ,EAAE,+DAA+D;AACzE,YAAA,QAAQ,EAAE,mDAAmD;AAC9D,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,OAAO,EAAE,SAAS;AACnB,KAAA;AACF,CAAA;;ACQH,KAAK,CAAC,QAAQ,CAAC,gBAAgB,EAAE,gBAAgB,CAAC;AAClD,MAAM,eAAe,GAAG;AACtB,IAAA,CAAC,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,CAAC;IACzC,CAAC,YAAY,EAAE,YAAY,CAAC;IAC5B,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC;IAC9B,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;IACzC,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC;AACpC,IAAA,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC;IACf,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC;IACnC,CAAC,MAAM,EAAE,OAAO,CAAC;AACjB,IAAA,CAAC,OAAO,CAAC;CACV;MAmDY,gBAAgB,CAAA;AACV,IAAA,SAAS,GAAG,MAAM,CAAC,QAAQ,CAAC;AAC5B,IAAA,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC;AAChC,IAAA,WAAW,GAAG,MAAM,CAAC,iBAAiB,CAAC;IAExC,SAAS,GAAG,MAAM,EAAU;IAC5B,QAAQ,GAAG,MAAM,EAAQ;IACzB,OAAO,GAAG,MAAM,EAAQ;IACxB,QAAQ,GAAG,MAAM,EAAkB;AAEnC,IAAA,KAAK,GAAG,KAAK,CAAa,EAAE,iDAAC;AAC7B,IAAA,KAAK,GAAG,KAAK,CAAc,SAAS,iDAAC;AACrC,IAAA,MAAM,GAAG,KAAK,CAAS,EAAE,kDAAC;AAC1B,IAAA,WAAW,GAAG,KAAK,CAAS,EAAE,uDAAC;AAC/B,IAAA,YAAY,GAAG,KAAK,CAAS,EAAE,wDAAC;IAChC,SAAS,GAAG,KAAK,CAAC,KAAK,sDAAI,SAAS,EAAE,UAAU,EAAA,CAAG;IACnD,SAAS,GAAG,KAAK,CAAC,KAAK,sDAAI,SAAS,EAAE,UAAU,EAAA,CAAG;IACnD,SAAS,GAAG,KAAK,CAAC,KAAK,sDAAI,SAAS,EAAE,UAAU,EAAA,CAAG;AACnD,IAAA,QAAQ,GAAG,KAAK,CAAsB,IAAI,oDAAC;AAC3C,IAAA,QAAQ,GAAG,KAAK,CAAkB,IAAI,oDAAC;AACvC,IAAA,OAAO,GAAG,KAAK,CAAuB,eAAe,mDAAC;AACtD,IAAA,MAAM,GAAG,KAAK,CAAoB,MAAM,kDAAC;AACzC,IAAA,WAAW,GAAG,KAAK,CAAqB,EAAE,uDAAC;AAExC,IAAA,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC;AAE9B,IAAA,MAAM,GAAG,MAAM,CAAS,EAAE,kDAAC;AAC3B,IAAA,QAAQ,GAAG,MAAM,CAAC,KAAK,oDAAC;AACxB,IAAA,SAAS,GAAG,MAAM,CAAC,KAAK,qDAAC;AACzB,IAAA,MAAM,GAAG,MAAM,CAAC,KAAK,kDAAC;AACtB,IAAA,YAAY,GAAG,MAAM,CAAyB,IAAI,wDAAC;AACnD,IAAA,iBAAiB,GAAG,MAAM,CAAC,CAAC,6DAAC;AAC7B,IAAA,UAAU,GAAG,MAAM,CAAC,KAAK,sDAAC;AACnC,IAAA,SAAS,GAA4B,MAAM,KAAK,CAAC;AACjD,IAAA,UAAU,GAAe,MAAM,KAAK,CAAC;IACrC,UAAU,GAAqB,IAAI;IACnC,eAAe,GAAgC,IAAI;AAExC,IAAA,UAAU,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,SAAS,EAAE,IAAI,IAAI,CAAC,SAAS,EAAE,sDAAC;IACjE,aAAa,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,MAAM,EAAE,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,eAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAC;AAC7C,IAAA,oBAAoB,GAAG,QAAQ,CAAC,MAAK;AACtD,QAAA,IAAI,CAAC,WAAW,CAAC,WAAW,EAAE;AAC9B,QAAA,OAAO,IAAI,CAAC,YAAY,EAAE,IAAI,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,8BAA8B,CAAC;AACxF,IAAA,CAAC,gEAAC;AAEiB,IAAA,gBAAgB,GAAG,QAAQ,CAAe,MAAK;AAChE,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,EAAE;QACrC,IAAI,aAAa,EAAE;AACjB,YAAA,OAAO,aAAa;QACtB;QAEA,OAAO;AACL,YAAA,OAAO,EAAE,eAAe;AACxB,YAAA,MAAM,EAAE;AACN,gBAAA,MAAM,EAAE,EAAE;AACX,aAAA;AACD,YAAA,OAAO,EAAE;AACP,gBAAA,KAAK,EAAE,IAAI;AACX,gBAAA,QAAQ,EAAE,EAAE;AACZ,gBAAA,QAAQ,EAAE,IAAI;AACf,aAAA;SACF;AACH,IAAA,CAAC,4DAAC;AAEe,IAAA,qBAAqB,GAAG,QAAQ,CAAC,MAAK;AACrD,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,EAAE;QACnC,IAAI,CAAC,iBAAiB,EAAE;AAExB,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE,EAAE;YACrB,OAAO,IAAI,CAAC,MAAM,EAAE,IAAI,IAAI,CAAC,QAAQ,EAAE;QACzC;QAEA,IAAI,OAAO,EAAE;YACX,OAAO,OAAO,CAAC,KAAK;QACtB;QAEA,OAAO,IAAI,CAAC,MAAM,EAAE,IAAI,IAAI,CAAC,QAAQ,EAAE;AACzC,IAAA,CAAC,iEAAC;IAEM,oBAAoB,GAAA;QAC1B,MAAM,MAAM,GAAa,EAAE;AAC3B,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,MAAM,EAAE;AAC3B,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,WAAW,EAAE;AAErC,QAAA,IAAI,CAAC,IAAI,CAAC,qBAAqB,EAAE,EAAE;AACjC,YAAA,OAAO,MAAM;QACf;AAEA,QAAA,KAAK,MAAM,SAAS,IAAI,UAAU,EAAE;YAClC,IAAI,SAAS,CAAC,KAAK,KAAK,UAAU,IAAI,IAAI,CAAC,SAAS,EAAE,EAAE;AACtD,gBAAA,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,KAAK,KAAK,aAAa,EAAE;AAC5D,oBAAA,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC;gBAChC;gBACA;YACF;AAEA,YAAA,IAAI,SAAS,CAAC,SAAS,IAAI,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,SAAS,EAAE;AAC7D,gBAAA,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC;gBAC9B;YACF;AAEA,YAAA,IAAI,SAAS,CAAC,SAAS,IAAI,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,SAAS,EAAE;AAC7D,gBAAA,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC;gBAC9B;YACF;AAEA,YAAA,IAAI,SAAS,CAAC,OAAO,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;AACvD,gBAAA,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC;YAChC;QACF;AAEA,QAAA,OAAO,MAAM;IACf;AAEmB,IAAA,QAAQ,GAAG,QAAQ,CAAC,MAAK;AAC1C,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,oBAAoB,EAAE;AAChD,QAAA,IAAI,YAAY,CAAC,MAAM,GAAG,CAAC,EAAE;AAC3B,YAAA,OAAO,IAAI;QACb;AAEA,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,EAAE;QACnC,IAAI,CAAC,iBAAiB,EAAE;QAExB,IAAI,CAAC,OAAO,EAAE;AACZ,YAAA,OAAO,KAAK;QACd;QAEA,OAAO,OAAO,CAAC,OAAO,IAAI,IAAI,CAAC,qBAAqB,EAAE;AACxD,IAAA,CAAC,oDAAC;IAEiB,SAAS,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,QAAQ,EAAE,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,WAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAC;AAE3C,IAAA,YAAY,GAAG,QAAQ,CAAC,MAAK;AAC9C,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,oBAAoB,EAAE;AAChD,QAAA,IAAI,YAAY,CAAC,MAAM,GAAG,CAAC,EAAE;AAC3B,YAAA,OAAO,YAAY,CAAC,CAAC,CAAC;QACxB;AAEA,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,EAAE;AACnC,QAAA,MAAM,MAAM,GAAG,OAAO,EAAE,MAAM;QAE9B,IAAI,CAAC,MAAM,EAAE;AACX,YAAA,OAAO,EAAE;QACX;AAEA,QAAA,IAAI,CAAC,WAAW,CAAC,WAAW,EAAE;AAC9B,QAAA,IAAI,MAAM,CAAC,UAAU,CAAC,EAAE;YACtB,OAAO,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,2BAA2B,CAAC;QAC9D;AAEA,QAAA,IAAI,MAAM,CAAC,WAAW,CAAC,EAAE;AACvB,YAAA,OAAO,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,6BAA6B,EAAE;AAC7D,gBAAA,GAAG,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,cAAc;AACxC,aAAA,CAAC;QACJ;AAEA,QAAA,IAAI,MAAM,CAAC,WAAW,CAAC,EAAE;AACvB,YAAA,OAAO,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,6BAA6B,EAAE;AAC7D,gBAAA,GAAG,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC,cAAc;AACxC,aAAA,CAAC;QACJ;QAEA,OAAO,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,0BAA0B,CAAC;AAC7D,IAAA,CAAC,wDAAC;AAEiB,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAK;AAC/C,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE,EAAE;AACrB,YAAA,OAAO,UAAU;QACnB;AAEA,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE,EAAE;AACpB,YAAA,OAAO,UAAU;QACnB;AAEA,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE,EAAE;AACnB,YAAA,OAAO,OAAO;QAChB;AAEA,QAAA,OAAO,SAAS;AAClB,IAAA,CAAC,yDAAC;IAEiB,cAAc,GAAG,QAAQ,CAAC,MAAM,6CAA6C,0DAAC;AAE9E,IAAA,YAAY,GAAG,QAAQ,CAAC,MACzC,aAAa,CAAC,kDAAkD,EAAE,IAAI,CAAC,WAAW,EAAE,CAAC,wDACtF;IAEkB,aAAa,GAAG,QAAQ,CAAC,MAC1C,aAAa,CACX,eAAe,CAAC;AACd,QAAA,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE;AACnB,QAAA,OAAO,EAAE,IAAI,CAAC,aAAa,EAAE;AAC9B,KAAA,CAAC,EACF,IAAI,CAAC,KAAK,EAAE,CACb,yDACF;IAED,QAAQ,GAAA;QACN,cAAc,CAAC,MAAK;AAClB,YAAA,IAAI;AACF,gBAAA,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,SAAS,EAAE,IAAI,CAAC;gBACrD,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,UAAU,YAAY,OAAO,CAAC;AAEvD,gBAAA,IAAI,IAAI,CAAC,UAAU,EAAE,OAAO,EAAE;AAC5B,oBAAA,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,UAAU;AACnC,oBAAA,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC;AAC9B,oBAAA,KAAK,CACH,OAAO,CAAC,aAAa,EACrB,OAAO,CAAC,YAAY,EACpB,OAAO,CAAC,MAAM,CAAC,IAAI,CACjB,MAAM,CAAC,KAAK,IAAI,KAAK,YAAY,mBAAmB,IAAI,KAAK,YAAY,kBAAkB,CAAC,CAC7F;AAEA,yBAAA,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,WAAW,CAAC;yBACzC,SAAS,CAAC,MAAK;AACd,wBAAA,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAC3C,oBAAA,CAAC,CAAC;gBACN;YACF;AAAE,YAAA,MAAM;AACN,gBAAA,IAAI,CAAC,UAAU,GAAG,IAAI;YACxB;AACF,QAAA,CAAC,CAAC;QAEF,UAAU,CAAC,MAAM,IAAI,CAAC,YAAY,EAAE,CAAC;IACvC;AAEO,IAAA,UAAU,CAAC,KAAa,EAAA;QAC7B,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,IAAI,EAAE,CAAC;IAC9B;AAEO,IAAA,gBAAgB,CAAC,EAA2B,EAAA;AACjD,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE;IACrB;AAEO,IAAA,iBAAiB,CAAC,EAAc,EAAA;AACrC,QAAA,IAAI,CAAC,UAAU,GAAG,EAAE;IACtB;AAEO,IAAA,gBAAgB,CAAC,UAAmB,EAAA;AACzC,QAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC;IAChC;AAEU,IAAA,eAAe,CAAC,KAAoB,EAAA;AAC5C,QAAA,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,IAAI,EAAE;AAC7B,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC;AACrB,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC;AACrB,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;AACpB,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;IAC3B;IAEU,OAAO,GAAA;AACf,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE;IACtB;IAEU,MAAM,GAAA;AACd,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE,EAAE;AACjB,YAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC;QACzB;QAEA,IAAI,CAAC,UAAU,EAAE;AACjB,QAAA,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE;IACrB;IAEO,KAAK,GAAA;AACV,QAAA,IAAI,CAAC,eAAe,EAAE,WAAW,EAAE,KAAK,EAAE;IAC5C;IAEO,IAAI,GAAA;AACT,QAAA,IAAI,CAAC,eAAe,EAAE,WAAW,EAAE,IAAI,EAAE;IAC3C;IAEO,KAAK,GAAA;AACV,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC;AACnB,QAAA,IAAI,CAAC,SAAS,CAAC,EAAE,CAAC;IACpB;AAEO,IAAA,UAAU,CAAC,OAAe,EAAA;AAC/B,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC;AACxB,QAAA,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC;IACzB;IAEO,UAAU,GAAA;AACf,QAAA,OAAO,IAAI,CAAC,MAAM,EAAE;IACtB;IAEO,OAAO,GAAA;QACZ,OAAO,IAAI,CAAC,eAAe,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAE;IAC3D;IAEO,SAAS,GAAA;QACd,OAAO,IAAI,CAAC,eAAe,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,CAAC;IAC5D;IAEO,aAAa,GAAA;AAClB,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC;QACvB,IAAI,CAAC,UAAU,EAAE;IACnB;IAEO,WAAW,GAAA;AAChB,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC;IACvB;IAEO,cAAc,GAAA;AACnB,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC;IACxB;IAEO,eAAe,GAAA;AACpB,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC;IAC1B;AAEO,IAAA,QAAQ,CAAC,OAAe,EAAA;AAC7B,QAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC;IAC1B;IAEO,QAAQ,GAAA;AACb,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC;AACvB,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC;QACrB,IAAI,CAAC,UAAU,EAAE;AAEjB,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE,OAAO,EAAE;AAC5B,YAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,WAAW,EAAE;AACrC,YAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,aAAa,EAAE;QACzC;IACF;IAEO,KAAK,GAAA;AACV,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC;AACnB,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC;AACxB,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC;AACtB,QAAA,IAAI,CAAC,SAAS,CAAC,EAAE,CAAC;AAElB,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE,OAAO,EAAE;AAC5B,YAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,cAAc,EAAE;AACxC,YAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,eAAe,EAAE;QAC3C;IACF;IAEQ,YAAY,GAAA;AAClB,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;AACjB,YAAA,KAAK,EAAE,MAAM,IAAI,CAAC,KAAK,EAAE;AACzB,YAAA,IAAI,EAAE,MAAM,IAAI,CAAC,IAAI,EAAE;AACvB,YAAA,KAAK,EAAE,MAAM,IAAI,CAAC,KAAK,EAAE;YACzB,UAAU,EAAE,CAAC,OAAe,KAAK,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC;AACzD,YAAA,UAAU,EAAE,MAAM,IAAI,CAAC,UAAU,EAAE;AACnC,YAAA,OAAO,EAAE,MAAM,IAAI,CAAC,OAAO,EAAE;AAC7B,YAAA,SAAS,EAAE,MAAM,IAAI,CAAC,SAAS,EAAE;AACjC,YAAA,QAAQ,EAAE,MAAM,IAAI,CAAC,QAAQ,EAAE;AAC/B,YAAA,KAAK,EAAE,MAAM,IAAI,CAAC,KAAK,EAAE;AACzB,YAAA,aAAa,EAAE,MAAM,IAAI,CAAC,aAAa,EAAE;AACzC,YAAA,eAAe,EAAE,MAAM,IAAI,CAAC,eAAe,EAAE;AAC7C,YAAA,WAAW,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE;AACrC,YAAA,cAAc,EAAE,MAAM,IAAI,CAAC,cAAc,EAAE;YAC3C,QAAQ,EAAE,CAAC,OAAe,KAAK,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC;YACrD,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,KAAK,EAAE,IAAI,CAAC,aAAa;YACzB,YAAY,EAAE,IAAI,CAAC,YAAY;AAChC,SAAA,CAAC;IACJ;uGArWW,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,SAAA,EAAA,WAAA,EAAA,QAAA,EAAA,UAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,SAAA,EAXhB;AACT,YAAA;AACE,gBAAA,OAAO,EAAE,iBAAiB;AAC1B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,gBAAgB,CAAC;AAC/C,gBAAA,KAAK,EAAE,IAAI;AACZ,aAAA;SACF,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAxCS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,gk8BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAlCS,WAAW,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,cAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,mBAAmB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,WAAW,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,qDAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,gBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FA+C5C,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAjD5B,SAAS;+BACE,UAAU,EAAA,OAAA,EACX,CAAC,WAAW,EAAE,mBAAmB,EAAE,WAAW,CAAC,EAAA,UAAA,EAC5C,IAAI,EAAA,QAAA,EACN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCT,EAAA,SAAA,EAEU;AACT,wBAAA;AACE,4BAAA,OAAO,EAAE,iBAAiB;AAC1B,4BAAA,WAAW,EAAE,UAAU,CAAC,sBAAsB,CAAC;AAC/C,4BAAA,KAAK,EAAE,IAAI;AACZ,yBAAA;qBACF,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,YAC3B,SAAS,EAAA,MAAA,EAAA,CAAA,gk8BAAA,CAAA,EAAA;;;AChGrB;;AAEG;;;;"}

package/fesm2022/shival99-z-ui-components-z-filter.mjs CHANGED Viewed

@@ -1,6 +1,6 @@
 import { NgTemplateOutlet } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Pipe, input, output, contentChild, signal, viewChild, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { Pipe, contentChild, output, input, signal, viewChild, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
 import { ZButtonComponent } from '@shival99/z-ui/components/z-button';
 import { ZIconComponent } from '@shival99/z-ui/components/z-icon';
 import { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';
@@ -518,6 +518,11 @@ const zFilterBetweenVariants = cva('text-muted-foreground flex items-center', {
 });
 class ZFilterComponent {
+    addButtonTemplate = contentChild('addButton', ...(ngDevMode ? [{ debugName: "addButtonTemplate" }] : []));
+    zFiltersChange = output();
+    zFilterAdd = output();
+    zFilterRemove = output();
+    zFilterUpdate = output();
     class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
     zFilters = input.required(...(ngDevMode ? [{ debugName: "zFilters" }] : []));
     zFields = input.required(...(ngDevMode ? [{ debugName: "zFields" }] : []));
@@ -527,11 +532,6 @@ class ZFilterComponent {
     zAllowMultiple = input(true, ...(ngDevMode ? [{ debugName: "zAllowMultiple" }] : []));
     zAddButtonIcon = input('lucidePlus', ...(ngDevMode ? [{ debugName: "zAddButtonIcon" }] : []));
     zAddButtonText = input(...(ngDevMode ? [undefined, { debugName: "zAddButtonText" }] : []));
-    zFiltersChange = output();
-    zFilterAdd = output();
-    zFilterRemove = output();
-    zFilterUpdate = output();
-    addButtonTemplate = contentChild('addButton', ...(ngDevMode ? [{ debugName: "addButtonTemplate" }] : []));
     addFilterOpen = signal(false, ...(ngDevMode ? [{ debugName: "addFilterOpen" }] : []));
     searchQuery = signal('', ...(ngDevMode ? [{ debugName: "searchQuery" }] : []));
     operatorPopoverOpen = signal(null, ...(ngDevMode ? [{ debugName: "operatorPopoverOpen" }] : []));
@@ -770,7 +770,7 @@ class ZFilterComponent {
         return field.key || `field-${index}`;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: ZFilterComponent, isStandalone: true, selector: "z-filter", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zFilters: { classPropertyName: "zFilters", publicName: "zFilters", isSignal: true, isRequired: true, transformFunction: null }, zFields: { classPropertyName: "zFields", publicName: "zFields", isSignal: true, isRequired: true, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zI18n: { classPropertyName: "zI18n", publicName: "zI18n", isSignal: true, isRequired: false, transformFunction: null }, zShowAddButton: { classPropertyName: "zShowAddButton", publicName: "zShowAddButton", isSignal: true, isRequired: false, transformFunction: null }, zAllowMultiple: { classPropertyName: "zAllowMultiple", publicName: "zAllowMultiple", isSignal: true, isRequired: false, transformFunction: null }, zAddButtonIcon: { classPropertyName: "zAddButtonIcon", publicName: "zAddButtonIcon", isSignal: true, isRequired: false, transformFunction: null }, zAddButtonText: { classPropertyName: "zAddButtonText", publicName: "zAddButtonText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zFiltersChange: "zFiltersChange", zFilterAdd: "zFilterAdd", zFilterRemove: "zFilterRemove", zFilterUpdate: "zFilterUpdate" }, host: { attributes: { "data-slot": "z-filter" }, properties: { "class": "hostClasses()" } }, queries: [{ propertyName: "addButtonTemplate", first: true, predicate: ["addButton"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "addFilterSearchInput", first: true, predicate: ["addFilterSearchInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Add Filter Button -->\n@if (zShowAddButton() && selectableFields().length > 0) {\n  @if (addButtonTemplate()) {\n    <ng-container [ngTemplateOutlet]=\"addButtonTemplate()!\" />\n  } @else {\n    <button\n      z-button\n      zType=\"outline\"\n      [zSize]=\"buttonSize()\"\n      z-popover\n      [zPopoverContent]=\"addFilterPopover\"\n      zTrigger=\"click\"\n      zPosition=\"bottom-left\"\n      [zOffset]=\"6\"\n      (zShow)=\"addFilterOpen.set(true); focusSearchInput()\"\n      (zHide)=\"addFilterOpen.set(false); searchQuery.set('')\">\n      <z-icon [zType]=\"zAddButtonIcon()\" zSize=\"14\" />\n      {{ zAddButtonText() || i18n().addFilter }}\n    </button>\n  }\n}\n\n<ng-template #addFilterPopover let-close=\"close\">\n  <div class=\"w-[200px]\">\n    <div class=\"border-border flex items-center border-b px-3\">\n      <z-icon zType=\"lucideSearch\" zSize=\"16\" class=\"text-muted-foreground/50 mr-2 shrink-0\" />\n      <input\n        #addFilterSearchInput\n        type=\"text\"\n        [placeholder]=\"i18n().searchFields\"\n        [value]=\"searchQuery()\"\n        (input)=\"onSearchInput($event)\"\n        class=\"placeholder:text-muted-foreground text-foreground flex h-10 w-full bg-transparent py-3 text-sm outline-none\" />\n    </div>\n    <div class=\"flex max-h-[300px] flex-col gap-0.5 overflow-y-auto p-1\">\n      @for (group of groupedFields(); track group.group; let groupIndex = $index) {\n        @if (group.group) {\n          <div\n            class=\"text-muted-foreground px-2 py-1.5 text-xs font-medium\"\n            [class.border-border]=\"groupIndex > 0\"\n            [class.mt-2]=\"groupIndex > 0\"\n            [class.border-t]=\"groupIndex > 0\"\n            [class.ml-1]=\"groupIndex > 0\">\n            {{ group.group }}\n          </div>\n        }\n        @for (field of group.fields; track trackByFieldKey($index, field)) {\n          <button\n            type=\"button\"\n            class=\"hover:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors\"\n            (click)=\"onFieldSelect(field); close()\">\n            @if (field.icon) {\n              <z-icon [zType]=\"field.icon\" zSize=\"14\" class=\"text-muted-foreground\" />\n            }\n            <span>{{ field.label }}</span>\n          </button>\n        }\n      } @empty {\n        <div class=\"text-muted-foreground py-6 text-center text-sm\">\n          {{ i18n().noFieldsFound }}\n        </div>\n      }\n    </div>\n  </div>\n</ng-template>\n\n<!-- Filter Items -->\n@for (filter of zFilters(); track trackByFilterId($index, filter)) {\n  @if (filter | zFilterField: $any(zFields()); as field) {\n    <div [class]=\"getItemClasses()\" data-slot=\"filter-item\">\n      <!-- Field Label -->\n      <div [class]=\"getLabelClasses()\">\n        @if (field.icon) {\n          <z-icon [zType]=\"field.icon\" zSize=\"14\" />\n        }\n        {{ field.label }}\n      </div>\n\n      <!-- Operator Dropdown -->\n      <button\n        type=\"button\"\n        z-popover\n        [zPopoverContent]=\"operatorDropdown\"\n        zTrigger=\"click\"\n        zPosition=\"bottom-left\"\n        [zOffset]=\"4\"\n        (zShow)=\"operatorPopoverOpen.set(filter.id)\"\n        (zHide)=\"operatorPopoverOpen.set(null)\"\n        class=\"text-muted-foreground hover:text-foreground hover:bg-muted flex cursor-pointer items-center px-2.5 text-sm transition-colors\"\n        [class.text-foreground]=\"operatorPopoverOpen() === filter.id\"\n        [class.bg-muted]=\"operatorPopoverOpen() === filter.id\">\n        {{ filter | zFilterOperatorLabel: $any(zFields()) : i18n() }}\n        <z-icon zType=\"lucideChevronDown\" zSize=\"12\" class=\"ml-1\" />\n      </button>\n\n      <ng-template #operatorDropdown let-close=\"close\">\n        <div class=\"flex w-fit min-w-32 flex-col gap-0.5 p-1\">\n          @for (op of filter | zFilterOperators: $any(zFields()) : i18n(); track op.value) {\n            <button\n              type=\"button\"\n              class=\"hover:bg-accent flex w-full cursor-pointer items-center justify-between gap-4 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none\"\n              (click)=\"updateFilterOperator(filter, op.value); close()\">\n              <span>{{ op.label }}</span>\n              @if (op.value === filter.operator) {\n                <z-icon zType=\"lucideCheck\" zSize=\"14\" class=\"text-primary\" />\n              }\n            </button>\n          }\n        </div>\n      </ng-template>\n\n      <!-- Value Selector -->\n      @if (!(filter | zFilterIsValueHidden)) {\n        <!-- Boolean Field -->\n        @if (field.type === 'boolean') {\n          <div class=\"flex items-center gap-2 px-2.5\">\n            <z-switch [zChecked]=\"filter.values[0] === true\" (zChange)=\"onBooleanChange(filter, $event)\" zSize=\"sm\" />\n            @if (field.onLabel && field.offLabel) {\n              <span class=\"text-muted-foreground text-xs\">\n                {{ filter.values[0] === true ? field.onLabel : field.offLabel }}\n              </span>\n            }\n          </div>\n        }\n\n        <!-- Text/Email/URL/Tel Input -->\n        @else if (field.type === 'text' || field.type === 'email' || field.type === 'url' || field.type === 'tel') {\n          <div [class]=\"getInputClasses()\" class=\"w-36\">\n            @if (field.prefix) {\n              <span class=\"text-muted-foreground mr-1\">{{ field.prefix }}</span>\n            }\n            <input\n              type=\"{{\n                field.type === 'email' ? 'email' : field.type === 'url' ? 'url' : field.type === 'tel' ? 'tel' : 'text'\n              }}\"\n              [value]=\"filter.values[0] || ''\"\n              [placeholder]=\"field.placeholder || i18n().placeholders.enterField\"\n              [pattern]=\"field | zFilterInputPattern\"\n              class=\"w-full bg-transparent outline-none\"\n              (blur)=\"onInputChange(filter, $event)\" />\n            @if (field.suffix) {\n              <span class=\"text-muted-foreground ml-1\">{{ field.suffix }}</span>\n            }\n          </div>\n        }\n\n        <!-- Number Input -->\n        @else if (field.type === 'number') {\n          @if (filter | zFilterIsBetweenOperator) {\n            <div class=\"flex items-center\">\n              <div [class]=\"getInputClasses()\" class=\"w-20\">\n                @if (field.prefix) {\n                  <span class=\"text-muted-foreground mr-1\">{{ field.prefix }}</span>\n                }\n                <input\n                  type=\"number\"\n                  [value]=\"filter.values[0] || ''\"\n                  [placeholder]=\"i18n().min\"\n                  [min]=\"field.min\"\n                  [max]=\"field.max\"\n                  [step]=\"field.step\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (blur)=\"onInputChange(filter, $event, 0)\" />\n              </div>\n              <div [class]=\"getBetweenClasses()\">{{ i18n().to }}</div>\n              <div [class]=\"getInputClasses()\" class=\"w-20\">\n                <input\n                  type=\"number\"\n                  [value]=\"filter.values[1] || ''\"\n                  [placeholder]=\"i18n().max\"\n                  [min]=\"field.min\"\n                  [max]=\"field.max\"\n                  [step]=\"field.step\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (blur)=\"onInputChange(filter, $event, 1)\" />\n                @if (field.suffix) {\n                  <span class=\"text-muted-foreground ml-1\">{{ field.suffix }}</span>\n                }\n              </div>\n            </div>\n          } @else {\n            <div [class]=\"getInputClasses()\" class=\"w-24\">\n              @if (field.prefix) {\n                <span class=\"text-muted-foreground mr-1\">{{ field.prefix }}</span>\n              }\n              <input\n                type=\"number\"\n                [value]=\"filter.values[0] || ''\"\n                [placeholder]=\"field.placeholder || i18n().placeholders.enterField\"\n                [min]=\"field.min\"\n                [max]=\"field.max\"\n                [step]=\"field.step\"\n                class=\"w-full bg-transparent outline-none\"\n                (blur)=\"onInputChange(filter, $event)\" />\n              @if (field.suffix) {\n                <span class=\"text-muted-foreground ml-1\">{{ field.suffix }}</span>\n              }\n            </div>\n          }\n        }\n\n        <!-- Date Input -->\n        @else if (field.type === 'date') {\n          <div [class]=\"getInputClasses()\" class=\"w-36\">\n            <input\n              type=\"date\"\n              [value]=\"filter.values[0] || ''\"\n              class=\"w-full bg-transparent outline-none\"\n              (change)=\"onInputChange(filter, $event)\" />\n          </div>\n        }\n\n        <!-- Date Range Input -->\n        @else if (field.type === 'daterange') {\n          <div class=\"flex items-center\">\n            <div [class]=\"getInputClasses()\" class=\"w-32\">\n              <input\n                type=\"date\"\n                [value]=\"filter.values[0] || ''\"\n                class=\"w-full bg-transparent outline-none\"\n                (change)=\"onInputChange(filter, $event, 0)\" />\n            </div>\n            <div [class]=\"getBetweenClasses()\">{{ i18n().to }}</div>\n            <div [class]=\"getInputClasses()\" class=\"w-32\">\n              <input\n                type=\"date\"\n                [value]=\"filter.values[1] || ''\"\n                class=\"w-full bg-transparent outline-none\"\n                (change)=\"onInputChange(filter, $event, 1)\" />\n            </div>\n          </div>\n        }\n\n        <!-- Time Input -->\n        @else if (field.type === 'time') {\n          @if (filter | zFilterIsBetweenOperator) {\n            <div class=\"flex items-center\">\n              <div [class]=\"getInputClasses()\" class=\"w-28\">\n                <input\n                  type=\"time\"\n                  [value]=\"filter.values[0] || ''\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (change)=\"onInputChange(filter, $event, 0)\" />\n              </div>\n              <div [class]=\"getBetweenClasses()\">{{ i18n().to }}</div>\n              <div [class]=\"getInputClasses()\" class=\"w-28\">\n                <input\n                  type=\"time\"\n                  [value]=\"filter.values[1] || ''\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (change)=\"onInputChange(filter, $event, 1)\" />\n              </div>\n            </div>\n          } @else {\n            <div [class]=\"getInputClasses()\" class=\"w-28\">\n              <input\n                type=\"time\"\n                [value]=\"filter.values[0] || ''\"\n                class=\"w-full bg-transparent outline-none\"\n                (change)=\"onInputChange(filter, $event)\" />\n            </div>\n          }\n        }\n\n        <!-- DateTime Input -->\n        @else if (field.type === 'datetime') {\n          @if (filter | zFilterIsBetweenOperator) {\n            <div class=\"flex items-center\">\n              <div [class]=\"getInputClasses()\" class=\"w-44\">\n                <input\n                  type=\"datetime-local\"\n                  [value]=\"filter.values[0] || ''\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (change)=\"onInputChange(filter, $event, 0)\" />\n              </div>\n              <div [class]=\"getBetweenClasses()\">{{ i18n().to }}</div>\n              <div [class]=\"getInputClasses()\" class=\"w-44\">\n                <input\n                  type=\"datetime-local\"\n                  [value]=\"filter.values[1] || ''\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (change)=\"onInputChange(filter, $event, 1)\" />\n              </div>\n            </div>\n          } @else {\n            <div [class]=\"getInputClasses()\" class=\"w-44\">\n              <input\n                type=\"datetime-local\"\n                [value]=\"filter.values[0] || ''\"\n                class=\"w-full bg-transparent outline-none\"\n                (change)=\"onInputChange(filter, $event)\" />\n            </div>\n          }\n        }\n\n        <!-- Select/Multiselect -->\n        @else if (field.type === 'select' || field.type === 'multiselect' || field.options) {\n          <button\n            type=\"button\"\n            z-popover\n            [zPopoverContent]=\"selectPopover\"\n            zTrigger=\"click\"\n            zPosition=\"bottom-left\"\n            [zOffset]=\"4\"\n            (zShow)=\"valuePopoverOpen.set(filter.id); focusSelectSearch(filter.id)\"\n            (zHide)=\"valuePopoverOpen.set(null)\"\n            class=\"hover:bg-muted flex cursor-pointer items-center gap-1.5 px-2.5 text-sm transition-colors\"\n            [class.bg-muted]=\"valuePopoverOpen() === filter.id\">\n            @if (filter | zFilterSelectedOptions: $any(zFields()); as selectedOpts) {\n              @if (selectedOpts.length > 0) {\n                <div class=\"flex items-center -space-x-1.5\">\n                  @for (opt of selectedOpts.slice(0, 3); track $any(opt).value) {\n                    @if (opt.icon) {\n                      <z-icon [zType]=\"opt.icon\" zSize=\"14\" />\n                    }\n                  }\n                </div>\n                @if (selectedOpts.length === 1) {\n                  {{ selectedOpts[0].label }}\n                } @else {\n                  {{ selectedOpts.length }} {{ i18n().selectedCount }}\n                }\n              } @else {\n                <span class=\"text-muted-foreground\">{{ i18n().select }}</span>\n              }\n            }\n            <z-icon zType=\"lucideChevronDown\" zSize=\"12\" class=\"text-muted-foreground ml-1\" />\n          </button>\n\n          <ng-template #selectPopover let-close=\"close\">\n            <div class=\"w-[200px]\">\n              @if (field.searchable !== false) {\n                <div class=\"border-border flex items-center border-b px-3\">\n                  <z-icon zType=\"lucideSearch\" zSize=\"16\" class=\"text-muted-foreground/50 mr-2 shrink-0\" />\n                  <input\n                    [id]=\"'select-search-' + filter.id\"\n                    type=\"text\"\n                    [placeholder]=\"i18n().placeholders.searchField\"\n                    class=\"placeholder:text-muted-foreground text-foreground flex h-9 w-full bg-transparent py-2 text-sm outline-none\" />\n                </div>\n              }\n              <div class=\"flex max-h-[200px] flex-col gap-0.5 overflow-y-auto p-1\">\n                <!-- Selected Options -->\n                @for (opt of filter | zFilterSelectedOptions: $any(zFields()); track $any(opt).value) {\n                  <button\n                    type=\"button\"\n                    class=\"hover:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors\"\n                    (click)=\"onSelectValueChange(filter, $any(opt)); field.type !== 'multiselect' && close()\">\n                    @if (opt.icon) {\n                      <z-icon [zType]=\"opt.icon\" zSize=\"14\" />\n                    }\n                    <span class=\"truncate\">{{ opt.label }}</span>\n                    <z-icon zType=\"lucideCheck\" zSize=\"14\" class=\"text-primary ml-auto\" />\n                  </button>\n                }\n\n                <!-- Separator -->\n                @if (\n                  (filter | zFilterSelectedOptions: $any(zFields())).length > 0 &&\n                  (filter | zFilterUnselectedOptions: $any(zFields())).length > 0\n                ) {\n                  <div class=\"bg-border my-1 ml-1 h-px\"></div>\n                }\n\n                <!-- Unselected Options -->\n                @for (opt of filter | zFilterUnselectedOptions: $any(zFields()); track $any(opt).value) {\n                  <button\n                    type=\"button\"\n                    class=\"hover:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors\"\n                    (click)=\"onSelectValueChange(filter, $any(opt)); field.type !== 'multiselect' && close()\">\n                    @if (opt.icon) {\n                      <z-icon [zType]=\"opt.icon\" zSize=\"14\" />\n                    }\n                    <span class=\"truncate\">{{ opt.label }}</span>\n                  </button>\n                }\n\n                @if (\n                  (filter | zFilterSelectedOptions: $any(zFields())).length === 0 &&\n                  (filter | zFilterUnselectedOptions: $any(zFields())).length === 0\n                ) {\n                  <div class=\"text-muted-foreground py-6 text-center text-sm\">\n                    {{ i18n().noResultsFound }}\n                  </div>\n                }\n              </div>\n            </div>\n          </ng-template>\n        }\n      }\n\n      <!-- Remove Button -->\n      <button type=\"button\" [class]=\"getRemoveButtonClasses()\" data-slot=\"filter-remove\" (click)=\"removeFilter(filter)\">\n        <z-icon zType=\"lucideX\" zSize=\"14\" />\n      </button>\n    </div>\n  }\n}\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ZSwitchComponent, selector: "z-switch", inputs: ["class", "zSize", "zLabel", "zText", "zDisabled", "zLoading", "zTextPosition", "zChecked"], outputs: ["zCheckedChange", "zChange"] }, { kind: "component", type: ZButtonComponent, selector: "z-button, button[z-button], a[z-button]", inputs: ["class", "zType", "zSize", "zShape", "zLabel", "zLoading", "zDisabled", "zTypeIcon", "zSizeIcon", "zStrokeWidthIcon", "zWave"], exportAs: ["zButton"] }, { kind: "directive", type: ZPopoverDirective, selector: "[z-popover]", inputs: ["zPopoverContent", "zPosition", "zTrigger", "zClass", "zShowDelay", "zHideDelay", "zDisabled", "zOffset", "zPopoverWidth", "zManualClose", "zScrollClose", "zShowArrow"], outputs: ["zShow", "zHide", "zHideStart", "zControl"], exportAs: ["zPopover"] }, { kind: "pipe", type: ZFilterFieldPipe, name: "zFilterField" }, { kind: "pipe", type: ZFilterOperatorLabelPipe, name: "zFilterOperatorLabel" }, { kind: "pipe", type: ZFilterOperatorsPipe, name: "zFilterOperators" }, { kind: "pipe", type: ZFilterSelectedOptionsPipe, name: "zFilterSelectedOptions" }, { kind: "pipe", type: ZFilterUnselectedOptionsPipe, name: "zFilterUnselectedOptions" }, { kind: "pipe", type: ZFilterInputPatternPipe, name: "zFilterInputPattern" }, { kind: "pipe", type: ZFilterIsValueHiddenPipe, name: "zFilterIsValueHidden" }, { kind: "pipe", type: ZFilterIsBetweenOperatorPipe, name: "zFilterIsBetweenOperator" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: ZFilterComponent, isStandalone: true, selector: "z-filter", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zFilters: { classPropertyName: "zFilters", publicName: "zFilters", isSignal: true, isRequired: true, transformFunction: null }, zFields: { classPropertyName: "zFields", publicName: "zFields", isSignal: true, isRequired: true, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zI18n: { classPropertyName: "zI18n", publicName: "zI18n", isSignal: true, isRequired: false, transformFunction: null }, zShowAddButton: { classPropertyName: "zShowAddButton", publicName: "zShowAddButton", isSignal: true, isRequired: false, transformFunction: null }, zAllowMultiple: { classPropertyName: "zAllowMultiple", publicName: "zAllowMultiple", isSignal: true, isRequired: false, transformFunction: null }, zAddButtonIcon: { classPropertyName: "zAddButtonIcon", publicName: "zAddButtonIcon", isSignal: true, isRequired: false, transformFunction: null }, zAddButtonText: { classPropertyName: "zAddButtonText", publicName: "zAddButtonText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zFiltersChange: "zFiltersChange", zFilterAdd: "zFilterAdd", zFilterRemove: "zFilterRemove", zFilterUpdate: "zFilterUpdate" }, host: { attributes: { "data-slot": "z-filter" }, properties: { "class": "hostClasses()" } }, queries: [{ propertyName: "addButtonTemplate", first: true, predicate: ["addButton"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "addFilterSearchInput", first: true, predicate: ["addFilterSearchInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Add Filter Button -->\n@if (zShowAddButton() && selectableFields().length > 0) {\n  @if (addButtonTemplate()) {\n    <ng-container [ngTemplateOutlet]=\"addButtonTemplate()!\" />\n  } @else {\n    <button\n      z-button\n      zType=\"outline\"\n      [zSize]=\"buttonSize()\"\n      z-popover\n      [zPopoverContent]=\"addFilterPopover\"\n      zTrigger=\"click\"\n      zPosition=\"bottom-left\"\n      [zOffset]=\"6\"\n      (zShow)=\"addFilterOpen.set(true); focusSearchInput()\"\n      (zHide)=\"addFilterOpen.set(false); searchQuery.set('')\">\n      <z-icon [zType]=\"zAddButtonIcon()\" zSize=\"14\" />\n      {{ zAddButtonText() || i18n().addFilter }}\n    </button>\n  }\n}\n\n<ng-template #addFilterPopover let-close=\"close\">\n  <div class=\"w-[200px]\">\n    <div class=\"border-border flex items-center border-b px-3\">\n      <z-icon zType=\"lucideSearch\" zSize=\"16\" class=\"text-muted-foreground/50 mr-2 shrink-0\" />\n      <input\n        #addFilterSearchInput\n        type=\"text\"\n        [placeholder]=\"i18n().searchFields\"\n        [value]=\"searchQuery()\"\n        (input)=\"onSearchInput($event)\"\n        class=\"placeholder:text-muted-foreground text-foreground flex h-10 w-full bg-transparent py-3 text-sm outline-none\" />\n    </div>\n    <div class=\"flex max-h-[300px] flex-col gap-0.5 overflow-y-auto p-1\">\n      @for (group of groupedFields(); track group.group; let groupIndex = $index) {\n        @if (group.group) {\n          <div\n            class=\"text-muted-foreground px-2 py-1.5 text-xs font-medium\"\n            [class.border-border]=\"groupIndex > 0\"\n            [class.mt-2]=\"groupIndex > 0\"\n            [class.border-t]=\"groupIndex > 0\"\n            [class.ml-1]=\"groupIndex > 0\">\n            {{ group.group }}\n          </div>\n        }\n        @for (field of group.fields; track trackByFieldKey($index, field)) {\n          <button\n            type=\"button\"\n            class=\"hover:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors\"\n            (click)=\"onFieldSelect(field); close()\">\n            @if (field.icon) {\n              <z-icon [zType]=\"field.icon\" zSize=\"14\" class=\"text-muted-foreground\" />\n            }\n            <span>{{ field.label }}</span>\n          </button>\n        }\n      } @empty {\n        <div class=\"text-muted-foreground py-6 text-center text-sm\">\n          {{ i18n().noFieldsFound }}\n        </div>\n      }\n    </div>\n  </div>\n</ng-template>\n\n<!-- Filter Items -->\n@for (filter of zFilters(); track trackByFilterId($index, filter)) {\n  @if (filter | zFilterField: $any(zFields()); as field) {\n    <div [class]=\"getItemClasses()\" data-slot=\"filter-item\">\n      <!-- Field Label -->\n      <div [class]=\"getLabelClasses()\">\n        @if (field.icon) {\n          <z-icon [zType]=\"field.icon\" zSize=\"14\" />\n        }\n        {{ field.label }}\n      </div>\n\n      <!-- Operator Dropdown -->\n      <button\n        type=\"button\"\n        z-popover\n        [zPopoverContent]=\"operatorDropdown\"\n        zTrigger=\"click\"\n        zPosition=\"bottom-left\"\n        [zOffset]=\"4\"\n        (zShow)=\"operatorPopoverOpen.set(filter.id)\"\n        (zHide)=\"operatorPopoverOpen.set(null)\"\n        class=\"text-muted-foreground hover:text-foreground hover:bg-muted flex cursor-pointer items-center px-2.5 text-sm transition-colors\"\n        [class.text-foreground]=\"operatorPopoverOpen() === filter.id\"\n        [class.bg-muted]=\"operatorPopoverOpen() === filter.id\">\n        {{ filter | zFilterOperatorLabel: $any(zFields()) : i18n() }}\n        <z-icon zType=\"lucideChevronDown\" zSize=\"12\" class=\"ml-1\" />\n      </button>\n\n      <ng-template #operatorDropdown let-close=\"close\">\n        <div class=\"flex w-fit min-w-32 flex-col gap-0.5 p-1\">\n          @for (op of filter | zFilterOperators: $any(zFields()) : i18n(); track op.value) {\n            <button\n              type=\"button\"\n              class=\"hover:bg-accent flex w-full cursor-pointer items-center justify-between gap-4 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none\"\n              (click)=\"updateFilterOperator(filter, op.value); close()\">\n              <span>{{ op.label }}</span>\n              @if (op.value === filter.operator) {\n                <z-icon zType=\"lucideCheck\" zSize=\"14\" class=\"text-primary\" />\n              }\n            </button>\n          }\n        </div>\n      </ng-template>\n\n      <!-- Value Selector -->\n      @if (!(filter | zFilterIsValueHidden)) {\n        <!-- Boolean Field -->\n        @if (field.type === 'boolean') {\n          <div class=\"flex items-center gap-2 px-2.5\">\n            <z-switch [zChecked]=\"filter.values[0] === true\" (zChange)=\"onBooleanChange(filter, $event)\" zSize=\"sm\" />\n            @if (field.onLabel && field.offLabel) {\n              <span class=\"text-muted-foreground text-xs\">\n                {{ filter.values[0] === true ? field.onLabel : field.offLabel }}\n              </span>\n            }\n          </div>\n        }\n\n        <!-- Text/Email/URL/Tel Input -->\n        @else if (field.type === 'text' || field.type === 'email' || field.type === 'url' || field.type === 'tel') {\n          <div [class]=\"getInputClasses()\" class=\"w-36\">\n            @if (field.prefix) {\n              <span class=\"text-muted-foreground mr-1\">{{ field.prefix }}</span>\n            }\n            <input\n              type=\"{{\n                field.type === 'email' ? 'email' : field.type === 'url' ? 'url' : field.type === 'tel' ? 'tel' : 'text'\n              }}\"\n              [value]=\"filter.values[0] || ''\"\n              [placeholder]=\"field.placeholder || i18n().placeholders.enterField\"\n              [pattern]=\"field | zFilterInputPattern\"\n              class=\"w-full bg-transparent outline-none\"\n              (blur)=\"onInputChange(filter, $event)\" />\n            @if (field.suffix) {\n              <span class=\"text-muted-foreground ml-1\">{{ field.suffix }}</span>\n            }\n          </div>\n        }\n\n        <!-- Number Input -->\n        @else if (field.type === 'number') {\n          @if (filter | zFilterIsBetweenOperator) {\n            <div class=\"flex items-center\">\n              <div [class]=\"getInputClasses()\" class=\"w-20\">\n                @if (field.prefix) {\n                  <span class=\"text-muted-foreground mr-1\">{{ field.prefix }}</span>\n                }\n                <input\n                  type=\"number\"\n                  [value]=\"filter.values[0] || ''\"\n                  [placeholder]=\"i18n().min\"\n                  [min]=\"field.min\"\n                  [max]=\"field.max\"\n                  [step]=\"field.step\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (blur)=\"onInputChange(filter, $event, 0)\" />\n              </div>\n              <div [class]=\"getBetweenClasses()\">{{ i18n().to }}</div>\n              <div [class]=\"getInputClasses()\" class=\"w-20\">\n                <input\n                  type=\"number\"\n                  [value]=\"filter.values[1] || ''\"\n                  [placeholder]=\"i18n().max\"\n                  [min]=\"field.min\"\n                  [max]=\"field.max\"\n                  [step]=\"field.step\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (blur)=\"onInputChange(filter, $event, 1)\" />\n                @if (field.suffix) {\n                  <span class=\"text-muted-foreground ml-1\">{{ field.suffix }}</span>\n                }\n              </div>\n            </div>\n          } @else {\n            <div [class]=\"getInputClasses()\" class=\"w-24\">\n              @if (field.prefix) {\n                <span class=\"text-muted-foreground mr-1\">{{ field.prefix }}</span>\n              }\n              <input\n                type=\"number\"\n                [value]=\"filter.values[0] || ''\"\n                [placeholder]=\"field.placeholder || i18n().placeholders.enterField\"\n                [min]=\"field.min\"\n                [max]=\"field.max\"\n                [step]=\"field.step\"\n                class=\"w-full bg-transparent outline-none\"\n                (blur)=\"onInputChange(filter, $event)\" />\n              @if (field.suffix) {\n                <span class=\"text-muted-foreground ml-1\">{{ field.suffix }}</span>\n              }\n            </div>\n          }\n        }\n\n        <!-- Date Input -->\n        @else if (field.type === 'date') {\n          <div [class]=\"getInputClasses()\" class=\"w-36\">\n            <input\n              type=\"date\"\n              [value]=\"filter.values[0] || ''\"\n              class=\"w-full bg-transparent outline-none\"\n              (change)=\"onInputChange(filter, $event)\" />\n          </div>\n        }\n\n        <!-- Date Range Input -->\n        @else if (field.type === 'daterange') {\n          <div class=\"flex items-center\">\n            <div [class]=\"getInputClasses()\" class=\"w-32\">\n              <input\n                type=\"date\"\n                [value]=\"filter.values[0] || ''\"\n                class=\"w-full bg-transparent outline-none\"\n                (change)=\"onInputChange(filter, $event, 0)\" />\n            </div>\n            <div [class]=\"getBetweenClasses()\">{{ i18n().to }}</div>\n            <div [class]=\"getInputClasses()\" class=\"w-32\">\n              <input\n                type=\"date\"\n                [value]=\"filter.values[1] || ''\"\n                class=\"w-full bg-transparent outline-none\"\n                (change)=\"onInputChange(filter, $event, 1)\" />\n            </div>\n          </div>\n        }\n\n        <!-- Time Input -->\n        @else if (field.type === 'time') {\n          @if (filter | zFilterIsBetweenOperator) {\n            <div class=\"flex items-center\">\n              <div [class]=\"getInputClasses()\" class=\"w-28\">\n                <input\n                  type=\"time\"\n                  [value]=\"filter.values[0] || ''\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (change)=\"onInputChange(filter, $event, 0)\" />\n              </div>\n              <div [class]=\"getBetweenClasses()\">{{ i18n().to }}</div>\n              <div [class]=\"getInputClasses()\" class=\"w-28\">\n                <input\n                  type=\"time\"\n                  [value]=\"filter.values[1] || ''\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (change)=\"onInputChange(filter, $event, 1)\" />\n              </div>\n            </div>\n          } @else {\n            <div [class]=\"getInputClasses()\" class=\"w-28\">\n              <input\n                type=\"time\"\n                [value]=\"filter.values[0] || ''\"\n                class=\"w-full bg-transparent outline-none\"\n                (change)=\"onInputChange(filter, $event)\" />\n            </div>\n          }\n        }\n\n        <!-- DateTime Input -->\n        @else if (field.type === 'datetime') {\n          @if (filter | zFilterIsBetweenOperator) {\n            <div class=\"flex items-center\">\n              <div [class]=\"getInputClasses()\" class=\"w-44\">\n                <input\n                  type=\"datetime-local\"\n                  [value]=\"filter.values[0] || ''\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (change)=\"onInputChange(filter, $event, 0)\" />\n              </div>\n              <div [class]=\"getBetweenClasses()\">{{ i18n().to }}</div>\n              <div [class]=\"getInputClasses()\" class=\"w-44\">\n                <input\n                  type=\"datetime-local\"\n                  [value]=\"filter.values[1] || ''\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (change)=\"onInputChange(filter, $event, 1)\" />\n              </div>\n            </div>\n          } @else {\n            <div [class]=\"getInputClasses()\" class=\"w-44\">\n              <input\n                type=\"datetime-local\"\n                [value]=\"filter.values[0] || ''\"\n                class=\"w-full bg-transparent outline-none\"\n                (change)=\"onInputChange(filter, $event)\" />\n            </div>\n          }\n        }\n\n        <!-- Select/Multiselect -->\n        @else if (field.type === 'select' || field.type === 'multiselect' || field.options) {\n          <button\n            type=\"button\"\n            z-popover\n            [zPopoverContent]=\"selectPopover\"\n            zTrigger=\"click\"\n            zPosition=\"bottom-left\"\n            [zOffset]=\"4\"\n            (zShow)=\"valuePopoverOpen.set(filter.id); focusSelectSearch(filter.id)\"\n            (zHide)=\"valuePopoverOpen.set(null)\"\n            class=\"hover:bg-muted flex cursor-pointer items-center gap-1.5 px-2.5 text-sm transition-colors\"\n            [class.bg-muted]=\"valuePopoverOpen() === filter.id\">\n            @if (filter | zFilterSelectedOptions: $any(zFields()); as selectedOpts) {\n              @if (selectedOpts.length > 0) {\n                <div class=\"flex items-center -space-x-1.5\">\n                  @for (opt of selectedOpts.slice(0, 3); track $any(opt).value) {\n                    @if (opt.icon) {\n                      <z-icon [zType]=\"opt.icon\" zSize=\"14\" />\n                    }\n                  }\n                </div>\n                @if (selectedOpts.length === 1) {\n                  {{ selectedOpts[0].label }}\n                } @else {\n                  {{ selectedOpts.length }} {{ i18n().selectedCount }}\n                }\n              } @else {\n                <span class=\"text-muted-foreground\">{{ i18n().select }}</span>\n              }\n            }\n            <z-icon zType=\"lucideChevronDown\" zSize=\"12\" class=\"text-muted-foreground ml-1\" />\n          </button>\n\n          <ng-template #selectPopover let-close=\"close\">\n            <div class=\"w-[200px]\">\n              @if (field.searchable !== false) {\n                <div class=\"border-border flex items-center border-b px-3\">\n                  <z-icon zType=\"lucideSearch\" zSize=\"16\" class=\"text-muted-foreground/50 mr-2 shrink-0\" />\n                  <input\n                    [id]=\"'select-search-' + filter.id\"\n                    type=\"text\"\n                    [placeholder]=\"i18n().placeholders.searchField\"\n                    class=\"placeholder:text-muted-foreground text-foreground flex h-9 w-full bg-transparent py-2 text-sm outline-none\" />\n                </div>\n              }\n              <div class=\"flex max-h-[200px] flex-col gap-0.5 overflow-y-auto p-1\">\n                <!-- Selected Options -->\n                @for (opt of filter | zFilterSelectedOptions: $any(zFields()); track $any(opt).value) {\n                  <button\n                    type=\"button\"\n                    class=\"hover:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors\"\n                    (click)=\"onSelectValueChange(filter, $any(opt)); field.type !== 'multiselect' && close()\">\n                    @if (opt.icon) {\n                      <z-icon [zType]=\"opt.icon\" zSize=\"14\" />\n                    }\n                    <span class=\"truncate\">{{ opt.label }}</span>\n                    <z-icon zType=\"lucideCheck\" zSize=\"14\" class=\"text-primary ml-auto\" />\n                  </button>\n                }\n\n                <!-- Separator -->\n                @if (\n                  (filter | zFilterSelectedOptions: $any(zFields())).length > 0 &&\n                  (filter | zFilterUnselectedOptions: $any(zFields())).length > 0\n                ) {\n                  <div class=\"bg-border my-1 ml-1 h-px\"></div>\n                }\n\n                <!-- Unselected Options -->\n                @for (opt of filter | zFilterUnselectedOptions: $any(zFields()); track $any(opt).value) {\n                  <button\n                    type=\"button\"\n                    class=\"hover:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors\"\n                    (click)=\"onSelectValueChange(filter, $any(opt)); field.type !== 'multiselect' && close()\">\n                    @if (opt.icon) {\n                      <z-icon [zType]=\"opt.icon\" zSize=\"14\" />\n                    }\n                    <span class=\"truncate\">{{ opt.label }}</span>\n                  </button>\n                }\n\n                @if (\n                  (filter | zFilterSelectedOptions: $any(zFields())).length === 0 &&\n                  (filter | zFilterUnselectedOptions: $any(zFields())).length === 0\n                ) {\n                  <div class=\"text-muted-foreground py-6 text-center text-sm\">\n                    {{ i18n().noResultsFound }}\n                  </div>\n                }\n              </div>\n            </div>\n          </ng-template>\n        }\n      }\n\n      <!-- Remove Button -->\n      <button type=\"button\" [class]=\"getRemoveButtonClasses()\" data-slot=\"filter-remove\" (click)=\"removeFilter(filter)\">\n        <z-icon zType=\"lucideX\" zSize=\"14\" />\n      </button>\n    </div>\n  }\n}\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ZSwitchComponent, selector: "z-switch", inputs: ["class", "zSize", "zLabel", "zText", "zDisabled", "zLoading", "zTextPosition", "zChecked"], outputs: ["zChange", "zCheckedChange"] }, { kind: "component", type: ZButtonComponent, selector: "z-button, button[z-button], a[z-button]", inputs: ["class", "zType", "zSize", "zShape", "zLabel", "zLoading", "zDisabled", "zTypeIcon", "zSizeIcon", "zStrokeWidthIcon", "zWave"], exportAs: ["zButton"] }, { kind: "directive", type: ZPopoverDirective, selector: "[z-popover]", inputs: ["zPopoverContent", "zPosition", "zTrigger", "zClass", "zShowDelay", "zHideDelay", "zDisabled", "zOffset", "zPopoverWidth", "zManualClose", "zScrollClose", "zShowArrow"], outputs: ["zShow", "zHide", "zHideStart", "zControl"], exportAs: ["zPopover"] }, { kind: "pipe", type: ZFilterFieldPipe, name: "zFilterField" }, { kind: "pipe", type: ZFilterOperatorLabelPipe, name: "zFilterOperatorLabel" }, { kind: "pipe", type: ZFilterOperatorsPipe, name: "zFilterOperators" }, { kind: "pipe", type: ZFilterSelectedOptionsPipe, name: "zFilterSelectedOptions" }, { kind: "pipe", type: ZFilterUnselectedOptionsPipe, name: "zFilterUnselectedOptions" }, { kind: "pipe", type: ZFilterInputPatternPipe, name: "zFilterInputPattern" }, { kind: "pipe", type: ZFilterIsValueHiddenPipe, name: "zFilterIsValueHidden" }, { kind: "pipe", type: ZFilterIsBetweenOperatorPipe, name: "zFilterIsBetweenOperator" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZFilterComponent, decorators: [{
             type: Component,
@@ -778,7 +778,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
                         '[class]': 'hostClasses()',
                         'data-slot': 'z-filter',
                     }, template: "<!-- Add Filter Button -->\n@if (zShowAddButton() && selectableFields().length > 0) {\n  @if (addButtonTemplate()) {\n    <ng-container [ngTemplateOutlet]=\"addButtonTemplate()!\" />\n  } @else {\n    <button\n      z-button\n      zType=\"outline\"\n      [zSize]=\"buttonSize()\"\n      z-popover\n      [zPopoverContent]=\"addFilterPopover\"\n      zTrigger=\"click\"\n      zPosition=\"bottom-left\"\n      [zOffset]=\"6\"\n      (zShow)=\"addFilterOpen.set(true); focusSearchInput()\"\n      (zHide)=\"addFilterOpen.set(false); searchQuery.set('')\">\n      <z-icon [zType]=\"zAddButtonIcon()\" zSize=\"14\" />\n      {{ zAddButtonText() || i18n().addFilter }}\n    </button>\n  }\n}\n\n<ng-template #addFilterPopover let-close=\"close\">\n  <div class=\"w-[200px]\">\n    <div class=\"border-border flex items-center border-b px-3\">\n      <z-icon zType=\"lucideSearch\" zSize=\"16\" class=\"text-muted-foreground/50 mr-2 shrink-0\" />\n      <input\n        #addFilterSearchInput\n        type=\"text\"\n        [placeholder]=\"i18n().searchFields\"\n        [value]=\"searchQuery()\"\n        (input)=\"onSearchInput($event)\"\n        class=\"placeholder:text-muted-foreground text-foreground flex h-10 w-full bg-transparent py-3 text-sm outline-none\" />\n    </div>\n    <div class=\"flex max-h-[300px] flex-col gap-0.5 overflow-y-auto p-1\">\n      @for (group of groupedFields(); track group.group; let groupIndex = $index) {\n        @if (group.group) {\n          <div\n            class=\"text-muted-foreground px-2 py-1.5 text-xs font-medium\"\n            [class.border-border]=\"groupIndex > 0\"\n            [class.mt-2]=\"groupIndex > 0\"\n            [class.border-t]=\"groupIndex > 0\"\n            [class.ml-1]=\"groupIndex > 0\">\n            {{ group.group }}\n          </div>\n        }\n        @for (field of group.fields; track trackByFieldKey($index, field)) {\n          <button\n            type=\"button\"\n            class=\"hover:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors\"\n            (click)=\"onFieldSelect(field); close()\">\n            @if (field.icon) {\n              <z-icon [zType]=\"field.icon\" zSize=\"14\" class=\"text-muted-foreground\" />\n            }\n            <span>{{ field.label }}</span>\n          </button>\n        }\n      } @empty {\n        <div class=\"text-muted-foreground py-6 text-center text-sm\">\n          {{ i18n().noFieldsFound }}\n        </div>\n      }\n    </div>\n  </div>\n</ng-template>\n\n<!-- Filter Items -->\n@for (filter of zFilters(); track trackByFilterId($index, filter)) {\n  @if (filter | zFilterField: $any(zFields()); as field) {\n    <div [class]=\"getItemClasses()\" data-slot=\"filter-item\">\n      <!-- Field Label -->\n      <div [class]=\"getLabelClasses()\">\n        @if (field.icon) {\n          <z-icon [zType]=\"field.icon\" zSize=\"14\" />\n        }\n        {{ field.label }}\n      </div>\n\n      <!-- Operator Dropdown -->\n      <button\n        type=\"button\"\n        z-popover\n        [zPopoverContent]=\"operatorDropdown\"\n        zTrigger=\"click\"\n        zPosition=\"bottom-left\"\n        [zOffset]=\"4\"\n        (zShow)=\"operatorPopoverOpen.set(filter.id)\"\n        (zHide)=\"operatorPopoverOpen.set(null)\"\n        class=\"text-muted-foreground hover:text-foreground hover:bg-muted flex cursor-pointer items-center px-2.5 text-sm transition-colors\"\n        [class.text-foreground]=\"operatorPopoverOpen() === filter.id\"\n        [class.bg-muted]=\"operatorPopoverOpen() === filter.id\">\n        {{ filter | zFilterOperatorLabel: $any(zFields()) : i18n() }}\n        <z-icon zType=\"lucideChevronDown\" zSize=\"12\" class=\"ml-1\" />\n      </button>\n\n      <ng-template #operatorDropdown let-close=\"close\">\n        <div class=\"flex w-fit min-w-32 flex-col gap-0.5 p-1\">\n          @for (op of filter | zFilterOperators: $any(zFields()) : i18n(); track op.value) {\n            <button\n              type=\"button\"\n              class=\"hover:bg-accent flex w-full cursor-pointer items-center justify-between gap-4 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none\"\n              (click)=\"updateFilterOperator(filter, op.value); close()\">\n              <span>{{ op.label }}</span>\n              @if (op.value === filter.operator) {\n                <z-icon zType=\"lucideCheck\" zSize=\"14\" class=\"text-primary\" />\n              }\n            </button>\n          }\n        </div>\n      </ng-template>\n\n      <!-- Value Selector -->\n      @if (!(filter | zFilterIsValueHidden)) {\n        <!-- Boolean Field -->\n        @if (field.type === 'boolean') {\n          <div class=\"flex items-center gap-2 px-2.5\">\n            <z-switch [zChecked]=\"filter.values[0] === true\" (zChange)=\"onBooleanChange(filter, $event)\" zSize=\"sm\" />\n            @if (field.onLabel && field.offLabel) {\n              <span class=\"text-muted-foreground text-xs\">\n                {{ filter.values[0] === true ? field.onLabel : field.offLabel }}\n              </span>\n            }\n          </div>\n        }\n\n        <!-- Text/Email/URL/Tel Input -->\n        @else if (field.type === 'text' || field.type === 'email' || field.type === 'url' || field.type === 'tel') {\n          <div [class]=\"getInputClasses()\" class=\"w-36\">\n            @if (field.prefix) {\n              <span class=\"text-muted-foreground mr-1\">{{ field.prefix }}</span>\n            }\n            <input\n              type=\"{{\n                field.type === 'email' ? 'email' : field.type === 'url' ? 'url' : field.type === 'tel' ? 'tel' : 'text'\n              }}\"\n              [value]=\"filter.values[0] || ''\"\n              [placeholder]=\"field.placeholder || i18n().placeholders.enterField\"\n              [pattern]=\"field | zFilterInputPattern\"\n              class=\"w-full bg-transparent outline-none\"\n              (blur)=\"onInputChange(filter, $event)\" />\n            @if (field.suffix) {\n              <span class=\"text-muted-foreground ml-1\">{{ field.suffix }}</span>\n            }\n          </div>\n        }\n\n        <!-- Number Input -->\n        @else if (field.type === 'number') {\n          @if (filter | zFilterIsBetweenOperator) {\n            <div class=\"flex items-center\">\n              <div [class]=\"getInputClasses()\" class=\"w-20\">\n                @if (field.prefix) {\n                  <span class=\"text-muted-foreground mr-1\">{{ field.prefix }}</span>\n                }\n                <input\n                  type=\"number\"\n                  [value]=\"filter.values[0] || ''\"\n                  [placeholder]=\"i18n().min\"\n                  [min]=\"field.min\"\n                  [max]=\"field.max\"\n                  [step]=\"field.step\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (blur)=\"onInputChange(filter, $event, 0)\" />\n              </div>\n              <div [class]=\"getBetweenClasses()\">{{ i18n().to }}</div>\n              <div [class]=\"getInputClasses()\" class=\"w-20\">\n                <input\n                  type=\"number\"\n                  [value]=\"filter.values[1] || ''\"\n                  [placeholder]=\"i18n().max\"\n                  [min]=\"field.min\"\n                  [max]=\"field.max\"\n                  [step]=\"field.step\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (blur)=\"onInputChange(filter, $event, 1)\" />\n                @if (field.suffix) {\n                  <span class=\"text-muted-foreground ml-1\">{{ field.suffix }}</span>\n                }\n              </div>\n            </div>\n          } @else {\n            <div [class]=\"getInputClasses()\" class=\"w-24\">\n              @if (field.prefix) {\n                <span class=\"text-muted-foreground mr-1\">{{ field.prefix }}</span>\n              }\n              <input\n                type=\"number\"\n                [value]=\"filter.values[0] || ''\"\n                [placeholder]=\"field.placeholder || i18n().placeholders.enterField\"\n                [min]=\"field.min\"\n                [max]=\"field.max\"\n                [step]=\"field.step\"\n                class=\"w-full bg-transparent outline-none\"\n                (blur)=\"onInputChange(filter, $event)\" />\n              @if (field.suffix) {\n                <span class=\"text-muted-foreground ml-1\">{{ field.suffix }}</span>\n              }\n            </div>\n          }\n        }\n\n        <!-- Date Input -->\n        @else if (field.type === 'date') {\n          <div [class]=\"getInputClasses()\" class=\"w-36\">\n            <input\n              type=\"date\"\n              [value]=\"filter.values[0] || ''\"\n              class=\"w-full bg-transparent outline-none\"\n              (change)=\"onInputChange(filter, $event)\" />\n          </div>\n        }\n\n        <!-- Date Range Input -->\n        @else if (field.type === 'daterange') {\n          <div class=\"flex items-center\">\n            <div [class]=\"getInputClasses()\" class=\"w-32\">\n              <input\n                type=\"date\"\n                [value]=\"filter.values[0] || ''\"\n                class=\"w-full bg-transparent outline-none\"\n                (change)=\"onInputChange(filter, $event, 0)\" />\n            </div>\n            <div [class]=\"getBetweenClasses()\">{{ i18n().to }}</div>\n            <div [class]=\"getInputClasses()\" class=\"w-32\">\n              <input\n                type=\"date\"\n                [value]=\"filter.values[1] || ''\"\n                class=\"w-full bg-transparent outline-none\"\n                (change)=\"onInputChange(filter, $event, 1)\" />\n            </div>\n          </div>\n        }\n\n        <!-- Time Input -->\n        @else if (field.type === 'time') {\n          @if (filter | zFilterIsBetweenOperator) {\n            <div class=\"flex items-center\">\n              <div [class]=\"getInputClasses()\" class=\"w-28\">\n                <input\n                  type=\"time\"\n                  [value]=\"filter.values[0] || ''\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (change)=\"onInputChange(filter, $event, 0)\" />\n              </div>\n              <div [class]=\"getBetweenClasses()\">{{ i18n().to }}</div>\n              <div [class]=\"getInputClasses()\" class=\"w-28\">\n                <input\n                  type=\"time\"\n                  [value]=\"filter.values[1] || ''\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (change)=\"onInputChange(filter, $event, 1)\" />\n              </div>\n            </div>\n          } @else {\n            <div [class]=\"getInputClasses()\" class=\"w-28\">\n              <input\n                type=\"time\"\n                [value]=\"filter.values[0] || ''\"\n                class=\"w-full bg-transparent outline-none\"\n                (change)=\"onInputChange(filter, $event)\" />\n            </div>\n          }\n        }\n\n        <!-- DateTime Input -->\n        @else if (field.type === 'datetime') {\n          @if (filter | zFilterIsBetweenOperator) {\n            <div class=\"flex items-center\">\n              <div [class]=\"getInputClasses()\" class=\"w-44\">\n                <input\n                  type=\"datetime-local\"\n                  [value]=\"filter.values[0] || ''\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (change)=\"onInputChange(filter, $event, 0)\" />\n              </div>\n              <div [class]=\"getBetweenClasses()\">{{ i18n().to }}</div>\n              <div [class]=\"getInputClasses()\" class=\"w-44\">\n                <input\n                  type=\"datetime-local\"\n                  [value]=\"filter.values[1] || ''\"\n                  class=\"w-full bg-transparent outline-none\"\n                  (change)=\"onInputChange(filter, $event, 1)\" />\n              </div>\n            </div>\n          } @else {\n            <div [class]=\"getInputClasses()\" class=\"w-44\">\n              <input\n                type=\"datetime-local\"\n                [value]=\"filter.values[0] || ''\"\n                class=\"w-full bg-transparent outline-none\"\n                (change)=\"onInputChange(filter, $event)\" />\n            </div>\n          }\n        }\n\n        <!-- Select/Multiselect -->\n        @else if (field.type === 'select' || field.type === 'multiselect' || field.options) {\n          <button\n            type=\"button\"\n            z-popover\n            [zPopoverContent]=\"selectPopover\"\n            zTrigger=\"click\"\n            zPosition=\"bottom-left\"\n            [zOffset]=\"4\"\n            (zShow)=\"valuePopoverOpen.set(filter.id); focusSelectSearch(filter.id)\"\n            (zHide)=\"valuePopoverOpen.set(null)\"\n            class=\"hover:bg-muted flex cursor-pointer items-center gap-1.5 px-2.5 text-sm transition-colors\"\n            [class.bg-muted]=\"valuePopoverOpen() === filter.id\">\n            @if (filter | zFilterSelectedOptions: $any(zFields()); as selectedOpts) {\n              @if (selectedOpts.length > 0) {\n                <div class=\"flex items-center -space-x-1.5\">\n                  @for (opt of selectedOpts.slice(0, 3); track $any(opt).value) {\n                    @if (opt.icon) {\n                      <z-icon [zType]=\"opt.icon\" zSize=\"14\" />\n                    }\n                  }\n                </div>\n                @if (selectedOpts.length === 1) {\n                  {{ selectedOpts[0].label }}\n                } @else {\n                  {{ selectedOpts.length }} {{ i18n().selectedCount }}\n                }\n              } @else {\n                <span class=\"text-muted-foreground\">{{ i18n().select }}</span>\n              }\n            }\n            <z-icon zType=\"lucideChevronDown\" zSize=\"12\" class=\"text-muted-foreground ml-1\" />\n          </button>\n\n          <ng-template #selectPopover let-close=\"close\">\n            <div class=\"w-[200px]\">\n              @if (field.searchable !== false) {\n                <div class=\"border-border flex items-center border-b px-3\">\n                  <z-icon zType=\"lucideSearch\" zSize=\"16\" class=\"text-muted-foreground/50 mr-2 shrink-0\" />\n                  <input\n                    [id]=\"'select-search-' + filter.id\"\n                    type=\"text\"\n                    [placeholder]=\"i18n().placeholders.searchField\"\n                    class=\"placeholder:text-muted-foreground text-foreground flex h-9 w-full bg-transparent py-2 text-sm outline-none\" />\n                </div>\n              }\n              <div class=\"flex max-h-[200px] flex-col gap-0.5 overflow-y-auto p-1\">\n                <!-- Selected Options -->\n                @for (opt of filter | zFilterSelectedOptions: $any(zFields()); track $any(opt).value) {\n                  <button\n                    type=\"button\"\n                    class=\"hover:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors\"\n                    (click)=\"onSelectValueChange(filter, $any(opt)); field.type !== 'multiselect' && close()\">\n                    @if (opt.icon) {\n                      <z-icon [zType]=\"opt.icon\" zSize=\"14\" />\n                    }\n                    <span class=\"truncate\">{{ opt.label }}</span>\n                    <z-icon zType=\"lucideCheck\" zSize=\"14\" class=\"text-primary ml-auto\" />\n                  </button>\n                }\n\n                <!-- Separator -->\n                @if (\n                  (filter | zFilterSelectedOptions: $any(zFields())).length > 0 &&\n                  (filter | zFilterUnselectedOptions: $any(zFields())).length > 0\n                ) {\n                  <div class=\"bg-border my-1 ml-1 h-px\"></div>\n                }\n\n                <!-- Unselected Options -->\n                @for (opt of filter | zFilterUnselectedOptions: $any(zFields()); track $any(opt).value) {\n                  <button\n                    type=\"button\"\n                    class=\"hover:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors\"\n                    (click)=\"onSelectValueChange(filter, $any(opt)); field.type !== 'multiselect' && close()\">\n                    @if (opt.icon) {\n                      <z-icon [zType]=\"opt.icon\" zSize=\"14\" />\n                    }\n                    <span class=\"truncate\">{{ opt.label }}</span>\n                  </button>\n                }\n\n                @if (\n                  (filter | zFilterSelectedOptions: $any(zFields())).length === 0 &&\n                  (filter | zFilterUnselectedOptions: $any(zFields())).length === 0\n                ) {\n                  <div class=\"text-muted-foreground py-6 text-center text-sm\">\n                    {{ i18n().noResultsFound }}\n                  </div>\n                }\n              </div>\n            </div>\n          </ng-template>\n        }\n      }\n\n      <!-- Remove Button -->\n      <button type=\"button\" [class]=\"getRemoveButtonClasses()\" data-slot=\"filter-remove\" (click)=\"removeFilter(filter)\">\n        <z-icon zType=\"lucideX\" zSize=\"14\" />\n      </button>\n    </div>\n  }\n}\n", styles: [":host{display:block}\n"] }]
-        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "zFilters", required: true }] }], zFields: [{ type: i0.Input, args: [{ isSignal: true, alias: "zFields", required: true }] }], zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zI18n: [{ type: i0.Input, args: [{ isSignal: true, alias: "zI18n", required: false }] }], zShowAddButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "zShowAddButton", required: false }] }], zAllowMultiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAllowMultiple", required: false }] }], zAddButtonIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAddButtonIcon", required: false }] }], zAddButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAddButtonText", required: false }] }], zFiltersChange: [{ type: i0.Output, args: ["zFiltersChange"] }], zFilterAdd: [{ type: i0.Output, args: ["zFilterAdd"] }], zFilterRemove: [{ type: i0.Output, args: ["zFilterRemove"] }], zFilterUpdate: [{ type: i0.Output, args: ["zFilterUpdate"] }], addButtonTemplate: [{ type: i0.ContentChild, args: ['addButton', { isSignal: true }] }], addFilterSearchInput: [{ type: i0.ViewChild, args: ['addFilterSearchInput', { isSignal: true }] }] } });
+        }], propDecorators: { addButtonTemplate: [{ type: i0.ContentChild, args: ['addButton', { isSignal: true }] }], zFiltersChange: [{ type: i0.Output, args: ["zFiltersChange"] }], zFilterAdd: [{ type: i0.Output, args: ["zFilterAdd"] }], zFilterRemove: [{ type: i0.Output, args: ["zFilterRemove"] }], zFilterUpdate: [{ type: i0.Output, args: ["zFilterUpdate"] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "zFilters", required: true }] }], zFields: [{ type: i0.Input, args: [{ isSignal: true, alias: "zFields", required: true }] }], zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zI18n: [{ type: i0.Input, args: [{ isSignal: true, alias: "zI18n", required: false }] }], zShowAddButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "zShowAddButton", required: false }] }], zAllowMultiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAllowMultiple", required: false }] }], zAddButtonIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAddButtonIcon", required: false }] }], zAddButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAddButtonText", required: false }] }], addFilterSearchInput: [{ type: i0.ViewChild, args: ['addFilterSearchInput', { isSignal: true }] }] } });
 /**
  * Generated bundle index. Do not edit.