import { AsyncPipe, NgForOf, NgIf, NgTemplateOutlet } from '@angular/common';
import { ChangeDetectionStrategy, Component, ContentChildren, inject, Input, TemplateRef, } from '@angular/core';
import { toSignal } from '@angular/core/rxjs-interop';
import { EMPTY_QUERY } from '@taiga-ui/cdk/constants';
import { TuiItem } from '@taiga-ui/cdk/directives/item';
import { TuiButton } from '@taiga-ui/core/components/button';
import { TuiDataList } from '@taiga-ui/core/components/data-list';
import { TuiIcon } from '@taiga-ui/core/components/icon';
import { tuiLinkOptionsProvider } from '@taiga-ui/core/components/link';
import { TuiDropdown } from '@taiga-ui/core/directives/dropdown';
import { tuiHintOptionsProvider } from '@taiga-ui/core/directives/hint';
import { TUI_COMMON_ICONS } from '@taiga-ui/core/tokens';
import { TuiItemsWithMore } from '@taiga-ui/kit/components/items-with-more';
import { TUI_MORE_WORD } from '@taiga-ui/kit/tokens';
import { TUI_BREADCRUMBS_OPTIONS } from './breadcrumbs.options';
import * as i0 from "@angular/core";
import * as i1 from "@taiga-ui/core/components/data-list";
import * as i2 from "@taiga-ui/core/directives/dropdown";
import * as i3 from "@taiga-ui/kit/components/items-with-more";
import * as i4 from "@taiga-ui/cdk/directives/item";
class TuiBreadcrumbs {
    constructor() {
        this.items = EMPTY_QUERY;
        this.options = inject(TUI_BREADCRUMBS_OPTIONS);
        this.icons = inject(TUI_COMMON_ICONS);
        this.more = toSignal(inject(TUI_MORE_WORD), { initialValue: '' });
        this.size = this.options.size;
        this.itemsLimit = this.options.itemsLimit;
    }
    get limit() {
        return this.itemsLimit ? this.itemsLimit - 2 : Infinity;
    }
    get offset() {
        return this.itemsLimit === 2 ? 1 : 0;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiBreadcrumbs, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiBreadcrumbs, isStandalone: true, selector: "tui-breadcrumbs", inputs: { size: "size", itemsLimit: "itemsLimit" }, host: { properties: { "attr.data-size": "size" } }, providers: [
            tuiLinkOptionsProvider({ appearance: 'action-grayscale' }),
            tuiHintOptionsProvider({ direction: 'bottom' }),
        ], queries: [{ propertyName: "items", predicate: TuiItem, read: TemplateRef }], ngImport: i0, template: "<ng-container *ngIf=\"items.changes | async\" />\n<ng-container *ngIf=\"itemsLimit > 1; else plain\">\n    <ng-container *ngIf=\"itemsLimit !== 2\">\n        <ng-container [ngTemplateOutlet]=\"items.first\" />\n        <ng-container [ngTemplateOutlet]=\"separator\" />\n    </ng-container>\n    <tui-items-with-more\n        side=\"start\"\n        [itemsLimit]=\"itemsLimit - 2\"\n        [required]=\"items.length + offset - 2\"\n    >\n        <ng-container *ngFor=\"let item of items; let last = last\">\n            <ng-container *ngIf=\"item !== items.first || itemsLimit === 2\">\n                <ng-container *tuiItem>\n                    <ng-container [ngTemplateOutlet]=\"item\" />\n                    <ng-container\n                        *ngIf=\"!last\"\n                        [ngTemplateOutlet]=\"separator\"\n                    />\n                </ng-container>\n            </ng-container>\n        </ng-container>\n        <ng-template\n            let-index\n            tuiMore\n        >\n            <span class=\"t-more\">\n                <button\n                    appearance=\"flat\"\n                    size=\"xs\"\n                    tuiDropdownOpen\n                    tuiIconButton\n                    type=\"button\"\n                    [iconStart]=\"icons.ellipsis\"\n                    [tuiDropdown]=\"dropdown\"\n                >\n                    {{ more() }}\n                </button>\n                <ng-container [ngTemplateOutlet]=\"separator\" />\n            </span>\n            <ng-template #dropdown>\n                <tui-data-list size=\"s\">\n                    <ng-container *ngFor=\"let item of items; let i = index\">\n                        <span\n                            *ngIf=\"i + offset && i <= index && item !== items.last\"\n                            tuiOption\n                            class=\"t-option\"\n                        >\n                            <ng-container [ngTemplateOutlet]=\"item\" />\n                        </span>\n                    </ng-container>\n                </tui-data-list>\n            </ng-template>\n        </ng-template>\n    </tui-items-with-more>\n</ng-container>\n<ng-template #separator>\n    <tui-icon\n        *ngIf=\"options.icon.length > 1; else char\"\n        class=\"t-icon\"\n        [icon]=\"options.icon\"\n    />\n    <ng-template #char>\n        <span class=\"t-char\">{{ options.icon }}</span>\n    </ng-template>\n</ng-template>\n<ng-template #plain>\n    <ng-container *ngFor=\"let item of items; let last = last\">\n        <ng-container [ngTemplateOutlet]=\"item\" />\n        <ng-container\n            *ngIf=\"!last\"\n            [ngTemplateOutlet]=\"separator\"\n        />\n    </ng-container>\n</ng-template>\n\n<ng-content />\n", styles: [":host{display:flex;align-items:center;white-space:nowrap;color:var(--tui-text-secondary)}:host[data-size=m]{font:var(--tui-font-text-s);line-height:1.5rem;block-size:1.5rem}:host[data-size=l]{font:var(--tui-font-text-m);line-height:2.5rem;block-size:2.5rem}:host ::ng-deep [tuiLink]{text-decoration:none}.t-more{display:flex;align-items:center}.t-option ::ng-deep>*{color:var(--tui-text-primary)!important;background:transparent!important;text-decoration:none}.t-icon{margin:0 .5rem;font-size:1rem;transform:scaleX(var(--tui-inline))}.t-char{margin:0 .375rem}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1.TuiDataListComponent, selector: "tui-data-list", inputs: ["emptyContent", "size"] }, { kind: "directive", type: i2.TuiDropdownDirective, selector: "[tuiDropdown]:not(ng-container):not(ng-template)", inputs: ["tuiDropdown"], exportAs: ["tuiDropdown"] }, { kind: "directive", type: i2.TuiDropdownOpen, selector: "[tuiDropdown][tuiDropdownOpen],[tuiDropdown][tuiDropdownOpenChange]", inputs: ["tuiDropdownEnabled", "tuiDropdownOpen"], outputs: ["tuiDropdownOpenChange"] }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "component", type: i3.TuiItemsWithMoreComponent, selector: "tui-items-with-more", outputs: ["lastIndexChange"] }, { kind: "directive", type: i3.TuiMore, selector: "[tuiMore]" }, { kind: "directive", type: i4.TuiItem, selector: "[tuiItem]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
export { TuiBreadcrumbs };
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiBreadcrumbs, decorators: [{
            type: Component,
            args: [{ standalone: true, selector: 'tui-breadcrumbs', imports: [
                        AsyncPipe,
                        NgForOf,
                        NgIf,
                        NgTemplateOutlet,
                        TuiButton,
                        TuiDataList,
                        TuiDropdown,
                        TuiIcon,
                        TuiItemsWithMore,
                    ], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                        tuiLinkOptionsProvider({ appearance: 'action-grayscale' }),
                        tuiHintOptionsProvider({ direction: 'bottom' }),
                    ], host: {
                        '[attr.data-size]': 'size',
                    }, template: "<ng-container *ngIf=\"items.changes | async\" />\n<ng-container *ngIf=\"itemsLimit > 1; else plain\">\n    <ng-container *ngIf=\"itemsLimit !== 2\">\n        <ng-container [ngTemplateOutlet]=\"items.first\" />\n        <ng-container [ngTemplateOutlet]=\"separator\" />\n    </ng-container>\n    <tui-items-with-more\n        side=\"start\"\n        [itemsLimit]=\"itemsLimit - 2\"\n        [required]=\"items.length + offset - 2\"\n    >\n        <ng-container *ngFor=\"let item of items; let last = last\">\n            <ng-container *ngIf=\"item !== items.first || itemsLimit === 2\">\n                <ng-container *tuiItem>\n                    <ng-container [ngTemplateOutlet]=\"item\" />\n                    <ng-container\n                        *ngIf=\"!last\"\n                        [ngTemplateOutlet]=\"separator\"\n                    />\n                </ng-container>\n            </ng-container>\n        </ng-container>\n        <ng-template\n            let-index\n            tuiMore\n        >\n            <span class=\"t-more\">\n                <button\n                    appearance=\"flat\"\n                    size=\"xs\"\n                    tuiDropdownOpen\n                    tuiIconButton\n                    type=\"button\"\n                    [iconStart]=\"icons.ellipsis\"\n                    [tuiDropdown]=\"dropdown\"\n                >\n                    {{ more() }}\n                </button>\n                <ng-container [ngTemplateOutlet]=\"separator\" />\n            </span>\n            <ng-template #dropdown>\n                <tui-data-list size=\"s\">\n                    <ng-container *ngFor=\"let item of items; let i = index\">\n                        <span\n                            *ngIf=\"i + offset && i <= index && item !== items.last\"\n                            tuiOption\n                            class=\"t-option\"\n                        >\n                            <ng-container [ngTemplateOutlet]=\"item\" />\n                        </span>\n                    </ng-container>\n                </tui-data-list>\n            </ng-template>\n        </ng-template>\n    </tui-items-with-more>\n</ng-container>\n<ng-template #separator>\n    <tui-icon\n        *ngIf=\"options.icon.length > 1; else char\"\n        class=\"t-icon\"\n        [icon]=\"options.icon\"\n    />\n    <ng-template #char>\n        <span class=\"t-char\">{{ options.icon }}</span>\n    </ng-template>\n</ng-template>\n<ng-template #plain>\n    <ng-container *ngFor=\"let item of items; let last = last\">\n        <ng-container [ngTemplateOutlet]=\"item\" />\n        <ng-container\n            *ngIf=\"!last\"\n            [ngTemplateOutlet]=\"separator\"\n        />\n    </ng-container>\n</ng-template>\n\n<ng-content />\n", styles: [":host{display:flex;align-items:center;white-space:nowrap;color:var(--tui-text-secondary)}:host[data-size=m]{font:var(--tui-font-text-s);line-height:1.5rem;block-size:1.5rem}:host[data-size=l]{font:var(--tui-font-text-m);line-height:2.5rem;block-size:2.5rem}:host ::ng-deep [tuiLink]{text-decoration:none}.t-more{display:flex;align-items:center}.t-option ::ng-deep>*{color:var(--tui-text-primary)!important;background:transparent!important;text-decoration:none}.t-icon{margin:0 .5rem;font-size:1rem;transform:scaleX(var(--tui-inline))}.t-char{margin:0 .375rem}\n"] }]
        }], propDecorators: { items: [{
                type: ContentChildren,
                args: [TuiItem, { read: TemplateRef }]
            }], size: [{
                type: Input
            }], itemsLimit: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 