import * as i0 from '@angular/core';
import { InjectionToken, model, input, output, Directive, inject, ChangeDetectorRef, ChangeDetectionStrategy, ViewEncapsulation, Component, NgModule } from '@angular/core';
import { Subject } from 'rxjs';

const SORT = new InjectionToken('SORT');

class SortDirective {
    active = model('', { ...(ngDevMode ? { debugName: "active" } : /* istanbul ignore next */ {}), alias: 'ngsSortActive' });
    start = input('asc', { ...(ngDevMode ? { debugName: "start" } : /* istanbul ignore next */ {}), alias: 'ngsSortStart' });
    direction = model('', { ...(ngDevMode ? { debugName: "direction" } : /* istanbul ignore next */ {}), alias: 'ngsSortDirection' });
    disableClear = input(false, { ...(ngDevMode ? { debugName: "disableClear" } : /* istanbul ignore next */ {}), alias: 'ngsSortDisableClear',
        transform: (value) => typeof value === 'string' ? value === '' || value === 'true' : value });
    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), alias: 'ngsSortDisabled',
        transform: (value) => typeof value === 'string' ? value === '' || value === 'true' : value });
    sortChange = output({ alias: 'ngsSortChange' });
    _stateChanges = new Subject();
    _initialized = new Subject();
    initialized = this._initialized.asObservable();
    ngOnInit() {
        this._initialized.next();
        this._initialized.complete();
    }
    ngOnChanges() {
        this._stateChanges.next();
    }
    ngOnDestroy() {
        this._stateChanges.complete();
    }
    sort(id) {
        const direction = this.getNextSortDirection(id);
        this.active.set(id);
        this.direction.set(direction);
        this.sortChange.emit({ active: id, direction });
        this._stateChanges.next();
    }
    getNextSortDirection(id) {
        if (this.active() !== id) {
            return this.start() || 'asc';
        }
        if (this.direction() === 'asc') {
            return 'desc';
        }
        if (this.direction() === 'desc' && !this.disableClear()) {
            return '';
        }
        return 'asc';
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SortDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.4", type: SortDirective, isStandalone: true, selector: "[ngsSort]", inputs: { active: { classPropertyName: "active", publicName: "ngsSortActive", isSignal: true, isRequired: false, transformFunction: null }, start: { classPropertyName: "start", publicName: "ngsSortStart", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "ngsSortDirection", isSignal: true, isRequired: false, transformFunction: null }, disableClear: { classPropertyName: "disableClear", publicName: "ngsSortDisableClear", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngsSortDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { active: "ngsSortActiveChange", direction: "ngsSortDirectionChange", sortChange: "ngsSortChange" }, providers: [{ provide: SORT, useExisting: SortDirective }], exportAs: ["ngsSort"], usesOnChanges: true, ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SortDirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '[ngsSort]',
                    exportAs: 'ngsSort',
                    providers: [{ provide: SORT, useExisting: SortDirective }],
                    standalone: true,
                }]
        }], propDecorators: { active: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngsSortActive", required: false }] }, { type: i0.Output, args: ["ngsSortActiveChange"] }], start: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngsSortStart", required: false }] }], direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngsSortDirection", required: false }] }, { type: i0.Output, args: ["ngsSortDirectionChange"] }], disableClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngsSortDisableClear", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngsSortDisabled", required: false }] }], sortChange: [{ type: i0.Output, args: ["ngsSortChange"] }] } });

class SortHeader {
    _rerenderSubscription;
    _cdr = inject(ChangeDetectorRef);
    id = input('', { ...(ngDevMode ? { debugName: "id" } : /* istanbul ignore next */ {}), alias: 'ngs-sort-header' });
    sortActionDescription = input('', ...(ngDevMode ? [{ debugName: "sortActionDescription" }] : /* istanbul ignore next */ []));
    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: (value) => typeof value === 'string' ? value === '' || value === 'true' : value });
    _sort = inject(SORT, { optional: true });
    ngOnInit() {
        if (this._sort && this._sort._stateChanges) {
            this._rerenderSubscription = this._sort._stateChanges.subscribe(() => {
                this._cdr.markForCheck();
            });
        }
    }
    ngOnDestroy() {
        this._rerenderSubscription?.unsubscribe();
    }
    _handleClick() {
        if (!this._isDisabled() && this._sort) {
            this._sort.sort(this.id());
        }
    }
    _getNextSortDirection() {
        if (!this._sort || this._isDisabled()) {
            return '';
        }
        return this._sort.getNextSortDirection(this.id());
    }
    _isSorted() {
        if (!this._sort) {
            return false;
        }
        const active = typeof this._sort.active === 'function' ? this._sort.active() : this._sort.active;
        const direction = typeof this._sort.direction === 'function' ? this._sort.direction() : this._sort.direction;
        return !!(active === this.id() && direction);
    }
    _isDisabled() {
        return this.disabled() || this._isSortDisabled();
    }
    _isSortDisabled() {
        return typeof this._sort?.disabled === 'function' ? this._sort.disabled() : this._sort?.disabled;
    }
    _getArrowState() {
        if (!this._sort) {
            return 'void';
        }
        const active = typeof this._sort.active === 'function' ? this._sort.active() : this._sort.active;
        const direction = typeof this._sort.direction === 'function' ? this._sort.direction() : this._sort.direction;
        return active === this.id() ? direction : 'void';
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SortHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: SortHeader, isStandalone: true, selector: "[ngs-sort-header]", inputs: { id: { classPropertyName: "id", publicName: "ngs-sort-header", isSignal: true, isRequired: false, transformFunction: null }, sortActionDescription: { classPropertyName: "sortActionDescription", publicName: "sortActionDescription", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.ngs-sort-header-disabled": "_isDisabled()" }, classAttribute: "ngs-sort-header" }, exportAs: ["ngsSortHeader"], ngImport: i0, template: "<div class=\"ngs-sort-header-container\"\n     [class.ngs-sort-header-sorted]=\"_isSorted()\">\n  <div class=\"ngs-sort-header-button relative\"\n          [attr.aria-label]=\"sortActionDescription()\"\n          (click)=\"_handleClick()\">\n    <ng-content />\n    <div class=\"ngs-sort-header-arrow\"\n         [class.ngs-sort-header-arrow-asc]=\"_getArrowState() === 'asc' || (!_isDisabled() && _getArrowState() === 'void' && _getNextSortDirection() === 'asc')\"\n         [class.ngs-sort-header-arrow-desc]=\"_getArrowState() === 'desc' || (!_isDisabled() && _getArrowState() === 'void' && _getNextSortDirection() === 'desc')\"\n         [class.ngs-sort-header-arrow-hint]=\"_getArrowState() === 'void' && !_isDisabled()\">\n      <svg viewBox=\"0 0 24 24\" focusable=\"false\" class=\"ngs-sort-header-arrow-svg\">\n        <path d=\"M7 10l5 5 5-5z\"/>\n      </svg>\n    </div>\n  </div>\n</div>\n", styles: [".ngs-sort-header-container{display:flex;align-items:center;cursor:pointer;position:relative;justify-content:flex-start;-webkit-user-select:text;user-select:text}.ngs-sort-header-button{border:none;background:transparent;padding:0;font:inherit;color:inherit;cursor:pointer;display:flex;align-items:center;width:100%;text-align:inherit;justify-content:inherit;-webkit-user-select:text;user-select:text}.ngs-sort-header-arrow{display:flex;align-items:center;justify-content:center;margin-left:calc(var(--spacing, .25rem) * .5);opacity:0;transition:transform .2s cubic-bezier(.4,0,.2,1),opacity .2s cubic-bezier(.4,0,.2,1)}.ngs-sort-header-arrow.ngs-sort-header-arrow-asc{opacity:1;transform:translateY(0)}.ngs-sort-header-arrow.ngs-sort-header-arrow-desc{opacity:1;transform:translateY(0) rotate(180deg)}.ngs-sort-header-arrow.ngs-sort-header-arrow-hint{opacity:0}.ngs-sort-header:hover:not(.ngs-sort-header-disabled) .ngs-sort-header-arrow.ngs-sort-header-arrow-hint{opacity:.54}.ngs-sort-header-arrow-svg{width:20px;height:20px;fill:currentColor}.ngs-sort-header-disabled,.ngs-sort-header-disabled .ngs-sort-header-button{cursor:default}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SortHeader, decorators: [{
            type: Component,
            args: [{ selector: '[ngs-sort-header]', exportAs: 'ngsSortHeader', host: {
                        'class': 'ngs-sort-header',
                        '[class.ngs-sort-header-disabled]': '_isDisabled()',
                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [], template: "<div class=\"ngs-sort-header-container\"\n     [class.ngs-sort-header-sorted]=\"_isSorted()\">\n  <div class=\"ngs-sort-header-button relative\"\n          [attr.aria-label]=\"sortActionDescription()\"\n          (click)=\"_handleClick()\">\n    <ng-content />\n    <div class=\"ngs-sort-header-arrow\"\n         [class.ngs-sort-header-arrow-asc]=\"_getArrowState() === 'asc' || (!_isDisabled() && _getArrowState() === 'void' && _getNextSortDirection() === 'asc')\"\n         [class.ngs-sort-header-arrow-desc]=\"_getArrowState() === 'desc' || (!_isDisabled() && _getArrowState() === 'void' && _getNextSortDirection() === 'desc')\"\n         [class.ngs-sort-header-arrow-hint]=\"_getArrowState() === 'void' && !_isDisabled()\">\n      <svg viewBox=\"0 0 24 24\" focusable=\"false\" class=\"ngs-sort-header-arrow-svg\">\n        <path d=\"M7 10l5 5 5-5z\"/>\n      </svg>\n    </div>\n  </div>\n</div>\n", styles: [".ngs-sort-header-container{display:flex;align-items:center;cursor:pointer;position:relative;justify-content:flex-start;-webkit-user-select:text;user-select:text}.ngs-sort-header-button{border:none;background:transparent;padding:0;font:inherit;color:inherit;cursor:pointer;display:flex;align-items:center;width:100%;text-align:inherit;justify-content:inherit;-webkit-user-select:text;user-select:text}.ngs-sort-header-arrow{display:flex;align-items:center;justify-content:center;margin-left:calc(var(--spacing, .25rem) * .5);opacity:0;transition:transform .2s cubic-bezier(.4,0,.2,1),opacity .2s cubic-bezier(.4,0,.2,1)}.ngs-sort-header-arrow.ngs-sort-header-arrow-asc{opacity:1;transform:translateY(0)}.ngs-sort-header-arrow.ngs-sort-header-arrow-desc{opacity:1;transform:translateY(0) rotate(180deg)}.ngs-sort-header-arrow.ngs-sort-header-arrow-hint{opacity:0}.ngs-sort-header:hover:not(.ngs-sort-header-disabled) .ngs-sort-header-arrow.ngs-sort-header-arrow-hint{opacity:.54}.ngs-sort-header-arrow-svg{width:20px;height:20px;fill:currentColor}.ngs-sort-header-disabled,.ngs-sort-header-disabled .ngs-sort-header-button{cursor:default}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngs-sort-header", required: false }] }], sortActionDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortActionDescription", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });

class SortModule {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SortModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.4", ngImport: i0, type: SortModule, imports: [SortDirective, SortHeader], exports: [SortDirective, SortHeader] });
    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SortModule });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SortModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [SortDirective, SortHeader],
                    exports: [SortDirective, SortHeader],
                }]
        }] });

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

export { SORT, SortDirective, SortHeader, SortModule };
//# sourceMappingURL=ngstarter-ui-components-sort.mjs.map
