import * as i0 from '@angular/core';
import { InjectionToken, inject, signal, computed, Directive, input, ViewEncapsulation, ChangeDetectionStrategy, Component, model, output, contentChildren, effect } from '@angular/core';
import { zMergeClasses } from '@shival99/z-ui/utils';
import { cva } from 'class-variance-authority';

const Z_BUTTON_GROUP = new InjectionToken('Z_BUTTON_GROUP');

class ZButtonGroupItemDirective {
    _group = inject(Z_BUTTON_GROUP, { optional: true });
    _index = signal(-1, ...(ngDevMode ? [{ debugName: "_index" }] : []));
    isActive = computed(() => {
        if (!this._group) {
            return false;
        }
        return this._group._isItemActive(this._index());
    }, ...(ngDevMode ? [{ debugName: "isActive" }] : []));
    index = this._index.asReadonly();
    _setIndex(index) {
        this._index.set(index);
    }
    onClick() {
        if (!this._group) {
            return;
        }
        this._group._selectItem(this._index());
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZButtonGroupItemDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.9", type: ZButtonGroupItemDirective, isStandalone: true, selector: "[z-button-group-item]", host: { listeners: { "click": "onClick()" }, properties: { "class.z-button-group-item-active": "isActive()" } }, exportAs: ["zButtonGroupItem"], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZButtonGroupItemDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[z-button-group-item]',
                    standalone: true,
                    host: {
                        '[class.z-button-group-item-active]': 'isActive()',
                        '(click)': 'onClick()',
                    },
                    exportAs: 'zButtonGroupItem',
                }]
        }] });

const zButtonGroupVariants = cva('inline-flex items-center [--radius:var(--radius)]', {
    variants: {
        zOrientation: {
            horizontal: [
                'flex-row',
                // First child - only left border radius
                '[&>*:first-child]:rounded-r-none',
                // Last child - only right border radius
                '[&>*:last-child]:rounded-l-none',
                // Middle children - no border radius
                '[&>*:not(:first-child):not(:last-child)]:rounded-none',
                // Remove double borders between buttons
                '[&>*:not(:first-child)]:border-l-0',
                // Handle single child
                '[&>*:only-child]:rounded-[var(--radius)]',
                '[&>*:only-child]:border-l',
                // Active item styling - use primary color from theme
                '[&>*.z-button-group-item-active]:bg-primary',
                '[&>*.z-button-group-item-active]:text-primary-foreground',
                '[&>*.z-button-group-item-active]:border-primary',
                '[&>*.z-button-group-item-active]:z-[1]',
            ],
            vertical: [
                'flex-col',
                // First child - only top border radius
                '[&>*:first-child]:rounded-b-none',
                // Last child - only bottom border radius
                '[&>*:last-child]:rounded-t-none',
                // Middle children - no border radius
                '[&>*:not(:first-child):not(:last-child)]:rounded-none',
                // Remove double borders between buttons
                '[&>*:not(:first-child)]:border-t-0',
                // Handle single child
                '[&>*:only-child]:rounded-[var(--radius)]',
                '[&>*:only-child]:border-t',
                // Active item styling - use primary color from theme
                '[&>*.z-button-group-item-active]:bg-primary',
                '[&>*.z-button-group-item-active]:text-primary-foreground',
                '[&>*.z-button-group-item-active]:border-primary',
                '[&>*.z-button-group-item-active]:z-[1]',
            ],
        },
    },
    defaultVariants: {
        zOrientation: 'horizontal',
    },
});
const zButtonGroupSeparatorVariants = cva('shrink-0 bg-border', {
    variants: {
        zOrientation: {
            horizontal: 'h-full w-px',
            vertical: 'w-full h-px',
        },
    },
    defaultVariants: {
        zOrientation: 'horizontal',
    },
});

class ZButtonGroupSeparatorComponent {
    zClass = input('', ...(ngDevMode ? [{ debugName: "zClass" }] : []));
    zOrientation = input('horizontal', ...(ngDevMode ? [{ debugName: "zOrientation" }] : []));
    zClasses = computed(() => zMergeClasses(zButtonGroupSeparatorVariants({
        zOrientation: this.zOrientation(),
    }), this.zClass()), ...(ngDevMode ? [{ debugName: "zClasses" }] : []));
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZButtonGroupSeparatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.9", type: ZButtonGroupSeparatorComponent, isStandalone: true, selector: "z-button-group-separator", inputs: { zClass: { classPropertyName: "zClass", publicName: "zClass", isSignal: true, isRequired: false, transformFunction: null }, zOrientation: { classPropertyName: "zOrientation", publicName: "zOrientation", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "separator" }, properties: { "class": "zClasses()" } }, exportAs: ["zButtonGroupSeparator"], ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZButtonGroupSeparatorComponent, decorators: [{
            type: Component,
            args: [{
                    selector: 'z-button-group-separator',
                    standalone: true,
                    template: ``,
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None,
                    host: {
                        role: 'separator',
                        '[class]': 'zClasses()',
                    },
                    exportAs: 'zButtonGroupSeparator',
                }]
        }], propDecorators: { zClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "zClass", required: false }] }], zOrientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "zOrientation", required: false }] }] } });

class ZButtonGroupComponent {
    zClass = input('', ...(ngDevMode ? [{ debugName: "zClass" }] : []));
    zOrientation = input('horizontal', ...(ngDevMode ? [{ debugName: "zOrientation" }] : []));
    zActive = model(null, ...(ngDevMode ? [{ debugName: "zActive" }] : []));
    zActiveChange = output();
    _items = contentChildren(ZButtonGroupItemDirective, ...(ngDevMode ? [{ debugName: "_items" }] : []));
    zClasses = computed(() => zMergeClasses(zButtonGroupVariants({
        zOrientation: this.zOrientation(),
    }), this.zClass()), ...(ngDevMode ? [{ debugName: "zClasses" }] : []));
    constructor() {
        effect(() => {
            const items = this._items();
            items.forEach((item, index) => {
                item._setIndex(index);
            });
        });
    }
    _selectItem(index) {
        const newValue = this.zActive() === index ? null : index;
        this.zActive.set(newValue);
        this.zActiveChange.emit(newValue);
    }
    _isItemActive(index) {
        return this.zActive() === index;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.9", type: ZButtonGroupComponent, isStandalone: true, selector: "z-button-group", inputs: { zClass: { classPropertyName: "zClass", publicName: "zClass", isSignal: true, isRequired: false, transformFunction: null }, zOrientation: { classPropertyName: "zOrientation", publicName: "zOrientation", isSignal: true, isRequired: false, transformFunction: null }, zActive: { classPropertyName: "zActive", publicName: "zActive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zActive: "zActiveChange", zActiveChange: "zActiveChange" }, host: { attributes: { "role": "group" }, properties: { "class": "zClasses()" } }, providers: [
            {
                provide: Z_BUTTON_GROUP,
                useExisting: ZButtonGroupComponent,
            },
        ], queries: [{ propertyName: "_items", predicate: ZButtonGroupItemDirective, isSignal: true }], exportAs: ["zButtonGroup"], ngImport: i0, template: `
    <ng-content />
  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZButtonGroupComponent, decorators: [{
            type: Component,
            args: [{
                    selector: 'z-button-group',
                    standalone: true,
                    template: `
    <ng-content />
  `,
                    providers: [
                        {
                            provide: Z_BUTTON_GROUP,
                            useExisting: ZButtonGroupComponent,
                        },
                    ],
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None,
                    host: {
                        role: 'group',
                        '[class]': 'zClasses()',
                    },
                    exportAs: 'zButtonGroup',
                }]
        }], ctorParameters: () => [], propDecorators: { zClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "zClass", required: false }] }], zOrientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "zOrientation", required: false }] }], zActive: [{ type: i0.Input, args: [{ isSignal: true, alias: "zActive", required: false }] }, { type: i0.Output, args: ["zActiveChange"] }], zActiveChange: [{ type: i0.Output, args: ["zActiveChange"] }], _items: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => ZButtonGroupItemDirective), { isSignal: true }] }] } });

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

export { ZButtonGroupComponent, ZButtonGroupItemDirective, ZButtonGroupSeparatorComponent, Z_BUTTON_GROUP, zButtonGroupSeparatorVariants, zButtonGroupVariants };
//# sourceMappingURL=shival99-z-ui-components-z-button-group.mjs.map
