@rt-tools/ui-kit-v2 0.39.0 → 0.39.2

package/fesm2022/rt-tools-ui-kit-v2-autocomplete.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"rt-tools-ui-kit-v2-autocomplete.mjs","names":[],"sources":["../../../projects/ui-kit-v2/src/lib/components/autocomplete/rt-autocomplete.component.ts","../../../projects/ui-kit-v2/src/lib/components/autocomplete/rt-autocomplete.component.html"],"sourcesContent":["import { BooleanInput } from '@angular/cdk/coercion';\nimport { NgTemplateOutlet } from '@angular/common';\nimport {\n    booleanAttribute,\n    computed,\n    forwardRef,\n    inject,\n    input,\n    output,\n    signal,\n    viewChild,\n    ChangeDetectionStrategy,\n    Component,\n    ElementRef,\n    InputSignal,\n    InputSignalWithTransform,\n    OutputEmitterRef,\n    Signal,\n    TemplateRef,\n    ViewEncapsulation,\n    WritableSignal,\n} from '@angular/core';\n\nimport { BlockDirective, ElemDirective, ModDirective } from '@rt-tools/core';\n\nimport { RT_KIT_LABELS, TRtKitLabelMap } from '@rt-tools/ui-kit-v2/core';\nimport { RtFormControlBase } from '@rt-tools/ui-kit-v2/form-control';\nimport { IRtIcon } from '@rt-tools/ui-kit-v2/core';\nimport { RtIconComponent } from '@rt-tools/ui-kit-v2/icon';\nimport { RtIconButtonComponent } from '@rt-tools/ui-kit-v2/icon-button';\nimport { RtSpinnerComponent } from '@rt-tools/ui-kit-v2/spinner';\nimport { RtPopoverDirective } from '@rt-tools/ui-kit-v2/popover';\nimport { RtRadiusDirective } from '@rt-tools/ui-kit-v2/radius';\nimport { RtOptionList, TRtOptionListAction } from '@rt-tools/ui-kit-v2/core';\nimport { IRtAutocomplete } from './rt-autocomplete.model';\n\n/** Сколько точек до дна панели уже считается концом списка. */\nconst END_THRESHOLD_PX: number = 8;\n\nconst BEM_BLOCK: string = 'rt-autocomplete';\n\nlet panelIdSeed: number = 0;\n\nfunction nextPanelId(): number {\n    panelIdSeed += 1;\n    return panelIdSeed;\n}\n\n/**\n * Typeahead/autocomplete с server-side filter через `(complete)` event.\n *\n * Panel рендерится через CDK Overlay (`[rtPopover]` trigger=\"manual\" на input'е)\n * — открывается по набору текста (не click/hover), не обрезается overflow.\n * Подписчик получает `(complete)` с текущей строкой и сам грузит подсказки.\n *\n * CVA через общий `RtFormControlBase`. Generic `TItem` — тип подсказки и\n * selected value. Крестик (`clearable`) виден при непустом тексте — очищает и\n * текст, и выбранный объект. Keyboard-nav (activedescendant): ArrowUp/Down —\n * highlight, Enter — выбрать активную, Escape — закрыть. Home/End — deferred.\n */\n@Component({\n    selector: 'rt-autocomplete',\n    templateUrl: './rt-autocomplete.component.html',\n    styleUrl: './rt-autocomplete.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    imports: [\n        // Angular\n        NgTemplateOutlet,\n\n        // standalone components / directives\n        RtIconButtonComponent,\n        RtIconComponent,\n        RtPopoverDirective,\n        RtSpinnerComponent,\n        BlockDirective,\n        ElemDirective,\n        ModDirective,\n    ],\n    providers: [\n        // Алиас базового токена — для contentChild(RtFormControlBase) в rt-field.\n        { provide: RtFormControlBase, useExisting: forwardRef(() => RtAutocompleteComponent) },\n    ],\n    hostDirectives: [{ directive: RtRadiusDirective, inputs: ['radius'] }],\n    host: {\n        class: BEM_BLOCK,\n        '[class.rt-autocomplete--open]': 'isOpen()',\n        '[class.rt-autocomplete--disabled]': 'isDisabled()',\n        '[class.rt-autocomplete--readonly]': 'isReadonly()',\n        '[class.rt-autocomplete--invalid]': 'isInvalid()',\n        '[class.rt-autocomplete--borderless]': '!bordered()',\n        '[class.rt-autocomplete--size--sm]': \"size() === 'sm'\",\n        '[class.rt-autocomplete--size--lg]': \"size() === 'lg'\",\n    },\n})\nexport class RtAutocompleteComponent<TItem> extends RtFormControlBase<TItem | null> {\n    /** Длина списка, на которой конец уже сообщён: прокрутка у дна до новой страницы его не повторяет. */\n    #endReportedAt: number = -1;\n\n    protected readonly t: Signal<TRtKitLabelMap> = inject(RT_KIT_LABELS);\n\n    protected readonly panelId: string = `rt-autocomplete-panel-${nextPanelId()}`;\n\n    protected readonly popover: Signal<RtPopoverDirective> = viewChild.required(RtPopoverDirective);\n\n    protected readonly fieldEl: Signal<ElementRef<HTMLInputElement> | undefined> = viewChild<ElementRef<HTMLInputElement>>('fieldEl');\n\n    protected readonly inputText: WritableSignal<string> = signal<string>('');\n\n    protected readonly isOpen: Signal<boolean> = computed((): boolean => this.popover().isOpen());\n\n    /** Клавиатура списка: подсветка, клавиши открытия, id для `aria-activedescendant`, прокрутка к опции. */\n    protected readonly optionList: RtOptionList = new RtOptionList({\n        panelId: (): string => this.panelId,\n        isOpen: (): boolean => this.isOpen(),\n        count: (): number => this.suggestions().length,\n        chooseKeys: new Set<string>(['Enter']),\n        sideKeys: false,\n        edgeKeys: false,\n    });\n\n    protected readonly activeIndex: WritableSignal<number> = this.optionList.activeIndex;\n\n    /** Идентификатор подсвеченной опции — тот же, что уходит в `aria-activedescendant`. */\n    protected readonly activeOptionId: Signal<string | null> = this.optionList.activeOptionId;\n\n    protected readonly hasValue: Signal<boolean> = computed((): boolean => this.inputText() !== '');\n\n    public readonly displayText: Signal<string> = computed((): string => this.displayWith()(this.value()));\n\n    public readonly suggestions: InputSignal<ReadonlyArray<TItem>> = input<ReadonlyArray<TItem>>([]);\n\n    public readonly displayWith: InputSignal<(item: TItem | null) => string> = input<(item: TItem | null) => string>(\n        (item: TItem | null): string => String(item ?? '')\n    );\n\n    public readonly placeholder: InputSignal<string> = input<string>('');\n    public readonly minLength: InputSignal<number> = input<number>(1);\n\n    /** Префикс-иконка слева в поле (например, `map` для поиска). */\n    public readonly iconLeft: InputSignal<IRtIcon.Name | null> = input<IRtIcon.Name | null>(null);\n\n    public readonly openOnFocus: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    public readonly itemTemplate: InputSignal<TemplateRef<{ $implicit: TItem }> | null> = input<TemplateRef<{ $implicit: TItem }> | null>(\n        null\n    );\n\n    /**\n     * Подсказки грузятся: в панели строка со спиннером — вместо пустого результата при первой загрузке\n     * и под списком при подгрузке следующей страницы.\n     */\n    public readonly loading: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    /** Свой текст пустого результата; `null` — подпись кита `uiNothingFound`. */\n    public readonly emptyText: InputSignal<string | null> = input<string | null>(null);\n\n    /** Своя разметка пустого результата; сильнее `emptyText`. Обстановка — набранная строка. */\n    public readonly emptyTemplate: InputSignal<TemplateRef<{ $implicit: string }> | null> = input<TemplateRef<{\n        $implicit: string;\n    }> | null>(null);\n\n    /**\n     * Панель долистали до конца — пора просить следующую страницу. Не приходит, пока идёт загрузка, и\n     * приходит один раз на каждую длину списка: прокрутка у дна до прихода страницы её не повторяет.\n     */\n    public readonly scrolledToEnd: OutputEmitterRef<void> = output<void>();\n\n    public readonly complete: OutputEmitterRef<IRtAutocomplete.CompleteEvent> = output<IRtAutocomplete.CompleteEvent>();\n\n    public readonly itemSelect: OutputEmitterRef<TItem> = output<TItem>();\n\n    public override writeValue(value: TItem | null): void {\n        super.writeValue(value);\n        this.inputText.set(this.displayWith()(this.value()));\n    }\n\n    public override setDisabledState(disabled: boolean): void {\n        super.setDisabledState(disabled);\n        if (disabled) {\n            this.popover().close();\n        }\n    }\n\n    protected getEmptyValue(): TItem | null {\n        return null;\n    }\n\n    protected focusAfterClear(): void {\n        this.fieldEl()?.nativeElement.focus();\n    }\n\n    protected override clearValue(): void {\n        super.clearValue();\n        this.inputText.set('');\n        this.#endReportedAt = -1;\n    }\n\n    protected onInput(event: Event): void {\n        const target: HTMLInputElement = event.target as HTMLInputElement;\n        const query: string = target.value;\n        this.inputText.set(query);\n        this.activeIndex.set(-1);\n        // Новый запрос — новый список: его первая страница той же длины, что прошлый список, снова\n        // сообщает о дне, иначе подгрузка нового запроса не началась бы вовсе.\n        this.#endReportedAt = -1;\n        if (query.length >= this.minLength()) {\n            this.complete.emit({ query, originalEvent: event });\n            this.popover().open();\n        } else {\n            this.popover().close();\n        }\n    }\n\n    protected onFocus(): void {\n        if (!this.openOnFocus()) {\n            return;\n        }\n        this.complete.emit({ query: this.inputText(), originalEvent: new Event('focus') });\n        this.popover().open();\n    }\n\n    protected onBlur(): void {\n        this.markTouched();\n    }\n\n    /** Прокрутка панели: у дна — сообщить, что пора следующая страница. */\n    protected onPanelScroll(event: Event): void {\n        const panel: HTMLElement = event.target as HTMLElement;\n        const atEnd: boolean = panel.scrollTop + panel.clientHeight >= panel.scrollHeight - END_THRESHOLD_PX;\n        const length: number = this.suggestions().length;\n        if (!atEnd || this.loading() || length === this.#endReportedAt) {\n            return;\n        }\n        this.#endReportedAt = length;\n        this.scrolledToEnd.emit();\n    }\n\n    protected onClosed(): void {\n        this.activeIndex.set(-1);\n    }\n\n    protected onSelect(item: TItem): void {\n        this.value.set(item);\n        this.inputText.set(this.displayWith()(item));\n        this.emitChange(item);\n        this.itemSelect.emit(item);\n        this.popover().close();\n    }\n\n    protected onInputKeydown(event: KeyboardEvent): void {\n        if (this.isDisabled()) {\n            return;\n        }\n        const key: string = event.key;\n        if (!this.isOpen()) {\n            return;\n        }\n        const action: TRtOptionListAction = this.optionList.actionOf(key);\n        if (action === 'none' || action === 'side') {\n            return;\n        }\n        event.preventDefault();\n        switch (action) {\n            case 'next':\n                this.optionList.move(1);\n                break;\n            case 'previous':\n                this.optionList.move(-1);\n                break;\n            case 'choose':\n                this.#selectActive();\n                break;\n            case 'close':\n                // Escape закрывает один слой: панель. Без остановки событие всплывает до document,\n                // и оверлей под панелью — боковая панель, окно — закрывается вместе с ней.\n                event.stopPropagation();\n                this.popover().close();\n                break;\n        }\n    }\n\n    #selectActive(): void {\n        const items: ReadonlyArray<TItem> = this.suggestions();\n        const index: number = this.activeIndex();\n        if (index >= 0 && index < items.length) {\n            this.onSelect(items[index]);\n        }\n    }\n}\n","<ng-container rtBlock=\"rt-autocomplete\">\n    @if (isReadonly()) {\n        <span rtElem=\"readonly\" qa-dataid=\"autocomplete-readonly\" [rtMod]=\"{ empty: !displayText() }\">{{ displayText() || '—' }}</span>\n    }\n    <div rtElem=\"field\" rtPopoverTrigger=\"manual\" rtPopoverWidth=\"trigger\" [rtPopover]=\"panelTpl\" (rtPopoverClosed)=\"onClosed()\">\n        @if (iconLeft(); as left) {\n            <rt-icon rtElem=\"icon-left\" size=\"sm\" color=\"muted\" [name]=\"left\" />\n        }\n        <input\n            #fieldEl\n            rtElem=\"input\"\n            qa-dataid=\"autocomplete-input\"\n            type=\"text\"\n            autocomplete=\"off\"\n            role=\"combobox\"\n            [attr.id]=\"effectiveControlId()\"\n            [attr.aria-label]=\"ariaLabel()\"\n            [attr.aria-expanded]=\"isOpen()\"\n            [attr.aria-invalid]=\"isInvalid() || null\"\n            [attr.aria-autocomplete]=\"'list'\"\n            [attr.aria-controls]=\"panelId\"\n            [attr.aria-activedescendant]=\"activeOptionId()\"\n            [placeholder]=\"placeholder()\"\n            [value]=\"inputText()\"\n            [disabled]=\"isDisabled()\"\n            (input)=\"onInput($event)\"\n            (focus)=\"onFocus()\"\n            (blur)=\"onBlur()\"\n            (keydown)=\"onInputKeydown($event)\" />\n        @if (showClearButton()) {\n            <rt-icon-button\n                rtElem=\"clear\"\n                qa-dataid=\"autocomplete-clear\"\n                icon=\"ico-close\"\n                size=\"sm\"\n                variant=\"ghost\"\n                iconColor=\"muted\"\n                [ariaLabel]=\"t().uiClear\"\n                [tabIndex]=\"-1\"\n                (clicked)=\"clear($event)\" />\n        }\n    </div>\n\n    <ng-template #panelTpl>\n        <!--\n            Опции выбираются мышью через (click); keyboard-nav — на input'е\n            (activedescendant), опции не focusable индивидуально.\n        -->\n        <!-- eslint-disable @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\n        <ul\n            rtElem=\"panel\"\n            qa-dataid=\"autocomplete-panel\"\n            role=\"listbox\"\n            [id]=\"panelId\"\n            [attr.aria-busy]=\"loading() || null\"\n            (scroll)=\"onPanelScroll($event)\">\n            @for (item of suggestions(); track $index; let i = $index) {\n                <li\n                    rtElem=\"option\"\n                    qa-dataid=\"autocomplete-option\"\n                    role=\"option\"\n                    [id]=\"panelId + '-opt-' + i\"\n                    [rtMod]=\"{ active: i === activeIndex() }\"\n                    [attr.aria-selected]=\"item === value()\"\n                    (click)=\"onSelect(item)\">\n                    @if (itemTemplate(); as tpl) {\n                        <ng-container *ngTemplateOutlet=\"tpl; context: { $implicit: item }\" />\n                    } @else {\n                        {{ displayWith()(item) }}\n                    }\n                </li>\n            } @empty {\n                @if (!loading()) {\n                    <li rtElem=\"empty\" qa-dataid=\"autocomplete-empty\">\n                        @if (emptyTemplate(); as tpl) {\n                            <ng-container *ngTemplateOutlet=\"tpl; context: { $implicit: inputText() }\" />\n                        } @else {\n                            {{ emptyText() ?? t().uiNothingFound }}\n                        }\n                    </li>\n                }\n            }\n            @if (loading()) {\n                <li rtElem=\"loading\" qa-dataid=\"autocomplete-loading\" aria-hidden=\"true\">\n                    <rt-spinner [diameter]=\"20\" />\n                </li>\n            }\n        </ul>\n    </ng-template>\n</ng-container>\n"],"mappings":"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"}
+{"version":3,"file":"rt-tools-ui-kit-v2-autocomplete.mjs","names":[],"sources":["../../../projects/ui-kit-v2/src/lib/components/autocomplete/rt-autocomplete.component.ts","../../../projects/ui-kit-v2/src/lib/components/autocomplete/rt-autocomplete.component.html"],"sourcesContent":["import { BooleanInput } from '@angular/cdk/coercion';\nimport { NgTemplateOutlet } from '@angular/common';\nimport {\n    booleanAttribute,\n    computed,\n    forwardRef,\n    inject,\n    input,\n    output,\n    signal,\n    viewChild,\n    ChangeDetectionStrategy,\n    Component,\n    ElementRef,\n    InputSignal,\n    InputSignalWithTransform,\n    OutputEmitterRef,\n    Signal,\n    TemplateRef,\n    ViewEncapsulation,\n    WritableSignal,\n} from '@angular/core';\n\nimport { BlockDirective, ElemDirective, ModDirective } from '@rt-tools/core';\n\nimport { RT_KIT_LABELS, TRtKitLabelMap } from '@rt-tools/ui-kit-v2/core';\nimport { RtFormControlBase } from '@rt-tools/ui-kit-v2/form-control';\nimport { IRtIcon } from '@rt-tools/ui-kit-v2/core';\nimport { RtIconComponent } from '@rt-tools/ui-kit-v2/icon';\nimport { RtIconButtonComponent } from '@rt-tools/ui-kit-v2/icon-button';\nimport { RtSpinnerComponent } from '@rt-tools/ui-kit-v2/spinner';\nimport { RtPopoverDirective } from '@rt-tools/ui-kit-v2/popover';\nimport { RtRadiusDirective } from '@rt-tools/ui-kit-v2/radius';\nimport { RtOptionList, TRtOptionListAction } from '@rt-tools/ui-kit-v2/core';\nimport { IRtAutocomplete } from './rt-autocomplete.model';\n\n/** Сколько точек до дна панели уже считается концом списка. */\nconst END_THRESHOLD_PX: number = 8;\n\nconst BEM_BLOCK: string = 'rt-autocomplete';\n\nlet panelIdSeed: number = 0;\n\nfunction nextPanelId(): number {\n    panelIdSeed += 1;\n    return panelIdSeed;\n}\n\n/**\n * Typeahead/autocomplete с server-side filter через `(complete)` event.\n *\n * Panel рендерится через CDK Overlay (`[rtPopover]` trigger=\"manual\" на input'е)\n * — открывается по набору текста (не click/hover), не обрезается overflow.\n * Подписчик получает `(complete)` с текущей строкой и сам грузит подсказки.\n *\n * CVA через общий `RtFormControlBase`. Generic `TItem` — тип подсказки и\n * selected value. Крестик (`clearable`) виден при непустом тексте — очищает и\n * текст, и выбранный объект. Keyboard-nav (activedescendant): ArrowUp/Down —\n * highlight, Enter — выбрать активную, Escape — закрыть. Home/End — deferred.\n */\n@Component({\n    selector: 'rt-autocomplete',\n    templateUrl: './rt-autocomplete.component.html',\n    styleUrl: './rt-autocomplete.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    imports: [\n        // Angular\n        NgTemplateOutlet,\n\n        // standalone components / directives\n        RtIconButtonComponent,\n        RtIconComponent,\n        RtPopoverDirective,\n        RtSpinnerComponent,\n        BlockDirective,\n        ElemDirective,\n        ModDirective,\n    ],\n    providers: [\n        // Алиас базового токена — для contentChild(RtFormControlBase) в rt-field.\n        { provide: RtFormControlBase, useExisting: forwardRef(() => RtAutocompleteComponent) },\n    ],\n    hostDirectives: [{ directive: RtRadiusDirective, inputs: ['radius'] }],\n    host: {\n        class: BEM_BLOCK,\n        '[class.rt-autocomplete--open]': 'isOpen()',\n        '[class.rt-autocomplete--disabled]': 'isDisabled()',\n        '[class.rt-autocomplete--readonly]': 'isReadonly()',\n        '[class.rt-autocomplete--invalid]': 'isInvalid()',\n        '[class.rt-autocomplete--borderless]': '!bordered()',\n        '[class.rt-autocomplete--size--sm]': \"size() === 'sm'\",\n        '[class.rt-autocomplete--size--lg]': \"size() === 'lg'\",\n    },\n})\nexport class RtAutocompleteComponent<TItem> extends RtFormControlBase<TItem | null> {\n    /** Длина списка, на которой конец уже сообщён: прокрутка у дна до новой страницы его не повторяет. */\n    #endReportedAt: number = -1;\n\n    protected readonly t: Signal<TRtKitLabelMap> = inject(RT_KIT_LABELS);\n\n    protected readonly panelId: string = `rt-autocomplete-panel-${nextPanelId()}`;\n\n    protected readonly popover: Signal<RtPopoverDirective> = viewChild.required(RtPopoverDirective);\n\n    protected readonly fieldEl: Signal<ElementRef<HTMLInputElement> | undefined> = viewChild<ElementRef<HTMLInputElement>>('fieldEl');\n\n    protected readonly inputText: WritableSignal<string> = signal<string>('');\n\n    protected readonly isOpen: Signal<boolean> = computed((): boolean => this.popover().isOpen());\n\n    /** Клавиатура списка: подсветка, клавиши открытия, id для `aria-activedescendant`, прокрутка к опции. */\n    protected readonly optionList: RtOptionList = new RtOptionList({\n        panelId: (): string => this.panelId,\n        isOpen: (): boolean => this.isOpen(),\n        count: (): number => this.suggestions().length,\n        chooseKeys: new Set<string>(['Enter']),\n        sideKeys: false,\n        edgeKeys: false,\n    });\n\n    protected readonly activeIndex: WritableSignal<number> = this.optionList.activeIndex;\n\n    /** Идентификатор подсвеченной опции — тот же, что уходит в `aria-activedescendant`. */\n    protected readonly activeOptionId: Signal<string | null> = this.optionList.activeOptionId;\n\n    protected readonly hasValue: Signal<boolean> = computed((): boolean => this.inputText() !== '');\n\n    public readonly displayText: Signal<string> = computed((): string => this.displayWith()(this.value()));\n\n    public readonly suggestions: InputSignal<ReadonlyArray<TItem>> = input<ReadonlyArray<TItem>>([]);\n\n    public readonly displayWith: InputSignal<(item: TItem | null) => string> = input<(item: TItem | null) => string>(\n        (item: TItem | null): string => String(item ?? '')\n    );\n\n    public readonly placeholder: InputSignal<string> = input<string>('');\n    public readonly minLength: InputSignal<number> = input<number>(1);\n\n    /** Префикс-иконка слева в поле (например, `map` для поиска). */\n    public readonly iconLeft: InputSignal<IRtIcon.Name | null> = input<IRtIcon.Name | null>(null);\n\n    public readonly openOnFocus: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    public readonly itemTemplate: InputSignal<TemplateRef<{ $implicit: TItem }> | null> = input<TemplateRef<{ $implicit: TItem }> | null>(\n        null\n    );\n\n    /**\n     * Подсказки грузятся: в панели строка со спиннером — вместо пустого результата при первой загрузке\n     * и под списком при подгрузке следующей страницы.\n     */\n    public readonly loading: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    /** Свой текст пустого результата; `null` — подпись кита `uiNothingFound`. */\n    public readonly emptyText: InputSignal<string | null> = input<string | null>(null);\n\n    /** Своя разметка пустого результата; сильнее `emptyText`. Обстановка — набранная строка. */\n    public readonly emptyTemplate: InputSignal<TemplateRef<{ $implicit: string }> | null> = input<TemplateRef<{\n        $implicit: string;\n    }> | null>(null);\n\n    /**\n     * Панель долистали до конца — пора просить следующую страницу. Не приходит, пока идёт загрузка, и\n     * приходит один раз на каждую длину списка: прокрутка у дна до прихода страницы её не повторяет.\n     */\n    public readonly scrolledToEnd: OutputEmitterRef<void> = output<void>();\n\n    public readonly complete: OutputEmitterRef<IRtAutocomplete.CompleteEvent> = output<IRtAutocomplete.CompleteEvent>();\n\n    public readonly itemSelect: OutputEmitterRef<TItem> = output<TItem>();\n\n    public override writeValue(value: TItem | null): void {\n        super.writeValue(value);\n        this.inputText.set(this.displayWith()(this.value()));\n    }\n\n    public override setDisabledState(disabled: boolean): void {\n        super.setDisabledState(disabled);\n        if (disabled) {\n            this.popover().close();\n        }\n    }\n\n    protected getEmptyValue(): TItem | null {\n        return null;\n    }\n\n    protected focusAfterClear(): void {\n        this.fieldEl()?.nativeElement.focus();\n    }\n\n    protected override clearValue(): void {\n        super.clearValue();\n        this.inputText.set('');\n        this.#endReportedAt = -1;\n    }\n\n    protected onInput(event: Event): void {\n        const target: HTMLInputElement = event.target as HTMLInputElement;\n        const query: string = target.value;\n        this.inputText.set(query);\n        this.activeIndex.set(-1);\n        // Новый запрос — новый список: его первая страница той же длины, что прошлый список, снова\n        // сообщает о дне, иначе подгрузка нового запроса не началась бы вовсе.\n        this.#endReportedAt = -1;\n        if (query.length >= this.minLength()) {\n            this.complete.emit({ query, originalEvent: event });\n            this.popover().open();\n        } else {\n            this.popover().close();\n        }\n    }\n\n    protected onFocus(): void {\n        if (!this.openOnFocus()) {\n            return;\n        }\n        this.complete.emit({ query: this.inputText(), originalEvent: new Event('focus') });\n        this.popover().open();\n    }\n\n    protected onBlur(): void {\n        this.markTouched();\n    }\n\n    /** Прокрутка панели: у дна — сообщить, что пора следующая страница. */\n    protected onPanelScroll(event: Event): void {\n        const panel: HTMLElement = event.target as HTMLElement;\n        const atEnd: boolean = panel.scrollTop + panel.clientHeight >= panel.scrollHeight - END_THRESHOLD_PX;\n        const length: number = this.suggestions().length;\n        if (!atEnd || this.loading() || length === this.#endReportedAt) {\n            return;\n        }\n        this.#endReportedAt = length;\n        this.scrolledToEnd.emit();\n    }\n\n    protected onClosed(): void {\n        this.activeIndex.set(-1);\n    }\n\n    protected onSelect(item: TItem): void {\n        this.value.set(item);\n        this.inputText.set(this.displayWith()(item));\n        this.emitChange(item);\n        this.itemSelect.emit(item);\n        this.popover().close();\n    }\n\n    protected onInputKeydown(event: KeyboardEvent): void {\n        if (this.isDisabled()) {\n            return;\n        }\n        const key: string = event.key;\n        if (!this.isOpen()) {\n            return;\n        }\n        const action: TRtOptionListAction = this.optionList.actionOf(key);\n        if (action === 'none' || action === 'side') {\n            return;\n        }\n        event.preventDefault();\n        switch (action) {\n            case 'next':\n                this.optionList.move(1);\n                break;\n            case 'previous':\n                this.optionList.move(-1);\n                break;\n            case 'choose':\n                this.#selectActive();\n                break;\n            case 'close':\n                // Escape закрывает один слой: панель. Без остановки событие всплывает до document,\n                // и оверлей под панелью — боковая панель, окно — закрывается вместе с ней.\n                event.stopPropagation();\n                this.popover().close();\n                break;\n        }\n    }\n\n    #selectActive(): void {\n        const items: ReadonlyArray<TItem> = this.suggestions();\n        const index: number = this.activeIndex();\n        if (index >= 0 && index < items.length) {\n            this.onSelect(items[index]);\n        }\n    }\n}\n","<ng-container rtBlock=\"rt-autocomplete\">\n    @if (isReadonly()) {\n        <span rtElem=\"readonly\" qa-dataid=\"autocomplete-readonly\" [rtMod]=\"{ empty: !displayText() }\">{{ displayText() || '—' }}</span>\n    }\n    <div rtElem=\"field\" rtPopoverTrigger=\"manual\" rtPopoverWidth=\"trigger\" [rtPopover]=\"panelTpl\" (rtPopoverClosed)=\"onClosed()\">\n        @if (iconLeft(); as left) {\n            <rt-icon rtElem=\"icon-left\" size=\"sm\" color=\"muted\" [name]=\"left\" />\n        }\n        <input\n            #fieldEl\n            rtElem=\"input\"\n            qa-dataid=\"autocomplete-input\"\n            type=\"text\"\n            autocomplete=\"off\"\n            role=\"combobox\"\n            [attr.id]=\"effectiveControlId()\"\n            [attr.aria-label]=\"ariaLabel()\"\n            [attr.aria-expanded]=\"isOpen()\"\n            [attr.aria-invalid]=\"isInvalid() || null\"\n            [attr.aria-autocomplete]=\"'list'\"\n            [attr.aria-controls]=\"panelId\"\n            [attr.aria-activedescendant]=\"activeOptionId()\"\n            [placeholder]=\"placeholder()\"\n            [value]=\"inputText()\"\n            [disabled]=\"isDisabled()\"\n            (input)=\"onInput($event)\"\n            (focus)=\"onFocus()\"\n            (blur)=\"onBlur()\"\n            (keydown)=\"onInputKeydown($event)\" />\n        @if (showClearButton()) {\n            <rt-icon-button\n                rtElem=\"clear\"\n                qa-dataid=\"autocomplete-clear\"\n                icon=\"ico-close\"\n                size=\"sm\"\n                variant=\"ghost\"\n                iconColor=\"muted\"\n                [ariaLabel]=\"t().uiClear\"\n                [tabIndex]=\"clearTabIndex()\"\n                (clicked)=\"clear($event)\" />\n        }\n    </div>\n\n    <ng-template #panelTpl>\n        <!--\n            Опции выбираются мышью через (click); keyboard-nav — на input'е\n            (activedescendant), опции не focusable индивидуально.\n        -->\n        <!-- eslint-disable @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\n        <ul\n            rtElem=\"panel\"\n            qa-dataid=\"autocomplete-panel\"\n            role=\"listbox\"\n            [id]=\"panelId\"\n            [attr.aria-busy]=\"loading() || null\"\n            (scroll)=\"onPanelScroll($event)\">\n            @for (item of suggestions(); track $index; let i = $index) {\n                <li\n                    rtElem=\"option\"\n                    qa-dataid=\"autocomplete-option\"\n                    role=\"option\"\n                    [id]=\"panelId + '-opt-' + i\"\n                    [rtMod]=\"{ active: i === activeIndex() }\"\n                    [attr.aria-selected]=\"item === value()\"\n                    (click)=\"onSelect(item)\">\n                    @if (itemTemplate(); as tpl) {\n                        <ng-container *ngTemplateOutlet=\"tpl; context: { $implicit: item }\" />\n                    } @else {\n                        {{ displayWith()(item) }}\n                    }\n                </li>\n            } @empty {\n                @if (!loading()) {\n                    <li rtElem=\"empty\" qa-dataid=\"autocomplete-empty\">\n                        @if (emptyTemplate(); as tpl) {\n                            <ng-container *ngTemplateOutlet=\"tpl; context: { $implicit: inputText() }\" />\n                        } @else {\n                            {{ emptyText() ?? t().uiNothingFound }}\n                        }\n                    </li>\n                }\n            }\n            @if (loading()) {\n                <li rtElem=\"loading\" qa-dataid=\"autocomplete-loading\" aria-hidden=\"true\">\n                    <rt-spinner [diameter]=\"20\" />\n                </li>\n            }\n        </ul>\n    </ng-template>\n</ng-container>\n"],"mappings":"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"}

package/fesm2022/rt-tools-ui-kit-v2-core.mjs

@@ -172,6 +172,7 @@ const RT_KIT_LABELS_EN = {
 	uiChangeAgent: "Change agent",
 	uiChooseFile: "Choose file",
 	uiChooseMonth: "Choose month and year",
+	uiChooseYear: "Choose year",
 	uiClear: "Clear",
 	uiClearFilters: "Clear filters",
 	uiClearSelection: "Clear selection",
@@ -203,6 +204,7 @@ const RT_KIT_LABELS_EN = {
 	uiDaysMany: COUNT_DAYS,
 	uiDaysOne: "{{count}} day",
 	uiDaysOther: COUNT_DAYS,
+	uiDecrease: "Decrease",
 	uiDetails: "Details",
 	uiDiscardChanges: "Discard Changes",
 	uiDone: "Done",
@@ -248,6 +250,7 @@ const RT_KIT_LABELS_EN = {
 	uiImageUploadChoose: "Choose file",
 	uiImageUploadDrop: "Drag and drop an image here or",
 	uiImageUploadImage: "Current image",
+	uiIncrease: "Increase",
 	uiInviteUser: "Invite user",
 	uiItemsPerPage: "Items per page",
 	uiLast30Days: "Last 30 days",
@@ -267,6 +270,7 @@ const RT_KIT_LABELS_EN = {
 	uiNextMonth: "Next month",
 	uiNextPage: "Next page",
 	uiNextYear: "Next year",
+	uiNextYears: "Next 12 years",
 	uiNightGridAria: "Occupancy grid",
 	uiNoData: "No data yet",
 	uiNoOptions: "No options",
@@ -277,16 +281,20 @@ const RT_KIT_LABELS_EN = {
 	uiOpenCalendar: "Open the calendar",
 	uiPageOf: "Page {{page}} of {{last}}",
 	uiPagination: "Pagination",
+	uiPercentagePoints: "{{value}} pp",
 	uiPerPage: "Items per page:",
 	uiPeriod: "Period",
 	uiPickAgent: "Select an agent",
 	uiPickAnotherAgent: "Select a different agent",
 	uiPickEndDate: "Pick the end date",
+	uiPickMonth: "choose a month",
 	uiPickStartDate: "Pick the start date",
 	uiPickTransition: "Select a transition",
+	uiPickYear: "choose a year",
 	uiPrevMonth: "Previous month",
 	uiPrevPage: "Previous page",
 	uiPrevYear: "Previous year",
+	uiPrevYears: "Previous 12 years",
 	uiProfile: "Profile",
 	uiQuickRanges: "Quick ranges",
 	uiRangeEmpty: "0 of 0",
@@ -920,6 +928,7 @@ var ERtStorageKeys;
 (function(ERtStorageKeys) {
 	ERtStorageKeys["Theme"] = "rt.theme";
 	ERtStorageKeys["TableColumnsPrefix"] = "rt.table.columns.";
+	ERtStorageKeys["DataTableConfigPrefix"] = "rt.data-table.config.";
 	ERtStorageKeys["SideMenu"] = "rt.side-menu";
 })(ERtStorageKeys || (ERtStorageKeys = {}));
 const DEFAULT_CHOICE = "light";
@@ -1267,7 +1276,9 @@ const RT_DESIGN_TOKEN_NAMES = [
 	"--rt-color-stepper-current-subtle",
 	"--rt-color-stepper-progress",
 	"--rt-color-stepper-track",
+	"--rt-color-table-bg",
 	"--rt-color-table-head-bg",
+	"--rt-color-table-pinned-shadow",
 	"--rt-color-text-disabled",
 	"--rt-color-text-inverse",
 	"--rt-color-text-link",
@@ -1312,6 +1323,7 @@ const RT_DESIGN_TOKEN_NAMES = [
 	"--rt-field-label-font-size",
 	"--rt-field-label-font-weight",
 	"--rt-field-label-help-gap",
+	"--rt-field-label-line-height",
 	"--rt-field-messages-line-height",
 	"--rt-field-messages-padding-top",
 	"--rt-field-required-color",
@@ -1564,8 +1576,10 @@ const RT_DESIGN_TOKEN_NAMES = [
 	"--rt-neutral-950",
 	"--rt-opacity-disabled",
 	"--rt-overlay-amber-16",
+	"--rt-overlay-black-16",
 	"--rt-overlay-black-4",
 	"--rt-overlay-black-50",
+	"--rt-overlay-black-64",
 	"--rt-overlay-black-8",
 	"--rt-overlay-brand-24",
 	"--rt-overlay-brand-8",