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

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

@@ -1,7 +1,158 @@
-import { NgTemplateOutlet } from "@angular/common";
+import { InteractivityChecker } from "@angular/cdk/a11y";
+import { DOCUMENT, NgTemplateOutlet } from "@angular/common";
 import * as i0 from "@angular/core";
-import { ChangeDetectionStrategy, Component, Directive, TemplateRef, ViewEncapsulation, booleanAttribute, contentChild, input } from "@angular/core";
+import { ChangeDetectionStrategy, Component, Directive, ElementRef, Injector, TemplateRef, ViewEncapsulation, afterNextRender, booleanAttribute, computed, contentChild, effect, inject, input, output, untracked } from "@angular/core";
+import { firstValueFrom } from "rxjs";
 import { BlockDirective, ElemDirective, ModDirective } from "@rt-tools/core";
+import { BreakpointsService, rtKitLabel } from "@rt-tools/ui-kit-v2/core";
+import { RT_ASIDE_DATA, RtAsideComponent, RtAsideFooterComponent, RtAsideHeaderComponent, RtAsideRef, RtAsideService } from "@rt-tools/ui-kit-v2/aside";
+import { RtIconButtonComponent } from "@rt-tools/ui-kit-v2/icon-button";
+import { RtButtonDirective } from "@rt-tools/ui-kit-v2/button";
+const BEM_BLOCK$1 = "rt-toolbar-filters-aside";
+var RtToolbarFiltersAsideComponent = class RtToolbarFiltersAsideComponent {
+	constructor() {
+		this.#asideRef = inject(RtAsideRef);
+		this.data = inject(RT_ASIDE_DATA);
+		this.title = rtKitLabel("uiFilters");
+		this.resetLabel = rtKitLabel("uiReset");
+		this.applyLabel = rtKitLabel("uiApply");
+	}
+	#asideRef;
+	onReset() {
+		this.data.reset();
+	}
+	onApply() {
+		this.data.apply();
+		this.#asideRef.close();
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: RtToolbarFiltersAsideComponent,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: RtToolbarFiltersAsideComponent,
+			isStandalone: true,
+			selector: "rt-toolbar-filters-aside",
+			host: { classAttribute: "rt-toolbar-filters-aside" },
+			ngImport: i0,
+			template: "<rt-aside size=\"sm\" trapFocus modal [ariaLabel]=\"title()\">\n    <rt-aside-header [title]=\"title()\" />\n\n    <ng-container rtBlock=\"rt-toolbar-filters-aside\">\n        <!-- Начальный фокус — на блоке полей, а не на стрелке: рамка фокуса не встаёт на кнопку, которую не нажимали -->\n        <div rtElem=\"fields\" qa-dataid=\"toolbar-filters-fields\" tabindex=\"-1\" cdkFocusInitial>\n            <ng-container [ngTemplateOutlet]=\"data.template\" [ngTemplateOutletContext]=\"{ $implicit: 'panel' }\" />\n        </div>\n    </ng-container>\n\n    <rt-aside-footer [phoneCloseLabel]=\"false\">\n        <button rtButton asideDismiss qa-dataid=\"toolbar-filters-reset\" type=\"button\" [label]=\"resetLabel()\" (click)=\"onReset()\">\n            <!-- empty: label is drawn by the directive -->\n        </button>\n        <button rtButton asidePrimary qa-dataid=\"toolbar-filters-apply\" type=\"button\" [label]=\"applyLabel()\" (click)=\"onApply()\">\n            <!-- empty: label is drawn by the directive -->\n        </button>\n    </rt-aside-footer>\n</rt-aside>\n",
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-toolbar-filters-aside{--rt-toolbar-filters-aside-gap: var(--rt-space-md)}.rt-toolbar-filters-aside__fields{display:flex;flex-direction:column;gap:var(--rt-toolbar-filters-aside-gap)}.rt-toolbar-filters-aside__fields:focus{outline:none}.rt-toolbar-filters-aside__fields>*{width:100%}}\n"],
+			dependencies: [
+				{
+					kind: "directive",
+					type: NgTemplateOutlet,
+					selector: "[ngTemplateOutlet]",
+					inputs: [
+						"ngTemplateOutletContext",
+						"ngTemplateOutlet",
+						"ngTemplateOutletInjector"
+					]
+				},
+				{
+					kind: "component",
+					type: RtAsideComponent,
+					selector: "rt-aside",
+					inputs: [
+						"size",
+						"contentLayout",
+						"width",
+						"ariaLabel",
+						"requestError",
+						"trapFocus",
+						"modal",
+						"pending"
+					]
+				},
+				{
+					kind: "component",
+					type: RtAsideFooterComponent,
+					selector: "rt-aside-footer",
+					inputs: ["phoneCloseLabel"]
+				},
+				{
+					kind: "component",
+					type: RtAsideHeaderComponent,
+					selector: "rt-aside-header",
+					inputs: [
+						"title",
+						"overline",
+						"subtitle",
+						"badges",
+						"closable",
+						"loading"
+					],
+					outputs: ["dismiss"]
+				},
+				{
+					kind: "directive",
+					type: BlockDirective,
+					selector: "[rtBlock]",
+					inputs: ["rtMod"]
+				},
+				{
+					kind: "directive",
+					type: ElemDirective,
+					selector: "[rtElem]",
+					inputs: ["rtMod"]
+				},
+				{
+					kind: "directive",
+					type: RtButtonDirective,
+					selector: "button[rtButton], a[rtButton]",
+					inputs: [
+						"label",
+						"icon",
+						"iconPos",
+						"theme",
+						"appearance",
+						"size",
+						"loading",
+						"loadingIcon",
+						"loadingLabel",
+						"pressed"
+					]
+				}
+			],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush,
+			encapsulation: i0.ViewEncapsulation.None
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: RtToolbarFiltersAsideComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "rt-toolbar-filters-aside",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			encapsulation: ViewEncapsulation.None,
+			imports: [
+				NgTemplateOutlet,
+				RtAsideComponent,
+				RtAsideFooterComponent,
+				RtAsideHeaderComponent,
+				BlockDirective,
+				ElemDirective,
+				RtButtonDirective
+			],
+			host: { class: BEM_BLOCK$1 },
+			template: "<rt-aside size=\"sm\" trapFocus modal [ariaLabel]=\"title()\">\n    <rt-aside-header [title]=\"title()\" />\n\n    <ng-container rtBlock=\"rt-toolbar-filters-aside\">\n        <!-- Начальный фокус — на блоке полей, а не на стрелке: рамка фокуса не встаёт на кнопку, которую не нажимали -->\n        <div rtElem=\"fields\" qa-dataid=\"toolbar-filters-fields\" tabindex=\"-1\" cdkFocusInitial>\n            <ng-container [ngTemplateOutlet]=\"data.template\" [ngTemplateOutletContext]=\"{ $implicit: 'panel' }\" />\n        </div>\n    </ng-container>\n\n    <rt-aside-footer [phoneCloseLabel]=\"false\">\n        <button rtButton asideDismiss qa-dataid=\"toolbar-filters-reset\" type=\"button\" [label]=\"resetLabel()\" (click)=\"onReset()\">\n            <!-- empty: label is drawn by the directive -->\n        </button>\n        <button rtButton asidePrimary qa-dataid=\"toolbar-filters-apply\" type=\"button\" [label]=\"applyLabel()\" (click)=\"onApply()\">\n            <!-- empty: label is drawn by the directive -->\n        </button>\n    </rt-aside-footer>\n</rt-aside>\n",
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-toolbar-filters-aside{--rt-toolbar-filters-aside-gap: var(--rt-space-md)}.rt-toolbar-filters-aside__fields{display:flex;flex-direction:column;gap:var(--rt-toolbar-filters-aside-gap)}.rt-toolbar-filters-aside__fields:focus{outline:none}.rt-toolbar-filters-aside__fields>*{width:100%}}\n"]
+		}]
+	}]
+});
 var RtToolbarLeftDirective = class RtToolbarLeftDirective {
 	static {
 		this.ɵfac = i0.ɵɵngDeclareFactory({
@@ -98,9 +249,68 @@ i0.ɵɵngDeclareClassMetadata({
 		args: [{ selector: "[rtToolbarRight]" }]
 	}]
 });
+var RtToolbarFiltersDirective = class RtToolbarFiltersDirective {
+	static ngTemplateContextGuard(_directive, context) {
+		return true;
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: RtToolbarFiltersDirective,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Directive
+		});
+	}
+	static {
+		this.ɵdir = i0.ɵɵngDeclareDirective({
+			minVersion: "14.0.0",
+			version: "22.2.2",
+			type: RtToolbarFiltersDirective,
+			isStandalone: true,
+			selector: "[rtToolbarFilters]",
+			ngImport: i0
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: RtToolbarFiltersDirective,
+	decorators: [{
+		type: Directive,
+		args: [{ selector: "[rtToolbarFilters]" }]
+	}]
+});
 const BEM_BLOCK = "rt-toolbar";
 var RtToolbarComponent = class RtToolbarComponent {
+	#narrow;
+	#asideService;
+	#injector;
+	#host;
+	#document;
+	#interactivity;
+	#filtersActiveLabel;
+	#filtersRef;
 	constructor() {
+		this.#narrow = inject(BreakpointsService).narrow;
+		this.#asideService = inject(RtAsideService);
+		this.#injector = inject(Injector);
+		this.#host = inject(ElementRef).nativeElement;
+		this.#document = inject(DOCUMENT);
+		this.#interactivity = inject(InteractivityChecker);
+		this.#filtersActiveLabel = rtKitLabel("uiFiltersActive");
+		this.#filtersRef = null;
+		this.filtersLabel = rtKitLabel("uiFilters");
+		this.filtersAriaLabel = computed(() => this.filtersActive() ? this.#filtersActiveLabel() : this.filtersLabel(), ...ngDevMode ? [{ debugName: "filtersAriaLabel" }] : /* istanbul ignore next */ []);
+		this.filtersTpl = contentChild(RtToolbarFiltersDirective, {
+			...ngDevMode ? { debugName: "filtersTpl" } : /* istanbul ignore next */ {},
+			read: TemplateRef
+		});
+		this.collapsed = computed(() => this.filtersTpl() !== void 0 && this.#narrow(), ...ngDevMode ? [{ debugName: "collapsed" }] : /* istanbul ignore next */ []);
+		this.filtersInBar = computed(() => this.filtersTpl() !== void 0 && !this.#narrow(), ...ngDevMode ? [{ debugName: "filtersInBar" }] : /* istanbul ignore next */ []);
 		this.leftTpl = contentChild(RtToolbarLeftDirective, {
 			...ngDevMode ? { debugName: "leftTpl" } : /* istanbul ignore next */ {},
 			read: TemplateRef
@@ -117,6 +327,44 @@ var RtToolbarComponent = class RtToolbarComponent {
 			...ngDevMode ? { debugName: "dense" } : /* istanbul ignore next */ {},
 			transform: booleanAttribute
 		});
+		this.filtersActive = input(false, {
+			...ngDevMode ? { debugName: "filtersActive" } : /* istanbul ignore next */ {},
+			transform: booleanAttribute
+		});
+		this.filtersApply = output();
+		this.filtersReset = output();
+		effect(() => {
+			if (this.filtersInBar()) untracked(() => this.#closeFilters());
+		});
+	}
+	openFilters() {
+		const template = this.filtersTpl();
+		if (template === void 0 || this.#filtersRef !== null) return;
+		const ref = this.#asideService.open(RtToolbarFiltersAsideComponent, {
+			injector: this.#injector,
+			data: {
+				template,
+				reset: () => this.filtersReset.emit(),
+				apply: () => this.filtersApply.emit()
+			},
+			position: "right",
+			backdropClass: "rt-aside-backdrop"
+		});
+		this.#filtersRef = ref;
+		firstValueFrom(ref.afterClosed(), { defaultValue: null }).then(() => {
+			if (this.#filtersRef === ref) this.#filtersRef = null;
+		});
+	}
+	#closeFilters() {
+		if (this.#filtersRef === null) return;
+		const focusInPanel = this.#document.activeElement?.closest("rt-toolbar-filters-aside") != null;
+		this.#filtersRef.close();
+		this.#filtersRef = null;
+		if (focusInPanel) afterNextRender({ write: () => this.#focusBar() }, { injector: this.#injector });
+	}
+	#focusBar() {
+		const place = this.#host.querySelector("[data-slot=\"left\"]") ?? this.#host;
+		Array.from(place.querySelectorAll("*")).find((node) => this.#interactivity.isFocusable(node) && this.#interactivity.isTabbable(node))?.focus();
 	}
 	static {
 		this.ɵfac = i0.ɵɵngDeclareFactory({
@@ -135,18 +383,42 @@ var RtToolbarComponent = class RtToolbarComponent {
 			type: RtToolbarComponent,
 			isStandalone: true,
 			selector: "rt-toolbar",
-			inputs: { dense: {
-				classPropertyName: "dense",
-				publicName: "dense",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			} },
+			inputs: {
+				dense: {
+					classPropertyName: "dense",
+					publicName: "dense",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				filtersActive: {
+					classPropertyName: "filtersActive",
+					publicName: "filtersActive",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				}
+			},
+			outputs: {
+				filtersApply: "filtersApply",
+				filtersReset: "filtersReset"
+			},
 			host: {
-				properties: { "class.rt-toolbar--dense": "dense()" },
+				properties: {
+					"class.rt-toolbar--dense": "dense()",
+					"class.rt-toolbar--filters-collapsed": "collapsed()"
+				},
 				classAttribute: "rt-toolbar"
 			},
 			queries: [
+				{
+					propertyName: "filtersTpl",
+					first: true,
+					predicate: RtToolbarFiltersDirective,
+					descendants: true,
+					read: TemplateRef,
+					isSignal: true
+				},
 				{
 					propertyName: "leftTpl",
 					first: true,
@@ -173,8 +445,8 @@ var RtToolbarComponent = class RtToolbarComponent {
 				}
 			],
 			ngImport: i0,
-			template: "@if (leftTpl() || centerTpl() || rightTpl()) {\n    <ng-container rtBlock=\"rt-toolbar\">\n        <div rtElem=\"bars\">\n            @if (leftTpl()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"left\" [rtMod]=\"{ left: true }\">\n                    <ng-container [ngTemplateOutlet]=\"leftTpl() ?? null\" />\n                </div>\n            }\n\n            @if (centerTpl()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"center\" [rtMod]=\"{ center: true }\">\n                    <ng-container [ngTemplateOutlet]=\"centerTpl() ?? null\" />\n                </div>\n            }\n\n            @if (rightTpl()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"right\" [rtMod]=\"{ right: true }\">\n                    <ng-container [ngTemplateOutlet]=\"rightTpl() ?? null\" />\n                </div>\n            }\n        </div>\n    </ng-container>\n}\n",
-			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-toolbar{--rt-toolbar-padding-top: var(--rt-space-2);--rt-toolbar-padding-bottom: var(--rt-space-2);--rt-toolbar-padding-inline: 0;--rt-toolbar-height: auto;--rt-toolbar-border-bottom: none;--rt-toolbar-gap: var(--rt-space-2);--rt-toolbar-center-justify: flex-end;--rt-toolbar-center-overflow: visible;--rt-toolbar-field-width: var(--rt-size-100);display:block}.rt-toolbar__bars{display:flex;width:100%;min-height:var(--rt-toolbar-height);box-sizing:border-box;flex-direction:row;align-items:center;justify-content:space-between;padding:var(--rt-toolbar-padding-top) var(--rt-toolbar-padding-inline) var(--rt-toolbar-padding-bottom);border-bottom:var(--rt-toolbar-border-bottom);gap:var(--rt-toolbar-gap)}.rt-toolbar__bar{display:flex;align-items:center}.rt-toolbar__bar--left{min-width:0;flex:0 0 auto;gap:var(--rt-space-2)}.rt-toolbar__bar--left>rt-input{width:var(--rt-toolbar-field-width);max-width:100%}.rt-toolbar__bar--center{overflow:var(--rt-toolbar-center-overflow);flex:1 1 auto;justify-content:var(--rt-toolbar-center-justify);gap:var(--rt-space-2)}.rt-toolbar__bar--center rt-input,.rt-toolbar__bar--center rt-select{width:100%}.rt-toolbar__bar--right{flex:0 1 auto;margin-left:auto;gap:var(--rt-space-sm)}.rt-toolbar--dense .rt-toolbar__bar--left{min-width:0;flex:0 1 auto}@container rt-place (width <= 768px){.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bars{flex-direction:column;align-items:stretch;gap:var(--rt-space-sm)}.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar{flex-wrap:wrap}.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--center{justify-content:stretch}.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--right{justify-content:flex-end;margin-left:0}}@media(width<=768px){:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bars{flex-direction:column;align-items:stretch;gap:var(--rt-space-sm)}:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar{flex-wrap:wrap}:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--center{justify-content:stretch}:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--right{justify-content:flex-end;margin-left:0}}}\n"],
+			template: "@if (leftTpl() || centerTpl() || rightTpl() || filtersTpl()) {\n    <ng-container rtBlock=\"rt-toolbar\">\n        <div rtElem=\"bars\">\n            @if (leftTpl() || filtersInBar()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"left\" [rtMod]=\"{ left: true }\">\n                    <ng-container [ngTemplateOutlet]=\"leftTpl() ?? null\" />\n\n                    <!-- На широком месте отборы стоят в полосе сами, после содержимого левой секции -->\n                    @if (filtersInBar()) {\n                        <ng-container [ngTemplateOutlet]=\"filtersTpl() ?? null\" [ngTemplateOutletContext]=\"{ $implicit: 'bar' }\" />\n                    }\n                </div>\n            }\n\n            @if (centerTpl()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"center\" [rtMod]=\"{ center: true }\">\n                    <ng-container [ngTemplateOutlet]=\"centerTpl() ?? null\" />\n                </div>\n            }\n\n            @if (rightTpl() || collapsed()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"right\" [rtMod]=\"{ right: true }\">\n                    <!-- На узком месте отборы уходят за кнопку: она первая в ряду кнопок полосы -->\n                    @if (collapsed()) {\n                        <rt-icon-button\n                            rtElem=\"filters-trigger\"\n                            qa-dataid=\"toolbar-filters-trigger\"\n                            icon=\"filter\"\n                            variant=\"primary\"\n                            [ariaLabel]=\"filtersAriaLabel()\"\n                            [tooltip]=\"filtersLabel()\"\n                            [indicator]=\"filtersActive()\"\n                            (clicked)=\"openFilters()\" />\n                    }\n\n                    <ng-container [ngTemplateOutlet]=\"rightTpl() ?? null\" />\n                </div>\n            }\n        </div>\n    </ng-container>\n}\n",
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-toolbar{--rt-toolbar-padding-top: var(--rt-space-2);--rt-toolbar-padding-bottom: var(--rt-space-2);--rt-toolbar-padding-inline: 0;--rt-toolbar-height: auto;--rt-toolbar-border-bottom: none;--rt-toolbar-gap: var(--rt-space-2);--rt-toolbar-center-justify: flex-end;--rt-toolbar-center-overflow: visible;--rt-toolbar-field-width: var(--rt-size-100);display:block}.rt-toolbar__bars{display:flex;width:100%;min-height:var(--rt-toolbar-height);box-sizing:border-box;flex-direction:row;align-items:center;justify-content:space-between;padding:var(--rt-toolbar-padding-top) var(--rt-toolbar-padding-inline) var(--rt-toolbar-padding-bottom);border-bottom:var(--rt-toolbar-border-bottom);gap:var(--rt-toolbar-gap)}.rt-toolbar__bar{display:flex;align-items:center}.rt-toolbar__bar--left{min-width:0;flex:0 0 auto;gap:var(--rt-space-2)}.rt-toolbar__bar--left>rt-input{width:var(--rt-toolbar-field-width);max-width:100%}.rt-toolbar__bar--center{overflow:var(--rt-toolbar-center-overflow);flex:1 1 auto;justify-content:var(--rt-toolbar-center-justify);gap:var(--rt-space-2)}.rt-toolbar__bar--center rt-input,.rt-toolbar__bar--center rt-select{width:100%}.rt-toolbar__bar--right{flex:0 1 auto;margin-left:auto;gap:var(--rt-space-sm)}.rt-toolbar__filters-trigger{flex-shrink:0}.rt-toolbar--dense .rt-toolbar__bar--left{min-width:0;flex:0 1 auto}@container rt-place (width <= 768px){.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bars{flex-direction:column;align-items:stretch;gap:var(--rt-space-sm)}.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar{flex-wrap:wrap}.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--center{justify-content:stretch}.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--right{justify-content:flex-end;margin-left:0}.rt-toolbar--filters-collapsed:not(.rt-toolbar--dense) .rt-toolbar__bar--right{justify-content:flex-start}}@media(width<=768px){:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bars{flex-direction:column;align-items:stretch;gap:var(--rt-space-sm)}:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar{flex-wrap:wrap}:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--center{justify-content:stretch}:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--right{justify-content:flex-end;margin-left:0}:where(html:not(:has(.rt-container))) .rt-toolbar--filters-collapsed:not(.rt-toolbar--dense) .rt-toolbar__bar--right{justify-content:flex-start}}}\n"],
 			dependencies: [
 				{
 					kind: "directive",
@@ -202,6 +474,33 @@ var RtToolbarComponent = class RtToolbarComponent {
 					kind: "directive",
 					type: ModDirective,
 					selector: "[rtMod]"
+				},
+				{
+					kind: "component",
+					type: RtIconButtonComponent,
+					selector: "rt-icon-button",
+					inputs: [
+						"icon",
+						"glyph",
+						"ariaLabel",
+						"variant",
+						"iconColor",
+						"iconFill",
+						"size",
+						"iconSize",
+						"type",
+						"tooltip",
+						"tooltipHideOnClick",
+						"tabIndex",
+						"loading",
+						"disabled",
+						"active",
+						"expanded",
+						"ariaHaspopup",
+						"link",
+						"indicator"
+					],
+					outputs: ["clicked"]
 				}
 			],
 			changeDetection: i0.ChangeDetectionStrategy.OnPush,
@@ -224,17 +523,27 @@ i0.ɵɵngDeclareClassMetadata({
 				NgTemplateOutlet,
 				BlockDirective,
 				ElemDirective,
-				ModDirective
+				ModDirective,
+				RtIconButtonComponent
 			],
 			host: {
 				class: BEM_BLOCK,
-				"[class.rt-toolbar--dense]": "dense()"
+				"[class.rt-toolbar--dense]": "dense()",
+				"[class.rt-toolbar--filters-collapsed]": "collapsed()"
 			},
-			template: "@if (leftTpl() || centerTpl() || rightTpl()) {\n    <ng-container rtBlock=\"rt-toolbar\">\n        <div rtElem=\"bars\">\n            @if (leftTpl()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"left\" [rtMod]=\"{ left: true }\">\n                    <ng-container [ngTemplateOutlet]=\"leftTpl() ?? null\" />\n                </div>\n            }\n\n            @if (centerTpl()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"center\" [rtMod]=\"{ center: true }\">\n                    <ng-container [ngTemplateOutlet]=\"centerTpl() ?? null\" />\n                </div>\n            }\n\n            @if (rightTpl()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"right\" [rtMod]=\"{ right: true }\">\n                    <ng-container [ngTemplateOutlet]=\"rightTpl() ?? null\" />\n                </div>\n            }\n        </div>\n    </ng-container>\n}\n",
-			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-toolbar{--rt-toolbar-padding-top: var(--rt-space-2);--rt-toolbar-padding-bottom: var(--rt-space-2);--rt-toolbar-padding-inline: 0;--rt-toolbar-height: auto;--rt-toolbar-border-bottom: none;--rt-toolbar-gap: var(--rt-space-2);--rt-toolbar-center-justify: flex-end;--rt-toolbar-center-overflow: visible;--rt-toolbar-field-width: var(--rt-size-100);display:block}.rt-toolbar__bars{display:flex;width:100%;min-height:var(--rt-toolbar-height);box-sizing:border-box;flex-direction:row;align-items:center;justify-content:space-between;padding:var(--rt-toolbar-padding-top) var(--rt-toolbar-padding-inline) var(--rt-toolbar-padding-bottom);border-bottom:var(--rt-toolbar-border-bottom);gap:var(--rt-toolbar-gap)}.rt-toolbar__bar{display:flex;align-items:center}.rt-toolbar__bar--left{min-width:0;flex:0 0 auto;gap:var(--rt-space-2)}.rt-toolbar__bar--left>rt-input{width:var(--rt-toolbar-field-width);max-width:100%}.rt-toolbar__bar--center{overflow:var(--rt-toolbar-center-overflow);flex:1 1 auto;justify-content:var(--rt-toolbar-center-justify);gap:var(--rt-space-2)}.rt-toolbar__bar--center rt-input,.rt-toolbar__bar--center rt-select{width:100%}.rt-toolbar__bar--right{flex:0 1 auto;margin-left:auto;gap:var(--rt-space-sm)}.rt-toolbar--dense .rt-toolbar__bar--left{min-width:0;flex:0 1 auto}@container rt-place (width <= 768px){.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bars{flex-direction:column;align-items:stretch;gap:var(--rt-space-sm)}.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar{flex-wrap:wrap}.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--center{justify-content:stretch}.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--right{justify-content:flex-end;margin-left:0}}@media(width<=768px){:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bars{flex-direction:column;align-items:stretch;gap:var(--rt-space-sm)}:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar{flex-wrap:wrap}:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--center{justify-content:stretch}:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--right{justify-content:flex-end;margin-left:0}}}\n"]
+			template: "@if (leftTpl() || centerTpl() || rightTpl() || filtersTpl()) {\n    <ng-container rtBlock=\"rt-toolbar\">\n        <div rtElem=\"bars\">\n            @if (leftTpl() || filtersInBar()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"left\" [rtMod]=\"{ left: true }\">\n                    <ng-container [ngTemplateOutlet]=\"leftTpl() ?? null\" />\n\n                    <!-- На широком месте отборы стоят в полосе сами, после содержимого левой секции -->\n                    @if (filtersInBar()) {\n                        <ng-container [ngTemplateOutlet]=\"filtersTpl() ?? null\" [ngTemplateOutletContext]=\"{ $implicit: 'bar' }\" />\n                    }\n                </div>\n            }\n\n            @if (centerTpl()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"center\" [rtMod]=\"{ center: true }\">\n                    <ng-container [ngTemplateOutlet]=\"centerTpl() ?? null\" />\n                </div>\n            }\n\n            @if (rightTpl() || collapsed()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"right\" [rtMod]=\"{ right: true }\">\n                    <!-- На узком месте отборы уходят за кнопку: она первая в ряду кнопок полосы -->\n                    @if (collapsed()) {\n                        <rt-icon-button\n                            rtElem=\"filters-trigger\"\n                            qa-dataid=\"toolbar-filters-trigger\"\n                            icon=\"filter\"\n                            variant=\"primary\"\n                            [ariaLabel]=\"filtersAriaLabel()\"\n                            [tooltip]=\"filtersLabel()\"\n                            [indicator]=\"filtersActive()\"\n                            (clicked)=\"openFilters()\" />\n                    }\n\n                    <ng-container [ngTemplateOutlet]=\"rightTpl() ?? null\" />\n                </div>\n            }\n        </div>\n    </ng-container>\n}\n",
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-toolbar{--rt-toolbar-padding-top: var(--rt-space-2);--rt-toolbar-padding-bottom: var(--rt-space-2);--rt-toolbar-padding-inline: 0;--rt-toolbar-height: auto;--rt-toolbar-border-bottom: none;--rt-toolbar-gap: var(--rt-space-2);--rt-toolbar-center-justify: flex-end;--rt-toolbar-center-overflow: visible;--rt-toolbar-field-width: var(--rt-size-100);display:block}.rt-toolbar__bars{display:flex;width:100%;min-height:var(--rt-toolbar-height);box-sizing:border-box;flex-direction:row;align-items:center;justify-content:space-between;padding:var(--rt-toolbar-padding-top) var(--rt-toolbar-padding-inline) var(--rt-toolbar-padding-bottom);border-bottom:var(--rt-toolbar-border-bottom);gap:var(--rt-toolbar-gap)}.rt-toolbar__bar{display:flex;align-items:center}.rt-toolbar__bar--left{min-width:0;flex:0 0 auto;gap:var(--rt-space-2)}.rt-toolbar__bar--left>rt-input{width:var(--rt-toolbar-field-width);max-width:100%}.rt-toolbar__bar--center{overflow:var(--rt-toolbar-center-overflow);flex:1 1 auto;justify-content:var(--rt-toolbar-center-justify);gap:var(--rt-space-2)}.rt-toolbar__bar--center rt-input,.rt-toolbar__bar--center rt-select{width:100%}.rt-toolbar__bar--right{flex:0 1 auto;margin-left:auto;gap:var(--rt-space-sm)}.rt-toolbar__filters-trigger{flex-shrink:0}.rt-toolbar--dense .rt-toolbar__bar--left{min-width:0;flex:0 1 auto}@container rt-place (width <= 768px){.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bars{flex-direction:column;align-items:stretch;gap:var(--rt-space-sm)}.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar{flex-wrap:wrap}.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--center{justify-content:stretch}.rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--right{justify-content:flex-end;margin-left:0}.rt-toolbar--filters-collapsed:not(.rt-toolbar--dense) .rt-toolbar__bar--right{justify-content:flex-start}}@media(width<=768px){:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bars{flex-direction:column;align-items:stretch;gap:var(--rt-space-sm)}:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar{flex-wrap:wrap}:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--center{justify-content:stretch}:where(html:not(:has(.rt-container))) .rt-toolbar:not(.rt-toolbar--dense) .rt-toolbar__bar--right{justify-content:flex-end;margin-left:0}:where(html:not(:has(.rt-container))) .rt-toolbar--filters-collapsed:not(.rt-toolbar--dense) .rt-toolbar__bar--right{justify-content:flex-start}}}\n"]
 		}]
 	}],
+	ctorParameters: () => [],
 	propDecorators: {
+		filtersTpl: [{
+			type: i0.ContentChild,
+			args: [i0.forwardRef(() => RtToolbarFiltersDirective), {
+				read: TemplateRef,
+				isSignal: true
+			}]
+		}],
 		leftTpl: [{
 			type: i0.ContentChild,
 			args: [i0.forwardRef(() => RtToolbarLeftDirective), {
@@ -263,9 +572,25 @@ i0.ɵɵngDeclareClassMetadata({
 				alias: "dense",
 				required: false
 			}]
+		}],
+		filtersActive: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "filtersActive",
+				required: false
+			}]
+		}],
+		filtersApply: [{
+			type: i0.Output,
+			args: ["filtersApply"]
+		}],
+		filtersReset: [{
+			type: i0.Output,
+			args: ["filtersReset"]
 		}]
 	}
 });
-export { RtToolbarCenterDirective, RtToolbarComponent, RtToolbarLeftDirective, RtToolbarRightDirective };
+export { RtToolbarCenterDirective, RtToolbarComponent, RtToolbarFiltersAsideComponent, RtToolbarFiltersDirective, RtToolbarLeftDirective, RtToolbarRightDirective };
 
 //# sourceMappingURL=rt-tools-ui-kit-v2-toolbar.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"rt-tools-ui-kit-v2-toolbar.mjs","names":[],"sources":["../../../projects/ui-kit-v2/src/lib/components/toolbar/rt-toolbar.component.ts","../../../projects/ui-kit-v2/src/lib/components/toolbar/rt-toolbar.component.html"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\nimport {\n    booleanAttribute,\n    ChangeDetectionStrategy,\n    Component,\n    contentChild,\n    Directive,\n    input,\n    InputSignalWithTransform,\n    Signal,\n    TemplateRef,\n    ViewEncapsulation,\n} from '@angular/core';\n\nimport { BlockDirective, ElemDirective, ModDirective } from '@rt-tools/core';\n\n/**\n * Маркер-директива для контента в левой секции тулбара.\n *\n * @example\n * ```html\n * <rt-toolbar>\n *     <ng-template rtToolbarLeft>\n *         <button rtButton label=\"Создать\" />\n *     </ng-template>\n * </rt-toolbar>\n * ```\n */\n@Directive({\n    selector: '[rtToolbarLeft]',\n})\nexport class RtToolbarLeftDirective {}\n\n/**\n * Маркер-директива для контента в центральной секции тулбара.\n *\n * @example\n * ```html\n * <rt-toolbar>\n *     <ng-template rtToolbarCenter>\n *         <span>Заголовок страницы</span>\n *     </ng-template>\n * </rt-toolbar>\n * ```\n */\n@Directive({\n    selector: '[rtToolbarCenter]',\n})\nexport class RtToolbarCenterDirective {}\n\n/**\n * Маркер-директива для контента в правой секции тулбара.\n *\n * @example\n * ```html\n * <rt-toolbar>\n *     <ng-template rtToolbarRight>\n *         <input type=\"search\" placeholder=\"Поиск\" />\n *     </ng-template>\n * </rt-toolbar>\n * ```\n */\n@Directive({\n    selector: '[rtToolbarRight]',\n})\nexport class RtToolbarRightDirective {}\n\n/**\n * Универсальный тулбар с тремя секциями: left, center, right.\n * Секции задаются `<ng-template>` с директивами-маркерами и подставляются через `ngTemplateOutlet`.\n * Каждый модуль/фича подключает `rt-toolbar` в своём layout и наполняет нужные секции.\n *\n * @example\n * ```html\n * <rt-toolbar>\n *     <ng-template rtToolbarLeft>\n *         <button rtButton label=\"Создать\" />\n *         <button rtButton label=\"Удалить\" appearance=\"text\" />\n *     </ng-template>\n *\n *     <ng-template rtToolbarCenter>\n *         <span>Заявки</span>\n *     </ng-template>\n *\n *     <ng-template rtToolbarRight>\n *         <input type=\"search\" [formControl]=\"searchCtrl\" />\n *     </ng-template>\n * </rt-toolbar>\n * ```\n */\nconst BEM_BLOCK: string = 'rt-toolbar';\n\n@Component({\n    selector: 'rt-toolbar',\n    templateUrl: './rt-toolbar.component.html',\n    styleUrls: ['./rt-toolbar.component.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    imports: [\n        // Angular\n        NgTemplateOutlet,\n\n        // standalone components / directives\n        BlockDirective,\n        ElemDirective,\n        ModDirective,\n    ],\n    host: {\n        class: BEM_BLOCK,\n        '[class.rt-toolbar--dense]': 'dense()',\n    },\n})\nexport class RtToolbarComponent {\n    protected readonly leftTpl: Signal<TemplateRef<unknown> | undefined> = contentChild(RtToolbarLeftDirective, { read: TemplateRef });\n\n    protected readonly centerTpl: Signal<TemplateRef<unknown> | undefined> = contentChild(RtToolbarCenterDirective, { read: TemplateRef });\n\n    protected readonly rightTpl: Signal<TemplateRef<unknown> | undefined> = contentChild(RtToolbarRightDirective, { read: TemplateRef });\n\n    /**\n     * Компактная шапка (заголовок + иконки-действия): зоны остаются в одну строку\n     * даже на мобилке. Без этого трёхзонный list-тулбар стекается в колонку на\n     * ≤768px, что для узкой шапки (напр. rt-chat) неверно.\n     */\n    public readonly dense: InputSignalWithTransform<boolean, boolean | string> = input<boolean, boolean | string>(false, {\n        transform: booleanAttribute,\n    });\n}\n","@if (leftTpl() || centerTpl() || rightTpl()) {\n    <ng-container rtBlock=\"rt-toolbar\">\n        <div rtElem=\"bars\">\n            @if (leftTpl()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"left\" [rtMod]=\"{ left: true }\">\n                    <ng-container [ngTemplateOutlet]=\"leftTpl() ?? null\" />\n                </div>\n            }\n\n            @if (centerTpl()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"center\" [rtMod]=\"{ center: true }\">\n                    <ng-container [ngTemplateOutlet]=\"centerTpl() ?? null\" />\n                </div>\n            }\n\n            @if (rightTpl()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"right\" [rtMod]=\"{ right: true }\">\n                    <ng-container [ngTemplateOutlet]=\"rightTpl() ?? null\" />\n                </div>\n            }\n        </div>\n    </ng-container>\n}\n"],"mappings":"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"}
+{"version":3,"file":"rt-tools-ui-kit-v2-toolbar.mjs","names":["BEM_BLOCK"],"sources":["../../../projects/ui-kit-v2/src/lib/components/toolbar/filters-aside/rt-toolbar-filters-aside.component.ts","../../../projects/ui-kit-v2/src/lib/components/toolbar/filters-aside/rt-toolbar-filters-aside.component.html","../../../projects/ui-kit-v2/src/lib/components/toolbar/rt-toolbar.component.ts","../../../projects/ui-kit-v2/src/lib/components/toolbar/rt-toolbar.component.html"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, inject, Signal, ViewEncapsulation } from '@angular/core';\n\nimport { BlockDirective, ElemDirective } from '@rt-tools/core';\n\nimport { rtKitLabel } from '@rt-tools/ui-kit-v2/core';\nimport { RT_ASIDE_DATA, RtAsideComponent, RtAsideFooterComponent, RtAsideHeaderComponent, RtAsideRef } from '@rt-tools/ui-kit-v2/aside';\nimport { RtButtonDirective } from '@rt-tools/ui-kit-v2/button';\nimport { IRtToolbar } from '../rt-toolbar.model';\n\nconst BEM_BLOCK: string = 'rt-toolbar-filters-aside';\n\n/**\n * Панель отборов полосы `rt-toolbar` на узком экране.\n *\n * Её поднимает кнопка фильтров полосы службой боковых панелей кита. В теле — слот\n * `rtToolbarFilters` с контекстом `panel`; шапка — заголовок «Фильтры» и стрелка возврата, без\n * надзаголовка и действий; подвал — «Сбросить» и «Применить» по краям. «Сбросить» сообщает о себе\n * и оставляет панель открытой, «Применить» сообщает и закрывает, стрелка закрывает молча.\n */\n@Component({\n    selector: 'rt-toolbar-filters-aside',\n    templateUrl: './rt-toolbar-filters-aside.component.html',\n    styleUrl: './rt-toolbar-filters-aside.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    imports: [\n        // Angular\n        NgTemplateOutlet,\n\n        // components\n        RtAsideComponent,\n        RtAsideFooterComponent,\n        RtAsideHeaderComponent,\n\n        // directives\n        BlockDirective,\n        ElemDirective,\n        RtButtonDirective,\n    ],\n    host: { class: BEM_BLOCK },\n})\nexport class RtToolbarFiltersAsideComponent {\n    readonly #asideRef: RtAsideRef = inject(RtAsideRef);\n\n    protected readonly data: IRtToolbar.IFiltersPanelData = inject(RT_ASIDE_DATA) as IRtToolbar.IFiltersPanelData;\n\n    protected readonly title: Signal<string> = rtKitLabel('uiFilters');\n    protected readonly resetLabel: Signal<string> = rtKitLabel('uiReset');\n    protected readonly applyLabel: Signal<string> = rtKitLabel('uiApply');\n\n    protected onReset(): void {\n        this.data.reset();\n    }\n\n    protected onApply(): void {\n        this.data.apply();\n        this.#asideRef.close();\n    }\n}\n","<rt-aside size=\"sm\" trapFocus modal [ariaLabel]=\"title()\">\n    <rt-aside-header [title]=\"title()\" />\n\n    <ng-container rtBlock=\"rt-toolbar-filters-aside\">\n        <!-- Начальный фокус — на блоке полей, а не на стрелке: рамка фокуса не встаёт на кнопку, которую не нажимали -->\n        <div rtElem=\"fields\" qa-dataid=\"toolbar-filters-fields\" tabindex=\"-1\" cdkFocusInitial>\n            <ng-container [ngTemplateOutlet]=\"data.template\" [ngTemplateOutletContext]=\"{ $implicit: 'panel' }\" />\n        </div>\n    </ng-container>\n\n    <rt-aside-footer [phoneCloseLabel]=\"false\">\n        <button rtButton asideDismiss qa-dataid=\"toolbar-filters-reset\" type=\"button\" [label]=\"resetLabel()\" (click)=\"onReset()\">\n            <!-- empty: label is drawn by the directive -->\n        </button>\n        <button rtButton asidePrimary qa-dataid=\"toolbar-filters-apply\" type=\"button\" [label]=\"applyLabel()\" (click)=\"onApply()\">\n            <!-- empty: label is drawn by the directive -->\n        </button>\n    </rt-aside-footer>\n</rt-aside>\n","import { InteractivityChecker } from '@angular/cdk/a11y';\nimport { DOCUMENT, NgTemplateOutlet } from '@angular/common';\nimport {\n    afterNextRender,\n    booleanAttribute,\n    ChangeDetectionStrategy,\n    Component,\n    computed,\n    contentChild,\n    Directive,\n    effect,\n    ElementRef,\n    inject,\n    Injector,\n    input,\n    InputSignalWithTransform,\n    output,\n    OutputEmitterRef,\n    Signal,\n    TemplateRef,\n    untracked,\n    ViewEncapsulation,\n} from '@angular/core';\n\nimport { firstValueFrom } from 'rxjs';\n\nimport { BlockDirective, ElemDirective, ModDirective } from '@rt-tools/core';\n\nimport { BreakpointsService, rtKitLabel } from '@rt-tools/ui-kit-v2/core';\nimport { RtAsideRef, RtAsideService } from '@rt-tools/ui-kit-v2/aside';\nimport { RtIconButtonComponent } from '@rt-tools/ui-kit-v2/icon-button';\nimport { RtToolbarFiltersAsideComponent } from './filters-aside/rt-toolbar-filters-aside.component';\nimport { IRtToolbar } from './rt-toolbar.model';\n\n/**\n * Маркер-директива для контента в левой секции тулбара.\n *\n * @example\n * ```html\n * <rt-toolbar>\n *     <ng-template rtToolbarLeft>\n *         <button rtButton label=\"Создать\" />\n *     </ng-template>\n * </rt-toolbar>\n * ```\n */\n@Directive({\n    selector: '[rtToolbarLeft]',\n})\nexport class RtToolbarLeftDirective {}\n\n/**\n * Маркер-директива для контента в центральной секции тулбара.\n *\n * @example\n * ```html\n * <rt-toolbar>\n *     <ng-template rtToolbarCenter>\n *         <span>Заголовок страницы</span>\n *     </ng-template>\n * </rt-toolbar>\n * ```\n */\n@Directive({\n    selector: '[rtToolbarCenter]',\n})\nexport class RtToolbarCenterDirective {}\n\n/**\n * Маркер-директива для контента в правой секции тулбара.\n *\n * @example\n * ```html\n * <rt-toolbar>\n *     <ng-template rtToolbarRight>\n *         <input type=\"search\" placeholder=\"Поиск\" />\n *     </ng-template>\n * </rt-toolbar>\n * ```\n */\n@Directive({\n    selector: '[rtToolbarRight]',\n})\nexport class RtToolbarRightDirective {}\n\n/**\n * Маркер-директива для отборов списка. На широком экране они стоят в левой секции после её\n * содержимого, на узком — за кнопкой фильтров, которая открывает панель отборов. Контекст шаблона\n * — место, где он нарисован: `bar` или `panel`.\n *\n * @example\n * ```html\n * <rt-toolbar [filtersActive]=\"hasFilter()\" (filtersReset)=\"reset()\">\n *     <ng-template rtToolbarFilters let-place>\n *         <rt-select [label]=\"place === 'panel' ? 'Статус' : null\" … />\n *     </ng-template>\n * </rt-toolbar>\n * ```\n */\n@Directive({\n    selector: '[rtToolbarFilters]',\n})\nexport class RtToolbarFiltersDirective {\n    public static ngTemplateContextGuard(\n        _directive: RtToolbarFiltersDirective,\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars -- второй довод стража контекста шаблона стоит только в типе-предикате; убрать его нечем, подпись задаёт каркас\n        context: unknown\n    ): context is IRtToolbar.IFiltersContext {\n        return true;\n    }\n}\n\n/**\n * Универсальный тулбар с тремя секциями: left, center, right.\n * Секции задаются `<ng-template>` с директивами-маркерами и подставляются через `ngTemplateOutlet`.\n * Каждый модуль/фича подключает `rt-toolbar` в своём layout и наполняет нужные секции.\n *\n * @example\n * ```html\n * <rt-toolbar>\n *     <ng-template rtToolbarLeft>\n *         <button rtButton label=\"Создать\" />\n *         <button rtButton label=\"Удалить\" appearance=\"text\" />\n *     </ng-template>\n *\n *     <ng-template rtToolbarCenter>\n *         <span>Заявки</span>\n *     </ng-template>\n *\n *     <ng-template rtToolbarRight>\n *         <input type=\"search\" [formControl]=\"searchCtrl\" />\n *     </ng-template>\n * </rt-toolbar>\n * ```\n */\nconst BEM_BLOCK: string = 'rt-toolbar';\n\n@Component({\n    selector: 'rt-toolbar',\n    templateUrl: './rt-toolbar.component.html',\n    styleUrls: ['./rt-toolbar.component.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    imports: [\n        // Angular\n        NgTemplateOutlet,\n\n        // standalone components / directives\n        BlockDirective,\n        ElemDirective,\n        ModDirective,\n        RtIconButtonComponent,\n    ],\n    host: {\n        class: BEM_BLOCK,\n        '[class.rt-toolbar--dense]': 'dense()',\n        '[class.rt-toolbar--filters-collapsed]': 'collapsed()',\n    },\n})\nexport class RtToolbarComponent {\n    readonly #narrow: Signal<boolean> = inject(BreakpointsService).narrow;\n    readonly #asideService: RtAsideService = inject(RtAsideService);\n    readonly #injector: Injector = inject(Injector);\n    readonly #host: HTMLElement = inject<ElementRef<HTMLElement>>(ElementRef).nativeElement;\n    readonly #document: Document = inject(DOCUMENT);\n    readonly #interactivity: InteractivityChecker = inject(InteractivityChecker);\n    readonly #filtersActiveLabel: Signal<string> = rtKitLabel('uiFiltersActive');\n\n    /** Открытая панель отборов: на широком месте её закрывают, чтобы поля не жили в двух местах. */\n    #filtersRef: RtAsideRef | null = null;\n\n    protected readonly filtersLabel: Signal<string> = rtKitLabel('uiFilters');\n\n    /** Имя кнопки для скринридера: точку в углу он не видит, и включённый отбор назван словами. */\n    protected readonly filtersAriaLabel: Signal<string> = computed((): string =>\n        this.filtersActive() ? this.#filtersActiveLabel() : this.filtersLabel()\n    );\n\n    protected readonly filtersTpl: Signal<TemplateRef<IRtToolbar.IFiltersContext> | undefined> = contentChild(RtToolbarFiltersDirective, {\n        read: TemplateRef,\n    });\n\n    /** Отборы ушли за кнопку: они объявлены, а место узкое. */\n    protected readonly collapsed: Signal<boolean> = computed((): boolean => this.filtersTpl() !== undefined && this.#narrow());\n\n    /** Отборы стоят в левой секции: они объявлены, а место широкое. */\n    protected readonly filtersInBar: Signal<boolean> = computed((): boolean => this.filtersTpl() !== undefined && !this.#narrow());\n\n    protected readonly leftTpl: Signal<TemplateRef<unknown> | undefined> = contentChild(RtToolbarLeftDirective, { read: TemplateRef });\n\n    protected readonly centerTpl: Signal<TemplateRef<unknown> | undefined> = contentChild(RtToolbarCenterDirective, { read: TemplateRef });\n\n    protected readonly rightTpl: Signal<TemplateRef<unknown> | undefined> = contentChild(RtToolbarRightDirective, { read: TemplateRef });\n\n    /**\n     * Компактная шапка (заголовок + иконки-действия): зоны остаются в одну строку\n     * даже на мобилке. Без этого трёхзонный list-тулбар стекается в колонку на\n     * ≤768px, что для узкой шапки (напр. rt-chat) неверно.\n     */\n    public readonly dense: InputSignalWithTransform<boolean, boolean | string> = input<boolean, boolean | string>(false, {\n        transform: booleanAttribute,\n    });\n\n    /** Включён хотя бы один отбор: кнопка фильтров узкого экрана несёт точку в углу значка. */\n    public readonly filtersActive: InputSignalWithTransform<boolean, boolean | string> = input<boolean, boolean | string>(false, {\n        transform: booleanAttribute,\n    });\n\n    /** Нажата «Применить» панели отборов; панель после этого закрыта. */\n    public readonly filtersApply: OutputEmitterRef<void> = output<void>();\n\n    /** Нажата «Сбросить» панели отборов; панель остаётся открытой. */\n    public readonly filtersReset: OutputEmitterRef<void> = output<void>();\n\n    constructor() {\n        // Место расширилось при открытой панели: отборы вернулись в полосу, и второй экземпляр\n        // полей в панели закрывается, иначе одни и те же отборы показаны дважды\n        effect((): void => {\n            if (this.filtersInBar()) {\n                untracked((): void => this.#closeFilters());\n            }\n        });\n    }\n\n    protected openFilters(): void {\n        const template: TemplateRef<IRtToolbar.IFiltersContext> | undefined = this.filtersTpl();\n        // Подложка ловит нажатия только со следующего кадра: второе нажатие до него открыло бы\n        // вторую панель поверх первой\n        if (template === undefined || this.#filtersRef !== null) {\n            return;\n        }\n\n        // Инжектор полосы — хозяин панели: уничтожение полосы закрывает и панель\n        const ref: RtAsideRef = this.#asideService.open<RtToolbarFiltersAsideComponent, IRtToolbar.IFiltersPanelData>(\n            RtToolbarFiltersAsideComponent,\n            {\n                injector: this.#injector,\n                data: {\n                    template,\n                    reset: (): void => this.filtersReset.emit(),\n                    apply: (): void => this.filtersApply.emit(),\n                },\n                position: 'right',\n                backdropClass: 'rt-aside-backdrop',\n            }\n        );\n        this.#filtersRef = ref;\n        // Панель закрывается и сама — «Применить», стрелкой, подложкой: ссылка гаснет вместе с ней\n        void firstValueFrom(ref.afterClosed(), { defaultValue: null }).then((): void => {\n            if (this.#filtersRef === ref) {\n                this.#filtersRef = null;\n            }\n        });\n    }\n\n    #closeFilters(): void {\n        if (this.#filtersRef === null) {\n            return;\n        }\n        // Кнопка, с которой панель открыли, на широком месте уже снята, и вернуть фокус панели\n        // некуда: он уходит в левую секцию полосы, куда вернулись поля отборов\n        const focusInPanel: boolean = this.#document.activeElement?.closest('rt-toolbar-filters-aside') != null;\n        this.#filtersRef.close();\n        this.#filtersRef = null;\n        if (focusInPanel) {\n            afterNextRender({ write: (): void => this.#focusBar() }, { injector: this.#injector });\n        }\n    }\n\n    #focusBar(): void {\n        const place: HTMLElement = this.#host.querySelector<HTMLElement>('[data-slot=\"left\"]') ?? this.#host;\n        const target: HTMLElement | undefined = Array.from(place.querySelectorAll<HTMLElement>('*')).find(\n            (node: HTMLElement): boolean => this.#interactivity.isFocusable(node) && this.#interactivity.isTabbable(node)\n        );\n        target?.focus();\n    }\n}\n","@if (leftTpl() || centerTpl() || rightTpl() || filtersTpl()) {\n    <ng-container rtBlock=\"rt-toolbar\">\n        <div rtElem=\"bars\">\n            @if (leftTpl() || filtersInBar()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"left\" [rtMod]=\"{ left: true }\">\n                    <ng-container [ngTemplateOutlet]=\"leftTpl() ?? null\" />\n\n                    <!-- На широком месте отборы стоят в полосе сами, после содержимого левой секции -->\n                    @if (filtersInBar()) {\n                        <ng-container [ngTemplateOutlet]=\"filtersTpl() ?? null\" [ngTemplateOutletContext]=\"{ $implicit: 'bar' }\" />\n                    }\n                </div>\n            }\n\n            @if (centerTpl()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"center\" [rtMod]=\"{ center: true }\">\n                    <ng-container [ngTemplateOutlet]=\"centerTpl() ?? null\" />\n                </div>\n            }\n\n            @if (rightTpl() || collapsed()) {\n                <div rtElem=\"bar\" qa-dataid=\"toolbar-bar\" data-slot=\"right\" [rtMod]=\"{ right: true }\">\n                    <!-- На узком месте отборы уходят за кнопку: она первая в ряду кнопок полосы -->\n                    @if (collapsed()) {\n                        <rt-icon-button\n                            rtElem=\"filters-trigger\"\n                            qa-dataid=\"toolbar-filters-trigger\"\n                            icon=\"filter\"\n                            variant=\"primary\"\n                            [ariaLabel]=\"filtersAriaLabel()\"\n                            [tooltip]=\"filtersLabel()\"\n                            [indicator]=\"filtersActive()\"\n                            (clicked)=\"openFilters()\" />\n                    }\n\n                    <ng-container [ngTemplateOutlet]=\"rightTpl() ?? null\" />\n                </div>\n            }\n        </div>\n    </ng-container>\n}\n"],"mappings":";;;;;;;;;;AAUA,MAAMA,cAAoB;AAgC1B,IAAa,iCAAb,MAAa,+BAA8B;CAtB3C,cAAA;EAuBa,KAAA,YAAwB,OAAO,UAAU;EAE/B,KAAA,OAAqC,OAAO,aAAa;EAEzD,KAAA,QAAwB,WAAW,WAAW;EAC9C,KAAA,aAA6B,WAAW,SAAS;EACjD,KAAA,aAA6B,WAAW,SAAS;CAUvE;CAhBY;CAQC,UAAO;EACb,KAAK,KAAK,MAAK;CACnB;CAEU,UAAO;EACb,KAAK,KAAK,MAAK;EACf,KAAK,UAAU,MAAK;CACxB;CAhBS;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAA8B,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAA9B;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAA8B,cAAA;GAAA,UAAA;GAAA,MAAA,EAAA,gBAAA,2BAAA;GAAA,UAAA;GAAA,UC1C3C;GAmBA,QAAA,CAAA,+UAAA;GAAA,cAAA;IAAA;KAAA,MAAA;KAAA,MDSQ;KAAgB,UAAA;KAAA,QAAA;MAAA;MAAA;MAAA;KAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MAGhB;KAAgB,UAAA;KAAA,QAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;KAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MAChB;KAAsB,UAAA;KAAA,QAAA,CAAA,iBAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACtB;KAAsB,UAAA;KAAA,QAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;KAAA;KAAA,SAAA,CAAA,SAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MAGtB;KAAc,UAAA;KAAA,QAAA,CAAA,OAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACd;KAAa,UAAA;KAAA,QAAA,CAAA,OAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACb;KAAiB,UAAA;KAAA,QAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;KAAA;IAAA;GAAA;GAAA,iBAAA,GAAA,wBAAA;GAAA,eAAA,GAAA,kBAAA;EAAA,CAAA;CAAA;;AAIZ,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAA8B,YAAA,CAAA;EAtB1C,MAAA;EACa,MAAA,CAAA;GAAA,UAAA;GAA0B,iBAGnB,wBAAwB;GAAM,eAChC,kBAAkB;GAAI,SAC5B;IAEL;IAGA;IACA;IACA;IAGA;IACA;IACA;GACH;GAAA,MACK,EAAE,OAAOA,YAAS;GAAE,UAAA;GAAA,QAAA,CAAA,+UAAA;EAAA,CAAA;;;AES9B,IAAa,yBAAb,MAAa,uBAAsB;CAAtB;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAsB,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAAtB;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAsB,cAAA;GAAA,UAAA;GAAA,UAAA;EAAA,CAAA;CAAA;;AAAtB,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAsB,YAAA,CAAA;EAHlC,MAAA;EAAU,MAAA,CAAA,EACP,UAAU,kBACb,CAAA;;;AAkBD,IAAa,2BAAb,MAAa,yBAAwB;CAAxB;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAwB,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAAxB;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAwB,cAAA;GAAA,UAAA;GAAA,UAAA;EAAA,CAAA;CAAA;;AAAxB,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAwB,YAAA,CAAA;EAHpC,MAAA;EAAU,MAAA,CAAA,EACP,UAAU,oBACb,CAAA;;;AAkBD,IAAa,0BAAb,MAAa,wBAAuB;CAAvB;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAuB,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAAvB;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAuB,cAAA;GAAA,UAAA;GAAA,UAAA;EAAA,CAAA;CAAA;;AAAvB,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAuB,YAAA,CAAA;EAHnC,MAAA;EAAU,MAAA,CAAA,EACP,UAAU,mBACb,CAAA;;;AAoBD,IAAa,4BAAb,MAAa,0BAAyB;CAC3B,OAAO,uBACV,YAEA,SAAgB;EAEhB,OAAO;CACX;CAPS;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAyB,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAAzB;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAyB,cAAA;GAAA,UAAA;GAAA,UAAA;EAAA,CAAA;CAAA;;AAAzB,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAyB,YAAA,CAAA;EAHrC,MAAA;EAAU,MAAA,CAAA,EACP,UAAU,qBACb,CAAA;;;AAkCD,MAAM,YAAoB;AAwB1B,IAAa,qBAAb,MAAa,mBAAkB;CAClB;CACA;CACA;CACA;CACA;CACA;CACA;CAGT;CA6CA,cAAA;EAtDS,KAAA,UAA2B,OAAO,kBAAkB,CAAC,CAAC;EACtD,KAAA,gBAAgC,OAAO,cAAc;EACrD,KAAA,YAAsB,OAAO,QAAQ;EACrC,KAAA,QAAqB,OAAgC,UAAU,CAAC,CAAC;EACjE,KAAA,YAAsB,OAAO,QAAQ;EACrC,KAAA,iBAAuC,OAAO,oBAAoB;EAClE,KAAA,sBAAsC,WAAW,iBAAiB;EAG3E,KAAA,cAAiC;EAEd,KAAA,eAA+B,WAAW,WAAW;EAGrD,KAAA,mBAAmC,eAClD,KAAK,cAAa,IAAK,KAAK,oBAAmB,IAAK,KAAK,aAAY,GACxE,GAAA,YAAA,CAAA,EAAA,WAAA,mBAAA,CAAA,+BAAA,CAAA,CAAA;EAEkB,KAAA,aAA0E,aAAa,2BAAyB;GAAA,GAAA,YAAA,EAAA,WAAA,aAAA,+BAAA,CAAA;GAC/H,MAAM;EAAW,CAAA;EAIF,KAAA,YAA6B,eAAwB,KAAK,WAAU,MAAO,UAAa,KAAK,QAAO,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,YAAA,CAAA,+BAAA,CAAA,CAAA;EAGvG,KAAA,eAAgC,eAAwB,KAAK,WAAU,MAAO,UAAa,CAAC,KAAK,QAAO,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,eAAA,CAAA,+BAAA,CAAA,CAAA;EAE3G,KAAA,UAAoD,aAAa,wBAAsB;GAAA,GAAA,YAAA,EAAA,WAAA,UAAA,+BAAA,CAAA;GAAI,MAAM;EAAW,CAAA;EAE5G,KAAA,YAAsD,aAAa,0BAAwB;GAAA,GAAA,YAAA,EAAA,WAAA,YAAA,+BAAA,CAAA;GAAI,MAAM;EAAW,CAAA;EAEhH,KAAA,WAAqD,aAAa,yBAAuB;GAAA,GAAA,YAAA,EAAA,WAAA,WAAA,+BAAA,CAAA;GAAI,MAAM;EAAW,CAAA;EAOjH,KAAA,QAA6D,MAAiC,OAAK;GAAA,GAAA,YAAA,EAAA,WAAA,QAAA,+BAAA,CAAA;GAC/G,WAAW;EAAgB,CAAA;EAIf,KAAA,gBAAqE,MAAiC,OAAK;GAAA,GAAA,YAAA,EAAA,WAAA,gBAAA,+BAAA,CAAA;GACvH,WAAW;EAAgB,CAAA;EAIf,KAAA,eAAuC,OAAM;EAG7C,KAAA,eAAuC,OAAM;EAKzD,aAAkB;GACd,IAAI,KAAK,aAAY,GACjB,gBAAsB,KAAK,cAAa,CAAE;EAElD,CAAC;CACL;CAEU,cAAW;EACjB,MAAM,WAAgE,KAAK,WAAU;EAGrF,IAAI,aAAa,UAAa,KAAK,gBAAgB,MAC/C;EAIJ,MAAM,MAAkB,KAAK,cAAc,KACvC,gCACA;GACI,UAAU,KAAK;GACf,MAAM;IACF;IACA,aAAmB,KAAK,aAAa,KAAI;IACzC,aAAmB,KAAK,aAAa,KAAI;GAC5C;GACD,UAAU;GACV,eAAe;EAClB,CAAA;EAEL,KAAK,cAAc;EAEnB,AAAK,eAAe,IAAI,YAAW,GAAI,EAAE,cAAc,KAAI,CAAE,CAAC,CAAC,WAAgB;GAC3E,IAAI,KAAK,gBAAgB,KACrB,KAAK,cAAc;EAE3B,CAAC;CACL;CAEA,gBAAa;EACT,IAAI,KAAK,gBAAgB,MACrB;EAIJ,MAAM,eAAwB,KAAK,UAAU,eAAe,QAAQ,0BAA0B,KAAK;EACnG,KAAK,YAAY,MAAK;EACtB,KAAK,cAAc;EACnB,IAAI,cACA,gBAAgB,EAAE,aAAmB,KAAK,UAAS,EAAE,GAAI,EAAE,UAAU,KAAK,UAAS,CAAE;CAE7F;CAEA,YAAS;EACL,MAAM,QAAqB,KAAK,MAAM,cAA2B,sBAAoB,KAAK,KAAK;EAI/F,AAHwC,MAAM,KAAK,MAAM,iBAA8B,GAAG,CAAC,CAAC,CAAC,MACxF,SAA+B,KAAK,eAAe,YAAY,IAAI,KAAK,KAAK,eAAe,WAAW,IAAI,CAEhH,CAAA,EAAQ,MAAK;CACjB;CApHS;EAAA,KAAA,OAAA,GAAA,mBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,UAAA;GAAA,MAAA;GAAkB,MAAA,CAAA;GAAA,QAAA,GAAA,gBAAA;EAAA,CAAA;CAAA;CAAlB;EAAA,KAAA,OAAA,GAAA,qBAAA;GAAA,YAAA;GAAA,SAAA;GAAA,MAAA;GAAkB,cAAA;GAAA,UAAA;GAAA,QAAA;IAAA,OAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;IAAA,eAAA;KAAA,mBAAA;KAAA,YAAA;KAAA,UAAA;KAAA,YAAA;KAAA,mBAAA;IAAA;GAAA;GAAA,SAAA;IAAA,cAAA;IAAA,cAAA;GAAA;GAAA,MAAA;IAAA,YAAA;KAAA,2BAAA;KAAA,uCAAA;IAAA;IAAA,gBAAA;GAAA;GAAA,SAAA;IAAA;KAAA,cAAA;KAAA,OAAA;KAAA,WAmB+E;KAAyB,aAAA;KAAA,MACzH;KAAW,UAAA;IAAA;IAAA;KAAA,cAAA;KAAA,OAAA;KAAA,WAS+D;KAAsB,aAAA;KAAA,MAAU;KAAW,UAAA;IAAA;IAAA;KAAA,cAAA;KAAA,OAAA;KAAA,WAEzC;KAAwB,aAAA;KAAA,MAAU;KAAW,UAAA;IAAA;IAAA;KAAA,cAAA;KAAA,OAAA;KAAA,WAE9C;KAAuB,aAAA;KAAA,MAAU;KAAW,UAAA;IAAA;GAAA;GAAA,UAAA;GAAA,UChMrI;GAyCA,QAAA,CAAA,0hFAAA;GAAA,cAAA;IAAA;KAAA,MAAA;KAAA,MDwGQ;KAAgB,UAAA;KAAA,QAAA;MAAA;MAAA;MAAA;KAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MAGhB;KAAc,UAAA;KAAA,QAAA,CAAA,OAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACd;KAAa,UAAA;KAAA,QAAA,CAAA,OAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACb;KAAY,UAAA;IAAA;IAAA;KAAA,MAAA;KAAA,MACZ;KAAqB,UAAA;KAAA,QAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;KAAA;KAAA,SAAA,CAAA,SAAA;IAAA;GAAA;GAAA,iBAAA,GAAA,wBAAA;GAAA,eAAA,GAAA,kBAAA;EAAA,CAAA;CAAA;;AAQhB,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAkB,YAAA,CAAA;EAtB9B,MAAA;EACa,MAAA,CAAA;GAAA,UAAA;GAAY,iBAGL,wBAAwB;GAAM,eAChC,kBAAkB;GAAI,SAC5B;IAEL;IAGA;IACA;IACA;IACA;GACH;GAAA,MACK;IACF,OAAO;IACP,6BAA6B;IAC7B,yCAAyC;GAC5C;GAAA,UAAA;GAAA,QAAA,CAAA,0hFAAA;EAAA,CAAA;CAqByG,CAAA;CAAA,sBAAA,CAAA;CAAA,gBAAA;EAAA,YAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA,GAAA,iBAAA,yBAAyB,GAAA;IAC/H,MAAM;IACT,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,SAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA,GAAA,iBAQmF,sBAAsB,GAAA;IAAI,MAAM;IAAa,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,WAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA,GAAA,iBAE3C,wBAAwB,GAAA;IAAI,MAAM;IAAa,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,UAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA,GAAA,iBAEhD,uBAAuB,GAAA;IAAI,MAAM;IAAa,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,OAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,eAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,cAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA,cAAA;EAAA,CAAA;EAAA,cAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA,cAAA;EAAA,CAAA;CAAA;AAAA,CAAA"}