import * as i0 from '@angular/core';
import { inject, input, computed, ViewEncapsulation, ChangeDetectionStrategy, Component, contentChildren, signal } from '@angular/core';
import { zTransform, zMergeClasses } from '@shival99/z-ui/utils';
import { ZIconComponent } from '@shival99/z-ui/components/z-icon';
import { cva } from 'class-variance-authority';

const zAccordionVariants = cva(['block w-full'], {
    variants: {
        zType: {
            default: 'border border-border rounded-md overflow-hidden',
            ghost: '',
            outline: 'border border-border rounded-md overflow-hidden',
            card: '',
            elevated: 'space-y-2',
            'icon-list': '',
            bordered: 'rounded-md border border-border',
            separated: 'space-y-2',
        },
    },
    defaultVariants: {
        zType: 'default',
    },
});
const zAccordionItemVariants = cva(['block group transition-[box-shadow,background-color] duration-200'], {
    variants: {
        zType: {
            default: 'border-b border-border last:border-b-0',
            ghost: 'border-b border-border last:border-b-0',
            outline: 'border-b border-border last:border-b-0',
            card: 'last:border-b-0 rounded-md px-4 transition-colors duration-200',
            elevated: 'last:border-b-0 rounded-md border-b-0 bg-card shadow-md',
            'icon-list': 'border-b border-border last:border-b-0',
            bordered: 'border-b border-border last:border-b-0',
            separated: 'border border-border rounded-md',
        },
        isDisabled: {
            true: 'cursor-not-allowed pointer-events-none opacity-50',
            false: '',
        },
        isOpen: {
            true: '',
            false: '',
        },
    },
    compoundVariants: [
        {
            zType: 'card',
            isOpen: true,
            class: 'bg-background ring-1 ring-border shadow-md',
        },
        {
            zType: 'elevated',
            isOpen: true,
            class: 'shadow-lg',
        },
    ],
    defaultVariants: {
        zType: 'default',
        isDisabled: false,
        isOpen: false,
    },
});
const zAccordionTriggerVariants = cva([
    'flex w-full select-none items-center justify-between gap-4 text-sm font-medium text-left',
    'cursor-pointer transition-[color,background-color,text-decoration-color] duration-200',
    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
], {
    variants: {
        zType: {
            default: 'px-4 py-4 hover:bg-muted/50',
            ghost: 'px-4 py-4 hover:bg-muted/50',
            outline: 'px-4 py-4 hover:bg-muted/50',
            card: 'rounded-md py-4',
            elevated: 'items-start rounded-md px-4 py-4 hover:underline',
            'icon-list': 'items-start px-4 py-4 [&[aria-expanded=true]>svg]:rotate-45',
            bordered: 'items-start px-5 py-4 hover:underline [&[aria-expanded=true]>svg]:rotate-180',
            separated: 'items-start px-5 py-4 hover:underline [&[aria-expanded=true]>svg]:rotate-180',
        },
        isOpen: {
            true: 'text-foreground',
            false: 'text-foreground',
        },
    },
    defaultVariants: {
        zType: 'default',
        isOpen: false,
    },
});
const zAccordionContentVariants = cva(['overflow-hidden text-sm'], {
    variants: {
        zType: {
            default: '',
            ghost: '',
            outline: '',
            card: 'text-muted-foreground',
            elevated: 'text-muted-foreground',
            'icon-list': 'text-muted-foreground',
            bordered: 'text-muted-foreground',
            separated: 'text-muted-foreground',
        },
        isOpen: {
            true: '',
            false: '',
        },
    },
    defaultVariants: {
        zType: 'default',
        isOpen: false,
    },
});

class ZAccordionItemComponent {
    _accordion = inject(ZAccordionComponent);
    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
    zId = input.required(...(ngDevMode ? [{ debugName: "zId" }] : []));
    zTitle = input.required(...(ngDevMode ? [{ debugName: "zTitle" }] : []));
    zDisabled = input(false, { ...(ngDevMode ? { debugName: "zDisabled" } : {}), transform: zTransform });
    isOpen = computed(() => this._accordion.isItemOpen(this.zId()), ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
    accordionType = this._accordion.zType;
    itemClasses = computed(() => zMergeClasses(zAccordionItemVariants({
        zType: this.accordionType(),
        isDisabled: this.zDisabled(),
        isOpen: this.isOpen(),
    }), this.class()), ...(ngDevMode ? [{ debugName: "itemClasses" }] : []));
    triggerClasses = computed(() => zAccordionTriggerVariants({
        zType: this.accordionType(),
        isOpen: this.isOpen(),
    }), ...(ngDevMode ? [{ debugName: "triggerClasses" }] : []));
    contentClasses = computed(() => zAccordionContentVariants({
        zType: this.accordionType(),
        isOpen: this.isOpen(),
    }), ...(ngDevMode ? [{ debugName: "contentClasses" }] : []));
    contentInnerClasses = computed(() => {
        if (this.accordionType() === 'card') {
            return 'pt-0 pb-4';
        }
        if (this.accordionType() === 'elevated') {
            return 'px-4 pt-0 pb-4';
        }
        if (this.accordionType() === 'icon-list') {
            return 'px-4 pt-0 pb-4 pl-12 text-muted-foreground';
        }
        if (this.accordionType() === 'bordered' || this.accordionType() === 'separated') {
            return 'px-5 pt-0 pb-4 text-muted-foreground';
        }
        return 'mt-2 px-4 pb-4';
    }, ...(ngDevMode ? [{ debugName: "contentInnerClasses" }] : []));
    iconType = computed(() => {
        if (this.accordionType() === 'card') {
            return this.isOpen() ? 'lucideMinus' : 'lucidePlus';
        }
        if (this.accordionType() === 'elevated') {
            return 'lucideChevronDown';
        }
        if (this.accordionType() === 'icon-list') {
            return 'lucidePlus';
        }
        if (this.accordionType() === 'bordered' || this.accordionType() === 'separated') {
            return 'lucideChevronDown';
        }
        return 'lucideChevronDown';
    }, ...(ngDevMode ? [{ debugName: "iconType" }] : []));
    iconClasses = computed(() => {
        if (this.accordionType() === 'card') {
            return 'text-muted-foreground pointer-events-none shrink-0';
        }
        if (this.accordionType() === 'elevated') {
            return zMergeClasses('text-muted-foreground pointer-events-none shrink-0 translate-y-0.5 transition-transform duration-200', this.isOpen() ? 'rotate-0' : 'rotate-90');
        }
        if (this.accordionType() === 'icon-list') {
            return zMergeClasses('text-muted-foreground pointer-events-none shrink-0 transition-transform duration-200', this.isOpen() ? 'rotate-45' : 'rotate-0');
        }
        if (this.accordionType() === 'bordered' || this.accordionType() === 'separated') {
            return 'text-muted-foreground pointer-events-none shrink-0 translate-y-0.5 transition-transform duration-200';
        }
        return zMergeClasses('text-muted-foreground shrink-0 transition-transform duration-200', this.isOpen() ? 'rotate-180' : '');
    }, ...(ngDevMode ? [{ debugName: "iconClasses" }] : []));
    titleWrapperClasses = computed(() => {
        if (this.accordionType() === 'icon-list') {
            return 'flex items-center gap-4';
        }
        return 'flex items-center gap-2';
    }, ...(ngDevMode ? [{ debugName: "titleWrapperClasses" }] : []));
    toggle() {
        if (this.zDisabled()) {
            return;
        }
        this._accordion.toggleItem(this.zId());
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZAccordionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.9", type: ZAccordionItemComponent, isStandalone: true, selector: "z-accordion-item", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zId: { classPropertyName: "zId", publicName: "zId", isSignal: true, isRequired: true, transformFunction: null }, zTitle: { classPropertyName: "zTitle", publicName: "zTitle", isSignal: true, isRequired: true, transformFunction: null }, zDisabled: { classPropertyName: "zDisabled", publicName: "zDisabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "itemClasses()" } }, ngImport: i0, template: "<div\n  [class]=\"triggerClasses()\"\n  (click)=\"toggle()\"\n  (keydown.enter)=\"toggle()\"\n  (keydown.space)=\"toggle()\"\n  tabindex=\"0\"\n  role=\"button\"\n  [attr.aria-expanded]=\"isOpen()\">\n  <span [class]=\"titleWrapperClasses()\">\n    <ng-content select=\"[zAccordionIcon]\" />\n    <span>{{ zTitle() }}</span>\n  </span>\n  <z-icon [zType]=\"iconType()\" zSize=\"16\" [class]=\"iconClasses()\" />\n</div>\n\n<div [class]=\"contentClasses()\" class=\"z-accordion-content\" [class.z-accordion-content-open]=\"isOpen()\">\n  <div class=\"z-accordion-content-inner\">\n    <div [class]=\"contentInnerClasses()\">\n      <ng-content />\n    </div>\n  </div>\n</div>\n", styles: [".z-accordion-content{display:grid;grid-template-rows:0fr;transition:grid-template-rows .2s ease-out}.z-accordion-content.z-accordion-content-open{grid-template-rows:1fr}.z-accordion-content>.z-accordion-content-inner{overflow:hidden;min-height:0}\n"], dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZAccordionItemComponent, decorators: [{
            type: Component,
            args: [{ selector: 'z-accordion-item', imports: [ZIconComponent], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                        '[class]': 'itemClasses()',
                    }, template: "<div\n  [class]=\"triggerClasses()\"\n  (click)=\"toggle()\"\n  (keydown.enter)=\"toggle()\"\n  (keydown.space)=\"toggle()\"\n  tabindex=\"0\"\n  role=\"button\"\n  [attr.aria-expanded]=\"isOpen()\">\n  <span [class]=\"titleWrapperClasses()\">\n    <ng-content select=\"[zAccordionIcon]\" />\n    <span>{{ zTitle() }}</span>\n  </span>\n  <z-icon [zType]=\"iconType()\" zSize=\"16\" [class]=\"iconClasses()\" />\n</div>\n\n<div [class]=\"contentClasses()\" class=\"z-accordion-content\" [class.z-accordion-content-open]=\"isOpen()\">\n  <div class=\"z-accordion-content-inner\">\n    <div [class]=\"contentInnerClasses()\">\n      <ng-content />\n    </div>\n  </div>\n</div>\n", styles: [".z-accordion-content{display:grid;grid-template-rows:0fr;transition:grid-template-rows .2s ease-out}.z-accordion-content.z-accordion-content-open{grid-template-rows:1fr}.z-accordion-content>.z-accordion-content-inner{overflow:hidden;min-height:0}\n"] }]
        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zId: [{ type: i0.Input, args: [{ isSignal: true, alias: "zId", required: true }] }], zTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTitle", required: true }] }], zDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDisabled", required: false }] }] } });

class ZAccordionComponent {
    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
    zType = input('default', ...(ngDevMode ? [{ debugName: "zType" }] : []));
    zMultiple = input(false, { ...(ngDevMode ? { debugName: "zMultiple" } : {}), transform: zTransform });
    zCollapsible = input(true, { ...(ngDevMode ? { debugName: "zCollapsible" } : {}), transform: zTransform });
    items = contentChildren(ZAccordionItemComponent, ...(ngDevMode ? [{ debugName: "items" }] : []));
    _openItems = signal(new Set(), ...(ngDevMode ? [{ debugName: "_openItems" }] : []));
    zClasses = computed(() => zMergeClasses(zAccordionVariants({ zType: this.zType() }), this.class()), ...(ngDevMode ? [{ debugName: "zClasses" }] : []));
    isItemOpen(itemId) {
        return this._openItems().has(itemId);
    }
    toggleItem(itemId) {
        const current = new Set(this._openItems());
        const isCurrentlyOpen = current.has(itemId);
        if (isCurrentlyOpen && this.zCollapsible()) {
            current.delete(itemId);
            this._openItems.set(current);
            return;
        }
        if (isCurrentlyOpen) {
            return;
        }
        if (!this.zMultiple()) {
            current.clear();
        }
        current.add(itemId);
        this._openItems.set(current);
    }
    openItem(itemId) {
        const current = new Set(this._openItems());
        if (!this.zMultiple()) {
            current.clear();
        }
        current.add(itemId);
        this._openItems.set(current);
    }
    closeItem(itemId) {
        if (!this.zCollapsible()) {
            return;
        }
        const current = new Set(this._openItems());
        current.delete(itemId);
        this._openItems.set(current);
    }
    closeAll() {
        if (!this.zCollapsible()) {
            return;
        }
        this._openItems.set(new Set());
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZAccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.9", type: ZAccordionComponent, isStandalone: true, selector: "z-accordion", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zType: { classPropertyName: "zType", publicName: "zType", isSignal: true, isRequired: false, transformFunction: null }, zMultiple: { classPropertyName: "zMultiple", publicName: "zMultiple", isSignal: true, isRequired: false, transformFunction: null }, zCollapsible: { classPropertyName: "zCollapsible", publicName: "zCollapsible", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "zClasses()" } }, queries: [{ propertyName: "items", predicate: ZAccordionItemComponent, isSignal: true }], ngImport: i0, template: '<ng-content />', isInline: true, styles: [".z-accordion-content{display:grid;grid-template-rows:0fr;transition:grid-template-rows .2s ease-out}.z-accordion-content.z-accordion-content-open{grid-template-rows:1fr}.z-accordion-content>.z-accordion-content-inner{overflow:hidden;min-height:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZAccordionComponent, decorators: [{
            type: Component,
            args: [{ selector: 'z-accordion', standalone: true, template: '<ng-content />', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                        '[class]': 'zClasses()',
                    }, styles: [".z-accordion-content{display:grid;grid-template-rows:0fr;transition:grid-template-rows .2s ease-out}.z-accordion-content.z-accordion-content-open{grid-template-rows:1fr}.z-accordion-content>.z-accordion-content-inner{overflow:hidden;min-height:0}\n"] }]
        }], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zType: [{ type: i0.Input, args: [{ isSignal: true, alias: "zType", required: false }] }], zMultiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMultiple", required: false }] }], zCollapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCollapsible", required: false }] }], items: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => ZAccordionItemComponent), { isSignal: true }] }] } });

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

export { ZAccordionComponent, ZAccordionItemComponent, zAccordionContentVariants, zAccordionItemVariants, zAccordionTriggerVariants, zAccordionVariants };
//# sourceMappingURL=shival99-z-ui-components-z-accordion.mjs.map
