import * as i0 from '@angular/core';
import { Pipe, inject, viewChild, input, computed, output, signal, ViewEncapsulation, ChangeDetectionStrategy, Component, Directive } from '@angular/core';
import { TranslatePipe } from '@ngx-translate/core';
import { ZIconComponent } from '@shival99/z-ui/components/z-icon';
import { ZTooltipDirective } from '@shival99/z-ui/components/z-tooltip';
import { ZTranslateService } from '@shival99/z-ui/services';
import { zMergeClasses, zTransform } from '@shival99/z-ui/utils';
import { cva } from 'class-variance-authority';

const zTagsContainerVariants = cva(['flex flex-wrap items-center'], {
    variants: {
        zSize: {
            sm: 'gap-1',
            default: 'gap-1.5',
            lg: 'gap-2',
        },
    },
    defaultVariants: {
        zSize: 'default',
    },
});
const zTagVariants = cva([
    'inline-flex items-center justify-center',
    'rounded-xs shadow-xs border font-medium',
    'transition-colors duration-200',
], {
    variants: {
        zSize: {
            sm: 'px-1.5 py-0.5 text-xs gap-1',
            default: 'px-2 py-1 text-xs gap-1.5',
            lg: 'px-2.5 py-1.5 text-sm gap-2',
        },
        zColor: {
            default: 'bg-muted text-muted-foreground !border-muted-foreground hover:bg-muted/80 dark:!border-border',
            primary: 'bg-primary/10 text-primary !border-primary hover:bg-primary/20 dark:!border-border',
            success: 'bg-green-500/10 text-green-600 !border-green-600 hover:bg-green-500/20 dark:text-green-400 dark:!border-border',
            warning: 'bg-yellow-500/10 text-yellow-600 !border-yellow-600 hover:bg-yellow-500/20 dark:text-yellow-400 dark:!border-border',
            danger: 'bg-red-500/10 text-red-600 !border-red-600 hover:bg-red-500/20 dark:text-red-400 dark:!border-border',
            info: 'bg-blue-500/10 text-blue-600 !border-blue-600 hover:bg-blue-500/20 dark:text-blue-400 dark:!border-border',
        },
        zClosable: {
            true: '',
            false: '',
        },
        zDisabled: {
            true: 'opacity-50 cursor-not-allowed pointer-events-none',
            false: '',
        },
    },
    defaultVariants: {
        zSize: 'default',
        zColor: 'default',
        zClosable: false,
        zDisabled: false,
    },
});
const zTagCloseButtonVariants = cva([
    'inline-flex items-center justify-center',
    'rounded-full cursor-pointer',
    'transition-colors duration-200',
    'hover:bg-black/10 dark:hover:bg-white/10',
    'outline-none focus:outline-none',
], {
    variants: {
        zSize: {
            sm: 'size-3',
            default: 'size-3.5',
            lg: 'size-4',
        },
    },
    defaultVariants: {
        zSize: 'default',
    },
});

class ZTagClassesPipe {
    transform(tag, config) {
        const isClosable = this._isClosable(tag, config);
        const isDisabled = tag.disabled || config.disabled;
        if (config.randomColor && !tag.color) {
            const baseClasses = zTagVariants({
                zSize: config.size,
                zColor: 'default',
                zClosable: isClosable,
                zDisabled: isDisabled,
            });
            const randomClasses = baseClasses
                .replace('bg-muted', '')
                .replace('text-muted-foreground', '')
                .replace('!border-muted-foreground', '')
                .replace('hover:bg-muted/80', '');
            return zMergeClasses(randomClasses, '[background-color:var(--z-tag-bg)] [color:var(--z-tag-text)] [border-color:var(--z-tag-border)]', 'hover:[background-color:var(--z-tag-hover-bg)]', 'dark:[background-color:var(--z-tag-dark-bg)] dark:[color:var(--z-tag-dark-text)]', 'dark:hover:[background-color:var(--z-tag-dark-hover-bg)]', config.tagClass);
        }
        return zMergeClasses(zTagVariants({
            zSize: config.size,
            zColor: tag.color || config.color,
            zClosable: isClosable,
            zDisabled: isDisabled,
        }), config.tagClass);
    }
    _isClosable(tag, config) {
        if (tag.disabled || config.disabled) {
            return false;
        }
        return tag.closable !== undefined ? tag.closable : config.closable;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZTagClassesPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.9", ngImport: i0, type: ZTagClassesPipe, isStandalone: true, name: "zTagClasses" });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZTagClassesPipe, decorators: [{
            type: Pipe,
            args: [{
                    name: 'zTagClasses',
                    standalone: true,
                    pure: true,
                }]
        }] });

class ZTagClosablePipe {
    transform(tag, config) {
        if (tag.disabled || config.disabled) {
            return false;
        }
        return tag.closable !== undefined ? tag.closable : config.closable;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZTagClosablePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.9", ngImport: i0, type: ZTagClosablePipe, isStandalone: true, name: "zTagClosable" });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZTagClosablePipe, decorators: [{
            type: Pipe,
            args: [{
                    name: 'zTagClosable',
                    standalone: true,
                    pure: true,
                }]
        }] });

class ZTagStylePipe {
    transform(tag, config) {
        if (!config.randomColor || tag.color) {
            return null;
        }
        const colors = this._getOrCreateRandomColor(tag.value, config.randomColorCache);
        return {
            '--z-tag-bg': colors.bg,
            '--z-tag-text': colors.text,
            '--z-tag-border': colors.border,
            '--z-tag-hover-bg': colors.hoverBg,
            '--z-tag-dark-bg': colors.darkBg ?? colors.bg,
            '--z-tag-dark-text': colors.darkText ?? colors.text,
            '--z-tag-dark-hover-bg': colors.darkHoverBg ?? colors.hoverBg,
        };
    }
    _getOrCreateRandomColor(value, cache) {
        const cached = cache.get(value);
        if (cached) {
            return cached;
        }
        const hue = Math.floor(Math.random() * 360);
        const saturation = 70 + Math.floor(Math.random() * 20);
        const lightness = 45 + Math.floor(Math.random() * 10);
        const colors = {
            bg: `hsl(${hue}, ${saturation}%, 95%)`,
            text: `hsl(${hue}, ${saturation}%, ${lightness}%)`,
            border: `hsl(${hue}, ${saturation}%, 85%)`,
            hoverBg: `hsl(${hue}, ${saturation}%, 90%)`,
            darkBg: `hsl(${hue}, ${saturation}%, 16%)`,
            darkText: `hsl(${hue}, ${saturation}%, 72%)`,
            darkHoverBg: `hsl(${hue}, ${saturation}%, 22%)`,
        };
        cache.set(value, colors);
        return colors;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZTagStylePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.9", ngImport: i0, type: ZTagStylePipe, isStandalone: true, name: "zTagStyle" });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZTagStylePipe, decorators: [{
            type: Pipe,
            args: [{
                    name: 'zTagStyle',
                    standalone: true,
                    pure: true,
                }]
        }] });

class ZTagsComponent {
    _zTranslate = inject(ZTranslateService);
    _addInput = viewChild('addInput', ...(ngDevMode ? [{ debugName: "_addInput" }] : []));
    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
    zTags = input([], ...(ngDevMode ? [{ debugName: "zTags" }] : []));
    zSize = input('default', ...(ngDevMode ? [{ debugName: "zSize" }] : []));
    zColor = input('default', ...(ngDevMode ? [{ debugName: "zColor" }] : []));
    zClosable = input(false, { ...(ngDevMode ? { debugName: "zClosable" } : {}), transform: zTransform });
    zDisabled = input(false, { ...(ngDevMode ? { debugName: "zDisabled" } : {}), transform: zTransform });
    zAddable = input(false, { ...(ngDevMode ? { debugName: "zAddable" } : {}), transform: zTransform });
    zAddText = input('', ...(ngDevMode ? [{ debugName: "zAddText" }] : []));
    zAddPlaceholder = input('', ...(ngDevMode ? [{ debugName: "zAddPlaceholder" }] : []));
    zRandomColor = input(false, { ...(ngDevMode ? { debugName: "zRandomColor" } : {}), transform: zTransform });
    zTagClass = input('', ...(ngDevMode ? [{ debugName: "zTagClass" }] : []));
    zLabelClass = input('', ...(ngDevMode ? [{ debugName: "zLabelClass" }] : []));
    zMaxWidth = input('', ...(ngDevMode ? [{ debugName: "zMaxWidth" }] : []));
    labelClasses = computed(() => {
        const maxWidth = this.zMaxWidth();
        return zMergeClasses(maxWidth ? 'truncate' : '', this.zLabelClass());
    }, ...(ngDevMode ? [{ debugName: "labelClasses" }] : []));
    labelStyle = computed(() => {
        const maxWidth = this.zMaxWidth();
        return maxWidth ? { 'max-width': maxWidth } : null;
    }, ...(ngDevMode ? [{ debugName: "labelStyle" }] : []));
    zTagClose = output();
    zTagAdd = output();
    uiState = signal({
        isAdding: false,
        pendingFocus: false,
    }, ...(ngDevMode ? [{ debugName: "uiState" }] : []));
    _randomColorCache = new Map();
    hostClasses = computed(() => zMergeClasses('inline-block', this.class()), ...(ngDevMode ? [{ debugName: "hostClasses" }] : []));
    containerClasses = computed(() => zTagsContainerVariants({ zSize: this.zSize() }), ...(ngDevMode ? [{ debugName: "containerClasses" }] : []));
    closeButtonClasses = computed(() => zTagCloseButtonVariants({ zSize: this.zSize() }), ...(ngDevMode ? [{ debugName: "closeButtonClasses" }] : []));
    closeIconSize = computed(() => {
        const sizeMap = {
            sm: '10',
            default: '12',
            lg: '14',
        };
        return sizeMap[this.zSize()];
    }, ...(ngDevMode ? [{ debugName: "closeIconSize" }] : []));
    tagConfig = computed(() => ({
        size: this.zSize(),
        color: this.zColor(),
        closable: this.zClosable(),
        disabled: this.zDisabled(),
        randomColor: this.zRandomColor(),
        tagClass: this.zTagClass(),
        randomColorCache: this._randomColorCache,
    }), ...(ngDevMode ? [{ debugName: "tagConfig" }] : []));
    effectiveAddText = computed(() => {
        this._zTranslate.currentLang();
        return this.zAddText() || this._zTranslate.instant('i18n_z_ui_tags_add');
    }, ...(ngDevMode ? [{ debugName: "effectiveAddText" }] : []));
    effectiveAddPlaceholder = computed(() => {
        this._zTranslate.currentLang();
        return this.zAddPlaceholder() || this._zTranslate.instant('i18n_z_ui_tags_placeholder');
    }, ...(ngDevMode ? [{ debugName: "effectiveAddPlaceholder" }] : []));
    addInputClasses = computed(() => {
        const sizeClasses = {
            sm: 'px-1.5 py-0.5 text-xs w-16',
            default: 'px-2 py-1 text-xs w-20',
            lg: 'px-2.5 py-1.5 text-sm w-24',
        };
        return zMergeClasses('rounded-sm border border-input bg-white shadow-xs', 'dark:bg-input/30 dark:border-input', 'outline-none transition-[border-color,box-shadow] duration-200', 'focus:border-ring focus:ring-ring/50 focus:ring-[3px]', 'text-foreground placeholder:text-muted-foreground', sizeClasses[this.zSize()]);
    }, ...(ngDevMode ? [{ debugName: "addInputClasses" }] : []));
    addButtonClasses = computed(() => {
        const sizeClasses = {
            sm: 'px-1.5 py-0.5 text-xs gap-1',
            default: 'px-2 py-1 text-xs gap-1.5',
            lg: 'px-2.5 py-1.5 text-sm gap-2',
        };
        return zMergeClasses('inline-flex items-center justify-center', 'rounded-sm border border-dashed border-border', 'text-muted-foreground cursor-pointer', 'transition-colors duration-200', 'hover:border-primary hover:text-primary hover:bg-primary/5', sizeClasses[this.zSize()]);
    }, ...(ngDevMode ? [{ debugName: "addButtonClasses" }] : []));
    ngAfterViewInit() {
        if (this.uiState().pendingFocus) {
            const inputEl = this._addInput();
            if (inputEl) {
                inputEl.nativeElement.focus();
                this.uiState.update(s => ({ ...s, pendingFocus: false }));
            }
        }
    }
    onRemoveTag(tag, event) {
        event.stopPropagation();
        if (tag.disabled || this.zDisabled()) {
            return;
        }
        this._randomColorCache.delete(tag.value);
        this.zTagClose.emit(tag);
    }
    onAddClick() {
        this.uiState.update(s => ({ ...s, isAdding: true, pendingFocus: true }));
        setTimeout(() => {
            const inputEl = this._addInput();
            if (inputEl) {
                inputEl.nativeElement.focus();
            }
        });
    }
    onAddConfirm(event) {
        const input = event.target;
        const value = input.value.trim();
        if (value) {
            this.zTagAdd.emit(value);
            input.value = '';
        }
        this.uiState.update(s => ({ ...s, isAdding: false }));
    }
    onAddCancel() {
        this.uiState.update(s => ({ ...s, isAdding: false }));
    }
    onAddBlur() {
        const inputEl = this._addInput();
        const input = inputEl?.nativeElement;
        if (input && input.value.trim()) {
            this.zTagAdd.emit(input.value.trim());
        }
        this.uiState.update(s => ({ ...s, isAdding: false }));
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZTagsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: ZTagsComponent, isStandalone: true, selector: "z-tags", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zTags: { classPropertyName: "zTags", publicName: "zTags", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zColor: { classPropertyName: "zColor", publicName: "zColor", isSignal: true, isRequired: false, transformFunction: null }, zClosable: { classPropertyName: "zClosable", publicName: "zClosable", isSignal: true, isRequired: false, transformFunction: null }, zDisabled: { classPropertyName: "zDisabled", publicName: "zDisabled", isSignal: true, isRequired: false, transformFunction: null }, zAddable: { classPropertyName: "zAddable", publicName: "zAddable", isSignal: true, isRequired: false, transformFunction: null }, zAddText: { classPropertyName: "zAddText", publicName: "zAddText", isSignal: true, isRequired: false, transformFunction: null }, zAddPlaceholder: { classPropertyName: "zAddPlaceholder", publicName: "zAddPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, zRandomColor: { classPropertyName: "zRandomColor", publicName: "zRandomColor", isSignal: true, isRequired: false, transformFunction: null }, zTagClass: { classPropertyName: "zTagClass", publicName: "zTagClass", isSignal: true, isRequired: false, transformFunction: null }, zLabelClass: { classPropertyName: "zLabelClass", publicName: "zLabelClass", isSignal: true, isRequired: false, transformFunction: null }, zMaxWidth: { classPropertyName: "zMaxWidth", publicName: "zMaxWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zTagClose: "zTagClose", zTagAdd: "zTagAdd" }, host: { properties: { "class": "hostClasses()" } }, viewQueries: [{ propertyName: "_addInput", first: true, predicate: ["addInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<div [class]=\"containerClasses()\">\n  @for (tag of zTags(); track tag.value) {\n    <span\n      [class]=\"tag | zTagClasses: tagConfig()\"\n      [style]=\"tag | zTagStyle: tagConfig()\"\n      z-tooltip\n      [zContent]=\"tag.label | translate\">\n      <span [class]=\"labelClasses()\" [style]=\"labelStyle()\">{{ tag.label | translate }}</span>\n      @if (tag | zTagClosable: tagConfig()) {\n        <button\n          type=\"button\"\n          [class]=\"closeButtonClasses()\"\n          [disabled]=\"tag.disabled || zDisabled()\"\n          (click)=\"onRemoveTag(tag, $event)\"\n          [attr.aria-label]=\"'Remove ' + (tag.label | translate)\">\n          <z-icon zType=\"lucideX\" [zSize]=\"closeIconSize()\" class=\"text-current\" />\n        </button>\n      }\n    </span>\n  }\n\n  @if (zAddable() && !zDisabled()) {\n    @if (uiState().isAdding) {\n      <input\n        #addInput\n        type=\"text\"\n        [class]=\"addInputClasses()\"\n        [placeholder]=\"effectiveAddPlaceholder()\"\n        (keydown.enter)=\"onAddConfirm($event)\"\n        (keydown.escape)=\"onAddCancel()\"\n        (blur)=\"onAddBlur()\" />\n    } @else {\n      <button type=\"button\" [class]=\"addButtonClasses()\" (click)=\"onAddClick()\">\n        <z-icon zType=\"lucidePlus\" [zSize]=\"closeIconSize()\" class=\"text-current\" />\n        <span>{{ effectiveAddText() }}</span>\n      </button>\n    }\n  }\n</div>\n", dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "directive", type: ZTooltipDirective, selector: "[z-tooltip], [zTooltip]", inputs: ["zContent", "zPosition", "zTooltipPosition", "zTrigger", "zTooltipTrigger", "zTooltipType", "zTooltipSize", "zClass", "zTooltipClass", "zShowDelay", "zTooltipShowDelay", "zHideDelay", "zTooltipHideDelay", "zArrow", "zTooltipArrow", "zDisabled", "zTooltipDisabled", "zOffset", "zTooltipOffset", "zAutoDetect", "zTriggerElement", "zAlwaysShow", "zMaxWidth"], outputs: ["zShow", "zHide"], exportAs: ["zTooltip"] }, { kind: "pipe", type: ZTagClassesPipe, name: "zTagClasses" }, { kind: "pipe", type: ZTagStylePipe, name: "zTagStyle" }, { kind: "pipe", type: ZTagClosablePipe, name: "zTagClosable" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZTagsComponent, decorators: [{
            type: Component,
            args: [{ selector: 'z-tags', imports: [ZIconComponent, ZTooltipDirective, ZTagClassesPipe, ZTagStylePipe, ZTagClosablePipe, TranslatePipe], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                        '[class]': 'hostClasses()',
                    }, template: "<div [class]=\"containerClasses()\">\n  @for (tag of zTags(); track tag.value) {\n    <span\n      [class]=\"tag | zTagClasses: tagConfig()\"\n      [style]=\"tag | zTagStyle: tagConfig()\"\n      z-tooltip\n      [zContent]=\"tag.label | translate\">\n      <span [class]=\"labelClasses()\" [style]=\"labelStyle()\">{{ tag.label | translate }}</span>\n      @if (tag | zTagClosable: tagConfig()) {\n        <button\n          type=\"button\"\n          [class]=\"closeButtonClasses()\"\n          [disabled]=\"tag.disabled || zDisabled()\"\n          (click)=\"onRemoveTag(tag, $event)\"\n          [attr.aria-label]=\"'Remove ' + (tag.label | translate)\">\n          <z-icon zType=\"lucideX\" [zSize]=\"closeIconSize()\" class=\"text-current\" />\n        </button>\n      }\n    </span>\n  }\n\n  @if (zAddable() && !zDisabled()) {\n    @if (uiState().isAdding) {\n      <input\n        #addInput\n        type=\"text\"\n        [class]=\"addInputClasses()\"\n        [placeholder]=\"effectiveAddPlaceholder()\"\n        (keydown.enter)=\"onAddConfirm($event)\"\n        (keydown.escape)=\"onAddCancel()\"\n        (blur)=\"onAddBlur()\" />\n    } @else {\n      <button type=\"button\" [class]=\"addButtonClasses()\" (click)=\"onAddClick()\">\n        <z-icon zType=\"lucidePlus\" [zSize]=\"closeIconSize()\" class=\"text-current\" />\n        <span>{{ effectiveAddText() }}</span>\n      </button>\n    }\n  }\n</div>\n" }]
        }], propDecorators: { _addInput: [{ type: i0.ViewChild, args: ['addInput', { isSignal: true }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zTags: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTags", required: false }] }], zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "zColor", required: false }] }], zClosable: [{ type: i0.Input, args: [{ isSignal: true, alias: "zClosable", required: false }] }], zDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDisabled", required: false }] }], zAddable: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAddable", required: false }] }], zAddText: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAddText", required: false }] }], zAddPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "zAddPlaceholder", required: false }] }], zRandomColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "zRandomColor", required: false }] }], zTagClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTagClass", required: false }] }], zLabelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLabelClass", required: false }] }], zMaxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMaxWidth", required: false }] }], zTagClose: [{ type: i0.Output, args: ["zTagClose"] }], zTagAdd: [{ type: i0.Output, args: ["zTagAdd"] }] } });

class ZTagsDirective {
    zSize = input('default', ...(ngDevMode ? [{ debugName: "zSize" }] : []));
    zColor = input('default', ...(ngDevMode ? [{ debugName: "zColor" }] : []));
    zDisabled = input(false, { ...(ngDevMode ? { debugName: "zDisabled" } : {}), transform: zTransform });
    zClass = input('', ...(ngDevMode ? [{ debugName: "zClass" }] : []));
    hostClasses = computed(() => zMergeClasses(zTagVariants({
        zSize: this.zSize(),
        zColor: this.zColor(),
        zDisabled: this.zDisabled(),
        zClosable: false,
    }), this.zClass()), ...(ngDevMode ? [{ debugName: "hostClasses" }] : []));
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZTagsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.9", type: ZTagsDirective, isStandalone: true, selector: "[z-tags]", inputs: { zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zColor: { classPropertyName: "zColor", publicName: "zColor", isSignal: true, isRequired: false, transformFunction: null }, zDisabled: { classPropertyName: "zDisabled", publicName: "zDisabled", isSignal: true, isRequired: false, transformFunction: null }, zClass: { classPropertyName: "zClass", publicName: "zClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "attr.aria-disabled": "zDisabled() || null" } }, exportAs: ["zTags"], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZTagsDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[z-tags]',
                    standalone: true,
                    host: {
                        '[class]': 'hostClasses()',
                        '[attr.aria-disabled]': 'zDisabled() || null',
                    },
                    exportAs: 'zTags',
                }]
        }], propDecorators: { zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "zColor", required: false }] }], zDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDisabled", required: false }] }], zClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "zClass", required: false }] }] } });

/**
 * Generated bundle index. Do not edit.
 */

export { ZTagClassesPipe, ZTagClosablePipe, ZTagStylePipe, ZTagsComponent, ZTagsDirective, zTagCloseButtonVariants, zTagVariants, zTagsContainerVariants };
//# sourceMappingURL=shival99-z-ui-components-z-tags.mjs.map
