@rt-tools/ui-kit-v2 0.35.0 → 0.36.0

package/fesm2022/rt-tools-ui-kit-v2-thread-list.mjs

@@ -200,6 +200,41 @@ i0.ɵɵngDeclareClassMetadata({
 		args: [{ selector: "ng-template[rtThreadListSearch]" }]
 	}]
 });
+var RtThreadListTabsDirective = class RtThreadListTabsDirective {
+	constructor() {
+		this.templateRef = inject(TemplateRef);
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: RtThreadListTabsDirective,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Directive
+		});
+	}
+	static {
+		this.ɵdir = i0.ɵɵngDeclareDirective({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: RtThreadListTabsDirective,
+			isStandalone: true,
+			selector: "ng-template[rtThreadListTabs]",
+			ngImport: i0
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: RtThreadListTabsDirective,
+	decorators: [{
+		type: Directive,
+		args: [{ selector: "ng-template[rtThreadListTabs]" }]
+	}]
+});
 const BEM_BLOCK = "rt-thread-list";
 const SKELETON_ROWS_COUNT = 6;
 const PREVIEW_ICONS = [
@@ -226,6 +261,7 @@ var RtThreadListComponent = class RtThreadListComponent {
 		this.rowActionsTemplate = contentChild(RtThreadListRowActionsDirective, ...ngDevMode ? [{ debugName: "rowActionsTemplate" }] : /* istanbul ignore next */ []);
 		this.filtersTemplate = contentChild(RtThreadListFiltersDirective, ...ngDevMode ? [{ debugName: "filtersTemplate" }] : /* istanbul ignore next */ []);
 		this.searchTemplate = contentChild(RtThreadListSearchDirective, ...ngDevMode ? [{ debugName: "searchTemplate" }] : /* istanbul ignore next */ []);
+		this.tabsTemplate = contentChild(RtThreadListTabsDirective, ...ngDevMode ? [{ debugName: "tabsTemplate" }] : /* istanbul ignore next */ []);
 		this.rows = input([], ...ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []);
 		this.activeId = input(null, ...ngDevMode ? [{ debugName: "activeId" }] : /* istanbul ignore next */ []);
 		this.searchPlaceholder = input("", ...ngDevMode ? [{ debugName: "searchPlaceholder" }] : /* istanbul ignore next */ []);
@@ -385,6 +421,13 @@ var RtThreadListComponent = class RtThreadListComponent {
 					predicate: RtThreadListSearchDirective,
 					descendants: true,
 					isSignal: true
+				},
+				{
+					propertyName: "tabsTemplate",
+					first: true,
+					predicate: RtThreadListTabsDirective,
+					descendants: true,
+					isSignal: true
 				}
 			],
 			hostDirectives: [{
@@ -392,8 +435,8 @@ var RtThreadListComponent = class RtThreadListComponent {
 				inputs: ["radius", "radius"]
 			}],
 			ngImport: i0,
-			template: "<ng-container rtBlock=\"rt-thread-list\">\n    <header rtElem=\"head\">\n        @if (searchTemplate()) {\n            <div rtElem=\"search\" qa-dataid=\"thread-list-search\">\n                <ng-container [ngTemplateOutlet]=\"searchTemplate()?.templateRef ?? null\" />\n            </div>\n        } @else {\n            <rt-input\n                rtElem=\"search\"\n                qa-dataid=\"thread-list-search\"\n                iconLeft=\"search\"\n                [placeholder]=\"searchPlaceholderText()\"\n                [formControl]=\"searchControl\" />\n        }\n        @if (filtersTemplate()) {\n            <rt-icon-button\n                rtElem=\"filter-trigger\"\n                qa-dataid=\"thread-list-filter\"\n                icon=\"filter\"\n                variant=\"secondary\"\n                rtPopoverAlign=\"end\"\n                [ariaLabel]=\"t().uiFilters\"\n                [indicator]=\"filtersActive()\"\n                [rtPopover]=\"filtersPanel\" />\n        }\n    </header>\n\n    <ng-template #rowButton let-row>\n        <button\n            rtElem=\"row\"\n            qa-dataid=\"thread-list-row\"\n            type=\"button\"\n            [attr.data-id]=\"row.id\"\n            [attr.data-unread]=\"row.hasUnread\"\n            [attr.aria-current]=\"row.id === activeId() ? 'true' : null\"\n            [rtMod]=\"{\n                active: row.id === activeId(),\n                unread: row.hasUnread,\n                overdue: !!row.overdue,\n            }\"\n            (click)=\"onSelect(row.id, $event)\">\n            @if (row.sign; as sign) {\n                <rt-service-logo rtElem=\"row-sign\" qa-dataid=\"thread-list-row-sign\" size=\"xs\" [logos]=\"[sign]\" />\n                <span rtElem=\"row-content\">\n                    <ng-container [ngTemplateOutlet]=\"rowContent\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                </span>\n            } @else {\n                <ng-container [ngTemplateOutlet]=\"rowContent\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n            }\n        </button>\n    </ng-template>\n\n    <ng-template #rowContent let-row>\n        <ng-container [ngTemplateOutlet]=\"rowTemplate()?.templateRef ?? null\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n    </ng-template>\n\n    <ng-template #filtersPanel>\n        <div rtElem=\"filters-panel\" qa-dataid=\"thread-list-filters-panel\">\n            <ng-container [ngTemplateOutlet]=\"filtersTemplate()?.templateRef ?? null\" />\n        </div>\n    </ng-template>\n\n    <div rtElem=\"rows\" qa-dataid=\"thread-list-rows\">\n        @if (loading() && !rows().length) {\n            @for (i of skeletonRows; track i) {\n                <div rtElem=\"row-skeleton\" qa-dataid=\"thread-list-row-skeleton\" aria-hidden=\"true\">\n                    <rt-skeleton width=\"60%\" height=\"14px\" />\n                    <rt-skeleton width=\"90%\" height=\"12px\" />\n                </div>\n            }\n        } @else if (!rows().length) {\n            <rt-empty-state rtElem=\"empty\" qa-dataid=\"thread-list-empty\" [description]=\"t().uiThreadListEmptyHint\" [title]=\"emptyTitle()\">\n                <div rtEmptyIllustration rtElem=\"empty-preview\">\n                    @for (row of emptyPreviewRows(); track row.id) {\n                        <div rtElem=\"empty-card\" [rtMod]=\"{ offset: row.offset }\">\n                            <span rtElem=\"empty-avatar\">\n                                <rt-icon size=\"sm\" [name]=\"row.icon\" />\n                            </span>\n                            <span rtElem=\"empty-lines\">\n                                <span rtElem=\"empty-line\" [rtMod]=\"{ short: true }\"></span>\n                                <span rtElem=\"empty-line\"></span>\n                            </span>\n                        </div>\n                    }\n                </div>\n            </rt-empty-state>\n        } @else {\n            @for (row of rows(); track row.id) {\n                @if (rowActionsTemplate(); as actions) {\n                    <div rtElem=\"row-wrap\" qa-dataid=\"thread-list-row-wrap\">\n                        <ng-container [ngTemplateOutlet]=\"rowButton\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                        <div rtElem=\"row-actions\" qa-dataid=\"thread-list-row-actions\">\n                            <ng-container [ngTemplateOutlet]=\"actions.templateRef\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                        </div>\n                    </div>\n                } @else {\n                    <ng-container [ngTemplateOutlet]=\"rowButton\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                }\n            }\n            @if (fetching()) {\n                <div rtElem=\"row-loader\" qa-dataid=\"thread-list-row-loader\">\n                    <rt-skeleton width=\"90%\" height=\"12px\" />\n                </div>\n            }\n            @if (hasMore()) {\n                <div\n                    rtElem=\"load-anchor\"\n                    qa-dataid=\"thread-list-load-more\"\n                    aria-hidden=\"true\"\n                    rtInfiniteScroll\n                    [disabled]=\"fetching()\"\n                    (loadMore)=\"onLoadMore()\"></div>\n            }\n        }\n    </div>\n</ng-container>\n",
-			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-thread-list{--rt-thread-list-border-width: var(--rt-border-width-thin);--rt-thread-list-card-radius: var(--rt-radius-lg);--rt-thread-list-tag-radius: var(--rt-radius-sm);--rt-thread-list-dot-radius: var(--rt-radius-full);--rt-thread-list-avatar-radius: var(--rt-radius-full);--rt-thread-list-line-radius: var(--rt-radius-full);display:flex;flex:1 1 auto;flex-direction:column;min-block-size:0}.rt-thread-list__head{display:flex;flex:0 0 auto;align-items:center;block-size:56px;border-block-end:var(--rt-thread-list-border-width) solid var(--rt-color-border-strong);gap:var(--rt-space-2);padding-inline:var(--rt-space-4)}.rt-thread-list__search{flex:1 1 auto;min-inline-size:0}.rt-thread-list__filter-trigger{flex:0 0 auto}.rt-thread-list__filters-panel{display:flex;flex-direction:column;padding:var(--rt-space-4);gap:var(--rt-space-2);min-inline-size:220px}.rt-thread-list__rows{display:flex;flex:1 1 auto;flex-direction:column;min-block-size:0;overflow-y:auto;overscroll-behavior:contain}.rt-thread-list__row{display:flex;align-items:center;justify-content:space-between;padding:var(--rt-space-2) var(--rt-space-4);border:none;background:none;border-inline-start:3px solid transparent;cursor:pointer;font-family:inherit;font-size:var(--rt-text-sm);gap:var(--rt-space-4);inline-size:100%;text-align:start}.rt-thread-list__row:hover{background:var(--rt-color-bg-subtle)}.rt-thread-list__row--active,.rt-thread-list__row--active:hover{background:var(--rt-color-state-info-bg);border-inline-start-color:var(--rt-color-action-primary)}.rt-thread-list__row--unread{position:relative;background:var(--rt-color-bg-subtle);border-inline-start-color:var(--rt-color-action-primary)}.rt-thread-list__row--unread .rt-thread-list__row-title{font-weight:var(--rt-font-weight-semibold)}.rt-thread-list__row--unread:before{position:absolute;border-radius:var(--rt-thread-list-dot-radius);background:var(--rt-color-action-primary);block-size:var(--rt-space-2);content:\"\";inline-size:var(--rt-space-2);inset-block-start:50%;inset-inline-start:var(--rt-space-2);transform:translateY(-50%)}.rt-thread-list__row--active,.rt-thread-list__row--active:hover{background:var(--rt-color-state-info-bg)}.rt-thread-list__row--overdue .rt-thread-list__row-time{color:var(--rt-color-state-error-text)}.rt-thread-list__row-wrap{position:relative}.rt-thread-list__row-actions{position:absolute;display:flex;align-items:center;background:var(--rt-color-bg-subtle);gap:var(--rt-space-1);inset-block:0;inset-inline-end:0;padding-inline:var(--rt-space-2) var(--rt-space-4)}@media(hover:hover){.rt-thread-list__row-actions{opacity:0;pointer-events:none}.rt-thread-list__row-wrap:hover .rt-thread-list__row-actions,.rt-thread-list__row-wrap:focus-within .rt-thread-list__row-actions,.rt-thread-list__row-wrap:has(.rt-menu--open) .rt-thread-list__row-actions{opacity:1;pointer-events:auto}}.rt-thread-list__row--active+.rt-thread-list__row-actions{background:var(--rt-color-state-info-bg)}.rt-thread-list__row-sign{flex:none}.rt-thread-list__row-content{display:flex;flex:1 1 auto;align-items:center;justify-content:space-between;gap:var(--rt-space-4);min-inline-size:0}.rt-thread-list__row-body{display:flex;flex-direction:column;gap:var(--rt-space-0-5);min-inline-size:0}.rt-thread-list__row-title{overflow:hidden;color:var(--rt-color-text-primary);text-overflow:ellipsis;white-space:nowrap}.rt-thread-list__row-id{color:var(--rt-color-text-muted);font-size:var(--rt-text-sm)}.rt-thread-list__row:hover .rt-copy-cell__button,.rt-thread-list__row:focus-within .rt-copy-cell__button{opacity:1}.rt-thread-list__row-subtitle{overflow:hidden;color:var(--rt-color-text-muted);text-overflow:ellipsis;white-space:nowrap}.rt-thread-list__row-meta{display:flex;flex:0 0 auto;align-items:center;gap:var(--rt-space-2)}.rt-thread-list__row-time{color:var(--rt-color-text-muted);white-space:nowrap}.rt-thread-list__row-tag{padding:var(--rt-space-0-5) var(--rt-space-2);border-radius:var(--rt-thread-list-tag-radius);background:var(--rt-color-state-warning-bg);color:var(--rt-color-state-warning-text);font-size:var(--rt-text-xs);white-space:nowrap}.rt-thread-list__row-dot{display:inline-block;border-radius:var(--rt-thread-list-dot-radius);background:var(--rt-color-text-link);block-size:6px;inline-size:6px}.rt-thread-list__row-skeleton{display:flex;flex-direction:column;padding:var(--rt-space-2) var(--rt-space-4);gap:var(--rt-space-2)}.rt-thread-list__row-loader{display:flex;justify-content:center;padding:var(--rt-space-2) var(--rt-space-4)}.rt-thread-list__load-anchor{block-size:1px}.rt-thread-list__empty{padding:var(--rt-space-6) var(--rt-space-4)}.rt-thread-list__empty-preview{display:flex;flex-direction:column;gap:var(--rt-space-1)}.rt-thread-list__empty-card{display:flex;align-items:center;padding:var(--rt-space-2);border:var(--rt-thread-list-border-width) solid var(--rt-color-border-subtle);border-radius:var(--rt-thread-list-card-radius);background:var(--rt-color-bg-surface-subtle);gap:var(--rt-space-2)}.rt-thread-list__empty-card--offset{transform:translate(20px)}.rt-thread-list__empty-avatar{display:grid;flex:0 0 auto;border-radius:var(--rt-thread-list-avatar-radius);background:var(--rt-color-text-muted);block-size:24px;color:var(--rt-color-bg-surface);inline-size:24px;place-items:center}.rt-thread-list__empty-lines{display:flex;flex-direction:column;gap:var(--rt-space-2)}.rt-thread-list__empty-line{border-radius:var(--rt-thread-list-line-radius);background:var(--rt-color-border-strong);block-size:6px;inline-size:112px}.rt-thread-list__empty-line--short{inline-size:48px}.rt-thread-list[data-rt-radius=none]{--rt-thread-list-card-radius: var(--rt-radius-none)}.rt-thread-list[data-rt-radius=xs]{--rt-thread-list-card-radius: var(--rt-radius-xs)}.rt-thread-list[data-rt-radius=sm]{--rt-thread-list-card-radius: var(--rt-radius-sm)}.rt-thread-list[data-rt-radius=ms]{--rt-thread-list-card-radius: var(--rt-radius-ms)}.rt-thread-list[data-rt-radius=md]{--rt-thread-list-card-radius: var(--rt-radius-md)}.rt-thread-list[data-rt-radius=lg]{--rt-thread-list-card-radius: var(--rt-radius-lg)}.rt-thread-list[data-rt-radius=xl]{--rt-thread-list-card-radius: var(--rt-radius-xl)}.rt-thread-list[data-rt-radius=\"2xl\"]{--rt-thread-list-card-radius: var(--rt-radius-2xl)}.rt-thread-list[data-rt-radius=full]{--rt-thread-list-card-radius: var(--rt-radius-full)}}\n"],
+			template: "<ng-container rtBlock=\"rt-thread-list\">\n    <header rtElem=\"head\">\n        @if (searchTemplate()) {\n            <div rtElem=\"search\" qa-dataid=\"thread-list-search\">\n                <ng-container [ngTemplateOutlet]=\"searchTemplate()?.templateRef ?? null\" />\n            </div>\n        } @else {\n            <rt-input\n                rtElem=\"search\"\n                qa-dataid=\"thread-list-search\"\n                iconLeft=\"search\"\n                [placeholder]=\"searchPlaceholderText()\"\n                [formControl]=\"searchControl\" />\n        }\n        @if (filtersTemplate()) {\n            <rt-icon-button\n                rtElem=\"filter-trigger\"\n                qa-dataid=\"thread-list-filter\"\n                icon=\"filter\"\n                variant=\"secondary\"\n                rtPopoverAlign=\"end\"\n                [ariaLabel]=\"t().uiFilters\"\n                [indicator]=\"filtersActive()\"\n                [rtPopover]=\"filtersPanel\" />\n        }\n    </header>\n\n    @if (tabsTemplate(); as tabs) {\n        <div rtElem=\"tabs\" qa-dataid=\"thread-list-tabs\">\n            <ng-container [ngTemplateOutlet]=\"tabs.templateRef\" />\n        </div>\n    }\n\n    <ng-template #rowButton let-row>\n        <button\n            rtElem=\"row\"\n            qa-dataid=\"thread-list-row\"\n            type=\"button\"\n            [attr.data-id]=\"row.id\"\n            [attr.data-unread]=\"row.hasUnread\"\n            [attr.aria-current]=\"row.id === activeId() ? 'true' : null\"\n            [rtMod]=\"{\n                active: row.id === activeId(),\n                unread: row.hasUnread,\n                overdue: !!row.overdue,\n            }\"\n            (click)=\"onSelect(row.id, $event)\">\n            @if (row.sign; as sign) {\n                <rt-service-logo rtElem=\"row-sign\" qa-dataid=\"thread-list-row-sign\" size=\"xs\" [logos]=\"[sign]\" />\n                <span rtElem=\"row-content\">\n                    <ng-container [ngTemplateOutlet]=\"rowContent\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                </span>\n            } @else {\n                <ng-container [ngTemplateOutlet]=\"rowContent\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n            }\n        </button>\n    </ng-template>\n\n    <ng-template #rowContent let-row>\n        <ng-container [ngTemplateOutlet]=\"rowTemplate()?.templateRef ?? null\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n    </ng-template>\n\n    <ng-template #filtersPanel>\n        <div rtElem=\"filters-panel\" qa-dataid=\"thread-list-filters-panel\">\n            <ng-container [ngTemplateOutlet]=\"filtersTemplate()?.templateRef ?? null\" />\n        </div>\n    </ng-template>\n\n    <div rtElem=\"rows\" qa-dataid=\"thread-list-rows\">\n        @if (loading() && !rows().length) {\n            @for (i of skeletonRows; track i) {\n                <div rtElem=\"row-skeleton\" qa-dataid=\"thread-list-row-skeleton\" aria-hidden=\"true\">\n                    <rt-skeleton width=\"60%\" height=\"14px\" />\n                    <rt-skeleton width=\"90%\" height=\"12px\" />\n                </div>\n            }\n        } @else if (!rows().length) {\n            <rt-empty-state rtElem=\"empty\" qa-dataid=\"thread-list-empty\" [description]=\"t().uiThreadListEmptyHint\" [title]=\"emptyTitle()\">\n                <div rtEmptyIllustration rtElem=\"empty-preview\">\n                    @for (row of emptyPreviewRows(); track row.id) {\n                        <div rtElem=\"empty-card\" [rtMod]=\"{ offset: row.offset }\">\n                            <span rtElem=\"empty-avatar\">\n                                <rt-icon size=\"sm\" [name]=\"row.icon\" />\n                            </span>\n                            <span rtElem=\"empty-lines\">\n                                <span rtElem=\"empty-line\" [rtMod]=\"{ short: true }\"></span>\n                                <span rtElem=\"empty-line\"></span>\n                            </span>\n                        </div>\n                    }\n                </div>\n            </rt-empty-state>\n        } @else {\n            @for (row of rows(); track row.id) {\n                @if (rowActionsTemplate(); as actions) {\n                    <div rtElem=\"row-wrap\" qa-dataid=\"thread-list-row-wrap\">\n                        <ng-container [ngTemplateOutlet]=\"rowButton\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                        <div rtElem=\"row-actions\" qa-dataid=\"thread-list-row-actions\">\n                            <ng-container [ngTemplateOutlet]=\"actions.templateRef\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                        </div>\n                    </div>\n                } @else {\n                    <ng-container [ngTemplateOutlet]=\"rowButton\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                }\n            }\n            @if (fetching()) {\n                <div rtElem=\"row-loader\" qa-dataid=\"thread-list-row-loader\">\n                    <rt-skeleton width=\"90%\" height=\"12px\" />\n                </div>\n            }\n            @if (hasMore()) {\n                <div\n                    rtElem=\"load-anchor\"\n                    qa-dataid=\"thread-list-load-more\"\n                    aria-hidden=\"true\"\n                    rtInfiniteScroll\n                    [disabled]=\"fetching()\"\n                    (loadMore)=\"onLoadMore()\"></div>\n            }\n        }\n    </div>\n</ng-container>\n",
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-thread-list{--rt-thread-list-border-width: var(--rt-border-width-thin);--rt-thread-list-card-radius: var(--rt-radius-lg);--rt-thread-list-tag-radius: var(--rt-radius-sm);--rt-thread-list-dot-radius: var(--rt-radius-full);--rt-thread-list-avatar-radius: var(--rt-radius-full);--rt-thread-list-line-radius: var(--rt-radius-full);display:flex;flex:1 1 auto;flex-direction:column;min-block-size:0}.rt-thread-list__head{display:flex;flex:0 0 auto;align-items:center;block-size:56px;border-block-end:var(--rt-thread-list-border-width) solid var(--rt-color-border-strong);gap:var(--rt-space-2);padding-inline:var(--rt-space-4)}.rt-thread-list__search{flex:1 1 auto;min-inline-size:0}.rt-thread-list__filter-trigger{flex:0 0 auto}.rt-thread-list__tabs{flex:0 0 auto;padding:var(--rt-space-0-5) var(--rt-space-2) 0}.rt-thread-list__filters-panel{display:flex;flex-direction:column;padding:var(--rt-space-4);gap:var(--rt-space-2);min-inline-size:220px}.rt-thread-list__rows{display:flex;flex:1 1 auto;flex-direction:column;min-block-size:0;overflow-y:auto;overscroll-behavior:contain}.rt-thread-list__row{display:flex;align-items:center;justify-content:space-between;padding:var(--rt-space-2) var(--rt-space-4);border:none;background:none;border-inline-start:3px solid transparent;cursor:pointer;font-family:inherit;font-size:var(--rt-text-sm);gap:var(--rt-space-4);inline-size:100%;text-align:start}.rt-thread-list__row:hover{background:var(--rt-color-bg-subtle)}.rt-thread-list__row--active,.rt-thread-list__row--active:hover{background:var(--rt-color-state-info-bg);border-inline-start-color:var(--rt-color-action-primary)}.rt-thread-list__row--unread{position:relative;background:var(--rt-color-bg-subtle);border-inline-start-color:var(--rt-color-action-primary)}.rt-thread-list__row--unread .rt-thread-list__row-title{font-weight:var(--rt-font-weight-semibold)}.rt-thread-list__row--unread:before{position:absolute;border-radius:var(--rt-thread-list-dot-radius);background:var(--rt-color-action-primary);block-size:var(--rt-space-2);content:\"\";inline-size:var(--rt-space-2);inset-block-start:50%;inset-inline-start:var(--rt-space-2);transform:translateY(-50%)}.rt-thread-list__row--active,.rt-thread-list__row--active:hover{background:var(--rt-color-state-info-bg)}.rt-thread-list__row--overdue .rt-thread-list__row-time{color:var(--rt-color-state-error-text)}.rt-thread-list__row-wrap{position:relative}.rt-thread-list__row-actions{position:absolute;display:flex;align-items:center;background:var(--rt-color-bg-subtle);gap:var(--rt-space-1);inset-block:0;inset-inline-end:0;padding-inline:var(--rt-space-2) var(--rt-space-4)}@media(hover:hover){.rt-thread-list__row-actions{opacity:0;pointer-events:none}.rt-thread-list__row-wrap:hover .rt-thread-list__row-actions,.rt-thread-list__row-wrap:focus-within .rt-thread-list__row-actions,.rt-thread-list__row-wrap:has(.rt-menu--open) .rt-thread-list__row-actions{opacity:1;pointer-events:auto}}.rt-thread-list__row--active+.rt-thread-list__row-actions{background:var(--rt-color-state-info-bg)}.rt-thread-list__row-sign{flex:none}.rt-thread-list__row-content{display:flex;flex:1 1 auto;align-items:center;justify-content:space-between;gap:var(--rt-space-4);min-inline-size:0}.rt-thread-list__row-body{display:flex;flex-direction:column;gap:var(--rt-space-0-5);min-inline-size:0}.rt-thread-list__row-title{overflow:hidden;color:var(--rt-color-text-primary);text-overflow:ellipsis;white-space:nowrap}.rt-thread-list__row-id{color:var(--rt-color-text-muted);font-size:var(--rt-text-sm)}.rt-thread-list__row:hover .rt-copy-cell__button,.rt-thread-list__row:focus-within .rt-copy-cell__button{opacity:1}.rt-thread-list__row-subtitle{overflow:hidden;color:var(--rt-color-text-muted);text-overflow:ellipsis;white-space:nowrap}.rt-thread-list__row-meta{display:flex;flex:0 0 auto;align-items:center;gap:var(--rt-space-2)}.rt-thread-list__row-time{color:var(--rt-color-text-muted);white-space:nowrap}.rt-thread-list__row-tag{padding:var(--rt-space-0-5) var(--rt-space-2);border-radius:var(--rt-thread-list-tag-radius);background:var(--rt-color-state-warning-bg);color:var(--rt-color-state-warning-text);font-size:var(--rt-text-xs);white-space:nowrap}.rt-thread-list__row-dot{display:inline-block;border-radius:var(--rt-thread-list-dot-radius);background:var(--rt-color-text-link);block-size:6px;inline-size:6px}.rt-thread-list__row-skeleton{display:flex;flex-direction:column;padding:var(--rt-space-2) var(--rt-space-4);gap:var(--rt-space-2)}.rt-thread-list__row-loader{display:flex;justify-content:center;padding:var(--rt-space-2) var(--rt-space-4)}.rt-thread-list__load-anchor{block-size:1px}.rt-thread-list__empty{padding:var(--rt-space-6) var(--rt-space-4)}.rt-thread-list__empty-preview{display:flex;flex-direction:column;gap:var(--rt-space-1)}.rt-thread-list__empty-card{display:flex;align-items:center;padding:var(--rt-space-2);border:var(--rt-thread-list-border-width) solid var(--rt-color-border-subtle);border-radius:var(--rt-thread-list-card-radius);background:var(--rt-color-bg-surface-subtle);gap:var(--rt-space-2)}.rt-thread-list__empty-card--offset{transform:translate(20px)}.rt-thread-list__empty-avatar{display:grid;flex:0 0 auto;border-radius:var(--rt-thread-list-avatar-radius);background:var(--rt-color-text-muted);block-size:24px;color:var(--rt-color-bg-surface);inline-size:24px;place-items:center}.rt-thread-list__empty-lines{display:flex;flex-direction:column;gap:var(--rt-space-2)}.rt-thread-list__empty-line{border-radius:var(--rt-thread-list-line-radius);background:var(--rt-color-border-strong);block-size:6px;inline-size:112px}.rt-thread-list__empty-line--short{inline-size:48px}.rt-thread-list[data-rt-radius=none]{--rt-thread-list-card-radius: var(--rt-radius-none)}.rt-thread-list[data-rt-radius=xs]{--rt-thread-list-card-radius: var(--rt-radius-xs)}.rt-thread-list[data-rt-radius=sm]{--rt-thread-list-card-radius: var(--rt-radius-sm)}.rt-thread-list[data-rt-radius=ms]{--rt-thread-list-card-radius: var(--rt-radius-ms)}.rt-thread-list[data-rt-radius=md]{--rt-thread-list-card-radius: var(--rt-radius-md)}.rt-thread-list[data-rt-radius=lg]{--rt-thread-list-card-radius: var(--rt-radius-lg)}.rt-thread-list[data-rt-radius=xl]{--rt-thread-list-card-radius: var(--rt-radius-xl)}.rt-thread-list[data-rt-radius=\"2xl\"]{--rt-thread-list-card-radius: var(--rt-radius-2xl)}.rt-thread-list[data-rt-radius=full]{--rt-thread-list-card-radius: var(--rt-radius-full)}}\n"],
 			dependencies: [
 				{
 					kind: "directive",
@@ -515,6 +558,7 @@ var RtThreadListComponent = class RtThreadListComponent {
 						"rtPopoverFitViewport",
 						"rtPopoverContext",
 						"rtPopoverPanelClass",
+						"rtPopoverBackdropClass",
 						"rtPopoverDisabled",
 						"rtPopoverOffsetY",
 						"rtPopoverOffsetX",
@@ -602,8 +646,8 @@ i0.ɵɵngDeclareClassMetadata({
 				inputs: ["radius"]
 			}],
 			host: { class: BEM_BLOCK },
-			template: "<ng-container rtBlock=\"rt-thread-list\">\n    <header rtElem=\"head\">\n        @if (searchTemplate()) {\n            <div rtElem=\"search\" qa-dataid=\"thread-list-search\">\n                <ng-container [ngTemplateOutlet]=\"searchTemplate()?.templateRef ?? null\" />\n            </div>\n        } @else {\n            <rt-input\n                rtElem=\"search\"\n                qa-dataid=\"thread-list-search\"\n                iconLeft=\"search\"\n                [placeholder]=\"searchPlaceholderText()\"\n                [formControl]=\"searchControl\" />\n        }\n        @if (filtersTemplate()) {\n            <rt-icon-button\n                rtElem=\"filter-trigger\"\n                qa-dataid=\"thread-list-filter\"\n                icon=\"filter\"\n                variant=\"secondary\"\n                rtPopoverAlign=\"end\"\n                [ariaLabel]=\"t().uiFilters\"\n                [indicator]=\"filtersActive()\"\n                [rtPopover]=\"filtersPanel\" />\n        }\n    </header>\n\n    <ng-template #rowButton let-row>\n        <button\n            rtElem=\"row\"\n            qa-dataid=\"thread-list-row\"\n            type=\"button\"\n            [attr.data-id]=\"row.id\"\n            [attr.data-unread]=\"row.hasUnread\"\n            [attr.aria-current]=\"row.id === activeId() ? 'true' : null\"\n            [rtMod]=\"{\n                active: row.id === activeId(),\n                unread: row.hasUnread,\n                overdue: !!row.overdue,\n            }\"\n            (click)=\"onSelect(row.id, $event)\">\n            @if (row.sign; as sign) {\n                <rt-service-logo rtElem=\"row-sign\" qa-dataid=\"thread-list-row-sign\" size=\"xs\" [logos]=\"[sign]\" />\n                <span rtElem=\"row-content\">\n                    <ng-container [ngTemplateOutlet]=\"rowContent\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                </span>\n            } @else {\n                <ng-container [ngTemplateOutlet]=\"rowContent\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n            }\n        </button>\n    </ng-template>\n\n    <ng-template #rowContent let-row>\n        <ng-container [ngTemplateOutlet]=\"rowTemplate()?.templateRef ?? null\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n    </ng-template>\n\n    <ng-template #filtersPanel>\n        <div rtElem=\"filters-panel\" qa-dataid=\"thread-list-filters-panel\">\n            <ng-container [ngTemplateOutlet]=\"filtersTemplate()?.templateRef ?? null\" />\n        </div>\n    </ng-template>\n\n    <div rtElem=\"rows\" qa-dataid=\"thread-list-rows\">\n        @if (loading() && !rows().length) {\n            @for (i of skeletonRows; track i) {\n                <div rtElem=\"row-skeleton\" qa-dataid=\"thread-list-row-skeleton\" aria-hidden=\"true\">\n                    <rt-skeleton width=\"60%\" height=\"14px\" />\n                    <rt-skeleton width=\"90%\" height=\"12px\" />\n                </div>\n            }\n        } @else if (!rows().length) {\n            <rt-empty-state rtElem=\"empty\" qa-dataid=\"thread-list-empty\" [description]=\"t().uiThreadListEmptyHint\" [title]=\"emptyTitle()\">\n                <div rtEmptyIllustration rtElem=\"empty-preview\">\n                    @for (row of emptyPreviewRows(); track row.id) {\n                        <div rtElem=\"empty-card\" [rtMod]=\"{ offset: row.offset }\">\n                            <span rtElem=\"empty-avatar\">\n                                <rt-icon size=\"sm\" [name]=\"row.icon\" />\n                            </span>\n                            <span rtElem=\"empty-lines\">\n                                <span rtElem=\"empty-line\" [rtMod]=\"{ short: true }\"></span>\n                                <span rtElem=\"empty-line\"></span>\n                            </span>\n                        </div>\n                    }\n                </div>\n            </rt-empty-state>\n        } @else {\n            @for (row of rows(); track row.id) {\n                @if (rowActionsTemplate(); as actions) {\n                    <div rtElem=\"row-wrap\" qa-dataid=\"thread-list-row-wrap\">\n                        <ng-container [ngTemplateOutlet]=\"rowButton\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                        <div rtElem=\"row-actions\" qa-dataid=\"thread-list-row-actions\">\n                            <ng-container [ngTemplateOutlet]=\"actions.templateRef\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                        </div>\n                    </div>\n                } @else {\n                    <ng-container [ngTemplateOutlet]=\"rowButton\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                }\n            }\n            @if (fetching()) {\n                <div rtElem=\"row-loader\" qa-dataid=\"thread-list-row-loader\">\n                    <rt-skeleton width=\"90%\" height=\"12px\" />\n                </div>\n            }\n            @if (hasMore()) {\n                <div\n                    rtElem=\"load-anchor\"\n                    qa-dataid=\"thread-list-load-more\"\n                    aria-hidden=\"true\"\n                    rtInfiniteScroll\n                    [disabled]=\"fetching()\"\n                    (loadMore)=\"onLoadMore()\"></div>\n            }\n        }\n    </div>\n</ng-container>\n",
-			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-thread-list{--rt-thread-list-border-width: var(--rt-border-width-thin);--rt-thread-list-card-radius: var(--rt-radius-lg);--rt-thread-list-tag-radius: var(--rt-radius-sm);--rt-thread-list-dot-radius: var(--rt-radius-full);--rt-thread-list-avatar-radius: var(--rt-radius-full);--rt-thread-list-line-radius: var(--rt-radius-full);display:flex;flex:1 1 auto;flex-direction:column;min-block-size:0}.rt-thread-list__head{display:flex;flex:0 0 auto;align-items:center;block-size:56px;border-block-end:var(--rt-thread-list-border-width) solid var(--rt-color-border-strong);gap:var(--rt-space-2);padding-inline:var(--rt-space-4)}.rt-thread-list__search{flex:1 1 auto;min-inline-size:0}.rt-thread-list__filter-trigger{flex:0 0 auto}.rt-thread-list__filters-panel{display:flex;flex-direction:column;padding:var(--rt-space-4);gap:var(--rt-space-2);min-inline-size:220px}.rt-thread-list__rows{display:flex;flex:1 1 auto;flex-direction:column;min-block-size:0;overflow-y:auto;overscroll-behavior:contain}.rt-thread-list__row{display:flex;align-items:center;justify-content:space-between;padding:var(--rt-space-2) var(--rt-space-4);border:none;background:none;border-inline-start:3px solid transparent;cursor:pointer;font-family:inherit;font-size:var(--rt-text-sm);gap:var(--rt-space-4);inline-size:100%;text-align:start}.rt-thread-list__row:hover{background:var(--rt-color-bg-subtle)}.rt-thread-list__row--active,.rt-thread-list__row--active:hover{background:var(--rt-color-state-info-bg);border-inline-start-color:var(--rt-color-action-primary)}.rt-thread-list__row--unread{position:relative;background:var(--rt-color-bg-subtle);border-inline-start-color:var(--rt-color-action-primary)}.rt-thread-list__row--unread .rt-thread-list__row-title{font-weight:var(--rt-font-weight-semibold)}.rt-thread-list__row--unread:before{position:absolute;border-radius:var(--rt-thread-list-dot-radius);background:var(--rt-color-action-primary);block-size:var(--rt-space-2);content:\"\";inline-size:var(--rt-space-2);inset-block-start:50%;inset-inline-start:var(--rt-space-2);transform:translateY(-50%)}.rt-thread-list__row--active,.rt-thread-list__row--active:hover{background:var(--rt-color-state-info-bg)}.rt-thread-list__row--overdue .rt-thread-list__row-time{color:var(--rt-color-state-error-text)}.rt-thread-list__row-wrap{position:relative}.rt-thread-list__row-actions{position:absolute;display:flex;align-items:center;background:var(--rt-color-bg-subtle);gap:var(--rt-space-1);inset-block:0;inset-inline-end:0;padding-inline:var(--rt-space-2) var(--rt-space-4)}@media(hover:hover){.rt-thread-list__row-actions{opacity:0;pointer-events:none}.rt-thread-list__row-wrap:hover .rt-thread-list__row-actions,.rt-thread-list__row-wrap:focus-within .rt-thread-list__row-actions,.rt-thread-list__row-wrap:has(.rt-menu--open) .rt-thread-list__row-actions{opacity:1;pointer-events:auto}}.rt-thread-list__row--active+.rt-thread-list__row-actions{background:var(--rt-color-state-info-bg)}.rt-thread-list__row-sign{flex:none}.rt-thread-list__row-content{display:flex;flex:1 1 auto;align-items:center;justify-content:space-between;gap:var(--rt-space-4);min-inline-size:0}.rt-thread-list__row-body{display:flex;flex-direction:column;gap:var(--rt-space-0-5);min-inline-size:0}.rt-thread-list__row-title{overflow:hidden;color:var(--rt-color-text-primary);text-overflow:ellipsis;white-space:nowrap}.rt-thread-list__row-id{color:var(--rt-color-text-muted);font-size:var(--rt-text-sm)}.rt-thread-list__row:hover .rt-copy-cell__button,.rt-thread-list__row:focus-within .rt-copy-cell__button{opacity:1}.rt-thread-list__row-subtitle{overflow:hidden;color:var(--rt-color-text-muted);text-overflow:ellipsis;white-space:nowrap}.rt-thread-list__row-meta{display:flex;flex:0 0 auto;align-items:center;gap:var(--rt-space-2)}.rt-thread-list__row-time{color:var(--rt-color-text-muted);white-space:nowrap}.rt-thread-list__row-tag{padding:var(--rt-space-0-5) var(--rt-space-2);border-radius:var(--rt-thread-list-tag-radius);background:var(--rt-color-state-warning-bg);color:var(--rt-color-state-warning-text);font-size:var(--rt-text-xs);white-space:nowrap}.rt-thread-list__row-dot{display:inline-block;border-radius:var(--rt-thread-list-dot-radius);background:var(--rt-color-text-link);block-size:6px;inline-size:6px}.rt-thread-list__row-skeleton{display:flex;flex-direction:column;padding:var(--rt-space-2) var(--rt-space-4);gap:var(--rt-space-2)}.rt-thread-list__row-loader{display:flex;justify-content:center;padding:var(--rt-space-2) var(--rt-space-4)}.rt-thread-list__load-anchor{block-size:1px}.rt-thread-list__empty{padding:var(--rt-space-6) var(--rt-space-4)}.rt-thread-list__empty-preview{display:flex;flex-direction:column;gap:var(--rt-space-1)}.rt-thread-list__empty-card{display:flex;align-items:center;padding:var(--rt-space-2);border:var(--rt-thread-list-border-width) solid var(--rt-color-border-subtle);border-radius:var(--rt-thread-list-card-radius);background:var(--rt-color-bg-surface-subtle);gap:var(--rt-space-2)}.rt-thread-list__empty-card--offset{transform:translate(20px)}.rt-thread-list__empty-avatar{display:grid;flex:0 0 auto;border-radius:var(--rt-thread-list-avatar-radius);background:var(--rt-color-text-muted);block-size:24px;color:var(--rt-color-bg-surface);inline-size:24px;place-items:center}.rt-thread-list__empty-lines{display:flex;flex-direction:column;gap:var(--rt-space-2)}.rt-thread-list__empty-line{border-radius:var(--rt-thread-list-line-radius);background:var(--rt-color-border-strong);block-size:6px;inline-size:112px}.rt-thread-list__empty-line--short{inline-size:48px}.rt-thread-list[data-rt-radius=none]{--rt-thread-list-card-radius: var(--rt-radius-none)}.rt-thread-list[data-rt-radius=xs]{--rt-thread-list-card-radius: var(--rt-radius-xs)}.rt-thread-list[data-rt-radius=sm]{--rt-thread-list-card-radius: var(--rt-radius-sm)}.rt-thread-list[data-rt-radius=ms]{--rt-thread-list-card-radius: var(--rt-radius-ms)}.rt-thread-list[data-rt-radius=md]{--rt-thread-list-card-radius: var(--rt-radius-md)}.rt-thread-list[data-rt-radius=lg]{--rt-thread-list-card-radius: var(--rt-radius-lg)}.rt-thread-list[data-rt-radius=xl]{--rt-thread-list-card-radius: var(--rt-radius-xl)}.rt-thread-list[data-rt-radius=\"2xl\"]{--rt-thread-list-card-radius: var(--rt-radius-2xl)}.rt-thread-list[data-rt-radius=full]{--rt-thread-list-card-radius: var(--rt-radius-full)}}\n"]
+			template: "<ng-container rtBlock=\"rt-thread-list\">\n    <header rtElem=\"head\">\n        @if (searchTemplate()) {\n            <div rtElem=\"search\" qa-dataid=\"thread-list-search\">\n                <ng-container [ngTemplateOutlet]=\"searchTemplate()?.templateRef ?? null\" />\n            </div>\n        } @else {\n            <rt-input\n                rtElem=\"search\"\n                qa-dataid=\"thread-list-search\"\n                iconLeft=\"search\"\n                [placeholder]=\"searchPlaceholderText()\"\n                [formControl]=\"searchControl\" />\n        }\n        @if (filtersTemplate()) {\n            <rt-icon-button\n                rtElem=\"filter-trigger\"\n                qa-dataid=\"thread-list-filter\"\n                icon=\"filter\"\n                variant=\"secondary\"\n                rtPopoverAlign=\"end\"\n                [ariaLabel]=\"t().uiFilters\"\n                [indicator]=\"filtersActive()\"\n                [rtPopover]=\"filtersPanel\" />\n        }\n    </header>\n\n    @if (tabsTemplate(); as tabs) {\n        <div rtElem=\"tabs\" qa-dataid=\"thread-list-tabs\">\n            <ng-container [ngTemplateOutlet]=\"tabs.templateRef\" />\n        </div>\n    }\n\n    <ng-template #rowButton let-row>\n        <button\n            rtElem=\"row\"\n            qa-dataid=\"thread-list-row\"\n            type=\"button\"\n            [attr.data-id]=\"row.id\"\n            [attr.data-unread]=\"row.hasUnread\"\n            [attr.aria-current]=\"row.id === activeId() ? 'true' : null\"\n            [rtMod]=\"{\n                active: row.id === activeId(),\n                unread: row.hasUnread,\n                overdue: !!row.overdue,\n            }\"\n            (click)=\"onSelect(row.id, $event)\">\n            @if (row.sign; as sign) {\n                <rt-service-logo rtElem=\"row-sign\" qa-dataid=\"thread-list-row-sign\" size=\"xs\" [logos]=\"[sign]\" />\n                <span rtElem=\"row-content\">\n                    <ng-container [ngTemplateOutlet]=\"rowContent\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                </span>\n            } @else {\n                <ng-container [ngTemplateOutlet]=\"rowContent\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n            }\n        </button>\n    </ng-template>\n\n    <ng-template #rowContent let-row>\n        <ng-container [ngTemplateOutlet]=\"rowTemplate()?.templateRef ?? null\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n    </ng-template>\n\n    <ng-template #filtersPanel>\n        <div rtElem=\"filters-panel\" qa-dataid=\"thread-list-filters-panel\">\n            <ng-container [ngTemplateOutlet]=\"filtersTemplate()?.templateRef ?? null\" />\n        </div>\n    </ng-template>\n\n    <div rtElem=\"rows\" qa-dataid=\"thread-list-rows\">\n        @if (loading() && !rows().length) {\n            @for (i of skeletonRows; track i) {\n                <div rtElem=\"row-skeleton\" qa-dataid=\"thread-list-row-skeleton\" aria-hidden=\"true\">\n                    <rt-skeleton width=\"60%\" height=\"14px\" />\n                    <rt-skeleton width=\"90%\" height=\"12px\" />\n                </div>\n            }\n        } @else if (!rows().length) {\n            <rt-empty-state rtElem=\"empty\" qa-dataid=\"thread-list-empty\" [description]=\"t().uiThreadListEmptyHint\" [title]=\"emptyTitle()\">\n                <div rtEmptyIllustration rtElem=\"empty-preview\">\n                    @for (row of emptyPreviewRows(); track row.id) {\n                        <div rtElem=\"empty-card\" [rtMod]=\"{ offset: row.offset }\">\n                            <span rtElem=\"empty-avatar\">\n                                <rt-icon size=\"sm\" [name]=\"row.icon\" />\n                            </span>\n                            <span rtElem=\"empty-lines\">\n                                <span rtElem=\"empty-line\" [rtMod]=\"{ short: true }\"></span>\n                                <span rtElem=\"empty-line\"></span>\n                            </span>\n                        </div>\n                    }\n                </div>\n            </rt-empty-state>\n        } @else {\n            @for (row of rows(); track row.id) {\n                @if (rowActionsTemplate(); as actions) {\n                    <div rtElem=\"row-wrap\" qa-dataid=\"thread-list-row-wrap\">\n                        <ng-container [ngTemplateOutlet]=\"rowButton\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                        <div rtElem=\"row-actions\" qa-dataid=\"thread-list-row-actions\">\n                            <ng-container [ngTemplateOutlet]=\"actions.templateRef\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                        </div>\n                    </div>\n                } @else {\n                    <ng-container [ngTemplateOutlet]=\"rowButton\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                }\n            }\n            @if (fetching()) {\n                <div rtElem=\"row-loader\" qa-dataid=\"thread-list-row-loader\">\n                    <rt-skeleton width=\"90%\" height=\"12px\" />\n                </div>\n            }\n            @if (hasMore()) {\n                <div\n                    rtElem=\"load-anchor\"\n                    qa-dataid=\"thread-list-load-more\"\n                    aria-hidden=\"true\"\n                    rtInfiniteScroll\n                    [disabled]=\"fetching()\"\n                    (loadMore)=\"onLoadMore()\"></div>\n            }\n        }\n    </div>\n</ng-container>\n",
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-thread-list{--rt-thread-list-border-width: var(--rt-border-width-thin);--rt-thread-list-card-radius: var(--rt-radius-lg);--rt-thread-list-tag-radius: var(--rt-radius-sm);--rt-thread-list-dot-radius: var(--rt-radius-full);--rt-thread-list-avatar-radius: var(--rt-radius-full);--rt-thread-list-line-radius: var(--rt-radius-full);display:flex;flex:1 1 auto;flex-direction:column;min-block-size:0}.rt-thread-list__head{display:flex;flex:0 0 auto;align-items:center;block-size:56px;border-block-end:var(--rt-thread-list-border-width) solid var(--rt-color-border-strong);gap:var(--rt-space-2);padding-inline:var(--rt-space-4)}.rt-thread-list__search{flex:1 1 auto;min-inline-size:0}.rt-thread-list__filter-trigger{flex:0 0 auto}.rt-thread-list__tabs{flex:0 0 auto;padding:var(--rt-space-0-5) var(--rt-space-2) 0}.rt-thread-list__filters-panel{display:flex;flex-direction:column;padding:var(--rt-space-4);gap:var(--rt-space-2);min-inline-size:220px}.rt-thread-list__rows{display:flex;flex:1 1 auto;flex-direction:column;min-block-size:0;overflow-y:auto;overscroll-behavior:contain}.rt-thread-list__row{display:flex;align-items:center;justify-content:space-between;padding:var(--rt-space-2) var(--rt-space-4);border:none;background:none;border-inline-start:3px solid transparent;cursor:pointer;font-family:inherit;font-size:var(--rt-text-sm);gap:var(--rt-space-4);inline-size:100%;text-align:start}.rt-thread-list__row:hover{background:var(--rt-color-bg-subtle)}.rt-thread-list__row--active,.rt-thread-list__row--active:hover{background:var(--rt-color-state-info-bg);border-inline-start-color:var(--rt-color-action-primary)}.rt-thread-list__row--unread{position:relative;background:var(--rt-color-bg-subtle);border-inline-start-color:var(--rt-color-action-primary)}.rt-thread-list__row--unread .rt-thread-list__row-title{font-weight:var(--rt-font-weight-semibold)}.rt-thread-list__row--unread:before{position:absolute;border-radius:var(--rt-thread-list-dot-radius);background:var(--rt-color-action-primary);block-size:var(--rt-space-2);content:\"\";inline-size:var(--rt-space-2);inset-block-start:50%;inset-inline-start:var(--rt-space-2);transform:translateY(-50%)}.rt-thread-list__row--active,.rt-thread-list__row--active:hover{background:var(--rt-color-state-info-bg)}.rt-thread-list__row--overdue .rt-thread-list__row-time{color:var(--rt-color-state-error-text)}.rt-thread-list__row-wrap{position:relative}.rt-thread-list__row-actions{position:absolute;display:flex;align-items:center;background:var(--rt-color-bg-subtle);gap:var(--rt-space-1);inset-block:0;inset-inline-end:0;padding-inline:var(--rt-space-2) var(--rt-space-4)}@media(hover:hover){.rt-thread-list__row-actions{opacity:0;pointer-events:none}.rt-thread-list__row-wrap:hover .rt-thread-list__row-actions,.rt-thread-list__row-wrap:focus-within .rt-thread-list__row-actions,.rt-thread-list__row-wrap:has(.rt-menu--open) .rt-thread-list__row-actions{opacity:1;pointer-events:auto}}.rt-thread-list__row--active+.rt-thread-list__row-actions{background:var(--rt-color-state-info-bg)}.rt-thread-list__row-sign{flex:none}.rt-thread-list__row-content{display:flex;flex:1 1 auto;align-items:center;justify-content:space-between;gap:var(--rt-space-4);min-inline-size:0}.rt-thread-list__row-body{display:flex;flex-direction:column;gap:var(--rt-space-0-5);min-inline-size:0}.rt-thread-list__row-title{overflow:hidden;color:var(--rt-color-text-primary);text-overflow:ellipsis;white-space:nowrap}.rt-thread-list__row-id{color:var(--rt-color-text-muted);font-size:var(--rt-text-sm)}.rt-thread-list__row:hover .rt-copy-cell__button,.rt-thread-list__row:focus-within .rt-copy-cell__button{opacity:1}.rt-thread-list__row-subtitle{overflow:hidden;color:var(--rt-color-text-muted);text-overflow:ellipsis;white-space:nowrap}.rt-thread-list__row-meta{display:flex;flex:0 0 auto;align-items:center;gap:var(--rt-space-2)}.rt-thread-list__row-time{color:var(--rt-color-text-muted);white-space:nowrap}.rt-thread-list__row-tag{padding:var(--rt-space-0-5) var(--rt-space-2);border-radius:var(--rt-thread-list-tag-radius);background:var(--rt-color-state-warning-bg);color:var(--rt-color-state-warning-text);font-size:var(--rt-text-xs);white-space:nowrap}.rt-thread-list__row-dot{display:inline-block;border-radius:var(--rt-thread-list-dot-radius);background:var(--rt-color-text-link);block-size:6px;inline-size:6px}.rt-thread-list__row-skeleton{display:flex;flex-direction:column;padding:var(--rt-space-2) var(--rt-space-4);gap:var(--rt-space-2)}.rt-thread-list__row-loader{display:flex;justify-content:center;padding:var(--rt-space-2) var(--rt-space-4)}.rt-thread-list__load-anchor{block-size:1px}.rt-thread-list__empty{padding:var(--rt-space-6) var(--rt-space-4)}.rt-thread-list__empty-preview{display:flex;flex-direction:column;gap:var(--rt-space-1)}.rt-thread-list__empty-card{display:flex;align-items:center;padding:var(--rt-space-2);border:var(--rt-thread-list-border-width) solid var(--rt-color-border-subtle);border-radius:var(--rt-thread-list-card-radius);background:var(--rt-color-bg-surface-subtle);gap:var(--rt-space-2)}.rt-thread-list__empty-card--offset{transform:translate(20px)}.rt-thread-list__empty-avatar{display:grid;flex:0 0 auto;border-radius:var(--rt-thread-list-avatar-radius);background:var(--rt-color-text-muted);block-size:24px;color:var(--rt-color-bg-surface);inline-size:24px;place-items:center}.rt-thread-list__empty-lines{display:flex;flex-direction:column;gap:var(--rt-space-2)}.rt-thread-list__empty-line{border-radius:var(--rt-thread-list-line-radius);background:var(--rt-color-border-strong);block-size:6px;inline-size:112px}.rt-thread-list__empty-line--short{inline-size:48px}.rt-thread-list[data-rt-radius=none]{--rt-thread-list-card-radius: var(--rt-radius-none)}.rt-thread-list[data-rt-radius=xs]{--rt-thread-list-card-radius: var(--rt-radius-xs)}.rt-thread-list[data-rt-radius=sm]{--rt-thread-list-card-radius: var(--rt-radius-sm)}.rt-thread-list[data-rt-radius=ms]{--rt-thread-list-card-radius: var(--rt-radius-ms)}.rt-thread-list[data-rt-radius=md]{--rt-thread-list-card-radius: var(--rt-radius-md)}.rt-thread-list[data-rt-radius=lg]{--rt-thread-list-card-radius: var(--rt-radius-lg)}.rt-thread-list[data-rt-radius=xl]{--rt-thread-list-card-radius: var(--rt-radius-xl)}.rt-thread-list[data-rt-radius=\"2xl\"]{--rt-thread-list-card-radius: var(--rt-radius-2xl)}.rt-thread-list[data-rt-radius=full]{--rt-thread-list-card-radius: var(--rt-radius-full)}}\n"]
 		}]
 	}],
 	propDecorators: {
@@ -623,6 +667,10 @@ i0.ɵɵngDeclareClassMetadata({
 			type: i0.ContentChild,
 			args: [i0.forwardRef(() => RtThreadListSearchDirective), { isSignal: true }]
 		}],
+		tabsTemplate: [{
+			type: i0.ContentChild,
+			args: [i0.forwardRef(() => RtThreadListTabsDirective), { isSignal: true }]
+		}],
 		rows: [{
 			type: i0.Input,
 			args: [{
@@ -713,6 +761,6 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
-export { RtThreadListComponent, RtThreadListFiltersDirective, RtThreadListRowActionsDirective, RtThreadListRowDirective, RtThreadListSearchDirective };
+export { RtThreadListComponent, RtThreadListFiltersDirective, RtThreadListRowActionsDirective, RtThreadListRowDirective, RtThreadListSearchDirective, RtThreadListTabsDirective };
 
 //# sourceMappingURL=rt-tools-ui-kit-v2-thread-list.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"rt-tools-ui-kit-v2-thread-list.mjs","names":[],"sources":["../../../projects/ui-kit-v2/src/lib/components/thread-list/rt-thread-list.directives.ts","../../../projects/ui-kit-v2/src/lib/components/thread-list/rt-thread-list.component.ts","../../../projects/ui-kit-v2/src/lib/components/thread-list/rt-thread-list.component.html"],"sourcesContent":["import { Directive, inject, input, InputSignal, TemplateRef } from '@angular/core';\n\nimport { IRtThreadList } from './rt-thread-list.model';\n\n/**\n * Помечает `<ng-template>` содержимого строки списка. Входом `[rtThreadListRow]`\n * потребитель передаёт свой массив строк — из него выводится тип `TRow`, поэтому\n * `let-row` в темплейте типизируется строго (context-guard ниже это подтверждает).\n */\n@Directive({\n    selector: 'ng-template[rtThreadListRow]',\n})\nexport class RtThreadListRowDirective<TRow extends IRtThreadList.Row> {\n    public readonly templateRef: TemplateRef<IRtThreadList.RowContext<TRow>> =\n        inject<TemplateRef<IRtThreadList.RowContext<TRow>>>(TemplateRef);\n\n    public readonly rows: InputSignal<readonly TRow[]> = input<readonly TRow[]>([], {\n        alias: 'rtThreadListRow',\n    });\n\n    public static ngTemplateContextGuard<TRow extends IRtThreadList.Row>(\n        _directive: RtThreadListRowDirective<TRow>,\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars -- второй довод стража контекста шаблона стоит только в типе-предикате; убрать его нечем, подпись задаёт каркас\n        context: unknown\n    ): context is IRtThreadList.RowContext<TRow> {\n        return true;\n    }\n}\n\n/**\n * Помечает `<ng-template>` действий строки (удалить, закрепить). Действия рисуются рядом с\n * кнопкой строки, а не внутри неё: вложенная кнопка в `<button>` недопустима и крадёт клик\n * выбора строки. Видны при наведении и фокусе внутри строки.\n */\n@Directive({\n    selector: 'ng-template[rtThreadListRowActions]',\n})\nexport class RtThreadListRowActionsDirective<TRow extends IRtThreadList.Row> {\n    public readonly templateRef: TemplateRef<IRtThreadList.RowContext<TRow>> =\n        inject<TemplateRef<IRtThreadList.RowContext<TRow>>>(TemplateRef);\n\n    public readonly rows: InputSignal<readonly TRow[]> = input<readonly TRow[]>([], {\n        alias: 'rtThreadListRowActions',\n    });\n\n    public static ngTemplateContextGuard<TRow extends IRtThreadList.Row>(\n        _directive: RtThreadListRowActionsDirective<TRow>,\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars -- второй довод стража контекста шаблона стоит только в типе-предикате; убрать его нечем, подпись задаёт каркас\n        context: unknown\n    ): context is IRtThreadList.RowContext<TRow> {\n        return true;\n    }\n}\n\n/**\n * Помечает `<ng-template>` с фильтрами — его содержимое рендерится в поповере,\n * который открывает иконка-фильтр в шапке списка.\n */\n@Directive({\n    selector: 'ng-template[rtThreadListFilters]',\n})\nexport class RtThreadListFiltersDirective {\n    public readonly templateRef: TemplateRef<unknown> = inject<TemplateRef<unknown>>(TemplateRef);\n}\n\n/**\n * Помечает `<ng-template>` с кастомным контролом поиска. Когда потребитель его\n * проецирует, шапка списка рендерит его содержимое вместо встроенного `rt-input`\n * — так воркспейс подставляет свой автокомплит по каталогу вместо текстового\n * поиска, не ломая generic-природу списка.\n */\n@Directive({\n    selector: 'ng-template[rtThreadListSearch]',\n})\nexport class RtThreadListSearchDirective {\n    public readonly templateRef: TemplateRef<unknown> = inject<TemplateRef<unknown>>(TemplateRef);\n}\n","import { NgTemplateOutlet } from '@angular/common';\nimport {\n    booleanAttribute,\n    computed,\n    contentChild,\n    inject,\n    input,\n    output,\n    ChangeDetectionStrategy,\n    Component,\n    DestroyRef,\n    InputSignal,\n    InputSignalWithTransform,\n    OnInit,\n    OutputEmitterRef,\n    Signal,\n    ViewEncapsulation,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { FormControl, ReactiveFormsModule } from '@angular/forms';\n\nimport { distinctUntilChanged, map } from 'rxjs';\n\nimport { BlockDirective, ElemDirective, ModDirective } from '@rt-tools/core';\n\nimport { RT_KIT_LABELS, TRtKitLabelMap, rtKitLabel } from '@rt-tools/ui-kit-v2/core';\nimport { searchDebounce } from '@rt-tools/ui-kit-v2/core';\n\nimport { RtInfiniteScrollDirective } from '@rt-tools/ui-kit-v2/core';\nimport { RtEmptyStateComponent } from '@rt-tools/ui-kit-v2/empty-state';\nimport { RtIconButtonComponent } from '@rt-tools/ui-kit-v2/icon-button';\nimport { RtIconComponent } from '@rt-tools/ui-kit-v2/icon';\nimport { IRtIcon } from '@rt-tools/ui-kit-v2/core';\nimport { RtInputComponent } from '@rt-tools/ui-kit-v2/input';\nimport { RtPopoverDirective } from '@rt-tools/ui-kit-v2/popover';\nimport { RtRadiusDirective } from '@rt-tools/ui-kit-v2/radius';\nimport { RtServiceLogoComponent } from '@rt-tools/ui-kit-v2/service-logo';\nimport { RtSkeletonComponent } from '@rt-tools/ui-kit-v2/skeleton';\nimport {\n    RtThreadListFiltersDirective,\n    RtThreadListRowActionsDirective,\n    RtThreadListRowDirective,\n    RtThreadListSearchDirective,\n} from './rt-thread-list.directives';\nimport { IRtThreadList } from './rt-thread-list.model';\n\nconst BEM_BLOCK: string = 'rt-thread-list';\n\n/** Кол-во скелетон-строк на первичной загрузке (пока `rows` пусты). */\nconst SKELETON_ROWS_COUNT: number = 6;\n\n/** Значки строк-превью пустого списка по умолчанию: люди переписки. */\nconst PREVIEW_ICONS: readonly IRtIcon.Name[] = ['user', 'users', 'user'];\n\n/**\n * Презентационный список тредов для воркспейсов:\n * поиск с дебаунсом, фильтр-поповер и бесконечная прокрутка. Данные и оркестрация\n * — на вызывающем; список стора/api не видит.\n *\n * Строку рисует потребитель через `<ng-template rtThreadListRow let-row>` (body +\n * meta); оболочка владеет кнопкой строки (active/unread/overdue), поиском, кнопкой\n * фильтров (точка-индикатор при `filtersActive`) и скроллом. Фильтры потребитель\n * кладёт в `<ng-template rtThreadListFilters>` — они рендерятся в поповере.\n */\n@Component({\n    selector: 'rt-thread-list',\n    templateUrl: './rt-thread-list.component.html',\n    styleUrls: ['./rt-thread-list.component.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    imports: [\n        // Angular\n        NgTemplateOutlet,\n        ReactiveFormsModule,\n\n        // standalone components / directives\n        RtEmptyStateComponent,\n        RtIconComponent,\n        RtIconButtonComponent,\n        RtInputComponent,\n        RtPopoverDirective,\n        RtServiceLogoComponent,\n        RtSkeletonComponent,\n        BlockDirective,\n        ElemDirective,\n        RtInfiniteScrollDirective,\n        ModDirective,\n    ],\n    hostDirectives: [{ directive: RtRadiusDirective, inputs: ['radius'] }],\n    host: {\n        class: BEM_BLOCK,\n    },\n})\nexport class RtThreadListComponent<TRow extends IRtThreadList.Row> implements OnInit {\n    readonly #destroyRef: DestroyRef = inject(DestroyRef);\n\n    readonly #t_uiSearch: Signal<string> = rtKitLabel('uiSearch');\n    readonly #t_uiNothingFound: Signal<string> = rtKitLabel('uiNothingFound');\n\n    protected readonly t: Signal<TRtKitLabelMap> = inject(RT_KIT_LABELS);\n\n    protected readonly searchPlaceholderText: Signal<string> = computed((): string => this.searchPlaceholder() || this.#t_uiSearch());\n    protected readonly emptyTitle: Signal<string> = computed((): string => this.emptyText() || this.#t_uiNothingFound());\n\n    protected readonly skeletonRows: number[] = Array.from({ length: SKELETON_ROWS_COUNT }, (_: unknown, i: number): number => i);\n\n    /** Декоративные строки-превью пустого состояния: значок строки из `emptyPreviewIcons`, каждая вторая сдвинута. */\n    protected readonly emptyPreviewRows: Signal<readonly IRtThreadList.PreviewRow[]> = computed((): readonly IRtThreadList.PreviewRow[] =>\n        this.emptyPreviewIcons().map((icon: IRtIcon.Name, index: number): IRtThreadList.PreviewRow => ({\n            icon,\n            id: index,\n            offset: index % 2 === 1,\n        }))\n    );\n\n    protected readonly searchControl: FormControl<string> = new FormControl<string>('', {\n        nonNullable: true,\n    });\n\n    protected readonly rowTemplate: Signal<RtThreadListRowDirective<TRow> | undefined> = contentChild(RtThreadListRowDirective<TRow>);\n\n    protected readonly rowActionsTemplate: Signal<RtThreadListRowActionsDirective<TRow> | undefined> = contentChild(\n        RtThreadListRowActionsDirective<TRow>\n    );\n\n    protected readonly filtersTemplate: Signal<RtThreadListFiltersDirective | undefined> = contentChild(RtThreadListFiltersDirective);\n\n    protected readonly searchTemplate: Signal<RtThreadListSearchDirective | undefined> = contentChild(RtThreadListSearchDirective);\n\n    public readonly rows: InputSignal<readonly TRow[]> = input<readonly TRow[]>([]);\n\n    public readonly activeId: InputSignal<IRtThreadList.TRowId | null> = input<IRtThreadList.TRowId | null>(null);\n\n    /** Пусто — берётся переведённая подпись по умолчанию */\n    public readonly searchPlaceholder: InputSignal<string> = input<string>('');\n\n    public readonly emptyText: InputSignal<string> = input<string>('');\n\n    /** Значки декоративных строк-превью пустого состояния, по строке на значок */\n    public readonly emptyPreviewIcons: InputSignal<readonly IRtIcon.Name[]> = input<readonly IRtIcon.Name[]>(PREVIEW_ICONS);\n\n    public readonly loading: InputSignalWithTransform<boolean, boolean | string> = input<boolean, boolean | string>(false, {\n        transform: booleanAttribute,\n    });\n\n    public readonly fetching: InputSignalWithTransform<boolean, boolean | string> = input<boolean, boolean | string>(false, {\n        transform: booleanAttribute,\n    });\n\n    public readonly hasMore: InputSignalWithTransform<boolean, boolean | string> = input<boolean, boolean | string>(false, {\n        transform: booleanAttribute,\n    });\n\n    public readonly filtersActive: InputSignalWithTransform<boolean, boolean | string> = input<boolean, boolean | string>(false, {\n        transform: booleanAttribute,\n    });\n\n    // Имя `select` зарезервировано под нативное DOM-событие\n    // (@angular-eslint/no-output-native), поэтому output переименован.\n    public readonly selectRow: OutputEmitterRef<IRtThreadList.TRowId> = output<IRtThreadList.TRowId>();\n\n    // Ctrl/⌘+клик по строке: потребитель открывает строку в новой вкладке.\n    // Обычный клик остаётся на `selectRow`.\n    public readonly openInNewTab: OutputEmitterRef<IRtThreadList.TRowId> = output<IRtThreadList.TRowId>();\n\n    public readonly searchChange: OutputEmitterRef<string> = output<string>();\n\n    public readonly loadMore: OutputEmitterRef<void> = output<void>();\n\n    public ngOnInit(): void {\n        // Дебаунс непустого ввода; очистка крестиком применяется сразу (searchDebounce).\n        this.searchControl.valueChanges\n            .pipe(\n                map((value: string): string => value.trim()),\n                searchDebounce(),\n                distinctUntilChanged(),\n                takeUntilDestroyed(this.#destroyRef)\n            )\n            .subscribe((value: string): void => this.searchChange.emit(value));\n    }\n\n    protected onSelect(id: IRtThreadList.TRowId, event: MouseEvent): void {\n        // Ctrl (Win/Linux) или ⌘ (macOS) — «открыть в новой вкладке», как у\n        // нативных ссылок. Иначе — обычный выбор строки в текущей вкладке.\n        if (event.ctrlKey || event.metaKey) {\n            this.openInNewTab.emit(id);\n            return;\n        }\n        this.selectRow.emit(id);\n    }\n\n    protected onLoadMore(): void {\n        this.loadMore.emit();\n    }\n}\n","<ng-container rtBlock=\"rt-thread-list\">\n    <header rtElem=\"head\">\n        @if (searchTemplate()) {\n            <div rtElem=\"search\" qa-dataid=\"thread-list-search\">\n                <ng-container [ngTemplateOutlet]=\"searchTemplate()?.templateRef ?? null\" />\n            </div>\n        } @else {\n            <rt-input\n                rtElem=\"search\"\n                qa-dataid=\"thread-list-search\"\n                iconLeft=\"search\"\n                [placeholder]=\"searchPlaceholderText()\"\n                [formControl]=\"searchControl\" />\n        }\n        @if (filtersTemplate()) {\n            <rt-icon-button\n                rtElem=\"filter-trigger\"\n                qa-dataid=\"thread-list-filter\"\n                icon=\"filter\"\n                variant=\"secondary\"\n                rtPopoverAlign=\"end\"\n                [ariaLabel]=\"t().uiFilters\"\n                [indicator]=\"filtersActive()\"\n                [rtPopover]=\"filtersPanel\" />\n        }\n    </header>\n\n    <ng-template #rowButton let-row>\n        <button\n            rtElem=\"row\"\n            qa-dataid=\"thread-list-row\"\n            type=\"button\"\n            [attr.data-id]=\"row.id\"\n            [attr.data-unread]=\"row.hasUnread\"\n            [attr.aria-current]=\"row.id === activeId() ? 'true' : null\"\n            [rtMod]=\"{\n                active: row.id === activeId(),\n                unread: row.hasUnread,\n                overdue: !!row.overdue,\n            }\"\n            (click)=\"onSelect(row.id, $event)\">\n            @if (row.sign; as sign) {\n                <rt-service-logo rtElem=\"row-sign\" qa-dataid=\"thread-list-row-sign\" size=\"xs\" [logos]=\"[sign]\" />\n                <span rtElem=\"row-content\">\n                    <ng-container [ngTemplateOutlet]=\"rowContent\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                </span>\n            } @else {\n                <ng-container [ngTemplateOutlet]=\"rowContent\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n            }\n        </button>\n    </ng-template>\n\n    <ng-template #rowContent let-row>\n        <ng-container [ngTemplateOutlet]=\"rowTemplate()?.templateRef ?? null\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n    </ng-template>\n\n    <ng-template #filtersPanel>\n        <div rtElem=\"filters-panel\" qa-dataid=\"thread-list-filters-panel\">\n            <ng-container [ngTemplateOutlet]=\"filtersTemplate()?.templateRef ?? null\" />\n        </div>\n    </ng-template>\n\n    <div rtElem=\"rows\" qa-dataid=\"thread-list-rows\">\n        @if (loading() && !rows().length) {\n            @for (i of skeletonRows; track i) {\n                <div rtElem=\"row-skeleton\" qa-dataid=\"thread-list-row-skeleton\" aria-hidden=\"true\">\n                    <rt-skeleton width=\"60%\" height=\"14px\" />\n                    <rt-skeleton width=\"90%\" height=\"12px\" />\n                </div>\n            }\n        } @else if (!rows().length) {\n            <rt-empty-state rtElem=\"empty\" qa-dataid=\"thread-list-empty\" [description]=\"t().uiThreadListEmptyHint\" [title]=\"emptyTitle()\">\n                <div rtEmptyIllustration rtElem=\"empty-preview\">\n                    @for (row of emptyPreviewRows(); track row.id) {\n                        <div rtElem=\"empty-card\" [rtMod]=\"{ offset: row.offset }\">\n                            <span rtElem=\"empty-avatar\">\n                                <rt-icon size=\"sm\" [name]=\"row.icon\" />\n                            </span>\n                            <span rtElem=\"empty-lines\">\n                                <span rtElem=\"empty-line\" [rtMod]=\"{ short: true }\"></span>\n                                <span rtElem=\"empty-line\"></span>\n                            </span>\n                        </div>\n                    }\n                </div>\n            </rt-empty-state>\n        } @else {\n            @for (row of rows(); track row.id) {\n                @if (rowActionsTemplate(); as actions) {\n                    <div rtElem=\"row-wrap\" qa-dataid=\"thread-list-row-wrap\">\n                        <ng-container [ngTemplateOutlet]=\"rowButton\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                        <div rtElem=\"row-actions\" qa-dataid=\"thread-list-row-actions\">\n                            <ng-container [ngTemplateOutlet]=\"actions.templateRef\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                        </div>\n                    </div>\n                } @else {\n                    <ng-container [ngTemplateOutlet]=\"rowButton\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                }\n            }\n            @if (fetching()) {\n                <div rtElem=\"row-loader\" qa-dataid=\"thread-list-row-loader\">\n                    <rt-skeleton width=\"90%\" height=\"12px\" />\n                </div>\n            }\n            @if (hasMore()) {\n                <div\n                    rtElem=\"load-anchor\"\n                    qa-dataid=\"thread-list-load-more\"\n                    aria-hidden=\"true\"\n                    rtInfiniteScroll\n                    [disabled]=\"fetching()\"\n                    (loadMore)=\"onLoadMore()\"></div>\n            }\n        }\n    </div>\n</ng-container>\n"],"mappings":"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"}
+{"version":3,"file":"rt-tools-ui-kit-v2-thread-list.mjs","names":[],"sources":["../../../projects/ui-kit-v2/src/lib/components/thread-list/rt-thread-list.directives.ts","../../../projects/ui-kit-v2/src/lib/components/thread-list/rt-thread-list.component.ts","../../../projects/ui-kit-v2/src/lib/components/thread-list/rt-thread-list.component.html"],"sourcesContent":["import { Directive, inject, input, InputSignal, TemplateRef } from '@angular/core';\n\nimport { IRtThreadList } from './rt-thread-list.model';\n\n/**\n * Помечает `<ng-template>` содержимого строки списка. Входом `[rtThreadListRow]`\n * потребитель передаёт свой массив строк — из него выводится тип `TRow`, поэтому\n * `let-row` в темплейте типизируется строго (context-guard ниже это подтверждает).\n */\n@Directive({\n    selector: 'ng-template[rtThreadListRow]',\n})\nexport class RtThreadListRowDirective<TRow extends IRtThreadList.Row> {\n    public readonly templateRef: TemplateRef<IRtThreadList.RowContext<TRow>> =\n        inject<TemplateRef<IRtThreadList.RowContext<TRow>>>(TemplateRef);\n\n    public readonly rows: InputSignal<readonly TRow[]> = input<readonly TRow[]>([], {\n        alias: 'rtThreadListRow',\n    });\n\n    public static ngTemplateContextGuard<TRow extends IRtThreadList.Row>(\n        _directive: RtThreadListRowDirective<TRow>,\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars -- второй довод стража контекста шаблона стоит только в типе-предикате; убрать его нечем, подпись задаёт каркас\n        context: unknown\n    ): context is IRtThreadList.RowContext<TRow> {\n        return true;\n    }\n}\n\n/**\n * Помечает `<ng-template>` действий строки (удалить, закрепить). Действия рисуются рядом с\n * кнопкой строки, а не внутри неё: вложенная кнопка в `<button>` недопустима и крадёт клик\n * выбора строки. Видны при наведении и фокусе внутри строки.\n */\n@Directive({\n    selector: 'ng-template[rtThreadListRowActions]',\n})\nexport class RtThreadListRowActionsDirective<TRow extends IRtThreadList.Row> {\n    public readonly templateRef: TemplateRef<IRtThreadList.RowContext<TRow>> =\n        inject<TemplateRef<IRtThreadList.RowContext<TRow>>>(TemplateRef);\n\n    public readonly rows: InputSignal<readonly TRow[]> = input<readonly TRow[]>([], {\n        alias: 'rtThreadListRowActions',\n    });\n\n    public static ngTemplateContextGuard<TRow extends IRtThreadList.Row>(\n        _directive: RtThreadListRowActionsDirective<TRow>,\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars -- второй довод стража контекста шаблона стоит только в типе-предикате; убрать его нечем, подпись задаёт каркас\n        context: unknown\n    ): context is IRtThreadList.RowContext<TRow> {\n        return true;\n    }\n}\n\n/**\n * Помечает `<ng-template>` с фильтрами — его содержимое рендерится в поповере,\n * который открывает иконка-фильтр в шапке списка.\n */\n@Directive({\n    selector: 'ng-template[rtThreadListFilters]',\n})\nexport class RtThreadListFiltersDirective {\n    public readonly templateRef: TemplateRef<unknown> = inject<TemplateRef<unknown>>(TemplateRef);\n}\n\n/**\n * Помечает `<ng-template>` с кастомным контролом поиска. Когда потребитель его\n * проецирует, шапка списка рендерит его содержимое вместо встроенного `rt-input`\n * — так воркспейс подставляет свой автокомплит по каталогу вместо текстового\n * поиска, не ломая generic-природу списка.\n */\n@Directive({\n    selector: 'ng-template[rtThreadListSearch]',\n})\nexport class RtThreadListSearchDirective {\n    public readonly templateRef: TemplateRef<unknown> = inject<TemplateRef<unknown>>(TemplateRef);\n}\n\n@Directive({\n    selector: 'ng-template[rtThreadListTabs]',\n})\nexport class RtThreadListTabsDirective {\n    public readonly templateRef: TemplateRef<unknown> = inject<TemplateRef<unknown>>(TemplateRef);\n}\n","import { NgTemplateOutlet } from '@angular/common';\nimport {\n    booleanAttribute,\n    computed,\n    contentChild,\n    inject,\n    input,\n    output,\n    ChangeDetectionStrategy,\n    Component,\n    DestroyRef,\n    InputSignal,\n    InputSignalWithTransform,\n    OnInit,\n    OutputEmitterRef,\n    Signal,\n    ViewEncapsulation,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { FormControl, ReactiveFormsModule } from '@angular/forms';\n\nimport { distinctUntilChanged, map } from 'rxjs';\n\nimport { BlockDirective, ElemDirective, ModDirective } from '@rt-tools/core';\n\nimport { RT_KIT_LABELS, TRtKitLabelMap, rtKitLabel } from '@rt-tools/ui-kit-v2/core';\nimport { searchDebounce } from '@rt-tools/ui-kit-v2/core';\n\nimport { RtInfiniteScrollDirective } from '@rt-tools/ui-kit-v2/core';\nimport { RtEmptyStateComponent } from '@rt-tools/ui-kit-v2/empty-state';\nimport { RtIconButtonComponent } from '@rt-tools/ui-kit-v2/icon-button';\nimport { RtIconComponent } from '@rt-tools/ui-kit-v2/icon';\nimport { IRtIcon } from '@rt-tools/ui-kit-v2/core';\nimport { RtInputComponent } from '@rt-tools/ui-kit-v2/input';\nimport { RtPopoverDirective } from '@rt-tools/ui-kit-v2/popover';\nimport { RtRadiusDirective } from '@rt-tools/ui-kit-v2/radius';\nimport { RtServiceLogoComponent } from '@rt-tools/ui-kit-v2/service-logo';\nimport { RtSkeletonComponent } from '@rt-tools/ui-kit-v2/skeleton';\nimport {\n    RtThreadListFiltersDirective,\n    RtThreadListRowActionsDirective,\n    RtThreadListRowDirective,\n    RtThreadListSearchDirective,\n    RtThreadListTabsDirective,\n} from './rt-thread-list.directives';\nimport { IRtThreadList } from './rt-thread-list.model';\n\nconst BEM_BLOCK: string = 'rt-thread-list';\n\n/** Кол-во скелетон-строк на первичной загрузке (пока `rows` пусты). */\nconst SKELETON_ROWS_COUNT: number = 6;\n\n/** Значки строк-превью пустого списка по умолчанию: люди переписки. */\nconst PREVIEW_ICONS: readonly IRtIcon.Name[] = ['user', 'users', 'user'];\n\n/**\n * Презентационный список тредов для воркспейсов:\n * поиск с дебаунсом, фильтр-поповер и бесконечная прокрутка. Данные и оркестрация\n * — на вызывающем; список стора/api не видит.\n *\n * Строку рисует потребитель через `<ng-template rtThreadListRow let-row>` (body +\n * meta); оболочка владеет кнопкой строки (active/unread/overdue), поиском, кнопкой\n * фильтров (точка-индикатор при `filtersActive`) и скроллом. Фильтры потребитель\n * кладёт в `<ng-template rtThreadListFilters>` — они рендерятся в поповере.\n */\n@Component({\n    selector: 'rt-thread-list',\n    templateUrl: './rt-thread-list.component.html',\n    styleUrls: ['./rt-thread-list.component.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    imports: [\n        // Angular\n        NgTemplateOutlet,\n        ReactiveFormsModule,\n\n        // standalone components / directives\n        RtEmptyStateComponent,\n        RtIconComponent,\n        RtIconButtonComponent,\n        RtInputComponent,\n        RtPopoverDirective,\n        RtServiceLogoComponent,\n        RtSkeletonComponent,\n        BlockDirective,\n        ElemDirective,\n        RtInfiniteScrollDirective,\n        ModDirective,\n    ],\n    hostDirectives: [{ directive: RtRadiusDirective, inputs: ['radius'] }],\n    host: {\n        class: BEM_BLOCK,\n    },\n})\nexport class RtThreadListComponent<TRow extends IRtThreadList.Row> implements OnInit {\n    readonly #destroyRef: DestroyRef = inject(DestroyRef);\n\n    readonly #t_uiSearch: Signal<string> = rtKitLabel('uiSearch');\n    readonly #t_uiNothingFound: Signal<string> = rtKitLabel('uiNothingFound');\n\n    protected readonly t: Signal<TRtKitLabelMap> = inject(RT_KIT_LABELS);\n\n    protected readonly searchPlaceholderText: Signal<string> = computed((): string => this.searchPlaceholder() || this.#t_uiSearch());\n    protected readonly emptyTitle: Signal<string> = computed((): string => this.emptyText() || this.#t_uiNothingFound());\n\n    protected readonly skeletonRows: number[] = Array.from({ length: SKELETON_ROWS_COUNT }, (_: unknown, i: number): number => i);\n\n    /** Декоративные строки-превью пустого состояния: значок строки из `emptyPreviewIcons`, каждая вторая сдвинута. */\n    protected readonly emptyPreviewRows: Signal<readonly IRtThreadList.PreviewRow[]> = computed((): readonly IRtThreadList.PreviewRow[] =>\n        this.emptyPreviewIcons().map((icon: IRtIcon.Name, index: number): IRtThreadList.PreviewRow => ({\n            icon,\n            id: index,\n            offset: index % 2 === 1,\n        }))\n    );\n\n    protected readonly searchControl: FormControl<string> = new FormControl<string>('', {\n        nonNullable: true,\n    });\n\n    protected readonly rowTemplate: Signal<RtThreadListRowDirective<TRow> | undefined> = contentChild(RtThreadListRowDirective<TRow>);\n\n    protected readonly rowActionsTemplate: Signal<RtThreadListRowActionsDirective<TRow> | undefined> = contentChild(\n        RtThreadListRowActionsDirective<TRow>\n    );\n\n    protected readonly filtersTemplate: Signal<RtThreadListFiltersDirective | undefined> = contentChild(RtThreadListFiltersDirective);\n\n    protected readonly searchTemplate: Signal<RtThreadListSearchDirective | undefined> = contentChild(RtThreadListSearchDirective);\n\n    protected readonly tabsTemplate: Signal<RtThreadListTabsDirective | undefined> = contentChild(RtThreadListTabsDirective);\n\n    public readonly rows: InputSignal<readonly TRow[]> = input<readonly TRow[]>([]);\n\n    public readonly activeId: InputSignal<IRtThreadList.TRowId | null> = input<IRtThreadList.TRowId | null>(null);\n\n    /** Пусто — берётся переведённая подпись по умолчанию */\n    public readonly searchPlaceholder: InputSignal<string> = input<string>('');\n\n    public readonly emptyText: InputSignal<string> = input<string>('');\n\n    /** Значки декоративных строк-превью пустого состояния, по строке на значок */\n    public readonly emptyPreviewIcons: InputSignal<readonly IRtIcon.Name[]> = input<readonly IRtIcon.Name[]>(PREVIEW_ICONS);\n\n    public readonly loading: InputSignalWithTransform<boolean, boolean | string> = input<boolean, boolean | string>(false, {\n        transform: booleanAttribute,\n    });\n\n    public readonly fetching: InputSignalWithTransform<boolean, boolean | string> = input<boolean, boolean | string>(false, {\n        transform: booleanAttribute,\n    });\n\n    public readonly hasMore: InputSignalWithTransform<boolean, boolean | string> = input<boolean, boolean | string>(false, {\n        transform: booleanAttribute,\n    });\n\n    public readonly filtersActive: InputSignalWithTransform<boolean, boolean | string> = input<boolean, boolean | string>(false, {\n        transform: booleanAttribute,\n    });\n\n    // Имя `select` зарезервировано под нативное DOM-событие\n    // (@angular-eslint/no-output-native), поэтому output переименован.\n    public readonly selectRow: OutputEmitterRef<IRtThreadList.TRowId> = output<IRtThreadList.TRowId>();\n\n    // Ctrl/⌘+клик по строке: потребитель открывает строку в новой вкладке.\n    // Обычный клик остаётся на `selectRow`.\n    public readonly openInNewTab: OutputEmitterRef<IRtThreadList.TRowId> = output<IRtThreadList.TRowId>();\n\n    public readonly searchChange: OutputEmitterRef<string> = output<string>();\n\n    public readonly loadMore: OutputEmitterRef<void> = output<void>();\n\n    public ngOnInit(): void {\n        // Дебаунс непустого ввода; очистка крестиком применяется сразу (searchDebounce).\n        this.searchControl.valueChanges\n            .pipe(\n                map((value: string): string => value.trim()),\n                searchDebounce(),\n                distinctUntilChanged(),\n                takeUntilDestroyed(this.#destroyRef)\n            )\n            .subscribe((value: string): void => this.searchChange.emit(value));\n    }\n\n    protected onSelect(id: IRtThreadList.TRowId, event: MouseEvent): void {\n        // Ctrl (Win/Linux) или ⌘ (macOS) — «открыть в новой вкладке», как у\n        // нативных ссылок. Иначе — обычный выбор строки в текущей вкладке.\n        if (event.ctrlKey || event.metaKey) {\n            this.openInNewTab.emit(id);\n            return;\n        }\n        this.selectRow.emit(id);\n    }\n\n    protected onLoadMore(): void {\n        this.loadMore.emit();\n    }\n}\n","<ng-container rtBlock=\"rt-thread-list\">\n    <header rtElem=\"head\">\n        @if (searchTemplate()) {\n            <div rtElem=\"search\" qa-dataid=\"thread-list-search\">\n                <ng-container [ngTemplateOutlet]=\"searchTemplate()?.templateRef ?? null\" />\n            </div>\n        } @else {\n            <rt-input\n                rtElem=\"search\"\n                qa-dataid=\"thread-list-search\"\n                iconLeft=\"search\"\n                [placeholder]=\"searchPlaceholderText()\"\n                [formControl]=\"searchControl\" />\n        }\n        @if (filtersTemplate()) {\n            <rt-icon-button\n                rtElem=\"filter-trigger\"\n                qa-dataid=\"thread-list-filter\"\n                icon=\"filter\"\n                variant=\"secondary\"\n                rtPopoverAlign=\"end\"\n                [ariaLabel]=\"t().uiFilters\"\n                [indicator]=\"filtersActive()\"\n                [rtPopover]=\"filtersPanel\" />\n        }\n    </header>\n\n    @if (tabsTemplate(); as tabs) {\n        <div rtElem=\"tabs\" qa-dataid=\"thread-list-tabs\">\n            <ng-container [ngTemplateOutlet]=\"tabs.templateRef\" />\n        </div>\n    }\n\n    <ng-template #rowButton let-row>\n        <button\n            rtElem=\"row\"\n            qa-dataid=\"thread-list-row\"\n            type=\"button\"\n            [attr.data-id]=\"row.id\"\n            [attr.data-unread]=\"row.hasUnread\"\n            [attr.aria-current]=\"row.id === activeId() ? 'true' : null\"\n            [rtMod]=\"{\n                active: row.id === activeId(),\n                unread: row.hasUnread,\n                overdue: !!row.overdue,\n            }\"\n            (click)=\"onSelect(row.id, $event)\">\n            @if (row.sign; as sign) {\n                <rt-service-logo rtElem=\"row-sign\" qa-dataid=\"thread-list-row-sign\" size=\"xs\" [logos]=\"[sign]\" />\n                <span rtElem=\"row-content\">\n                    <ng-container [ngTemplateOutlet]=\"rowContent\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                </span>\n            } @else {\n                <ng-container [ngTemplateOutlet]=\"rowContent\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n            }\n        </button>\n    </ng-template>\n\n    <ng-template #rowContent let-row>\n        <ng-container [ngTemplateOutlet]=\"rowTemplate()?.templateRef ?? null\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n    </ng-template>\n\n    <ng-template #filtersPanel>\n        <div rtElem=\"filters-panel\" qa-dataid=\"thread-list-filters-panel\">\n            <ng-container [ngTemplateOutlet]=\"filtersTemplate()?.templateRef ?? null\" />\n        </div>\n    </ng-template>\n\n    <div rtElem=\"rows\" qa-dataid=\"thread-list-rows\">\n        @if (loading() && !rows().length) {\n            @for (i of skeletonRows; track i) {\n                <div rtElem=\"row-skeleton\" qa-dataid=\"thread-list-row-skeleton\" aria-hidden=\"true\">\n                    <rt-skeleton width=\"60%\" height=\"14px\" />\n                    <rt-skeleton width=\"90%\" height=\"12px\" />\n                </div>\n            }\n        } @else if (!rows().length) {\n            <rt-empty-state rtElem=\"empty\" qa-dataid=\"thread-list-empty\" [description]=\"t().uiThreadListEmptyHint\" [title]=\"emptyTitle()\">\n                <div rtEmptyIllustration rtElem=\"empty-preview\">\n                    @for (row of emptyPreviewRows(); track row.id) {\n                        <div rtElem=\"empty-card\" [rtMod]=\"{ offset: row.offset }\">\n                            <span rtElem=\"empty-avatar\">\n                                <rt-icon size=\"sm\" [name]=\"row.icon\" />\n                            </span>\n                            <span rtElem=\"empty-lines\">\n                                <span rtElem=\"empty-line\" [rtMod]=\"{ short: true }\"></span>\n                                <span rtElem=\"empty-line\"></span>\n                            </span>\n                        </div>\n                    }\n                </div>\n            </rt-empty-state>\n        } @else {\n            @for (row of rows(); track row.id) {\n                @if (rowActionsTemplate(); as actions) {\n                    <div rtElem=\"row-wrap\" qa-dataid=\"thread-list-row-wrap\">\n                        <ng-container [ngTemplateOutlet]=\"rowButton\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                        <div rtElem=\"row-actions\" qa-dataid=\"thread-list-row-actions\">\n                            <ng-container [ngTemplateOutlet]=\"actions.templateRef\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                        </div>\n                    </div>\n                } @else {\n                    <ng-container [ngTemplateOutlet]=\"rowButton\" [ngTemplateOutletContext]=\"{ $implicit: row }\" />\n                }\n            }\n            @if (fetching()) {\n                <div rtElem=\"row-loader\" qa-dataid=\"thread-list-row-loader\">\n                    <rt-skeleton width=\"90%\" height=\"12px\" />\n                </div>\n            }\n            @if (hasMore()) {\n                <div\n                    rtElem=\"load-anchor\"\n                    qa-dataid=\"thread-list-load-more\"\n                    aria-hidden=\"true\"\n                    rtInfiniteScroll\n                    [disabled]=\"fetching()\"\n                    (loadMore)=\"onLoadMore()\"></div>\n            }\n        }\n    </div>\n</ng-container>\n"],"mappings":"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"}

package/fesm2022/rt-tools-ui-kit-v2-toggle-button-group.mjs

@@ -319,7 +319,8 @@ var RtToggleButtonGroupComponent = class RtToggleButtonGroupComponent {
 						"rtTooltipPlacement",
 						"rtTooltipShowDelay",
 						"rtTooltipWhenTruncated",
-						"rtTooltipHideOnClick"
+						"rtTooltipHideOnClick",
+						"rtTooltipShowOnTap"
 					],
 					exportAs: ["rtTooltip"]
 				},

package/fesm2022/rt-tools-ui-kit-v2-toggle-button-group.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"rt-tools-ui-kit-v2-toggle-button-group.mjs","names":[],"sources":["../../../projects/ui-kit-v2/src/lib/components/toggle-button-group/rt-toggle-button-option.directive.ts","../../../projects/ui-kit-v2/src/lib/components/toggle-button-group/rt-toggle-button-group.component.ts","../../../projects/ui-kit-v2/src/lib/components/toggle-button-group/rt-toggle-button-group.component.html"],"sourcesContent":["import { Directive, inject, TemplateRef } from '@angular/core';\n\nimport { IRtToggleButtonGroup } from './rt-toggle-button-group.model';\n\n/**\n * Маркер своей разметки сегмента — того, что рисуется внутри кнопки на месте значка и подписи.\n *\n * Кнопка остаётся киту: нажатие, подсветка, недоступность, фокус и связь с формой. Потребитель даёт\n * только содержимое — например картинку-превью раскладки — и получает опцию и признак, нажат ли\n * сегмент.\n *\n * @example\n * ```html\n * <rt-toggle-button-group [options]=\"layouts\" formControlName=\"layout\">\n *     <ng-template rtToggleButtonOption let-option let-active=\"active\">\n *         <img [src]=\"option.value + '.svg'\" [alt]=\"option.label\" />\n *     </ng-template>\n * </rt-toggle-button-group>\n * ```\n */\n@Directive({\n    selector: '[rtToggleButtonOption]',\n})\nexport class RtToggleButtonOptionDirective<T = string> {\n    public readonly templateRef: TemplateRef<IRtToggleButtonGroup.OptionContext<T>> =\n        inject<TemplateRef<IRtToggleButtonGroup.OptionContext<T>>>(TemplateRef);\n}\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { NgTemplateOutlet } from '@angular/common';\nimport {\n    booleanAttribute,\n    ChangeDetectionStrategy,\n    Component,\n    computed,\n    contentChild,\n    forwardRef,\n    input,\n    InputSignal,\n    InputSignalWithTransform,\n    output,\n    OutputEmitterRef,\n    signal,\n    Signal,\n    ViewEncapsulation,\n    WritableSignal,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\nimport { BlockDirective, ElemDirective, ModDirective } from '@rt-tools/core';\n\nimport { RtIconComponent } from '@rt-tools/ui-kit-v2/icon';\nimport { IRtIcon } from '@rt-tools/ui-kit-v2/core';\nimport { RtRadiusDirective } from '@rt-tools/ui-kit-v2/radius';\nimport { RtTooltipDirective } from '@rt-tools/ui-kit-v2/tooltip';\nimport { IRtToggleButtonGroup } from './rt-toggle-button-group.model';\nimport { RtToggleButtonOptionDirective } from './rt-toggle-button-option.directive';\n\nconst BEM_BLOCK: string = 'rt-toggle-button-group';\n\n/**\n * Маппинг размера группы на размер вложенной `<rt-icon>`. rt-icon не имеет\n * промежуточных значений (12 / 16 / 20 / 24 / 32), поэтому `lg` тоже едет\n * на `sm` (16px) — ближе к расчётным 18px у rt-button lg, чем md (20px).\n */\nconst ICON_SIZE_BY_SIZE: Readonly<Record<IRtToggleButtonGroup.Size, IRtIcon.Size>> = Object.freeze({\n    sm: 'xs',\n    md: 'sm',\n    lg: 'sm',\n});\n\n/** Форма записала набор, а не одно значение: так пишет множественный выбор. */\nfunction isMany<T>(value: IRtToggleButtonGroup.FormValue<T>): value is ReadonlyArray<T> {\n    return Array.isArray(value);\n}\n\n/**\n * Generic segmented control кита.\n *\n * API `toggle-button-group` с тремя особенностями:\n *  1. BEM через `rtBlock/rtElem/rtMod` (camelCase mods → kebab-case в CSS).\n *  2. Tooltip — нативный `[attr.title]` вместо `MatTooltip` (Angular Material\n *     запрещён, см. CLAUDE.md).\n *  3. Визуал — текстовые лейблы + опциональная иконка, а не icon-only кнопки.\n *     Иконка остаётся опциональной, чтобы покрыть оба сценария.\n *\n * Компонент \"controlled\" — рендерит сегмент с `value === option.value` как\n * активный, эмиттит `valueChange` при клике, обновление `value` остаётся за\n * потребителем.\n *\n * Generic `<T = string>` сохраняет типизацию по value (`'list' | 'grid'`,\n * union'ы, enum'ы). Дефолт `string` нужен, чтобы шаблон-инстанцирование\n * без явного параметра компилировалось.\n */\n@Component({\n    selector: 'rt-toggle-button-group',\n    templateUrl: './rt-toggle-button-group.component.html',\n    styleUrls: ['./rt-toggle-button-group.component.scss', './rt-toggle-button-group-chips.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    imports: [\n        // angular\n        NgTemplateOutlet,\n\n        // standalone components / directives\n        RtIconComponent,\n        RtTooltipDirective,\n        BlockDirective,\n        ElemDirective,\n        ModDirective,\n    ],\n    providers: [\n        {\n            provide: NG_VALUE_ACCESSOR,\n            useExisting: forwardRef((): typeof RtToggleButtonGroupComponent => RtToggleButtonGroupComponent),\n            multi: true,\n        },\n    ],\n    hostDirectives: [{ directive: RtRadiusDirective, inputs: ['radius'] }],\n    host: {\n        class: BEM_BLOCK,\n        '[class.rt-toggle-button-group--full-width]': 'fullWidth()',\n        '[class.rt-toggle-button-group--wrap]': \"layout() === 'wrap'\",\n        '[class.rt-toggle-button-group--column]': \"layout() === 'column'\",\n        '[class.rt-toggle-button-group--md]': \"size() === 'md'\",\n        '[class.rt-toggle-button-group--lg]': \"size() === 'lg'\",\n        '[class.rt-toggle-button-group--chips]': \"appearance() === 'chips'\",\n    },\n})\nexport class RtToggleButtonGroupComponent<T = string> implements ControlValueAccessor {\n    #onChange: (value: IRtToggleButtonGroup.FormValue<T>) => void = (): void => undefined;\n    #onTouched: () => void = (): void => undefined;\n\n    /** Группа связана с формой: нажатие тогда само переносит подсветку, без ответа хозяина. */\n    #bound: boolean = false;\n\n    /** Значение, записанное формой или нажатием; `undefined`, пока форма ничего не писала. */\n    readonly #formValue: WritableSignal<{ readonly value: IRtToggleButtonGroup.FormValue<T> } | undefined> = signal<\n        { readonly value: IRtToggleButtonGroup.FormValue<T> } | undefined\n    >(undefined);\n\n    /** Отключение, назначенное формой через CVA (`setDisabledState`). */\n    readonly #disabledByForm: WritableSignal<boolean> = signal<boolean>(false);\n\n    /** Выбранное при одиночном выборе: слово формы, если она его сказала, иначе вход. */\n    readonly #single: Signal<T | undefined> = computed((): T | undefined => {\n        const written: { readonly value: IRtToggleButtonGroup.FormValue<T> } | undefined = this.#formValue();\n        if (written === undefined) {\n            return this.value();\n        }\n\n        return isMany(written.value) ? undefined : (written.value ?? undefined);\n    });\n\n    /** Набор выбранного при множественном выборе: слово формы, если она его сказала, иначе вход. */\n    readonly #many: Signal<ReadonlyArray<T>> = computed((): ReadonlyArray<T> => {\n        const written: { readonly value: IRtToggleButtonGroup.FormValue<T> } | undefined = this.#formValue();\n        if (written === undefined) {\n            return this.values();\n        }\n\n        return isMany(written.value) ? written.value : [];\n    });\n\n    protected readonly isDisabled: Signal<boolean> = computed((): boolean => this.disabled() || this.#disabledByForm());\n\n    /** Своя разметка сегмента; без неё кнопка рисует значок и подпись. */\n    protected readonly optionTpl: Signal<RtToggleButtonOptionDirective<T> | undefined> = contentChild(RtToggleButtonOptionDirective);\n\n    protected readonly iconSize: Signal<IRtIcon.Size> = computed((): IRtIcon.Size => ICON_SIZE_BY_SIZE[this.size()]);\n\n    /**\n     * Сегменты, готовые к отрисовке: подсветка и недоступность посчитаны здесь, а не в шаблоне.\n     *\n     * Подсветка читается по-разному в одиночном и множественном выборе, а недоступность приходит\n     * с двух сторон — от группы и от самого сегмента. Признак группы главнее: доступный сегмент\n     * внутри отключённой группы читался бы как её единственное живое место.\n     */\n    protected readonly items: Signal<ReadonlyArray<IRtToggleButtonGroup.Rendered<T>>> = computed(\n        (): ReadonlyArray<IRtToggleButtonGroup.Rendered<T>> => {\n            const multiple: boolean = this.multiple();\n            const chosen: ReadonlyArray<T> = this.#many();\n            const single: T | undefined = this.#single();\n            const groupDisabled: boolean = this.isDisabled();\n\n            return this.options().map((option: IRtToggleButtonGroup.Option<T>): IRtToggleButtonGroup.Rendered<T> => {\n                const active: boolean = multiple ? chosen.includes(option.value) : single === option.value;\n\n                return { option, active, disabled: groupDisabled || !!option.disabled, context: { $implicit: option, active } };\n            });\n        }\n    );\n\n    public readonly options: InputSignal<ReadonlyArray<IRtToggleButtonGroup.Option<T>>> =\n        input.required<ReadonlyArray<IRtToggleButtonGroup.Option<T>>>();\n\n    public readonly value: InputSignal<T | undefined> = input<T | undefined>(undefined);\n\n    /**\n     * Множественный выбор: нажатие добавляет сегмент или снимает его, а не переносит выбор.\n     *\n     * Своим входом, а не расширением типа `value`: вход, у которого тип значения меняется от\n     * значения другого входа, не проверяет ни сборка, ни линтер — потребитель узнаёт о своей\n     * ошибке, когда группа перестаёт подсвечивать выбранное.\n     */\n    public readonly multiple: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    /** Набор выбранного. Читается только при множественном выборе, одиночный берёт `value`. */\n    public readonly values: InputSignal<ReadonlyArray<T>> = input<ReadonlyArray<T>>([]);\n\n    public readonly ariaLabel: InputSignal<string | null> = input<string | null>(null);\n\n    public readonly size: InputSignal<IRtToggleButtonGroup.Size> = input<IRtToggleButtonGroup.Size>('sm');\n\n    public readonly disabled: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    /** Растягивает группу на всю ширину контейнера; опции делят ширину поровну. */\n    public readonly fullWidth: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    /**\n     * Раскладка сегментов: одна строка, перенос на следующую или столбик. Перенос нужен длинным\n     * спискам во всплывающих окнах, столбик — спискам вроде дней недели.\n     */\n    public readonly layout: InputSignal<IRtToggleButtonGroup.Layout> = input<IRtToggleButtonGroup.Layout>('row');\n\n    /**\n     * Вид группы: дорожка с сегментами или отдельные чипы. Вид — входом, а не классом потребителя:\n     * у чипов своя коробка пункта, свой просвет и своя подсветка, и класс снаружи до неё не достаёт.\n     */\n    public readonly appearance: InputSignal<IRtToggleButtonGroup.Appearance> = input<IRtToggleButtonGroup.Appearance>('segmented');\n\n    /**\n     * Галочка перед подписью выбранного пункта, как у фильтр-чипа Material. Выключена по умолчанию:\n     * в сегментах выбор и так виден подложкой, а место под галочку раздвигает пункт.\n     */\n    public readonly checkmark: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    public readonly valueChange: OutputEmitterRef<T> = output<T>();\n\n    /**\n     * Весь набор выбранного после нажатия, а не разница с прежним: разницу вызывающий сводит со\n     * своим состоянием сам, и каждый сводит по-своему.\n     */\n    public readonly valuesChange: OutputEmitterRef<ReadonlyArray<T>> = output<ReadonlyArray<T>>();\n\n    public writeValue(value: IRtToggleButtonGroup.FormValue<T>): void {\n        this.#formValue.set({ value });\n    }\n\n    public registerOnChange(fn: (value: IRtToggleButtonGroup.FormValue<T>) => void): void {\n        this.#bound = true;\n        this.#onChange = fn;\n    }\n\n    public registerOnTouched(fn: () => void): void {\n        this.#onTouched = fn;\n    }\n\n    public setDisabledState(disabled: boolean): void {\n        this.#disabledByForm.set(disabled);\n    }\n\n    protected onOptionClick(item: IRtToggleButtonGroup.Rendered<T>): void {\n        if (item.disabled) {\n            return;\n        }\n\n        const option: IRtToggleButtonGroup.Option<T> = item.option;\n\n        if (!this.multiple()) {\n            this.#commit(option.value);\n            this.valueChange.emit(option.value);\n\n            return;\n        }\n\n        const chosen: ReadonlyArray<T> = this.#many();\n        const next: T[] = chosen.includes(option.value)\n            ? chosen.filter((one: T): boolean => one !== option.value)\n            : [...chosen, option.value];\n\n        this.#commit(next);\n        this.valuesChange.emit(next);\n    }\n\n    /** Нажатие уходит в форму, если группа с ней связана; без формы подсветку ведёт хозяин входами. */\n    #commit(value: IRtToggleButtonGroup.FormValue<T>): void {\n        if (!this.#bound) {\n            return;\n        }\n        this.#formValue.set({ value });\n        this.#onChange(value);\n        this.#onTouched();\n    }\n}\n","<div\n    rtBlock=\"rt-toggle-button-group\"\n    role=\"group\"\n    [rtMod]=\"{\n        sm: size() === 'sm',\n        md: size() === 'md',\n        lg: size() === 'lg',\n        disabled: isDisabled(),\n        wrap: layout() === 'wrap',\n        column: layout() === 'column',\n        chips: appearance() === 'chips',\n    }\"\n    [attr.aria-label]=\"ariaLabel()\">\n    @for (item of items(); track item.option.value) {\n        <button\n            type=\"button\"\n            rtElem=\"button\"\n            qa-dataid=\"toggle-button-group-option\"\n            [attr.data-value]=\"item.option.value\"\n            [rtMod]=\"{\n                active: item.active,\n                first: $first,\n                last: $last,\n                checked: checkmark() && item.active,\n            }\"\n            [disabled]=\"item.disabled\"\n            [attr.aria-pressed]=\"item.active ? 'true' : 'false'\"\n            [rtTooltip]=\"item.option.title ?? ''\"\n            (click)=\"onOptionClick(item)\">\n            @if (checkmark() && item.active) {\n                <span rtElem=\"check\" aria-hidden=\"true\">\n                    <svg rtElem=\"check-svg\" viewBox=\"-2 -3 30 30\" focusable=\"false\">\n                        <path fill=\"none\" stroke=\"currentColor\" d=\"M1.73,12.91 8.1,19.28 22.79,4.59\" />\n                    </svg>\n                </span>\n            }\n            @if (optionTpl(); as tpl) {\n                <ng-container [ngTemplateOutlet]=\"tpl.templateRef\" [ngTemplateOutletContext]=\"item.context\" />\n            } @else {\n                @if (item.option.icon || item.option.glyph) {\n                    <rt-icon\n                        rtElem=\"icon\"\n                        color=\"current\"\n                        [name]=\"item.option.icon ?? null\"\n                        [glyph]=\"item.option.glyph ?? null\"\n                        [size]=\"iconSize()\" />\n                }\n                <span rtElem=\"label\">{{ item.option.label }}</span>\n            }\n        </button>\n    }\n</div>\n"],"mappings":"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"}
+{"version":3,"file":"rt-tools-ui-kit-v2-toggle-button-group.mjs","names":[],"sources":["../../../projects/ui-kit-v2/src/lib/components/toggle-button-group/rt-toggle-button-option.directive.ts","../../../projects/ui-kit-v2/src/lib/components/toggle-button-group/rt-toggle-button-group.component.ts","../../../projects/ui-kit-v2/src/lib/components/toggle-button-group/rt-toggle-button-group.component.html"],"sourcesContent":["import { Directive, inject, TemplateRef } from '@angular/core';\n\nimport { IRtToggleButtonGroup } from './rt-toggle-button-group.model';\n\n/**\n * Маркер своей разметки сегмента — того, что рисуется внутри кнопки на месте значка и подписи.\n *\n * Кнопка остаётся киту: нажатие, подсветка, недоступность, фокус и связь с формой. Потребитель даёт\n * только содержимое — например картинку-превью раскладки — и получает опцию и признак, нажат ли\n * сегмент.\n *\n * @example\n * ```html\n * <rt-toggle-button-group [options]=\"layouts\" formControlName=\"layout\">\n *     <ng-template rtToggleButtonOption let-option let-active=\"active\">\n *         <img [src]=\"option.value + '.svg'\" [alt]=\"option.label\" />\n *     </ng-template>\n * </rt-toggle-button-group>\n * ```\n */\n@Directive({\n    selector: '[rtToggleButtonOption]',\n})\nexport class RtToggleButtonOptionDirective<T = string> {\n    public readonly templateRef: TemplateRef<IRtToggleButtonGroup.OptionContext<T>> =\n        inject<TemplateRef<IRtToggleButtonGroup.OptionContext<T>>>(TemplateRef);\n}\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { NgTemplateOutlet } from '@angular/common';\nimport {\n    booleanAttribute,\n    ChangeDetectionStrategy,\n    Component,\n    computed,\n    contentChild,\n    forwardRef,\n    input,\n    InputSignal,\n    InputSignalWithTransform,\n    output,\n    OutputEmitterRef,\n    signal,\n    Signal,\n    ViewEncapsulation,\n    WritableSignal,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\nimport { BlockDirective, ElemDirective, ModDirective } from '@rt-tools/core';\n\nimport { RtIconComponent } from '@rt-tools/ui-kit-v2/icon';\nimport { IRtIcon } from '@rt-tools/ui-kit-v2/core';\nimport { RtRadiusDirective } from '@rt-tools/ui-kit-v2/radius';\nimport { RtTooltipDirective } from '@rt-tools/ui-kit-v2/tooltip';\nimport { IRtToggleButtonGroup } from './rt-toggle-button-group.model';\nimport { RtToggleButtonOptionDirective } from './rt-toggle-button-option.directive';\n\nconst BEM_BLOCK: string = 'rt-toggle-button-group';\n\n/**\n * Маппинг размера группы на размер вложенной `<rt-icon>`. rt-icon не имеет\n * промежуточных значений (12 / 16 / 20 / 24 / 32), поэтому `lg` тоже едет\n * на `sm` (16px) — ближе к расчётным 18px у rt-button lg, чем md (20px).\n */\nconst ICON_SIZE_BY_SIZE: Readonly<Record<IRtToggleButtonGroup.Size, IRtIcon.Size>> = Object.freeze({\n    sm: 'xs',\n    md: 'sm',\n    lg: 'sm',\n});\n\n/** Форма записала набор, а не одно значение: так пишет множественный выбор. */\nfunction isMany<T>(value: IRtToggleButtonGroup.FormValue<T>): value is ReadonlyArray<T> {\n    return Array.isArray(value);\n}\n\n/**\n * Generic segmented control кита.\n *\n * API `toggle-button-group` с тремя особенностями:\n *  1. BEM через `rtBlock/rtElem/rtMod` (camelCase mods → kebab-case в CSS).\n *  2. Tooltip — нативный `[attr.title]` вместо `MatTooltip` (Angular Material\n *     запрещён, см. CLAUDE.md).\n *  3. Визуал — текстовые лейблы + опциональная иконка, а не icon-only кнопки.\n *     Иконка остаётся опциональной, чтобы покрыть оба сценария.\n *\n * Компонент \"controlled\" — рендерит сегмент с `value === option.value` как\n * активный, эмиттит `valueChange` при клике, обновление `value` остаётся за\n * потребителем.\n *\n * Generic `<T = string>` сохраняет типизацию по value (`'list' | 'grid'`,\n * union'ы, enum'ы). Дефолт `string` нужен, чтобы шаблон-инстанцирование\n * без явного параметра компилировалось.\n */\n@Component({\n    selector: 'rt-toggle-button-group',\n    templateUrl: './rt-toggle-button-group.component.html',\n    styleUrls: ['./rt-toggle-button-group.component.scss', './rt-toggle-button-group-chips.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    imports: [\n        // angular\n        NgTemplateOutlet,\n\n        // standalone components / directives\n        RtIconComponent,\n        RtTooltipDirective,\n        BlockDirective,\n        ElemDirective,\n        ModDirective,\n    ],\n    providers: [\n        {\n            provide: NG_VALUE_ACCESSOR,\n            useExisting: forwardRef((): typeof RtToggleButtonGroupComponent => RtToggleButtonGroupComponent),\n            multi: true,\n        },\n    ],\n    hostDirectives: [{ directive: RtRadiusDirective, inputs: ['radius'] }],\n    host: {\n        class: BEM_BLOCK,\n        '[class.rt-toggle-button-group--full-width]': 'fullWidth()',\n        '[class.rt-toggle-button-group--wrap]': \"layout() === 'wrap'\",\n        '[class.rt-toggle-button-group--column]': \"layout() === 'column'\",\n        '[class.rt-toggle-button-group--md]': \"size() === 'md'\",\n        '[class.rt-toggle-button-group--lg]': \"size() === 'lg'\",\n        '[class.rt-toggle-button-group--chips]': \"appearance() === 'chips'\",\n    },\n})\nexport class RtToggleButtonGroupComponent<T = string> implements ControlValueAccessor {\n    #onChange: (value: IRtToggleButtonGroup.FormValue<T>) => void = (): void => undefined;\n    #onTouched: () => void = (): void => undefined;\n\n    /** Группа связана с формой: нажатие тогда само переносит подсветку, без ответа хозяина. */\n    #bound: boolean = false;\n\n    /** Значение, записанное формой или нажатием; `undefined`, пока форма ничего не писала. */\n    readonly #formValue: WritableSignal<{ readonly value: IRtToggleButtonGroup.FormValue<T> } | undefined> = signal<\n        { readonly value: IRtToggleButtonGroup.FormValue<T> } | undefined\n    >(undefined);\n\n    /** Отключение, назначенное формой через CVA (`setDisabledState`). */\n    readonly #disabledByForm: WritableSignal<boolean> = signal<boolean>(false);\n\n    /** Выбранное при одиночном выборе: слово формы, если она его сказала, иначе вход. */\n    readonly #single: Signal<T | undefined> = computed((): T | undefined => {\n        const written: { readonly value: IRtToggleButtonGroup.FormValue<T> } | undefined = this.#formValue();\n        if (written === undefined) {\n            return this.value();\n        }\n\n        return isMany(written.value) ? undefined : (written.value ?? undefined);\n    });\n\n    /** Набор выбранного при множественном выборе: слово формы, если она его сказала, иначе вход. */\n    readonly #many: Signal<ReadonlyArray<T>> = computed((): ReadonlyArray<T> => {\n        const written: { readonly value: IRtToggleButtonGroup.FormValue<T> } | undefined = this.#formValue();\n        if (written === undefined) {\n            return this.values();\n        }\n\n        return isMany(written.value) ? written.value : [];\n    });\n\n    protected readonly isDisabled: Signal<boolean> = computed((): boolean => this.disabled() || this.#disabledByForm());\n\n    /** Своя разметка сегмента; без неё кнопка рисует значок и подпись. */\n    protected readonly optionTpl: Signal<RtToggleButtonOptionDirective<T> | undefined> = contentChild(RtToggleButtonOptionDirective);\n\n    protected readonly iconSize: Signal<IRtIcon.Size> = computed((): IRtIcon.Size => ICON_SIZE_BY_SIZE[this.size()]);\n\n    /**\n     * Сегменты, готовые к отрисовке: подсветка и недоступность посчитаны здесь, а не в шаблоне.\n     *\n     * Подсветка читается по-разному в одиночном и множественном выборе, а недоступность приходит\n     * с двух сторон — от группы и от самого сегмента. Признак группы главнее: доступный сегмент\n     * внутри отключённой группы читался бы как её единственное живое место.\n     */\n    protected readonly items: Signal<ReadonlyArray<IRtToggleButtonGroup.Rendered<T>>> = computed(\n        (): ReadonlyArray<IRtToggleButtonGroup.Rendered<T>> => {\n            const multiple: boolean = this.multiple();\n            const chosen: ReadonlyArray<T> = this.#many();\n            const single: T | undefined = this.#single();\n            const groupDisabled: boolean = this.isDisabled();\n\n            return this.options().map((option: IRtToggleButtonGroup.Option<T>): IRtToggleButtonGroup.Rendered<T> => {\n                const active: boolean = multiple ? chosen.includes(option.value) : single === option.value;\n\n                return { option, active, disabled: groupDisabled || !!option.disabled, context: { $implicit: option, active } };\n            });\n        }\n    );\n\n    public readonly options: InputSignal<ReadonlyArray<IRtToggleButtonGroup.Option<T>>> =\n        input.required<ReadonlyArray<IRtToggleButtonGroup.Option<T>>>();\n\n    public readonly value: InputSignal<T | undefined> = input<T | undefined>(undefined);\n\n    /**\n     * Множественный выбор: нажатие добавляет сегмент или снимает его, а не переносит выбор.\n     *\n     * Своим входом, а не расширением типа `value`: вход, у которого тип значения меняется от\n     * значения другого входа, не проверяет ни сборка, ни линтер — потребитель узнаёт о своей\n     * ошибке, когда группа перестаёт подсвечивать выбранное.\n     */\n    public readonly multiple: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    /** Набор выбранного. Читается только при множественном выборе, одиночный берёт `value`. */\n    public readonly values: InputSignal<ReadonlyArray<T>> = input<ReadonlyArray<T>>([]);\n\n    public readonly ariaLabel: InputSignal<string | null> = input<string | null>(null);\n\n    public readonly size: InputSignal<IRtToggleButtonGroup.Size> = input<IRtToggleButtonGroup.Size>('sm');\n\n    public readonly disabled: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    /** Растягивает группу на всю ширину контейнера; опции делят ширину поровну. */\n    public readonly fullWidth: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    /**\n     * Раскладка сегментов: одна строка, перенос на следующую или столбик. Перенос нужен длинным\n     * спискам во всплывающих окнах, столбик — спискам вроде дней недели.\n     */\n    public readonly layout: InputSignal<IRtToggleButtonGroup.Layout> = input<IRtToggleButtonGroup.Layout>('row');\n\n    /**\n     * Вид группы: дорожка с сегментами или отдельные чипы. Вид — входом, а не классом потребителя:\n     * у чипов своя коробка пункта, свой просвет и своя подсветка, и класс снаружи до неё не достаёт.\n     */\n    public readonly appearance: InputSignal<IRtToggleButtonGroup.Appearance> = input<IRtToggleButtonGroup.Appearance>('segmented');\n\n    /**\n     * Галочка перед подписью выбранного пункта, как у фильтр-чипа Material. Выключена по умолчанию:\n     * в сегментах выбор и так виден подложкой, а место под галочку раздвигает пункт.\n     */\n    public readonly checkmark: InputSignalWithTransform<boolean, BooleanInput> = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute,\n    });\n\n    public readonly valueChange: OutputEmitterRef<T> = output<T>();\n\n    /**\n     * Весь набор выбранного после нажатия, а не разница с прежним: разницу вызывающий сводит со\n     * своим состоянием сам, и каждый сводит по-своему.\n     */\n    public readonly valuesChange: OutputEmitterRef<ReadonlyArray<T>> = output<ReadonlyArray<T>>();\n\n    public writeValue(value: IRtToggleButtonGroup.FormValue<T>): void {\n        this.#formValue.set({ value });\n    }\n\n    public registerOnChange(fn: (value: IRtToggleButtonGroup.FormValue<T>) => void): void {\n        this.#bound = true;\n        this.#onChange = fn;\n    }\n\n    public registerOnTouched(fn: () => void): void {\n        this.#onTouched = fn;\n    }\n\n    public setDisabledState(disabled: boolean): void {\n        this.#disabledByForm.set(disabled);\n    }\n\n    protected onOptionClick(item: IRtToggleButtonGroup.Rendered<T>): void {\n        if (item.disabled) {\n            return;\n        }\n\n        const option: IRtToggleButtonGroup.Option<T> = item.option;\n\n        if (!this.multiple()) {\n            this.#commit(option.value);\n            this.valueChange.emit(option.value);\n\n            return;\n        }\n\n        const chosen: ReadonlyArray<T> = this.#many();\n        const next: T[] = chosen.includes(option.value)\n            ? chosen.filter((one: T): boolean => one !== option.value)\n            : [...chosen, option.value];\n\n        this.#commit(next);\n        this.valuesChange.emit(next);\n    }\n\n    /** Нажатие уходит в форму, если группа с ней связана; без формы подсветку ведёт хозяин входами. */\n    #commit(value: IRtToggleButtonGroup.FormValue<T>): void {\n        if (!this.#bound) {\n            return;\n        }\n        this.#formValue.set({ value });\n        this.#onChange(value);\n        this.#onTouched();\n    }\n}\n","<div\n    rtBlock=\"rt-toggle-button-group\"\n    role=\"group\"\n    [rtMod]=\"{\n        sm: size() === 'sm',\n        md: size() === 'md',\n        lg: size() === 'lg',\n        disabled: isDisabled(),\n        wrap: layout() === 'wrap',\n        column: layout() === 'column',\n        chips: appearance() === 'chips',\n    }\"\n    [attr.aria-label]=\"ariaLabel()\">\n    @for (item of items(); track item.option.value) {\n        <button\n            type=\"button\"\n            rtElem=\"button\"\n            qa-dataid=\"toggle-button-group-option\"\n            [attr.data-value]=\"item.option.value\"\n            [rtMod]=\"{\n                active: item.active,\n                first: $first,\n                last: $last,\n                checked: checkmark() && item.active,\n            }\"\n            [disabled]=\"item.disabled\"\n            [attr.aria-pressed]=\"item.active ? 'true' : 'false'\"\n            [rtTooltip]=\"item.option.title ?? ''\"\n            (click)=\"onOptionClick(item)\">\n            @if (checkmark() && item.active) {\n                <span rtElem=\"check\" aria-hidden=\"true\">\n                    <svg rtElem=\"check-svg\" viewBox=\"-2 -3 30 30\" focusable=\"false\">\n                        <path fill=\"none\" stroke=\"currentColor\" d=\"M1.73,12.91 8.1,19.28 22.79,4.59\" />\n                    </svg>\n                </span>\n            }\n            @if (optionTpl(); as tpl) {\n                <ng-container [ngTemplateOutlet]=\"tpl.templateRef\" [ngTemplateOutletContext]=\"item.context\" />\n            } @else {\n                @if (item.option.icon || item.option.glyph) {\n                    <rt-icon\n                        rtElem=\"icon\"\n                        color=\"current\"\n                        [name]=\"item.option.icon ?? null\"\n                        [glyph]=\"item.option.glyph ?? null\"\n                        [size]=\"iconSize()\" />\n                }\n                <span rtElem=\"label\">{{ item.option.label }}</span>\n            }\n        </button>\n    }\n</div>\n"],"mappings":"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"}

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

@@ -5,6 +5,7 @@ import { hasModifierKey } from "@angular/cdk/keycodes";
 import { Overlay, OverlayConfig, ScrollStrategyOptions } from "@angular/cdk/overlay";
 import { ComponentPortal } from "@angular/cdk/portal";
 import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
+import { Subject, filter, switchMap } from "rxjs";
 import { carryThemeScope, materialPresetClassesOf, rtKitDefault } from "@rt-tools/ui-kit-v2/core";
 const BEM_BLOCK = "rt-tooltip";
 var RtTooltipComponent = class RtTooltipComponent {
@@ -127,6 +128,7 @@ var RtTooltipDirective = class RtTooltipDirective {
 	#overlayRef;
 	#tooltipRef;
 	#showTimer;
+	#overlaySource;
 	#placementDefault;
 	#showDelayDefault;
 	constructor() {
@@ -137,6 +139,7 @@ var RtTooltipDirective = class RtTooltipDirective {
 		this.#overlayRef = null;
 		this.#tooltipRef = null;
 		this.#showTimer = null;
+		this.#overlaySource = new Subject();
 		this.#placementDefault = rtKitDefault("tooltip", (it) => it.placement, null);
 		this.#showDelayDefault = rtKitDefault("tooltip", (it) => it.showDelay, SHOW_DELAY_MS);
 		this.text = input("", {
@@ -166,10 +169,16 @@ var RtTooltipDirective = class RtTooltipDirective {
 			alias: "rtTooltipHideOnClick",
 			transform: booleanAttribute
 		});
+		this.showOnTap = input(false, {
+			...ngDevMode ? { debugName: "showOnTap" } : /* istanbul ignore next */ {},
+			alias: "rtTooltipShowOnTap",
+			transform: booleanAttribute
+		});
 		effect(() => this.#syncText(this.text()));
 		this.#focusMonitor.monitor(this.#elementRef, true).pipe(takeUntilDestroyed()).subscribe((origin) => {
 			if (origin === "keyboard") this.show();
 		});
+		this.#overlaySource.pipe(switchMap((overlayRef) => overlayRef.outsidePointerEvents()), filter((event) => this.showOnTap() && !this.#isOnHost(event.target)), takeUntilDestroyed()).subscribe(() => this.hide());
 	}
 	ngOnDestroy() {
 		this.#focusMonitor.stopMonitoring(this.#elementRef);
@@ -187,6 +196,10 @@ var RtTooltipDirective = class RtTooltipDirective {
 		this.#tooltipRef = null;
 	}
 	onClick() {
+		if (this.showOnTap()) {
+			this.#toggleNow();
+			return;
+		}
 		if (this.hideOnClick() || this.#tooltipRef === null) this.hide();
 	}
 	onKeydown(event) {
@@ -198,6 +211,14 @@ var RtTooltipDirective = class RtTooltipDirective {
 			event.stopPropagation();
 		}
 	}
+	#isOnHost(target) {
+		return target instanceof Node && this.#elementRef.nativeElement.contains(target);
+	}
+	#toggleNow() {
+		const wasOpen = this.#tooltipRef !== null;
+		this.hide();
+		if (!wasOpen) this.#attach();
+	}
 	#syncText(text) {
 		if (this.#tooltipRef === null) return;
 		if (text.trim() === "") {
@@ -229,6 +250,7 @@ var RtTooltipDirective = class RtTooltipDirective {
 			panelClass: ["rt-tooltip-panel", ...presetClasses]
 		});
 		this.#overlayRef = this.#overlay.create(config);
+		this.#overlaySource.next(this.#overlayRef);
 		return this.#overlayRef;
 	}
 	#clearTimer() {
@@ -294,6 +316,13 @@ var RtTooltipDirective = class RtTooltipDirective {
 					isSignal: true,
 					isRequired: false,
 					transformFunction: null
+				},
+				showOnTap: {
+					classPropertyName: "showOnTap",
+					publicName: "rtTooltipShowOnTap",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
 				}
 			},
 			host: { listeners: {
@@ -368,6 +397,14 @@ i0.ɵɵngDeclareClassMetadata({
 				alias: "rtTooltipHideOnClick",
 				required: false
 			}]
+		}],
+		showOnTap: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "rtTooltipShowOnTap",
+				required: false
+			}]
 		}]
 	}
 });