@rt-tools/ui-kit-v2 0.17.0 → 0.19.0

package/fesm2022/rt-tools-ui-kit-v2-ai-run-status.mjs

@@ -0,0 +1,97 @@
+import { NgTemplateOutlet } from '@angular/common';
+import * as i0 from '@angular/core';
+import { computed, input, model, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { BlockDirective, ElemDirective, ModDirective } from '@rt-tools/core';
+import { rtKitLabel } from '@rt-tools/ui-kit-v2/core';
+import { RtIconComponent } from '@rt-tools/ui-kit-v2/icon';
+import { RtSpinnerComponent } from '@rt-tools/ui-kit-v2/spinner';
+import { RtTimelineComponent } from '@rt-tools/ui-kit-v2/timeline';
+import { RtTooltipDirective } from '@rt-tools/ui-kit-v2/tooltip';
+
+const BEM_BLOCK = 'rt-ai-run-status';
+/** Значок и его цвет по состоянию; у `running` значка нет — на его месте крутилка. */
+const MARKS = {
+    done: { name: 'check-circle', color: 'success' },
+    stopped: { name: 'times-circle', color: 'muted' },
+    failed: { name: 'exclamation-circle', color: 'danger' },
+};
+let runStatusIdSeed = 0;
+function nextRunStatusId() {
+    runStatusIdSeed += 1;
+    return runStatusIdSeed;
+}
+/**
+ * Строка хода работы ИИ-ассистента: значок состояния, подпись текущего шага или итога, мета
+ * (время, число шагов) и раскрытие списка пройденных шагов. Пока модель работает, по подписи
+ * бежит блик; при `prefers-reduced-motion` подпись стоит ровным цветом.
+ *
+ * Компонент презентационный: состояние, подпись и шаги приходят готовыми, разбор потока
+ * событий модели остаётся в приложении.
+ */
+class RtAiRunStatusComponent {
+    constructor() {
+        this.#t_aiShowSteps = rtKitLabel('aiShowSteps');
+        this.#t_aiHideSteps = rtKitLabel('aiHideSteps');
+        this.stepsId = `rt-ai-run-status-steps-${nextRunStatusId()}`;
+        this.hasSteps = computed(() => this.steps().length > 0, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "hasSteps" }] : /* istanbul ignore next */ []));
+        this.isOpen = computed(() => this.hasSteps() && this.expanded(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+        this.mark = computed(() => {
+            const state = this.state();
+            return state === 'running' ? null : MARKS[state];
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "mark" }] : /* istanbul ignore next */ []));
+        this.toggleLabel = computed(() => this.isOpen() ? this.#t_aiHideSteps() : this.#t_aiShowSteps(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "toggleLabel" }] : /* istanbul ignore next */ []));
+        this.state = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
+        /** Подпись: текущий шаг, пока модель работает, или итог — «Worked for 31s». */
+        this.label = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+        /** Вторичная строка справа от подписи: время шага или число шагов. Пусто — не рисуется. */
+        this.meta = input('', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "meta" }] : /* istanbul ignore next */ []));
+        /** Пройденные шаги. Пустой список — строку нельзя раскрыть. */
+        this.steps = input([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "steps" }] : /* istanbul ignore next */ []));
+        /** Раскрыт ли список шагов. */
+        this.expanded = model(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "expanded" }] : /* istanbul ignore next */ []));
+    }
+    #t_aiShowSteps;
+    #t_aiHideSteps;
+    onToggle() {
+        this.expanded.set(!this.expanded());
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RtAiRunStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: RtAiRunStatusComponent, isStandalone: true, selector: "rt-ai-run-status", inputs: { state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, meta: { classPropertyName: "meta", publicName: "meta", isSignal: true, isRequired: false, transformFunction: null }, steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "expandedChange" }, host: { classAttribute: "rt-ai-run-status" }, ngImport: i0, template: "<div rtBlock=\"rt-ai-run-status\" qa-dataid=\"ai-run-status\" [attr.data-state]=\"state()\" [rtMod]=\"{ state: state(), open: isOpen() }\">\n    <ng-template #head>\n        <span rtElem=\"mark\" aria-hidden=\"true\">\n            @if (mark(); as m) {\n                <rt-icon size=\"sm\" [name]=\"m.name\" [color]=\"m.color\" />\n            } @else {\n                <rt-spinner appearance=\"arc\" [diameter]=\"16\" />\n            }\n        </span>\n        <span rtElem=\"label\" qa-dataid=\"ai-run-status-label\" [rtMod]=\"{ state: state() }\">{{ label() }}</span>\n        @if (meta()) {\n            <span rtElem=\"meta\" qa-dataid=\"ai-run-status-meta\">{{ meta() }}</span>\n        }\n    </ng-template>\n\n    @if (hasSteps()) {\n        <button\n            rtElem=\"row\"\n            type=\"button\"\n            qa-dataid=\"ai-run-status-toggle\"\n            [attr.aria-expanded]=\"isOpen()\"\n            [attr.aria-controls]=\"stepsId\"\n            [rtTooltip]=\"toggleLabel()\"\n            (click)=\"onToggle()\">\n            <ng-container [ngTemplateOutlet]=\"head\" />\n            <rt-icon rtElem=\"chevron\" size=\"sm\" color=\"muted\" [name]=\"isOpen() ? 'chevron-up' : 'chevron-down'\" />\n        </button>\n    } @else {\n        <div rtElem=\"row\" role=\"status\" qa-dataid=\"ai-run-status-row\">\n            <ng-container [ngTemplateOutlet]=\"head\" />\n        </div>\n    }\n\n    @if (isOpen()) {\n        <rt-timeline rtElem=\"steps\" qa-dataid=\"ai-run-status-steps\" [id]=\"stepsId\" [steps]=\"steps()\" />\n    }\n</div>\n", styles: ["@charset \"UTF-8\";@layer rt-kit.components{rt-ai-run-status{display:block}rt-ai-run-status .rt-ai-run-status{--rt-ai-run-status-radius: var(--rt-radius-sm);--rt-ai-run-status-focus-shadow: var(--rt-shadow-focus-ring);--rt-ai-run-status-shimmer-duration: var(--rt-duration-slower);--rt-ai-run-status-shimmer-from: var(--rt-color-text-muted);--rt-ai-run-status-shimmer-to: var(--rt-color-action-primary-on-surface);display:flex;flex-direction:column;gap:var(--rt-space-2xs)}rt-ai-run-status .rt-ai-run-status__row{display:inline-flex;align-items:center;align-self:flex-start;padding:var(--rt-space-2xs) 0;border:0;border-radius:var(--rt-ai-run-status-radius);margin:0;background:transparent;color:inherit;font:inherit;gap:var(--rt-space-sm);text-align:start}rt-ai-run-status .rt-ai-run-status button.rt-ai-run-status__row{cursor:pointer}rt-ai-run-status .rt-ai-run-status button.rt-ai-run-status__row:focus-visible{box-shadow:var(--rt-ai-run-status-focus-shadow);outline:2px solid transparent;outline-offset:2px}rt-ai-run-status .rt-ai-run-status button.rt-ai-run-status__row:hover .rt-ai-run-status__chevron{color:var(--rt-color-text-primary)}rt-ai-run-status .rt-ai-run-status__mark{display:inline-flex;flex:none;align-items:center;justify-content:center;block-size:16px;inline-size:16px}rt-ai-run-status .rt-ai-run-status__label{color:var(--rt-color-text-primary);font-size:var(--rt-text-sm);line-height:var(--rt-leading-snug)}rt-ai-run-status .rt-ai-run-status__label--state--running{animation:rt-ai-run-status-shimmer var(--rt-ai-run-status-shimmer-duration) linear infinite;background:linear-gradient(90deg,var(--rt-ai-run-status-shimmer-from) 0%,var(--rt-ai-run-status-shimmer-to) 50%,var(--rt-ai-run-status-shimmer-from) 100%);background-clip:text;background-size:200% 100%;color:transparent}rt-ai-run-status .rt-ai-run-status__label--state--stopped{color:var(--rt-color-text-muted)}rt-ai-run-status .rt-ai-run-status__label--state--failed{color:var(--rt-color-action-danger-on-surface)}rt-ai-run-status .rt-ai-run-status__meta{flex:none;color:var(--rt-color-text-muted);font-size:var(--rt-text-xs);line-height:var(--rt-leading-snug)}rt-ai-run-status .rt-ai-run-status__chevron{flex:none;color:var(--rt-color-text-muted)}rt-ai-run-status .rt-ai-run-status__steps{padding-inline-start:var(--rt-space-2xs)}@keyframes rt-ai-run-status-shimmer{0%{background-position:100% 0}to{background-position:-100% 0}}@media(prefers-reduced-motion:reduce){.rt-ai-run-status__label--state--running{animation:none;background:none;color:var(--rt-ai-run-status-shimmer-from)}}}\n"], dependencies: [{ kind: "directive", type: 
+                // angular
+                NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: 
+                // standalone components / directives
+                BlockDirective, selector: "[rtBlock]", inputs: ["rtMod"] }, { kind: "directive", type: ElemDirective, selector: "[rtElem]", inputs: ["rtMod"] }, { kind: "directive", type: ModDirective, selector: "[rtMod]" }, { kind: "component", type: RtIconComponent, selector: "rt-icon", inputs: ["name", "glyph", "glyphStrategy", "size", "color", "fill", "spin", "rotate"] }, { kind: "component", type: RtSpinnerComponent, selector: "rt-spinner", inputs: ["diameter", "color", "appearance", "overlay", "backdrop", "plate"] }, { kind: "component", type: RtTimelineComponent, selector: "rt-timeline", inputs: ["steps"] }, { kind: "directive", type: RtTooltipDirective, selector: "[rtTooltip]", inputs: ["rtTooltip", "rtTooltipPlacement", "rtTooltipWhenTruncated"], exportAs: ["rtTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RtAiRunStatusComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rt-ai-run-status', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
+                        // angular
+                        NgTemplateOutlet,
+                        // standalone components / directives
+                        BlockDirective,
+                        ElemDirective,
+                        ModDirective,
+                        RtIconComponent,
+                        RtSpinnerComponent,
+                        RtTimelineComponent,
+                        RtTooltipDirective,
+                    ], host: {
+                        class: BEM_BLOCK,
+                    }, template: "<div rtBlock=\"rt-ai-run-status\" qa-dataid=\"ai-run-status\" [attr.data-state]=\"state()\" [rtMod]=\"{ state: state(), open: isOpen() }\">\n    <ng-template #head>\n        <span rtElem=\"mark\" aria-hidden=\"true\">\n            @if (mark(); as m) {\n                <rt-icon size=\"sm\" [name]=\"m.name\" [color]=\"m.color\" />\n            } @else {\n                <rt-spinner appearance=\"arc\" [diameter]=\"16\" />\n            }\n        </span>\n        <span rtElem=\"label\" qa-dataid=\"ai-run-status-label\" [rtMod]=\"{ state: state() }\">{{ label() }}</span>\n        @if (meta()) {\n            <span rtElem=\"meta\" qa-dataid=\"ai-run-status-meta\">{{ meta() }}</span>\n        }\n    </ng-template>\n\n    @if (hasSteps()) {\n        <button\n            rtElem=\"row\"\n            type=\"button\"\n            qa-dataid=\"ai-run-status-toggle\"\n            [attr.aria-expanded]=\"isOpen()\"\n            [attr.aria-controls]=\"stepsId\"\n            [rtTooltip]=\"toggleLabel()\"\n            (click)=\"onToggle()\">\n            <ng-container [ngTemplateOutlet]=\"head\" />\n            <rt-icon rtElem=\"chevron\" size=\"sm\" color=\"muted\" [name]=\"isOpen() ? 'chevron-up' : 'chevron-down'\" />\n        </button>\n    } @else {\n        <div rtElem=\"row\" role=\"status\" qa-dataid=\"ai-run-status-row\">\n            <ng-container [ngTemplateOutlet]=\"head\" />\n        </div>\n    }\n\n    @if (isOpen()) {\n        <rt-timeline rtElem=\"steps\" qa-dataid=\"ai-run-status-steps\" [id]=\"stepsId\" [steps]=\"steps()\" />\n    }\n</div>\n", styles: ["@charset \"UTF-8\";@layer rt-kit.components{rt-ai-run-status{display:block}rt-ai-run-status .rt-ai-run-status{--rt-ai-run-status-radius: var(--rt-radius-sm);--rt-ai-run-status-focus-shadow: var(--rt-shadow-focus-ring);--rt-ai-run-status-shimmer-duration: var(--rt-duration-slower);--rt-ai-run-status-shimmer-from: var(--rt-color-text-muted);--rt-ai-run-status-shimmer-to: var(--rt-color-action-primary-on-surface);display:flex;flex-direction:column;gap:var(--rt-space-2xs)}rt-ai-run-status .rt-ai-run-status__row{display:inline-flex;align-items:center;align-self:flex-start;padding:var(--rt-space-2xs) 0;border:0;border-radius:var(--rt-ai-run-status-radius);margin:0;background:transparent;color:inherit;font:inherit;gap:var(--rt-space-sm);text-align:start}rt-ai-run-status .rt-ai-run-status button.rt-ai-run-status__row{cursor:pointer}rt-ai-run-status .rt-ai-run-status button.rt-ai-run-status__row:focus-visible{box-shadow:var(--rt-ai-run-status-focus-shadow);outline:2px solid transparent;outline-offset:2px}rt-ai-run-status .rt-ai-run-status button.rt-ai-run-status__row:hover .rt-ai-run-status__chevron{color:var(--rt-color-text-primary)}rt-ai-run-status .rt-ai-run-status__mark{display:inline-flex;flex:none;align-items:center;justify-content:center;block-size:16px;inline-size:16px}rt-ai-run-status .rt-ai-run-status__label{color:var(--rt-color-text-primary);font-size:var(--rt-text-sm);line-height:var(--rt-leading-snug)}rt-ai-run-status .rt-ai-run-status__label--state--running{animation:rt-ai-run-status-shimmer var(--rt-ai-run-status-shimmer-duration) linear infinite;background:linear-gradient(90deg,var(--rt-ai-run-status-shimmer-from) 0%,var(--rt-ai-run-status-shimmer-to) 50%,var(--rt-ai-run-status-shimmer-from) 100%);background-clip:text;background-size:200% 100%;color:transparent}rt-ai-run-status .rt-ai-run-status__label--state--stopped{color:var(--rt-color-text-muted)}rt-ai-run-status .rt-ai-run-status__label--state--failed{color:var(--rt-color-action-danger-on-surface)}rt-ai-run-status .rt-ai-run-status__meta{flex:none;color:var(--rt-color-text-muted);font-size:var(--rt-text-xs);line-height:var(--rt-leading-snug)}rt-ai-run-status .rt-ai-run-status__chevron{flex:none;color:var(--rt-color-text-muted)}rt-ai-run-status .rt-ai-run-status__steps{padding-inline-start:var(--rt-space-2xs)}@keyframes rt-ai-run-status-shimmer{0%{background-position:100% 0}to{background-position:-100% 0}}@media(prefers-reduced-motion:reduce){.rt-ai-run-status__label--state--running{animation:none;background:none;color:var(--rt-ai-run-status-shimmer-from)}}}\n"] }]
+        }], propDecorators: { state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], meta: [{ type: i0.Input, args: [{ isSignal: true, alias: "meta", required: false }] }], steps: [{ type: i0.Input, args: [{ isSignal: true, alias: "steps", required: false }] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }, { type: i0.Output, args: ["expandedChange"] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { RtAiRunStatusComponent };
+//# sourceMappingURL=rt-tools-ui-kit-v2-ai-run-status.mjs.map

package/fesm2022/rt-tools-ui-kit-v2-ai-run-status.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"rt-tools-ui-kit-v2-ai-run-status.mjs","sources":["../../../projects/ui-kit-v2/src/lib/components/ai-run-status/rt-ai-run-status.component.ts","../../../projects/ui-kit-v2/src/lib/components/ai-run-status/rt-ai-run-status.component.html","../../../projects/ui-kit-v2/src/lib/components/ai-run-status/rt-tools-ui-kit-v2-ai-run-status.ts"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\nimport {\n    ChangeDetectionStrategy,\n    Component,\n    computed,\n    input,\n    InputSignal,\n    model,\n    ModelSignal,\n    Signal,\n    ViewEncapsulation,\n} from '@angular/core';\n\nimport { BlockDirective, ElemDirective, ModDirective } from '@rt-tools/core';\n\nimport { IRtIcon, rtKitLabel } from '@rt-tools/ui-kit-v2/core';\nimport { RtIconComponent } from '@rt-tools/ui-kit-v2/icon';\nimport { RtSpinnerComponent } from '@rt-tools/ui-kit-v2/spinner';\nimport { IRtTimeline, RtTimelineComponent } from '@rt-tools/ui-kit-v2/timeline';\nimport { RtTooltipDirective } from '@rt-tools/ui-kit-v2/tooltip';\n\nimport { IRtAiRunStatus } from './rt-ai-run-status.model';\n\nconst BEM_BLOCK: string = 'rt-ai-run-status';\n\n/** Значок и его цвет по состоянию; у `running` значка нет — на его месте крутилка. */\nconst MARKS: Readonly<Record<Exclude<IRtAiRunStatus.State, 'running'>, { name: IRtIcon.Name; color: IRtIcon.Color }>> = {\n    done: { name: 'check-circle', color: 'success' },\n    stopped: { name: 'times-circle', color: 'muted' },\n    failed: { name: 'exclamation-circle', color: 'danger' },\n};\n\nlet runStatusIdSeed: number = 0;\n\nfunction nextRunStatusId(): number {\n    runStatusIdSeed += 1;\n    return runStatusIdSeed;\n}\n\n/**\n * Строка хода работы ИИ-ассистента: значок состояния, подпись текущего шага или итога, мета\n * (время, число шагов) и раскрытие списка пройденных шагов. Пока модель работает, по подписи\n * бежит блик; при `prefers-reduced-motion` подпись стоит ровным цветом.\n *\n * Компонент презентационный: состояние, подпись и шаги приходят готовыми, разбор потока\n * событий модели остаётся в приложении.\n */\n@Component({\n    selector: 'rt-ai-run-status',\n    templateUrl: './rt-ai-run-status.component.html',\n    styleUrl: './rt-ai-run-status.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        RtIconComponent,\n        RtSpinnerComponent,\n        RtTimelineComponent,\n        RtTooltipDirective,\n    ],\n    host: {\n        class: BEM_BLOCK,\n    },\n})\nexport class RtAiRunStatusComponent {\n    readonly #t_aiShowSteps: Signal<string> = rtKitLabel('aiShowSteps');\n    readonly #t_aiHideSteps: Signal<string> = rtKitLabel('aiHideSteps');\n\n    protected readonly stepsId: string = `rt-ai-run-status-steps-${nextRunStatusId()}`;\n\n    protected readonly hasSteps: Signal<boolean> = computed((): boolean => this.steps().length > 0);\n\n    protected readonly isOpen: Signal<boolean> = computed((): boolean => this.hasSteps() && this.expanded());\n\n    protected readonly mark: Signal<{ name: IRtIcon.Name; color: IRtIcon.Color } | null> = computed(\n        (): { name: IRtIcon.Name; color: IRtIcon.Color } | null => {\n            const state: IRtAiRunStatus.State = this.state();\n            return state === 'running' ? null : MARKS[state];\n        }\n    );\n\n    protected readonly toggleLabel: Signal<string> = computed((): string =>\n        this.isOpen() ? this.#t_aiHideSteps() : this.#t_aiShowSteps()\n    );\n\n    public readonly state: InputSignal<IRtAiRunStatus.State> = input.required<IRtAiRunStatus.State>();\n\n    /** Подпись: текущий шаг, пока модель работает, или итог — «Worked for 31s». */\n    public readonly label: InputSignal<string> = input.required<string>();\n\n    /** Вторичная строка справа от подписи: время шага или число шагов. Пусто — не рисуется. */\n    public readonly meta: InputSignal<string> = input<string>('');\n\n    /** Пройденные шаги. Пустой список — строку нельзя раскрыть. */\n    public readonly steps: InputSignal<readonly IRtTimeline.Step[]> = input<readonly IRtTimeline.Step[]>([]);\n\n    /** Раскрыт ли список шагов. */\n    public readonly expanded: ModelSignal<boolean> = model<boolean>(false);\n\n    protected onToggle(): void {\n        this.expanded.set(!this.expanded());\n    }\n}\n","<div rtBlock=\"rt-ai-run-status\" qa-dataid=\"ai-run-status\" [attr.data-state]=\"state()\" [rtMod]=\"{ state: state(), open: isOpen() }\">\n    <ng-template #head>\n        <span rtElem=\"mark\" aria-hidden=\"true\">\n            @if (mark(); as m) {\n                <rt-icon size=\"sm\" [name]=\"m.name\" [color]=\"m.color\" />\n            } @else {\n                <rt-spinner appearance=\"arc\" [diameter]=\"16\" />\n            }\n        </span>\n        <span rtElem=\"label\" qa-dataid=\"ai-run-status-label\" [rtMod]=\"{ state: state() }\">{{ label() }}</span>\n        @if (meta()) {\n            <span rtElem=\"meta\" qa-dataid=\"ai-run-status-meta\">{{ meta() }}</span>\n        }\n    </ng-template>\n\n    @if (hasSteps()) {\n        <button\n            rtElem=\"row\"\n            type=\"button\"\n            qa-dataid=\"ai-run-status-toggle\"\n            [attr.aria-expanded]=\"isOpen()\"\n            [attr.aria-controls]=\"stepsId\"\n            [rtTooltip]=\"toggleLabel()\"\n            (click)=\"onToggle()\">\n            <ng-container [ngTemplateOutlet]=\"head\" />\n            <rt-icon rtElem=\"chevron\" size=\"sm\" color=\"muted\" [name]=\"isOpen() ? 'chevron-up' : 'chevron-down'\" />\n        </button>\n    } @else {\n        <div rtElem=\"row\" role=\"status\" qa-dataid=\"ai-run-status-row\">\n            <ng-container [ngTemplateOutlet]=\"head\" />\n        </div>\n    }\n\n    @if (isOpen()) {\n        <rt-timeline rtElem=\"steps\" qa-dataid=\"ai-run-status-steps\" [id]=\"stepsId\" [steps]=\"steps()\" />\n    }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/rt-tools-ui-kit-v2-aside-section.mjs

@@ -0,0 +1,47 @@
+import * as i0 from '@angular/core';
+import { input, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { BlockDirective, ElemDirective } from '@rt-tools/core';
+
+const BEM_BLOCK = 'rt-aside-section';
+/**
+ * Смысловая секция внутри асайда: единый вертикальный ритм между полями и
+ * необязательный заголовок одного стиля. Заменяет разнобой из `fieldset`,
+ * самопальных `div`-секций, `h3` и `<legend>`, которым раньше каждый диалог
+ * группировал контент по-своему.
+ *
+ * Заголовок (`[heading]`) рендерится только когда задан. Соседние секции
+ * автоматически разделяются верхней границей — отдельный разделитель в
+ * потребителе не нужен.
+ *
+ * Внутри секция размечена словарём формы панели: тело — колонкой контролов,
+ * заголовок — заголовком раздела. Ритм между ними приходит зазорами словаря,
+ * поэтому панель, собранная из готовых секций, и панель, размеченная словарём
+ * вручную, стоят одинаково.
+ */
+class RtAsideSectionComponent {
+    constructor() {
+        this.heading = input(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RtAsideSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: RtAsideSectionComponent, isStandalone: true, selector: "rt-aside-section", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "rt-aside-section" }, ngImport: i0, template: "<ng-container rtBlock=\"rt-form\">\n    <div rtElem=\"controls\" qa-dataid=\"aside-section-body\">\n        @if (heading()) {\n            <h3 rtElem=\"title\" qa-dataid=\"aside-section-heading\">{{ heading() }}</h3>\n        }\n        <ng-content />\n    </div>\n</ng-container>\n", styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-aside-section{--rt-aside-section-border-width: var(--rt-border-width-thin);display:flex;flex-direction:column}.rt-aside-section+.rt-aside-section{padding-top:var(--rt-aside-content-gap);border-top:var(--rt-aside-section-border-width) solid var(--rt-color-border-subtle)}}\n"], dependencies: [{ kind: "directive", type: 
+                // standalone components / directives
+                BlockDirective, selector: "[rtBlock]", inputs: ["rtMod"] }, { kind: "directive", type: ElemDirective, selector: "[rtElem]", inputs: ["rtMod"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RtAsideSectionComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rt-aside-section', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
+                        // standalone components / directives
+                        BlockDirective,
+                        ElemDirective,
+                    ], host: {
+                        class: BEM_BLOCK,
+                    }, template: "<ng-container rtBlock=\"rt-form\">\n    <div rtElem=\"controls\" qa-dataid=\"aside-section-body\">\n        @if (heading()) {\n            <h3 rtElem=\"title\" qa-dataid=\"aside-section-heading\">{{ heading() }}</h3>\n        }\n        <ng-content />\n    </div>\n</ng-container>\n", styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-aside-section{--rt-aside-section-border-width: var(--rt-border-width-thin);display:flex;flex-direction:column}.rt-aside-section+.rt-aside-section{padding-top:var(--rt-aside-content-gap);border-top:var(--rt-aside-section-border-width) solid var(--rt-color-border-subtle)}}\n"] }]
+        }], propDecorators: { heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { RtAsideSectionComponent };
+//# sourceMappingURL=rt-tools-ui-kit-v2-aside-section.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"rt-tools-ui-kit-v2-aside-section.mjs","sources":["../../../projects/ui-kit-v2/src/lib/components/aside-section/rt-aside-section.component.ts","../../../projects/ui-kit-v2/src/lib/components/aside-section/rt-aside-section.component.html","../../../projects/ui-kit-v2/src/lib/components/aside-section/rt-tools-ui-kit-v2-aside-section.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input, InputSignal, ViewEncapsulation } from '@angular/core';\n\nimport { BlockDirective, ElemDirective } from '@rt-tools/core';\n\nconst BEM_BLOCK: string = 'rt-aside-section';\n\n/**\n * Смысловая секция внутри асайда: единый вертикальный ритм между полями и\n * необязательный заголовок одного стиля. Заменяет разнобой из `fieldset`,\n * самопальных `div`-секций, `h3` и `<legend>`, которым раньше каждый диалог\n * группировал контент по-своему.\n *\n * Заголовок (`[heading]`) рендерится только когда задан. Соседние секции\n * автоматически разделяются верхней границей — отдельный разделитель в\n * потребителе не нужен.\n *\n * Внутри секция размечена словарём формы панели: тело — колонкой контролов,\n * заголовок — заголовком раздела. Ритм между ними приходит зазорами словаря,\n * поэтому панель, собранная из готовых секций, и панель, размеченная словарём\n * вручную, стоят одинаково.\n */\n@Component({\n    selector: 'rt-aside-section',\n    templateUrl: './rt-aside-section.component.html',\n    styleUrl: './rt-aside-section.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    imports: [\n        // standalone components / directives\n        BlockDirective,\n        ElemDirective,\n    ],\n    host: {\n        class: BEM_BLOCK,\n    },\n})\nexport class RtAsideSectionComponent {\n    public readonly heading: InputSignal<string | null> = input<string | null>(null);\n}\n","<ng-container rtBlock=\"rt-form\">\n    <div rtElem=\"controls\" qa-dataid=\"aside-section-body\">\n        @if (heading()) {\n            <h3 rtElem=\"title\" qa-dataid=\"aside-section-heading\">{{ heading() }}</h3>\n        }\n        <ng-content />\n    </div>\n</ng-container>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;AAIA,MAAM,SAAS,GAAW,kBAAkB;AAE5C;;;;;;;;;;;;;;AAcG;MAgBU,uBAAuB,CAAA;AAfpC,IAAA,WAAA,GAAA;QAgBoB,IAAA,CAAA,OAAO,GAA+B,KAAK,CAAgB,IAAI;oFAAC;AACnF,IAAA;8GAFY,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAvB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,uBAAuB,oQCpCpC,4RAQA,EAAA,MAAA,EAAA,CAAA,mUAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA;;ADqBQ,gBAAA,cAAc,yEACd,aAAa,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAMR,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAfnC,SAAS;+BACI,kBAAkB,EAAA,eAAA,EAGX,uBAAuB,CAAC,MAAM,iBAChC,iBAAiB,CAAC,IAAI,EAAA,OAAA,EAC5B;;wBAEL,cAAc;wBACd,aAAa;qBAChB,EAAA,IAAA,EACK;AACF,wBAAA,KAAK,EAAE,SAAS;AACnB,qBAAA,EAAA,QAAA,EAAA,4RAAA,EAAA,MAAA,EAAA,CAAA,mUAAA,CAAA,EAAA;;;AElCL;;AAEG;;;;"}