@akcelik/strct 5.10.0 → 5.11.0

package/fesm2022/akcelik-strct.mjs

@@ -1890,6 +1890,16 @@ class StrctListItem {
      * row at once; this is the per-row form.
      */
     wrap = input(false, { ...(ngDevMode ? { debugName: "wrap" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * The row cannot be activated — a conversation that cannot be switched away
+     * from while a reply arrives. It keeps its tab stop and says
+     * `aria-disabled`, so the reason can be read; a keyboard or touch user
+     * never sees a `title`.
+     */
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Why it cannot be activated, read as the row's description. */
+    disabledReason = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "disabledReason" }] : /* istanbul ignore next */ []));
     /** Marks the current row (`aria-current`). */
     selected = input(false, { ...(ngDevMode ? { debugName: "selected" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     /** Optional leading rail, as `strct-card [status]`. */
@@ -1898,16 +1908,19 @@ class StrctListItem {
     /** Emitted when an `interactive` row is activated. */
     activated = output();
     onActivate() {
-        if (this.interactive())
+        if (this.interactive() && !this.disabled())
             this.activated.emit();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctListItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: StrctListItem, isStandalone: true, selector: "strct-list-item", inputs: { interactive: { classPropertyName: "interactive", publicName: "interactive", isSignal: true, isRequired: false, transformFunction: null }, wrap: { classPropertyName: "wrap", publicName: "wrap", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activated: "activated" }, host: { attributes: { "role": "listitem" }, properties: { "class.strct-li--interactive": "interactive()", "class.strct-li--wrap": "wrap()", "class.strct-li--selected": "selected()", "class.strct-li--status": "status()", "attr.data-status": "status()" }, classAttribute: "strct-li" }, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: StrctListItem, isStandalone: true, selector: "strct-list-item", inputs: { interactive: { classPropertyName: "interactive", publicName: "interactive", isSignal: true, isRequired: false, transformFunction: null }, wrap: { classPropertyName: "wrap", publicName: "wrap", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, disabledReason: { classPropertyName: "disabledReason", publicName: "disabledReason", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activated: "activated" }, host: { attributes: { "role": "listitem" }, properties: { "class.strct-li--interactive": "interactive()", "class.strct-li--wrap": "wrap()", "class.strct-li--disabled": "disabled()", "class.strct-li--selected": "selected()", "class.strct-li--status": "status()", "attr.data-status": "status()" }, classAttribute: "strct-li" }, ngImport: i0, template: `
     <div
       class="strct-li__main"
       [attr.role]="interactive() ? 'button' : null"
       [attr.tabindex]="interactive() ? 0 : null"
       [attr.aria-current]="selected() ? 'true' : null"
+      [attr.aria-disabled]="disabled() ? 'true' : null"
+      [attr.title]="disabledReason() || null"
+      [attr.aria-description]="disabled() ? disabledReason() || null : null"
       (click)="onActivate()"
       (keydown.enter)="onActivate()"
       (keydown.space)="$event.preventDefault(); onActivate()"
@@ -1920,7 +1933,7 @@ class StrctListItem {
       <span class="strct-li__meta"><ng-content select="[strctListItemMeta]" /></span>
     </div>
     <span class="strct-li__trailing"><ng-content select="[strctListItemTrailing]" /></span>
-  `, isInline: true, styles: [".strct-li{display:flex;align-items:center;gap:var(--space-2);padding-inline:var(--space-3);position:relative}.strct-list--flush .strct-li{padding-inline:0}.strct-list--dividers .strct-li+.strct-li{border-block-start:1px solid var(--b1)}.strct-li__main{display:flex;align-items:center;gap:var(--space-2);flex:1;min-width:0;min-height:44px;padding-block:6px;text-align:start;border-radius:var(--radius-sm)}.strct-list--dense .strct-li__main{min-height:32px;padding-block:2px}.strct-li--interactive .strct-li__main{cursor:pointer}.strct-li--interactive:hover{background:var(--bg-2)}.strct-li--selected{background:var(--acc-s)}.strct-li__main:focus-visible{outline:2px solid var(--acc50);outline-offset:-2px}.strct-li--status:before{content:\"\";position:absolute;inset-block:0;inset-inline-start:0;width:2px;background:var(--t3)}.strct-li[data-status=accent]:before{background:var(--acc)}.strct-li[data-status=success]:before{background:var(--success)}.strct-li[data-status=warning]:before{background:var(--warning)}.strct-li[data-status=critical]:before{background:var(--critical)}.strct-li--wrap .strct-li__main,.strct-list--wrap .strct-li__main{align-items:flex-start}.strct-li--wrap .strct-li__leading,.strct-list--wrap .strct-li__leading{min-height:calc(var(--text-md) * 1.45)}.strct-li--wrap .strct-li__title,.strct-li--wrap .strct-li__desc,.strct-list--wrap .strct-li__title,.strct-list--wrap .strct-li__desc{overflow:visible;text-overflow:clip;white-space:normal;overflow-wrap:anywhere}.strct-li--wrap .strct-li__meta,.strct-list--wrap .strct-li__meta{align-self:flex-start;min-height:calc(var(--text-md) * 1.45)}.strct-li__leading:empty,.strct-li__meta:empty,.strct-li__desc:empty,.strct-li__trailing:empty{display:none}.strct-li__leading{display:inline-flex;align-items:center;flex:none}.strct-li__text{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}.strct-li__title{font-size:var(--text-md);color:var(--t1);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strct-li__desc{font-size:var(--text-sm);color:var(--t3);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strct-li__meta{display:inline-flex;align-items:center;flex:none;font-size:var(--text-sm);color:var(--t3);white-space:nowrap}.strct-li__trailing{display:inline-flex;align-items:center;gap:var(--space-2);flex:none}@container (max-width: 360px){.strct-li__main{flex-wrap:wrap}.strct-li__meta{flex-basis:100%;padding-inline-start:0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, styles: [".strct-li{display:flex;align-items:center;gap:var(--space-2);padding-inline:var(--space-3);position:relative}.strct-list--flush .strct-li{padding-inline:0}.strct-list--dividers .strct-li+.strct-li{border-block-start:1px solid var(--b1)}.strct-li__main{display:flex;align-items:center;gap:var(--space-2);flex:1;min-width:0;min-height:44px;padding-block:6px;text-align:start;border-radius:var(--radius-sm)}.strct-list--dense .strct-li__main{min-height:32px;padding-block:2px}.strct-li--interactive .strct-li__main{cursor:pointer}.strct-li--disabled .strct-li__main{cursor:not-allowed;opacity:.6}.strct-li--disabled.strct-li--interactive:hover{background:none}.strct-li--interactive:hover{background:var(--bg-2)}.strct-li--selected{background:var(--acc-s)}.strct-li__main:focus-visible{outline:2px solid var(--acc50);outline-offset:-2px}.strct-li--status:before{content:\"\";position:absolute;inset-block:0;inset-inline-start:0;width:2px;background:var(--t3)}.strct-li[data-status=accent]:before{background:var(--acc)}.strct-li[data-status=success]:before{background:var(--success)}.strct-li[data-status=warning]:before{background:var(--warning)}.strct-li[data-status=critical]:before{background:var(--critical)}.strct-li--wrap .strct-li__main,.strct-list--wrap .strct-li__main{align-items:flex-start}.strct-li--wrap .strct-li__leading,.strct-list--wrap .strct-li__leading{min-height:calc(var(--text-md) * 1.45)}.strct-li--wrap .strct-li__title,.strct-li--wrap .strct-li__desc,.strct-list--wrap .strct-li__title,.strct-list--wrap .strct-li__desc{overflow:visible;text-overflow:clip;white-space:normal;overflow-wrap:anywhere}.strct-li--wrap .strct-li__meta,.strct-list--wrap .strct-li__meta{align-self:flex-start;min-height:calc(var(--text-md) * 1.45)}.strct-li__leading:empty,.strct-li__meta:empty,.strct-li__desc:empty,.strct-li__trailing:empty{display:none}.strct-li__leading{display:inline-flex;align-items:center;flex:none}.strct-li__text{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}.strct-li__title{font-size:var(--text-md);color:var(--t1);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strct-li__desc{font-size:var(--text-sm);color:var(--t3);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strct-li__meta{display:inline-flex;align-items:center;flex:none;font-size:var(--text-sm);color:var(--t3);white-space:nowrap}.strct-li__trailing{display:inline-flex;align-items:center;gap:var(--space-2);flex:none}@container (max-width: 360px){.strct-li__main{flex-wrap:wrap}.strct-li__meta{flex-basis:100%;padding-inline-start:0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctListItem, decorators: [{
             type: Component,
@@ -1930,6 +1943,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
       [attr.role]="interactive() ? 'button' : null"
       [attr.tabindex]="interactive() ? 0 : null"
       [attr.aria-current]="selected() ? 'true' : null"
+      [attr.aria-disabled]="disabled() ? 'true' : null"
+      [attr.title]="disabledReason() || null"
+      [attr.aria-description]="disabled() ? disabledReason() || null : null"
       (click)="onActivate()"
       (keydown.enter)="onActivate()"
       (keydown.space)="$event.preventDefault(); onActivate()"
@@ -1947,11 +1963,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
                         role: 'listitem',
                         '[class.strct-li--interactive]': 'interactive()',
                         '[class.strct-li--wrap]': 'wrap()',
+                        '[class.strct-li--disabled]': 'disabled()',
                         '[class.strct-li--selected]': 'selected()',
                         '[class.strct-li--status]': 'status()',
                         '[attr.data-status]': 'status()',
-                    }, styles: [".strct-li{display:flex;align-items:center;gap:var(--space-2);padding-inline:var(--space-3);position:relative}.strct-list--flush .strct-li{padding-inline:0}.strct-list--dividers .strct-li+.strct-li{border-block-start:1px solid var(--b1)}.strct-li__main{display:flex;align-items:center;gap:var(--space-2);flex:1;min-width:0;min-height:44px;padding-block:6px;text-align:start;border-radius:var(--radius-sm)}.strct-list--dense .strct-li__main{min-height:32px;padding-block:2px}.strct-li--interactive .strct-li__main{cursor:pointer}.strct-li--interactive:hover{background:var(--bg-2)}.strct-li--selected{background:var(--acc-s)}.strct-li__main:focus-visible{outline:2px solid var(--acc50);outline-offset:-2px}.strct-li--status:before{content:\"\";position:absolute;inset-block:0;inset-inline-start:0;width:2px;background:var(--t3)}.strct-li[data-status=accent]:before{background:var(--acc)}.strct-li[data-status=success]:before{background:var(--success)}.strct-li[data-status=warning]:before{background:var(--warning)}.strct-li[data-status=critical]:before{background:var(--critical)}.strct-li--wrap .strct-li__main,.strct-list--wrap .strct-li__main{align-items:flex-start}.strct-li--wrap .strct-li__leading,.strct-list--wrap .strct-li__leading{min-height:calc(var(--text-md) * 1.45)}.strct-li--wrap .strct-li__title,.strct-li--wrap .strct-li__desc,.strct-list--wrap .strct-li__title,.strct-list--wrap .strct-li__desc{overflow:visible;text-overflow:clip;white-space:normal;overflow-wrap:anywhere}.strct-li--wrap .strct-li__meta,.strct-list--wrap .strct-li__meta{align-self:flex-start;min-height:calc(var(--text-md) * 1.45)}.strct-li__leading:empty,.strct-li__meta:empty,.strct-li__desc:empty,.strct-li__trailing:empty{display:none}.strct-li__leading{display:inline-flex;align-items:center;flex:none}.strct-li__text{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}.strct-li__title{font-size:var(--text-md);color:var(--t1);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strct-li__desc{font-size:var(--text-sm);color:var(--t3);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strct-li__meta{display:inline-flex;align-items:center;flex:none;font-size:var(--text-sm);color:var(--t3);white-space:nowrap}.strct-li__trailing{display:inline-flex;align-items:center;gap:var(--space-2);flex:none}@container (max-width: 360px){.strct-li__main{flex-wrap:wrap}.strct-li__meta{flex-basis:100%;padding-inline-start:0}}\n"] }]
-        }], propDecorators: { interactive: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactive", required: false }] }], wrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "wrap", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], activated: [{ type: i0.Output, args: ["activated"] }] } });
+                    }, styles: [".strct-li{display:flex;align-items:center;gap:var(--space-2);padding-inline:var(--space-3);position:relative}.strct-list--flush .strct-li{padding-inline:0}.strct-list--dividers .strct-li+.strct-li{border-block-start:1px solid var(--b1)}.strct-li__main{display:flex;align-items:center;gap:var(--space-2);flex:1;min-width:0;min-height:44px;padding-block:6px;text-align:start;border-radius:var(--radius-sm)}.strct-list--dense .strct-li__main{min-height:32px;padding-block:2px}.strct-li--interactive .strct-li__main{cursor:pointer}.strct-li--disabled .strct-li__main{cursor:not-allowed;opacity:.6}.strct-li--disabled.strct-li--interactive:hover{background:none}.strct-li--interactive:hover{background:var(--bg-2)}.strct-li--selected{background:var(--acc-s)}.strct-li__main:focus-visible{outline:2px solid var(--acc50);outline-offset:-2px}.strct-li--status:before{content:\"\";position:absolute;inset-block:0;inset-inline-start:0;width:2px;background:var(--t3)}.strct-li[data-status=accent]:before{background:var(--acc)}.strct-li[data-status=success]:before{background:var(--success)}.strct-li[data-status=warning]:before{background:var(--warning)}.strct-li[data-status=critical]:before{background:var(--critical)}.strct-li--wrap .strct-li__main,.strct-list--wrap .strct-li__main{align-items:flex-start}.strct-li--wrap .strct-li__leading,.strct-list--wrap .strct-li__leading{min-height:calc(var(--text-md) * 1.45)}.strct-li--wrap .strct-li__title,.strct-li--wrap .strct-li__desc,.strct-list--wrap .strct-li__title,.strct-list--wrap .strct-li__desc{overflow:visible;text-overflow:clip;white-space:normal;overflow-wrap:anywhere}.strct-li--wrap .strct-li__meta,.strct-list--wrap .strct-li__meta{align-self:flex-start;min-height:calc(var(--text-md) * 1.45)}.strct-li__leading:empty,.strct-li__meta:empty,.strct-li__desc:empty,.strct-li__trailing:empty{display:none}.strct-li__leading{display:inline-flex;align-items:center;flex:none}.strct-li__text{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}.strct-li__title{font-size:var(--text-md);color:var(--t1);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strct-li__desc{font-size:var(--text-sm);color:var(--t3);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strct-li__meta{display:inline-flex;align-items:center;flex:none;font-size:var(--text-sm);color:var(--t3);white-space:nowrap}.strct-li__trailing{display:inline-flex;align-items:center;gap:var(--space-2);flex:none}@container (max-width: 360px){.strct-li__main{flex-wrap:wrap}.strct-li__meta{flex-basis:100%;padding-inline-start:0}}\n"] }]
+        }], propDecorators: { interactive: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactive", required: false }] }], wrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "wrap", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], disabledReason: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledReason", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], activated: [{ type: i0.Output, args: ["activated"] }] } });
 /**
  * A short list of things with a status — alarms, findings, clusters in a
  * summary. A table needs a header row and columns, a timeline implies time
@@ -2379,6 +2396,16 @@ class StrctTag {
      */
     activateLabel = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "activateLabel" }] : /* istanbul ignore next */ []));
+    /**
+     * The tag's body is a link to this address — an object chip in a reply opens
+     * the object's page. A link is what a middle click, a Ctrl/Cmd-click and
+     * "copy link address" need; `interactive` cannot give them.
+     */
+    href = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "href" }] : /* istanbul ignore next */ []));
+    /** `_blank` adds the `rel` a new tab needs. */
+    target = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "target" }] : /* istanbul ignore next */ []));
     /**
      * The body becomes a control: pointer, hover, focus ring, and `activated` on
      * click / Enter / Space. The × stays a separate tab stop, so "open it" and
@@ -2399,21 +2426,38 @@ class StrctTag {
             this.activated.emit();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctTag, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: StrctTag, isStandalone: true, selector: "strct-tag", inputs: { status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, removable: { classPropertyName: "removable", publicName: "removable", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, removeLabel: { classPropertyName: "removeLabel", publicName: "removeLabel", isSignal: true, isRequired: false, transformFunction: null }, activateLabel: { classPropertyName: "activateLabel", publicName: "activateLabel", isSignal: true, isRequired: false, transformFunction: null }, interactive: { classPropertyName: "interactive", publicName: "interactive", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, mono: { classPropertyName: "mono", publicName: "mono", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { removed: "removed", activated: "activated" }, host: { properties: { "class.strct-tag--interactive": "interactive() && !disabled()", "class.strct-tag--pill": "shape() === 'pill'", "class.strct-tag--mono": "mono()", "class.strct-tag--accent": "status() === 'accent'", "class.strct-tag--success": "status() === 'success'", "class.strct-tag--warning": "status() === 'warning'", "class.strct-tag--critical": "status() === 'critical'" }, classAttribute: "strct-tag" }, ngImport: i0, template: `
-    <span
-      class="strct-tag__text"
-      [attr.role]="interactive() ? 'button' : null"
-      [attr.tabindex]="interactive() && !disabled() ? 0 : null"
-      [attr.aria-label]="interactive() && activateLabel() ? activateLabel() : null"
-      (click)="onActivate()"
-      (keydown.enter)="onActivate()"
-      (keydown.space)="$event.preventDefault(); onActivate()"
-    >
-      <!-- Declared before the catch-all so the selector wins; it renders first
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: StrctTag, isStandalone: true, selector: "strct-tag", inputs: { status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, removable: { classPropertyName: "removable", publicName: "removable", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, removeLabel: { classPropertyName: "removeLabel", publicName: "removeLabel", isSignal: true, isRequired: false, transformFunction: null }, activateLabel: { classPropertyName: "activateLabel", publicName: "activateLabel", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, interactive: { classPropertyName: "interactive", publicName: "interactive", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, mono: { classPropertyName: "mono", publicName: "mono", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { removed: "removed", activated: "activated" }, host: { properties: { "class.strct-tag--interactive": "interactive() && !disabled()", "class.strct-tag--pill": "shape() === 'pill'", "class.strct-tag--mono": "mono()", "class.strct-tag--accent": "status() === 'accent'", "class.strct-tag--success": "status() === 'success'", "class.strct-tag--warning": "status() === 'warning'", "class.strct-tag--critical": "status() === 'critical'" }, classAttribute: "strct-tag" }, ngImport: i0, template: `
+    <!-- With an href the body is a real link: Ctrl/Cmd-click opens a tab, the
+         address shows on hover and it can be copied as a link — none of which
+         a role="button" can do. The same text, the same focus ring. -->
+    @if (href() && !disabled()) {
+      <a
+        class="strct-tag__text strct-tag__text--link"
+        [attr.href]="href()"
+        [attr.target]="target() || null"
+        [attr.rel]="target() === '_blank' ? 'noopener noreferrer' : null"
+        [attr.aria-label]="activateLabel() || null"
+        (click)="onActivate()"
+      >
+        <ng-content select="[strctTagLeading]" />
+        <ng-content />
+      </a>
+    } @else {
+      <span
+        class="strct-tag__text"
+        [attr.role]="interactive() ? 'button' : null"
+        [attr.tabindex]="interactive() && !disabled() ? 0 : null"
+        [attr.aria-label]="interactive() && activateLabel() ? activateLabel() : null"
+        (click)="onActivate()"
+        (keydown.enter)="onActivate()"
+        (keydown.space)="$event.preventDefault(); onActivate()"
+      >
+        <!-- Declared before the catch-all so the selector wins; it renders first
            either way. -->
-      <ng-content select="[strctTagLeading]" />
-      <ng-content />
-    </span>
+        <ng-content select="[strctTagLeading]" />
+        <ng-content />
+      </span>
+    }
     @if (removable() && !disabled()) {
       <button
         type="button"
@@ -2424,25 +2468,42 @@ class StrctTag {
         <strct-icon name="close" [size]="11" [strokeWidth]="1.6" />
       </button>
     }
-  `, isInline: true, styles: [".strct-tag{display:inline-flex;align-items:center;gap:5px;padding-block:3px;padding-inline:9px 4px;border-radius:4px;font-size:12px;font-weight:500;color:var(--t1);background:var(--bg-3);border:1px solid var(--b2)}.strct-tag:not(:has(.strct-tag__remove)){padding-inline-end:9px}.strct-tag--accent{color:var(--acc);border-color:var(--acc30);background:var(--acc-s)}.strct-tag--success{color:var(--success);border-color:var(--success);background:transparent}.strct-tag--warning{color:var(--warning);border-color:var(--warning);background:transparent}.strct-tag--critical{color:var(--critical);border-color:var(--critical);background:transparent}.strct-tag__text{display:inline-flex;align-items:center;gap:5px}.strct-tag--interactive .strct-tag__text{cursor:pointer;border-radius:3px}.strct-tag--interactive:hover{border-color:var(--b3);background:var(--bg-2)}.strct-tag--interactive.strct-tag--accent:hover{border-color:var(--acc)}.strct-tag__text:focus-visible{outline:2px solid var(--acc50);outline-offset:2px}.strct-tag--pill{border-radius:var(--radius-full, 999px);padding-inline:10px 5px}.strct-tag--pill:not(:has(.strct-tag__remove)){padding-inline-end:10px}.strct-tag--pill .strct-tag__remove{border-radius:999px}.strct-tag--mono{font-family:var(--mono)}.strct-tag__remove{display:inline-flex;padding:2px;border:0;border-radius:3px;background:transparent;color:currentColor;opacity:.65;cursor:pointer}.strct-tag__remove:hover,.strct-tag__remove:focus-visible{opacity:1;background:var(--dn)}\n"], dependencies: [{ kind: "component", type: StrctIcon, selector: "strct-icon", inputs: ["name", "strictName", "size", "strokeWidth", "badge", "ariaLabel", "count", "countMax", "countStatus", "countLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, styles: [".strct-tag{display:inline-flex;align-items:center;gap:5px;padding-block:3px;padding-inline:9px 4px;border-radius:4px;font-size:12px;font-weight:500;color:var(--t1);background:var(--bg-3);border:1px solid var(--b2)}.strct-tag:not(:has(.strct-tag__remove)){padding-inline-end:9px}.strct-tag--accent{color:var(--acc);border-color:var(--acc30);background:var(--acc-s)}.strct-tag--success{color:var(--success);border-color:var(--success);background:transparent}.strct-tag--warning{color:var(--warning);border-color:var(--warning);background:transparent}.strct-tag--critical{color:var(--critical);border-color:var(--critical);background:transparent}.strct-tag__text{display:inline-flex;align-items:center;gap:5px}.strct-tag__text--link{color:inherit;text-decoration:none;cursor:pointer}.strct-tag__text--link:hover{text-decoration:underline}.strct-tag--interactive .strct-tag__text{cursor:pointer;border-radius:3px}.strct-tag--interactive:hover{border-color:var(--b3);background:var(--bg-2)}.strct-tag--interactive.strct-tag--accent:hover{border-color:var(--acc)}.strct-tag__text:focus-visible{outline:2px solid var(--acc50);outline-offset:2px}.strct-tag--pill{border-radius:var(--radius-full, 999px);padding-inline:10px 5px}.strct-tag--pill:not(:has(.strct-tag__remove)){padding-inline-end:10px}.strct-tag--pill .strct-tag__remove{border-radius:999px}.strct-tag--mono{font-family:var(--mono)}.strct-tag__remove{display:inline-flex;padding:2px;border:0;border-radius:3px;background:transparent;color:currentColor;opacity:.65;cursor:pointer}.strct-tag__remove:hover,.strct-tag__remove:focus-visible{opacity:1;background:var(--dn)}\n"], dependencies: [{ kind: "component", type: StrctIcon, selector: "strct-icon", inputs: ["name", "strictName", "size", "strokeWidth", "badge", "ariaLabel", "count", "countMax", "countStatus", "countLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctTag, decorators: [{
             type: Component,
             args: [{ selector: 'strct-tag', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [StrctIcon], template: `
-    <span
-      class="strct-tag__text"
-      [attr.role]="interactive() ? 'button' : null"
-      [attr.tabindex]="interactive() && !disabled() ? 0 : null"
-      [attr.aria-label]="interactive() && activateLabel() ? activateLabel() : null"
-      (click)="onActivate()"
-      (keydown.enter)="onActivate()"
-      (keydown.space)="$event.preventDefault(); onActivate()"
-    >
-      <!-- Declared before the catch-all so the selector wins; it renders first
+    <!-- With an href the body is a real link: Ctrl/Cmd-click opens a tab, the
+         address shows on hover and it can be copied as a link — none of which
+         a role="button" can do. The same text, the same focus ring. -->
+    @if (href() && !disabled()) {
+      <a
+        class="strct-tag__text strct-tag__text--link"
+        [attr.href]="href()"
+        [attr.target]="target() || null"
+        [attr.rel]="target() === '_blank' ? 'noopener noreferrer' : null"
+        [attr.aria-label]="activateLabel() || null"
+        (click)="onActivate()"
+      >
+        <ng-content select="[strctTagLeading]" />
+        <ng-content />
+      </a>
+    } @else {
+      <span
+        class="strct-tag__text"
+        [attr.role]="interactive() ? 'button' : null"
+        [attr.tabindex]="interactive() && !disabled() ? 0 : null"
+        [attr.aria-label]="interactive() && activateLabel() ? activateLabel() : null"
+        (click)="onActivate()"
+        (keydown.enter)="onActivate()"
+        (keydown.space)="$event.preventDefault(); onActivate()"
+      >
+        <!-- Declared before the catch-all so the selector wins; it renders first
            either way. -->
-      <ng-content select="[strctTagLeading]" />
-      <ng-content />
-    </span>
+        <ng-content select="[strctTagLeading]" />
+        <ng-content />
+      </span>
+    }
     @if (removable() && !disabled()) {
       <button
         type="button"
@@ -2462,8 +2523,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
                         '[class.strct-tag--success]': "status() === 'success'",
                         '[class.strct-tag--warning]': "status() === 'warning'",
                         '[class.strct-tag--critical]': "status() === 'critical'",
-                    }, styles: [".strct-tag{display:inline-flex;align-items:center;gap:5px;padding-block:3px;padding-inline:9px 4px;border-radius:4px;font-size:12px;font-weight:500;color:var(--t1);background:var(--bg-3);border:1px solid var(--b2)}.strct-tag:not(:has(.strct-tag__remove)){padding-inline-end:9px}.strct-tag--accent{color:var(--acc);border-color:var(--acc30);background:var(--acc-s)}.strct-tag--success{color:var(--success);border-color:var(--success);background:transparent}.strct-tag--warning{color:var(--warning);border-color:var(--warning);background:transparent}.strct-tag--critical{color:var(--critical);border-color:var(--critical);background:transparent}.strct-tag__text{display:inline-flex;align-items:center;gap:5px}.strct-tag--interactive .strct-tag__text{cursor:pointer;border-radius:3px}.strct-tag--interactive:hover{border-color:var(--b3);background:var(--bg-2)}.strct-tag--interactive.strct-tag--accent:hover{border-color:var(--acc)}.strct-tag__text:focus-visible{outline:2px solid var(--acc50);outline-offset:2px}.strct-tag--pill{border-radius:var(--radius-full, 999px);padding-inline:10px 5px}.strct-tag--pill:not(:has(.strct-tag__remove)){padding-inline-end:10px}.strct-tag--pill .strct-tag__remove{border-radius:999px}.strct-tag--mono{font-family:var(--mono)}.strct-tag__remove{display:inline-flex;padding:2px;border:0;border-radius:3px;background:transparent;color:currentColor;opacity:.65;cursor:pointer}.strct-tag__remove:hover,.strct-tag__remove:focus-visible{opacity:1;background:var(--dn)}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], removable: [{ type: i0.Input, args: [{ isSignal: true, alias: "removable", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], removeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "removeLabel", required: false }] }], activateLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "activateLabel", required: false }] }], interactive: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactive", required: false }] }], shape: [{ type: i0.Input, args: [{ isSignal: true, alias: "shape", required: false }] }], mono: [{ type: i0.Input, args: [{ isSignal: true, alias: "mono", required: false }] }], removed: [{ type: i0.Output, args: ["removed"] }], activated: [{ type: i0.Output, args: ["activated"] }] } });
+                    }, styles: [".strct-tag{display:inline-flex;align-items:center;gap:5px;padding-block:3px;padding-inline:9px 4px;border-radius:4px;font-size:12px;font-weight:500;color:var(--t1);background:var(--bg-3);border:1px solid var(--b2)}.strct-tag:not(:has(.strct-tag__remove)){padding-inline-end:9px}.strct-tag--accent{color:var(--acc);border-color:var(--acc30);background:var(--acc-s)}.strct-tag--success{color:var(--success);border-color:var(--success);background:transparent}.strct-tag--warning{color:var(--warning);border-color:var(--warning);background:transparent}.strct-tag--critical{color:var(--critical);border-color:var(--critical);background:transparent}.strct-tag__text{display:inline-flex;align-items:center;gap:5px}.strct-tag__text--link{color:inherit;text-decoration:none;cursor:pointer}.strct-tag__text--link:hover{text-decoration:underline}.strct-tag--interactive .strct-tag__text{cursor:pointer;border-radius:3px}.strct-tag--interactive:hover{border-color:var(--b3);background:var(--bg-2)}.strct-tag--interactive.strct-tag--accent:hover{border-color:var(--acc)}.strct-tag__text:focus-visible{outline:2px solid var(--acc50);outline-offset:2px}.strct-tag--pill{border-radius:var(--radius-full, 999px);padding-inline:10px 5px}.strct-tag--pill:not(:has(.strct-tag__remove)){padding-inline-end:10px}.strct-tag--pill .strct-tag__remove{border-radius:999px}.strct-tag--mono{font-family:var(--mono)}.strct-tag__remove{display:inline-flex;padding:2px;border:0;border-radius:3px;background:transparent;color:currentColor;opacity:.65;cursor:pointer}.strct-tag__remove:hover,.strct-tag__remove:focus-visible{opacity:1;background:var(--dn)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], removable: [{ type: i0.Input, args: [{ isSignal: true, alias: "removable", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], removeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "removeLabel", required: false }] }], activateLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "activateLabel", required: false }] }], href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], target: [{ type: i0.Input, args: [{ isSignal: true, alias: "target", required: false }] }], interactive: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactive", required: false }] }], shape: [{ type: i0.Input, args: [{ isSignal: true, alias: "shape", required: false }] }], mono: [{ type: i0.Input, args: [{ isSignal: true, alias: "mono", required: false }] }], removed: [{ type: i0.Output, args: ["removed"] }], activated: [{ type: i0.Output, args: ["activated"] }] } });
 
 /**
  * Circular avatar: an image when `src` is set, otherwise initials from `name`.
@@ -4996,6 +5057,15 @@ class StrctModal {
      * `dismissible` for lightweight, transient dialogs where quick dismissal is fine.
      */
     dismissible = input(false, { ...(ngDevMode ? { debugName: "dismissible" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Escape closes the dialog. Defaults to `dismissible`; set it on its own for
+     * a window that should close on Escape — nothing is lost — but not on a
+     * stray click outside it. An Escape a focused control already handled
+     * (`defaultPrevented`) is left alone.
+     */
+    closeOnEscape = input(null, { ...(ngDevMode ? { debugName: "closeOnEscape" } : /* istanbul ignore next */ {}), transform: (v) => (v === null || v === undefined ? null : booleanAttribute(v)) });
+    /** A click on the backdrop closes it. Defaults to `dismissible`. */
+    closeOnBackdrop = input(null, { ...(ngDevMode ? { debugName: "closeOnBackdrop" } : /* istanbul ignore next */ {}), transform: (v) => (v === null || v === undefined ? null : booleanAttribute(v)) });
     /** Allow repositioning the dialog by dragging its header (mouse + touch). */
     draggable = input(false, { ...(ngDevMode ? { debugName: "draggable" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     /** Extra class(es) added to the dialog panel — style it from app-global CSS. */
@@ -5073,12 +5143,17 @@ class StrctModal {
         // that bubbled up from a child (e.g. a space typed in an input/textarea).
         if (event && event.target !== event.currentTarget)
             return;
-        if (this.dismissible())
+        if (this.closeOnBackdrop() ?? this.dismissible())
             this.close();
     }
-    onEscape() {
+    onEscape(event) {
+        // A control that used Escape first keeps it: an IME composition, a
+        // searchbox that clears. Both mark the event handled.
+        if (event?.defaultPrevented)
+            return;
         // With several modals open, only the topmost one reacts to Escape.
-        if (this.open() && this.dismissible() && isTopmostModal(this))
+        const allowed = this.closeOnEscape() ?? this.dismissible();
+        if (this.open() && allowed && isTopmostModal(this))
             this.close();
     }
     /** Wrap Tab focus within the dialog. */
@@ -5167,7 +5242,7 @@ class StrctModal {
         (items[0] ?? this.dialog())?.focus();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctModal, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: StrctModal, isStandalone: true, selector: "strct-modal", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, hideFooter: { classPropertyName: "hideFooter", publicName: "hideFooter", isSignal: true, isRequired: false, transformFunction: null }, chromeless: { classPropertyName: "chromeless", publicName: "chromeless", isSignal: true, isRequired: false, transformFunction: null }, closeLabel: { classPropertyName: "closeLabel", publicName: "closeLabel", isSignal: true, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: true, isRequired: false, transformFunction: null }, backdropClass: { classPropertyName: "backdropClass", publicName: "backdropClass", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", closed: "closed" }, host: { listeners: { "document:keydown.escape": "onEscape()" } }, queries: [{ propertyName: "lazyContent", first: true, predicate: StrctModalContent, descendants: true, isSignal: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: StrctModal, isStandalone: true, selector: "strct-modal", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, hideFooter: { classPropertyName: "hideFooter", publicName: "hideFooter", isSignal: true, isRequired: false, transformFunction: null }, chromeless: { classPropertyName: "chromeless", publicName: "chromeless", isSignal: true, isRequired: false, transformFunction: null }, closeLabel: { classPropertyName: "closeLabel", publicName: "closeLabel", isSignal: true, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdrop: { classPropertyName: "closeOnBackdrop", publicName: "closeOnBackdrop", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: true, isRequired: false, transformFunction: null }, backdropClass: { classPropertyName: "backdropClass", publicName: "backdropClass", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", closed: "closed" }, host: { listeners: { "document:keydown.escape": "onEscape($event)" } }, queries: [{ propertyName: "lazyContent", first: true, predicate: StrctModalContent, descendants: true, isSignal: true }], ngImport: i0, template: `
     @if (open()) {
       <!-- Backdrop: pointer-only dismiss target. No role/tabindex — keyboard users
            dismiss via Escape, and the focus trap makes the backdrop unreachable
@@ -5288,9 +5363,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
       </div>
     }
   `, host: {
-                        '(document:keydown.escape)': 'onEscape()',
+                        '(document:keydown.escape)': 'onEscape($event)',
                     }, styles: [".strct-modal__overlay{position:fixed;inset:0;z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;padding:var(--space-5);background:var(--backdrop);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:strct-modal-fade .12s ease}@media(max-width:768px){.strct-modal__overlay{padding:var(--space-3)}}.strct-modal__dialog{width:100%;max-height:calc(100vh - 48px);display:flex;flex-direction:column;background:var(--bg-1);border:1px solid var(--b2);border-radius:var(--radius-xl);box-shadow:var(--shadow-elevated);overflow:hidden;animation:strct-modal-rise .14s ease}.strct-modal__dialog--sm{max-width:min(480px,calc(100vw - 32px))}.strct-modal__dialog--md{max-width:min(640px,calc(100vw - 32px))}.strct-modal__dialog--lg{max-width:min(860px,calc(100vw - 32px))}.strct-modal__dialog--xl{max-width:min(1080px,calc(100vw - 32px))}.strct-modal__head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--b1)}.strct-modal__head--drag{cursor:move;-webkit-user-select:none;user-select:none;touch-action:none}.strct-modal__overlay--glass{background:#00000061;-webkit-backdrop-filter:blur(10px) saturate(1.25);backdrop-filter:blur(10px) saturate(1.25)}.strct-modal__dialog--glass{background:color-mix(in srgb,var(--bg-1) 72%,transparent);-webkit-backdrop-filter:blur(24px) saturate(1.4);backdrop-filter:blur(24px) saturate(1.4)}.strct-modal__dialog--glass .strct-modal__foot{background:color-mix(in srgb,var(--bg-2) 55%,transparent)}.strct-modal__title{font-size:14px;font-weight:600;color:var(--t1)}.strct-modal__close{display:inline-flex;padding:4px;border:0;border-radius:5px;background:transparent;color:var(--t3);cursor:pointer}.strct-modal__close:hover{color:var(--t1);background:var(--bg-3)}.strct-modal__body{padding:var(--space-4);overflow-y:auto;color:var(--t2);font-size:13px}.strct-modal__dialog--chromeless{width:calc(232px + var(--strct-wiz-content-min, 864px) + 2px);max-width:calc(100vw - 32px)}.strct-modal__dialog--chromeless:has(.strct-wiz__layout--aside){width:calc(232px + var(--strct-wiz-content-min, 864px) + 280px + 2px)}.strct-modal__dialog--chromeless .strct-modal__body{padding:0;overflow:hidden;display:flex;flex-direction:column;flex:1;min-height:0}.strct-modal__dialog--chromeless .strct-modal__body>*{flex:1;min-height:0}.strct-modal__foot{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-2);padding:var(--space-3) var(--space-4);border-top:1px solid var(--b1);background:var(--bg-2)}@keyframes strct-modal-fade{0%{opacity:0}}@keyframes strct-modal-rise{0%{opacity:0;transform:translateY(8px) scale(.98)}}@media(prefers-reduced-motion:reduce){.strct-modal__overlay,.strct-modal__dialog{animation:none}}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], hideFooter: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideFooter", required: false }] }], chromeless: [{ type: i0.Input, args: [{ isSignal: true, alias: "chromeless", required: false }] }], closeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeLabel", required: false }] }], dismissible: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissible", required: false }] }], draggable: [{ type: i0.Input, args: [{ isSignal: true, alias: "draggable", required: false }] }], panelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelClass", required: false }] }], backdropClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "backdropClass", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], closed: [{ type: i0.Output, args: ["closed"] }], lazyContent: [{ type: i0.ContentChild, args: [i0.forwardRef(() => StrctModalContent), { isSignal: true }] }] } });
+        }], ctorParameters: () => [], propDecorators: { open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], hideFooter: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideFooter", required: false }] }], chromeless: [{ type: i0.Input, args: [{ isSignal: true, alias: "chromeless", required: false }] }], closeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeLabel", required: false }] }], dismissible: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissible", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], closeOnBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnBackdrop", required: false }] }], draggable: [{ type: i0.Input, args: [{ isSignal: true, alias: "draggable", required: false }] }], panelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelClass", required: false }] }], backdropClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "backdropClass", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], closed: [{ type: i0.Output, args: ["closed"] }], lazyContent: [{ type: i0.ContentChild, args: [i0.forwardRef(() => StrctModalContent), { isSignal: true }] }] } });
 
 /** Marks the drawer's footer action area: `<ng-container strctDrawerFooter>…`. */
 class StrctDrawerFooter {
@@ -10001,7 +10076,7 @@ class StrctChips {
         (blur)="commitDraft(); onTouched()"
       />
     </div>
-  `, isInline: true, styles: [".strct-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;width:100%;min-height:38px;padding:5px 8px;background:var(--bg-2);border:1px solid var(--b2);border-radius:6px;cursor:text;transition:border-color .14s ease,box-shadow .14s ease}.strct-chips:focus-within{border-color:var(--acc50);box-shadow:0 0 0 3px var(--acc18);background:var(--bg-1)}.strct-chips__input{flex:1;min-width:80px;border:0;outline:none;background:transparent;font-family:var(--font);font-size:13px;color:var(--t1);padding:3px 2px}.strct-chips__input::placeholder{color:var(--t3)}\n"], dependencies: [{ kind: "component", type: StrctTag, selector: "strct-tag", inputs: ["status", "removable", "disabled", "removeLabel", "activateLabel", "interactive", "shape", "mono"], outputs: ["removed", "activated"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, styles: [".strct-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;width:100%;min-height:38px;padding:5px 8px;background:var(--bg-2);border:1px solid var(--b2);border-radius:6px;cursor:text;transition:border-color .14s ease,box-shadow .14s ease}.strct-chips:focus-within{border-color:var(--acc50);box-shadow:0 0 0 3px var(--acc18);background:var(--bg-1)}.strct-chips__input{flex:1;min-width:80px;border:0;outline:none;background:transparent;font-family:var(--font);font-size:13px;color:var(--t1);padding:3px 2px}.strct-chips__input::placeholder{color:var(--t3)}\n"], dependencies: [{ kind: "component", type: StrctTag, selector: "strct-tag", inputs: ["status", "removable", "disabled", "removeLabel", "activateLabel", "href", "target", "interactive", "shape", "mono"], outputs: ["removed", "activated"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctChips, decorators: [{
             type: Component,
@@ -25542,6 +25617,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
         }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], closeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeLabel", required: false }] }], restoreLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "restoreLabel", required: false }] }], itemTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => StrctWindowDockItem), { ...{ read: TemplateRef }, isSignal: true }] }], restoreMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "restoreMode", required: false }] }], restoreRequest: [{ type: i0.Output, args: ["restoreRequest"] }] } });
 
 /** A card the message carries — an action to approve, a result to read. */
+/** A quiet row under the bubble — copy, a status, a fold. */
+class StrctChatMessageActions {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctChatMessageActions, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.4", type: StrctChatMessageActions, isStandalone: true, selector: "[strctChatMessageActions]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctChatMessageActions, decorators: [{
+            type: Directive,
+            args: [{ selector: '[strctChatMessageActions]' }]
+        }] });
 class StrctChatAttachment {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctChatAttachment, deps: [], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.4", type: StrctChatAttachment, isStandalone: true, selector: "[strctChatAttachment]", host: { classAttribute: "strct-chat__attachment" }, ngImport: i0 });
@@ -25710,8 +25794,14 @@ class StrctChatMessage {
         }
       </div>
       <ng-content select="[strctChatAttachment]" />
+      <!-- Copy, a status ("Stopped", "Model call failed"), a quiet "Used 3
+           tools" fold. It was going into the attachment slot, which the
+           library documents as a card the message carries. -->
+      <div class="strct-msg__actions">
+        <ng-content select="[strctChatMessageActions]" />
+      </div>
     </div>
-  `, isInline: true, styles: [".strct-msg{display:flex;align-items:flex-start;gap:var(--space-2);min-width:0}.strct-msg[data-author=user]{flex-direction:row-reverse}.strct-msg[data-author=system]{justify-content:center}.strct-msg__avatar{flex:none}.strct-msg__body{display:flex;flex-direction:column;gap:4px;min-width:0;max-width:80%}.strct-msg[data-author=user] .strct-msg__body{align-items:flex-end}.strct-msg__meta{display:flex;align-items:baseline;gap:6px;font-size:var(--text-sm);color:var(--t3)}.strct-msg__name{font-weight:600}.strct-msg__bubble{padding:var(--space-2) var(--space-3);border:1px solid var(--b2);border-radius:var(--radius-lg);background:var(--bg-2);color:var(--t1);font-size:13px;line-height:1.5;min-width:0;overflow-wrap:anywhere}.strct-msg[data-author=user] .strct-msg__bubble{background:var(--acc-s);border-color:var(--acc30)}.strct-msg[data-author=system] .strct-msg__bubble{border:0;background:none;color:var(--t3);font-size:var(--text-sm);text-align:center}.strct-msg__caret{display:inline-block;width:2px;height:1em;margin-inline-start:2px;vertical-align:text-bottom;background:var(--acc);animation:strct-chat-caret 1s steps(2,start) infinite}@keyframes strct-chat-caret{to{opacity:0}}@media(prefers-reduced-motion:reduce){.strct-msg__caret{animation:none}}.strct-chat__attachment{display:block;margin-block-start:4px}\n"], dependencies: [{ kind: "component", type: StrctAvatar, selector: "strct-avatar", inputs: ["icon", "shape", "tone", "src", "name", "size", "status"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, styles: [".strct-msg{display:flex;align-items:flex-start;gap:var(--space-2);min-width:0}.strct-msg[data-author=user]{flex-direction:row-reverse}.strct-msg[data-author=system]{justify-content:center}.strct-msg__avatar{flex:none}.strct-msg__body{display:flex;flex-direction:column;gap:4px;min-width:0;max-width:80%}.strct-msg[data-author=user] .strct-msg__body{align-items:flex-end}.strct-msg__meta{display:flex;align-items:baseline;gap:6px;font-size:var(--text-sm);color:var(--t3)}.strct-msg__name{font-weight:600}.strct-msg__actions:empty{display:none}.strct-msg__actions{display:flex;align-items:center;gap:var(--space-2);margin-block-start:4px;font-size:var(--text-sm);color:var(--t3)}.strct-msg__bubble{padding:var(--space-2) var(--space-3);border:1px solid var(--b2);border-radius:var(--radius-lg);background:var(--bg-2);color:var(--t1);font-size:13px;line-height:1.5;min-width:0;overflow-wrap:anywhere}.strct-msg[data-author=user] .strct-msg__bubble{background:var(--acc-s);border-color:var(--acc30)}.strct-msg[data-author=system] .strct-msg__bubble{border:0;background:none;color:var(--t3);font-size:var(--text-sm);text-align:center}.strct-msg__caret{display:inline-block;width:2px;height:1em;margin-inline-start:2px;vertical-align:text-bottom;background:var(--acc);animation:strct-chat-caret 1s steps(2,start) infinite}@keyframes strct-chat-caret{to{opacity:0}}@media(prefers-reduced-motion:reduce){.strct-msg__caret{animation:none}}.strct-chat__attachment{display:block;margin-block-start:4px}\n"], dependencies: [{ kind: "component", type: StrctAvatar, selector: "strct-avatar", inputs: ["icon", "shape", "tone", "src", "name", "size", "status"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctChatMessage, decorators: [{
             type: Component,
@@ -25743,6 +25833,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
         }
       </div>
       <ng-content select="[strctChatAttachment]" />
+      <!-- Copy, a status ("Stopped", "Model call failed"), a quiet "Used 3
+           tools" fold. It was going into the attachment slot, which the
+           library documents as a card the message carries. -->
+      <div class="strct-msg__actions">
+        <ng-content select="[strctChatMessageActions]" />
+      </div>
     </div>
   `, host: {
                         class: 'strct-msg',
@@ -25751,7 +25847,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
                         '[attr.aria-label]': 'displayName()',
                         // A streaming reply is announced when it finishes, not token by token.
                         '[attr.aria-busy]': 'streaming() ? "true" : null',
-                    }, styles: [".strct-msg{display:flex;align-items:flex-start;gap:var(--space-2);min-width:0}.strct-msg[data-author=user]{flex-direction:row-reverse}.strct-msg[data-author=system]{justify-content:center}.strct-msg__avatar{flex:none}.strct-msg__body{display:flex;flex-direction:column;gap:4px;min-width:0;max-width:80%}.strct-msg[data-author=user] .strct-msg__body{align-items:flex-end}.strct-msg__meta{display:flex;align-items:baseline;gap:6px;font-size:var(--text-sm);color:var(--t3)}.strct-msg__name{font-weight:600}.strct-msg__bubble{padding:var(--space-2) var(--space-3);border:1px solid var(--b2);border-radius:var(--radius-lg);background:var(--bg-2);color:var(--t1);font-size:13px;line-height:1.5;min-width:0;overflow-wrap:anywhere}.strct-msg[data-author=user] .strct-msg__bubble{background:var(--acc-s);border-color:var(--acc30)}.strct-msg[data-author=system] .strct-msg__bubble{border:0;background:none;color:var(--t3);font-size:var(--text-sm);text-align:center}.strct-msg__caret{display:inline-block;width:2px;height:1em;margin-inline-start:2px;vertical-align:text-bottom;background:var(--acc);animation:strct-chat-caret 1s steps(2,start) infinite}@keyframes strct-chat-caret{to{opacity:0}}@media(prefers-reduced-motion:reduce){.strct-msg__caret{animation:none}}.strct-chat__attachment{display:block;margin-block-start:4px}\n"] }]
+                    }, styles: [".strct-msg{display:flex;align-items:flex-start;gap:var(--space-2);min-width:0}.strct-msg[data-author=user]{flex-direction:row-reverse}.strct-msg[data-author=system]{justify-content:center}.strct-msg__avatar{flex:none}.strct-msg__body{display:flex;flex-direction:column;gap:4px;min-width:0;max-width:80%}.strct-msg[data-author=user] .strct-msg__body{align-items:flex-end}.strct-msg__meta{display:flex;align-items:baseline;gap:6px;font-size:var(--text-sm);color:var(--t3)}.strct-msg__name{font-weight:600}.strct-msg__actions:empty{display:none}.strct-msg__actions{display:flex;align-items:center;gap:var(--space-2);margin-block-start:4px;font-size:var(--text-sm);color:var(--t3)}.strct-msg__bubble{padding:var(--space-2) var(--space-3);border:1px solid var(--b2);border-radius:var(--radius-lg);background:var(--bg-2);color:var(--t1);font-size:13px;line-height:1.5;min-width:0;overflow-wrap:anywhere}.strct-msg[data-author=user] .strct-msg__bubble{background:var(--acc-s);border-color:var(--acc30)}.strct-msg[data-author=system] .strct-msg__bubble{border:0;background:none;color:var(--t3);font-size:var(--text-sm);text-align:center}.strct-msg__caret{display:inline-block;width:2px;height:1em;margin-inline-start:2px;vertical-align:text-bottom;background:var(--acc);animation:strct-chat-caret 1s steps(2,start) infinite}@keyframes strct-chat-caret{to{opacity:0}}@media(prefers-reduced-motion:reduce){.strct-msg__caret{animation:none}}.strct-chat__attachment{display:block;margin-block-start:4px}\n"] }]
         }], propDecorators: { author: [{ type: i0.Input, args: [{ isSignal: true, alias: "author", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], avatarIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarIcon", required: false }] }], streaming: [{ type: i0.Input, args: [{ isSignal: true, alias: "streaming", required: false }] }], time: [{ type: i0.Input, args: [{ isSignal: true, alias: "time", required: false }] }], timeFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "timeFormat", required: false }] }], authorNames: [{ type: i0.Input, args: [{ isSignal: true, alias: "authorNames", required: false }] }] } });
 /**
  * The box the user writes in: it grows with the text up to `maxRows`, sends on
@@ -25775,6 +25871,17 @@ class StrctChatComposer {
      * while a reply is still streaming. `disabled` stops the typing as well.
      */
     sendDisabled = input(false, { ...(ngDevMode ? { debugName: "sendDisabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * A reply is streaming: the one button becomes Stop, where every chat the
+     * operators know puts it. It is enabled whatever the draft holds, and Enter
+     * still never sends — the draft stays editable meanwhile.
+     */
+    busy = input(false, { ...(ngDevMode ? { debugName: "busy" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** What the Stop button is called. */
+    stopLabel = input('Stop', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "stopLabel" }] : /* istanbul ignore next */ []));
+    /** The reader asked for the reply to stop. */
+    stop = output();
     /** How tall the box grows before it scrolls. */
     maxRows = input(8, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "maxRows" }] : /* istanbul ignore next */ []));
@@ -25807,7 +25914,7 @@ class StrctChatComposer {
     }
     submit() {
         const text = this.value().trim();
-        if (!text || this.disabled() || this.sendDisabled())
+        if (!text || this.disabled() || this.sendDisabled() || this.busy())
             return;
         this.send.emit(text);
         this.value.set('');
@@ -25819,7 +25926,7 @@ class StrctChatComposer {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctChatComposer, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: StrctChatComposer, isStandalone: true, selector: "strct-chat-composer", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, sendDisabled: { classPropertyName: "sendDisabled", publicName: "sendDisabled", isSignal: true, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: true, isRequired: false, transformFunction: null }, sendLabel: { classPropertyName: "sendLabel", publicName: "sendLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", send: "send" }, host: { classAttribute: "strct-composer" }, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: StrctChatComposer, isStandalone: true, selector: "strct-chat-composer", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, sendDisabled: { classPropertyName: "sendDisabled", publicName: "sendDisabled", isSignal: true, isRequired: false, transformFunction: null }, busy: { classPropertyName: "busy", publicName: "busy", isSignal: true, isRequired: false, transformFunction: null }, stopLabel: { classPropertyName: "stopLabel", publicName: "stopLabel", isSignal: true, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: true, isRequired: false, transformFunction: null }, sendLabel: { classPropertyName: "sendLabel", publicName: "sendLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", stop: "stop", send: "send" }, host: { classAttribute: "strct-composer" }, ngImport: i0, template: `
     <label class="strct-composer__label" [attr.for]="inputId">{{ label() }}</label>
     <div class="strct-composer__box">
       <textarea
@@ -25838,14 +25945,19 @@ class StrctChatComposer {
       <button
         type="button"
         class="strct-composer__send"
-        [attr.aria-label]="sendLabel()"
-        [disabled]="disabled() || sendDisabled() || !value().trim()"
-        (click)="submit()"
+        [class.strct-composer__send--stop]="busy()"
+        [attr.aria-label]="busy() ? stopLabel() : sendLabel()"
+        [disabled]="busy() ? disabled() : disabled() || sendDisabled() || !value().trim()"
+        (click)="busy() ? stop.emit() : submit()"
       >
-        <strct-icon strictName="arrowUp" [size]="15" [strokeWidth]="1.8" />
+        @if (busy()) {
+          <span class="strct-composer__stopmark" aria-hidden="true"></span>
+        } @else {
+          <strct-icon strictName="arrowUp" [size]="15" [strokeWidth]="1.8" />
+        }
       </button>
     </div>
-  `, isInline: true, styles: [".strct-composer{display:block}.strct-composer__label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.strct-composer__box{display:flex;align-items:flex-end;gap:4px;padding:4px 4px 4px var(--space-3);border:1px solid var(--b2);border-radius:var(--radius-lg);background:var(--bg-2);transition:border-color .14s ease,box-shadow .14s ease}.strct-composer__box:focus-within{border-color:var(--acc50);box-shadow:0 0 0 3px var(--acc18);background:var(--bg-1)}.strct-composer__input{flex:1;min-width:0;border:0;background:none;resize:none;padding:6px 0;font-family:var(--font);font-size:13px;line-height:20px;color:var(--t1);overflow-y:auto}.strct-composer__input:focus{outline:none}.strct-composer__input::placeholder{color:var(--t3)}.strct-composer__send{display:inline-flex;align-items:center;justify-content:center;flex:none;width:28px;height:28px;border:0;border-radius:var(--radius-md);background:var(--acc);color:var(--inv);cursor:pointer}.strct-composer__send:disabled{opacity:var(--disabled-opacity);cursor:not-allowed}.strct-composer__send:focus-visible{outline:2px solid var(--acc50);outline-offset:2px}\n"], dependencies: [{ kind: "component", type: StrctIcon, selector: "strct-icon", inputs: ["name", "strictName", "size", "strokeWidth", "badge", "ariaLabel", "count", "countMax", "countStatus", "countLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, styles: [".strct-composer{display:block}.strct-composer__label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.strct-composer__box{display:flex;align-items:flex-end;gap:4px;padding:4px 4px 4px var(--space-3);border:1px solid var(--b2);border-radius:var(--radius-lg);background:var(--bg-2);transition:border-color .14s ease,box-shadow .14s ease}.strct-composer__box:focus-within{border-color:var(--acc50);box-shadow:0 0 0 3px var(--acc18);background:var(--bg-1)}.strct-composer__input{flex:1;min-width:0;border:0;background:none;resize:none;padding:6px 0;font-family:var(--font);font-size:13px;line-height:20px;color:var(--t1);overflow-y:auto}.strct-composer__input:focus{outline:none}.strct-composer__input::placeholder{color:var(--t3)}.strct-composer__send{display:inline-flex;align-items:center;justify-content:center;flex:none;width:28px;height:28px;border:0;border-radius:var(--radius-md);background:var(--acc);color:var(--inv);cursor:pointer}.strct-composer__stopmark{width:10px;height:10px;border-radius:2px;background:currentColor}.strct-composer__send:disabled{opacity:var(--disabled-opacity);cursor:not-allowed}.strct-composer__send:focus-visible{outline:2px solid var(--acc50);outline-offset:2px}\n"], dependencies: [{ kind: "component", type: StrctIcon, selector: "strct-icon", inputs: ["name", "strictName", "size", "strokeWidth", "badge", "ariaLabel", "count", "countMax", "countStatus", "countLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctChatComposer, decorators: [{
             type: Component,
@@ -25868,15 +25980,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
       <button
         type="button"
         class="strct-composer__send"
-        [attr.aria-label]="sendLabel()"
-        [disabled]="disabled() || sendDisabled() || !value().trim()"
-        (click)="submit()"
+        [class.strct-composer__send--stop]="busy()"
+        [attr.aria-label]="busy() ? stopLabel() : sendLabel()"
+        [disabled]="busy() ? disabled() : disabled() || sendDisabled() || !value().trim()"
+        (click)="busy() ? stop.emit() : submit()"
       >
-        <strct-icon strictName="arrowUp" [size]="15" [strokeWidth]="1.8" />
+        @if (busy()) {
+          <span class="strct-composer__stopmark" aria-hidden="true"></span>
+        } @else {
+          <strct-icon strictName="arrowUp" [size]="15" [strokeWidth]="1.8" />
+        }
       </button>
     </div>
-  `, host: { class: 'strct-composer' }, styles: [".strct-composer{display:block}.strct-composer__label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.strct-composer__box{display:flex;align-items:flex-end;gap:4px;padding:4px 4px 4px var(--space-3);border:1px solid var(--b2);border-radius:var(--radius-lg);background:var(--bg-2);transition:border-color .14s ease,box-shadow .14s ease}.strct-composer__box:focus-within{border-color:var(--acc50);box-shadow:0 0 0 3px var(--acc18);background:var(--bg-1)}.strct-composer__input{flex:1;min-width:0;border:0;background:none;resize:none;padding:6px 0;font-family:var(--font);font-size:13px;line-height:20px;color:var(--t1);overflow-y:auto}.strct-composer__input:focus{outline:none}.strct-composer__input::placeholder{color:var(--t3)}.strct-composer__send{display:inline-flex;align-items:center;justify-content:center;flex:none;width:28px;height:28px;border:0;border-radius:var(--radius-md);background:var(--acc);color:var(--inv);cursor:pointer}.strct-composer__send:disabled{opacity:var(--disabled-opacity);cursor:not-allowed}.strct-composer__send:focus-visible{outline:2px solid var(--acc50);outline-offset:2px}\n"] }]
-        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], sendDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "sendDisabled", required: false }] }], maxRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxRows", required: false }] }], sendLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "sendLabel", required: false }] }], send: [{ type: i0.Output, args: ["send"] }] } });
+  `, host: { class: 'strct-composer' }, styles: [".strct-composer{display:block}.strct-composer__label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.strct-composer__box{display:flex;align-items:flex-end;gap:4px;padding:4px 4px 4px var(--space-3);border:1px solid var(--b2);border-radius:var(--radius-lg);background:var(--bg-2);transition:border-color .14s ease,box-shadow .14s ease}.strct-composer__box:focus-within{border-color:var(--acc50);box-shadow:0 0 0 3px var(--acc18);background:var(--bg-1)}.strct-composer__input{flex:1;min-width:0;border:0;background:none;resize:none;padding:6px 0;font-family:var(--font);font-size:13px;line-height:20px;color:var(--t1);overflow-y:auto}.strct-composer__input:focus{outline:none}.strct-composer__input::placeholder{color:var(--t3)}.strct-composer__send{display:inline-flex;align-items:center;justify-content:center;flex:none;width:28px;height:28px;border:0;border-radius:var(--radius-md);background:var(--acc);color:var(--inv);cursor:pointer}.strct-composer__stopmark{width:10px;height:10px;border-radius:2px;background:currentColor}.strct-composer__send:disabled{opacity:var(--disabled-opacity);cursor:not-allowed}.strct-composer__send:focus-visible{outline:2px solid var(--acc50);outline-offset:2px}\n"] }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], sendDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "sendDisabled", required: false }] }], busy: [{ type: i0.Input, args: [{ isSignal: true, alias: "busy", required: false }] }], stopLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "stopLabel", required: false }] }], stop: [{ type: i0.Output, args: ["stop"] }], maxRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxRows", required: false }] }], sendLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "sendLabel", required: false }] }], send: [{ type: i0.Output, args: ["send"] }] } });
 let composerCounter = 0;
 
 /**
@@ -26704,7 +26821,7 @@ class StrctConfirmOutlet {
         </ng-container>
       }
     </strct-modal>
-  `, isInline: true, styles: [".strct-confirm__message{margin:0;color:var(--t2)}\n"], dependencies: [{ kind: "component", type: StrctModal, selector: "strct-modal", inputs: ["open", "title", "size", "hideFooter", "chromeless", "closeLabel", "dismissible", "draggable", "panelClass", "backdropClass", "variant"], outputs: ["openChange", "closed"] }, { kind: "component", type: StrctButton, selector: "button[strct-button], a[strct-button]", inputs: ["variant", "size", "solid", "block", "iconOnly"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, styles: [".strct-confirm__message{margin:0;color:var(--t2)}\n"], dependencies: [{ kind: "component", type: StrctModal, selector: "strct-modal", inputs: ["open", "title", "size", "hideFooter", "chromeless", "closeLabel", "dismissible", "closeOnEscape", "closeOnBackdrop", "draggable", "panelClass", "backdropClass", "variant"], outputs: ["openChange", "closed"] }, { kind: "component", type: StrctButton, selector: "button[strct-button], a[strct-button]", inputs: ["variant", "size", "solid", "block", "iconOnly"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctConfirmOutlet, decorators: [{
             type: Component,
@@ -28294,6 +28411,1035 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
   `, host: { class: 'strct-heatmap' }, styles: [".strct-heatmap{display:block}.strct-heatmap__svg{width:100%;display:block}.strct-heatmap__empty{display:flex;align-items:center;justify-content:center;min-height:60px;font-size:12px;color:var(--t3)}.strct-heatmap__label{fill:var(--t3);font-size:10px}.strct-heatmap__label--row{font-family:var(--font)}.strct-heatmap__label--col{font-family:var(--mono);font-variant-numeric:tabular-nums}.strct-heatmap__cell{stroke:var(--bg-1);stroke-width:1}@media(prefers-reduced-motion:no-preference){.strct-heatmap__cell{transition:opacity .12s ease}}.strct-heatmap__cell:hover{opacity:.75}\n"] }]
         }], ctorParameters: () => [], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], cols: [{ type: i0.Input, args: [{ isSignal: true, alias: "cols", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], colLabelEvery: [{ type: i0.Input, args: [{ isSignal: true, alias: "colLabelEvery", required: false }] }], colLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "colLabel", required: false }] }], valueFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueFormat", required: false }] }], thresholds: [{ type: i0.Input, args: [{ isSignal: true, alias: "thresholds", required: false }] }], status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], emptyText: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyText", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], summaryFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "summaryFormat", required: false }] }], cellHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellHeight", required: false }] }], gap: [{ type: i0.Input, args: [{ isSignal: true, alias: "gap", required: false }] }], rowLabelWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowLabelWidth", required: false }] }] } });
 
+/**
+ * A Markdown reader that produces plain objects — never HTML.
+ *
+ * A model's reply is Markdown, and an app that reaches for a Markdown library
+ * ends up handing the browser a string of HTML (`innerHTML` plus a sanitiser),
+ * which a sealed, reviewed build cannot accept. This reader returns a tree the
+ * templates draw with ordinary bindings, so every word reaches the page as a
+ * text node and raw HTML is shown as the characters it is.
+ *
+ * It is deliberately a subset of CommonMark + GFM: paragraphs, ATX headings,
+ * fenced code, lists (nested), block quotes, thematic breaks, tables with
+ * alignment, and inline emphasis / strong / strikethrough / code / links /
+ * autolinks. Everything else is text.
+ *
+ * Every loop is bounded, because the input is a remote model's output.
+ */
+/** Hard limits, so hostile input costs a known amount of work. */
+const STRCT_MD_LIMITS = {
+    /** Characters of source read at all. */
+    source: 256 * 1024,
+    /** Lines read at all. */
+    lines: 20000,
+    /** How deep lists and quotes may nest. */
+    depth: 8,
+    /** Inline delimiter runs considered per text span. */
+    delimiters: 2000,
+};
+const RULE = /^ {0,3}((\*\s*){3,}|(-\s*){3,}|(_\s*){3,})$/;
+const ATX = /^ {0,3}(#{1,6})\s+(.*?)\s*#*\s*$/;
+const FENCE = /^ {0,3}(`{3,}|~{3,})\s*([^`]*)$/;
+const UL = /^(\s*)([-*+])\s+(.*)$/;
+const OL = /^(\s*)(\d{1,9})[.)]\s+(.*)$/;
+const QUOTE = /^ {0,3}>\s?(.*)$/;
+const TABLE_DELIM = /^\s*\|?\s*:?-{1,}:?\s*(\|\s*:?-{1,}:?\s*)*\|?\s*$/;
+/**
+ * Read Markdown into blocks.
+ *
+ * `streaming` says the source may be cut mid-token: an unterminated fence is
+ * still a code block, so a reply that streams code looks like code from its
+ * first line rather than flashing as a paragraph and then becoming one.
+ */
+function strctParseMarkdown(source, options = {}) {
+    const text = source.length > STRCT_MD_LIMITS.source ? source.slice(0, STRCT_MD_LIMITS.source) : source;
+    const lines = text.replace(/\r\n?/g, '\n').split('\n').slice(0, STRCT_MD_LIMITS.lines);
+    return parseBlocks(lines, 0, options);
+}
+function parseBlocks(lines, depth, options) {
+    const out = [];
+    let i = 0;
+    const paragraph = [];
+    const flushParagraph = () => {
+        if (!paragraph.length)
+            return;
+        out.push({ kind: 'p', inlines: parseInlines(paragraph.join('\n'), options) });
+        paragraph.length = 0;
+    };
+    while (i < lines.length) {
+        const line = lines[i];
+        // Blank line: ends a paragraph, nothing else.
+        if (!line.trim()) {
+            flushParagraph();
+            i++;
+            continue;
+        }
+        // Fenced code. An unclosed fence is still code while streaming.
+        const fence = FENCE.exec(line);
+        if (fence) {
+            flushParagraph();
+            const marker = fence[1][0];
+            const width = fence[1].length;
+            const lang = fence[2].trim();
+            const body = [];
+            let closed = false;
+            i++;
+            while (i < lines.length) {
+                const candidate = lines[i];
+                const end = new RegExp(`^ {0,3}${marker === '`' ? '`' : '~'}{${width},}\\s*$`).test(candidate);
+                if (end) {
+                    closed = true;
+                    i++;
+                    break;
+                }
+                body.push(candidate);
+                i++;
+            }
+            out.push({ kind: 'code', text: body.join('\n'), lang, closed });
+            continue;
+        }
+        // Thematic break.
+        if (RULE.test(line)) {
+            flushParagraph();
+            out.push({ kind: 'rule' });
+            i++;
+            continue;
+        }
+        // ATX heading.
+        const atx = ATX.exec(line);
+        if (atx) {
+            flushParagraph();
+            out.push({
+                kind: 'heading',
+                level: atx[1].length,
+                inlines: parseInlines(atx[2], options),
+            });
+            i++;
+            continue;
+        }
+        // Block quote: take the run of quoted lines and read them as blocks.
+        const quote = QUOTE.exec(line);
+        if (quote && depth < STRCT_MD_LIMITS.depth) {
+            flushParagraph();
+            const inner = [];
+            while (i < lines.length) {
+                const m = QUOTE.exec(lines[i]);
+                if (m) {
+                    inner.push(m[1]);
+                    i++;
+                }
+                else if (lines[i].trim() && inner.length) {
+                    // A lazy continuation line belongs to the quote's last paragraph.
+                    inner.push(lines[i]);
+                    i++;
+                }
+                else
+                    break;
+            }
+            out.push({ kind: 'quote', blocks: parseBlocks(inner, depth + 1, options) });
+            continue;
+        }
+        // Table: a header row followed by a delimiter row.
+        if (line.includes('|') && i + 1 < lines.length && TABLE_DELIM.test(lines[i + 1])) {
+            flushParagraph();
+            const head = splitRow(lines[i]).map((c) => parseInlines(c, options));
+            const align = splitRow(lines[i + 1]).map(toAlign);
+            const rows = [];
+            i += 2;
+            while (i < lines.length && lines[i].includes('|') && lines[i].trim()) {
+                rows.push(splitRow(lines[i]).map((c) => parseInlines(c, options)));
+                i++;
+            }
+            out.push({ kind: 'table', head, align, rows });
+            continue;
+        }
+        // Lists.
+        const item = UL.exec(line) ?? OL.exec(line);
+        if (item && depth < STRCT_MD_LIMITS.depth) {
+            flushParagraph();
+            const ordered = !UL.test(line);
+            const start = ordered ? Number(OL.exec(line)[2]) : 1;
+            const items = [];
+            const baseIndent = item[1].length;
+            while (i < lines.length) {
+                const m = UL.exec(lines[i]) ?? OL.exec(lines[i]);
+                const sameKind = m && !UL.test(lines[i]) === ordered;
+                if (!m || !sameKind || m[1].length < baseIndent)
+                    break;
+                if (m[1].length > baseIndent)
+                    break; // a deeper list is the item's own
+                const buffer = [m[3]];
+                i++;
+                // Continuation lines: anything indented past the marker, and blanks
+                // between them, belong to this item.
+                while (i < lines.length) {
+                    const next = lines[i];
+                    if (!next.trim()) {
+                        const after = lines[i + 1] ?? '';
+                        if (after.trim() && /^\s{2,}/.test(after)) {
+                            buffer.push('');
+                            i++;
+                            continue;
+                        }
+                        break;
+                    }
+                    if (/^\s{2,}/.test(next) && !UL.test(next.slice(baseIndent)) === false) {
+                        buffer.push(next.slice(Math.min(baseIndent + 2, next.length - next.trimStart().length)));
+                        i++;
+                        continue;
+                    }
+                    if (/^\s{2,}/.test(next)) {
+                        buffer.push(next.trimStart());
+                        i++;
+                        continue;
+                    }
+                    break;
+                }
+                items.push(parseBlocks(buffer, depth + 1, options));
+            }
+            out.push({ kind: 'list', ordered, start, items });
+            continue;
+        }
+        paragraph.push(line);
+        i++;
+    }
+    flushParagraph();
+    return out;
+}
+function splitRow(line) {
+    const trimmed = line.trim().replace(/^\|/, '').replace(/\|$/, '');
+    const cells = [];
+    let cur = '';
+    for (let i = 0; i < trimmed.length; i++) {
+        const ch = trimmed[i];
+        if (ch === '\\' && trimmed[i + 1] === '|') {
+            cur += '|';
+            i++;
+            continue;
+        }
+        if (ch === '|') {
+            cells.push(cur.trim());
+            cur = '';
+            continue;
+        }
+        cur += ch;
+    }
+    cells.push(cur.trim());
+    return cells;
+}
+function toAlign(cell) {
+    const c = cell.trim();
+    const left = c.startsWith(':');
+    const right = c.endsWith(':');
+    if (left && right)
+        return 'center';
+    if (right)
+        return 'end';
+    if (left)
+        return 'start';
+    return null;
+}
+/**
+ * Inline reading. Code spans win over everything (their content is literal),
+ * then links, then the emphasis delimiters — each bounded.
+ */
+function parseInlines(source, options = {}) {
+    const out = [];
+    let buf = '';
+    let i = 0;
+    let budget = STRCT_MD_LIMITS.delimiters;
+    const flush = () => {
+        if (!buf)
+            return;
+        out.push(...applyTokens(buf, options.tokenize));
+        buf = '';
+    };
+    while (i < source.length) {
+        const ch = source[i];
+        // A backslash escapes the next punctuation character.
+        if (ch === '\\' && i + 1 < source.length && /[\\`*_{}[\]()#+\-.!|~>]/.test(source[i + 1])) {
+            buf += source[i + 1];
+            i += 2;
+            continue;
+        }
+        // Code span: the longest run of backticks closes it.
+        if (ch === '`') {
+            const run = /^`+/.exec(source.slice(i))[0];
+            const close = source.indexOf(run, i + run.length);
+            if (close !== -1) {
+                flush();
+                out.push({ kind: 'code', text: source.slice(i + run.length, close).trim() });
+                i = close + run.length;
+                continue;
+            }
+        }
+        // Hard break: two spaces at the end of a line, or a backslash.
+        if (ch === '\n') {
+            const hard = buf.endsWith('  ') || buf.endsWith('\\');
+            buf = buf.replace(/( {2,}|\\)$/, '');
+            flush();
+            out.push(hard ? { kind: 'break' } : { kind: 'text', text: ' ' });
+            i++;
+            continue;
+        }
+        // Autolink.
+        if (ch === '<') {
+            const auto = /^<((?:https?:\/\/|mailto:)[^ >]+)>/.exec(source.slice(i));
+            if (auto) {
+                flush();
+                out.push({ kind: 'link', href: auto[1], children: [{ kind: 'text', text: auto[1] }] });
+                i += auto[0].length;
+                continue;
+            }
+        }
+        // Link. An image is read as a link's text — nothing is ever loaded.
+        if ((ch === '[' || (ch === '!' && source[i + 1] === '[')) && budget-- > 0) {
+            const at = ch === '!' ? i + 1 : i;
+            const close = matchBracket(source, at);
+            if (close !== -1 && source[close + 1] === '(') {
+                const end = source.indexOf(')', close + 2);
+                if (end !== -1) {
+                    const label = source.slice(at + 1, close);
+                    const href = source
+                        .slice(close + 2, end)
+                        .trim()
+                        .split(/\s+/)[0];
+                    flush();
+                    if (ch === '!') {
+                        // An image's alt text is all a reader gets: no request is made.
+                        out.push({ kind: 'text', text: label });
+                    }
+                    else {
+                        out.push({ kind: 'link', href, children: parseInlines(label, options) });
+                    }
+                    i = end + 1;
+                    continue;
+                }
+            }
+        }
+        // Emphasis, strong, strikethrough. A delimiter only opens when something
+        // follows it immediately and only closes when something precedes it —
+        // the flanking rule, which is what keeps "2 * 3 * 4" arithmetic.
+        if ((ch === '*' || ch === '_' || ch === '~') && budget-- > 0) {
+            const run = new RegExp(`^\\${ch}+`).exec(source.slice(i))[0];
+            const len = ch === '~' ? (run.length >= 2 ? 2 : 0) : Math.min(run.length, 2);
+            const opens = !/^\s|^$/.test(source.slice(i + run.length, i + run.length + 1) || '');
+            if (len && opens) {
+                const marker = ch.repeat(len);
+                const close = findCloser(source, marker, i + len);
+                if (close !== -1 && close > i + len) {
+                    const inner = source.slice(i + len, close);
+                    flush();
+                    const children = parseInlines(inner, options);
+                    out.push(ch === '~'
+                        ? { kind: 'del', children }
+                        : len === 2
+                            ? { kind: 'strong', children }
+                            : { kind: 'em', children });
+                    i = close + len;
+                    continue;
+                }
+            }
+        }
+        buf += ch;
+        i++;
+    }
+    flush();
+    return out;
+}
+/**
+ * The next closing delimiter: one with a non-space before it. An opener with
+ * no such closer is not a delimiter at all, it is the character written.
+ */
+function findCloser(source, marker, from) {
+    let at = source.indexOf(marker, from);
+    while (at !== -1) {
+        const before = source[at - 1];
+        if (before && !/\s/.test(before))
+            return at;
+        at = source.indexOf(marker, at + marker.length);
+    }
+    return -1;
+}
+/** The index of the `]` matching the `[` at `from`, or -1. */
+function matchBracket(source, from) {
+    let depth = 0;
+    for (let i = from; i < source.length; i++) {
+        if (source[i] === '\\') {
+            i++;
+            continue;
+        }
+        if (source[i] === '[')
+            depth++;
+        else if (source[i] === ']') {
+            depth--;
+            if (!depth)
+                return i;
+        }
+    }
+    return -1;
+}
+/** Hand a run of plain text to the consumer's tokenizer, if it gave one. */
+function applyTokens(text, tokenize) {
+    if (!tokenize)
+        return [{ kind: 'text', text }];
+    let found;
+    try {
+        found = tokenize(text) ?? [];
+    }
+    catch {
+        return [{ kind: 'text', text }];
+    }
+    const valid = found
+        .filter((t) => t && t.length > 0 && t.start >= 0 && t.start + t.length <= text.length)
+        .sort((a, b) => a.start - b.start);
+    const out = [];
+    let at = 0;
+    for (const t of valid) {
+        if (t.start < at)
+            continue; // overlapping claims are dropped
+        if (t.start > at)
+            out.push({ kind: 'text', text: text.slice(at, t.start) });
+        out.push({
+            kind: 'token',
+            token: t.token,
+            text: text.slice(t.start, t.start + t.length),
+            data: t.data,
+        });
+        at = t.start + t.length;
+    }
+    if (at < text.length)
+        out.push({ kind: 'text', text: text.slice(at) });
+    return out.length ? out : [{ kind: 'text', text }];
+}
+/**
+ * What a link may do. Anything that is not plainly safe stays the text the
+ * model wrote: `javascript:`, `data:`, a protocol-relative `//host`, or
+ * anything this does not recognise.
+ */
+function strctClassifyHref(href) {
+    const raw = (href ?? '').trim();
+    if (!raw)
+        return null;
+    // Control characters and whitespace inside a URL are a smuggling trick.
+    if (/[\u0000-\u001f\u007f\s]/.test(raw))
+        return null;
+    if (/^https?:\/\/[^/]/i.test(raw))
+        return 'external';
+    if (/^mailto:[^@\s]+@[^@\s]+$/i.test(raw))
+        return 'external';
+    if (raw.startsWith('//'))
+        return null;
+    if (raw.startsWith('/'))
+        return 'internal';
+    return null;
+}
+
+/**
+ * A template for a span the consumer claimed through `tokens`, keyed by the
+ * token's kind:
+ *
+ *   <ng-template strctMarkdownToken="object" let-text let-data="data">
+ *     <strct-tag [href]="data.url">{{ text }}</strct-tag>
+ *   </ng-template>
+ */
+class StrctMarkdownToken {
+    /** Which token kind this template draws. */
+    strctMarkdownToken = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "strctMarkdownToken" }] : /* istanbul ignore next */ []));
+    template = inject(TemplateRef);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctMarkdownToken, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.4", type: StrctMarkdownToken, isStandalone: true, selector: "ng-template[strctMarkdownToken]", inputs: { strctMarkdownToken: { classPropertyName: "strctMarkdownToken", publicName: "strctMarkdownToken", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctMarkdownToken, decorators: [{
+            type: Directive,
+            args: [{ selector: 'ng-template[strctMarkdownToken]' }]
+        }], propDecorators: { strctMarkdownToken: [{ type: i0.Input, args: [{ isSignal: true, alias: "strctMarkdownToken", required: false }] }] } });
+/**
+ * Markdown as a tree of components, never as HTML.
+ *
+ *   <strct-markdown [source]="reply()" [streaming]="busy()" />
+ *
+ * A model's reply is Markdown: drawn as plain text it leaves tables as rows of
+ * pipes and `**` everywhere, and an app that reaches for a Markdown library
+ * ends up handing the browser HTML — `innerHTML` plus a sanitiser — which a
+ * sealed, reviewed build cannot accept.
+ *
+ * Every word reaches the page as a text node. Raw HTML is shown as the
+ * characters it is. Images are never loaded: an image's alt text is all a
+ * reader gets. A link opens in a new tab only when it is plainly http(s);
+ * an in-app path is handed to `(navigate)`; anything else — `javascript:`,
+ * `data:`, `//host` — stays the text the model wrote.
+ */
+class StrctMarkdown {
+    /** The Markdown to read. */
+    source = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "source" }] : /* istanbul ignore next */ []));
+    /**
+     * A tree read elsewhere, instead of `source` — how the component draws the
+     * blocks inside a list item or a quote without re-reading them.
+     */
+    tree = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tree" }] : /* istanbul ignore next */ []));
+    /**
+     * The reply is still arriving: an unterminated fence is already a code
+     * block, so streamed code does not flash as a paragraph first, and the
+     * caret sits at the end of the last line.
+     */
+    streaming = input(false, { ...(ngDevMode ? { debugName: "streaming" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * How far the model's headings are pulled down. A message is a region
+     * inside a dialog, so `#` should not be the page's `h1`: the default of 2
+     * makes it an `h3`.
+     */
+    headingOffset = input(2, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "headingOffset" }] : /* istanbul ignore next */ []));
+    /**
+     * What a link may do, when the default rule is not what the app wants.
+     * Returning `null` leaves the link as text.
+     */
+    linkPolicy = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "linkPolicy" }] : /* istanbul ignore next */ []));
+    /** Claim runs of plain text — an inventory id becomes an object chip. */
+    tokens = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tokens" }] : /* istanbul ignore next */ []));
+    /** An in-app link was followed; the consumer routes it. */
+    navigate = output();
+    tokenDefs = contentChildren(StrctMarkdownToken, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tokenDefs" }] : /* istanbul ignore next */ []));
+    blocks = computed(() => {
+        const given = this.tree();
+        if (given)
+            return given;
+        return strctParseMarkdown(this.source(), {
+            streaming: this.streaming(),
+            tokenize: this.tokens() ?? undefined,
+        });
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "blocks" }] : /* istanbul ignore next */ []));
+    level(level) {
+        return Math.min(6, Math.max(1, level + this.headingOffset()));
+    }
+    hrefKind(href) {
+        const own = this.linkPolicy();
+        return own ? own(href) : strctClassifyHref(href);
+    }
+    tokenTemplate(kind) {
+        return this.tokenDefs().find((d) => d.strctMarkdownToken() === kind)?.template ?? null;
+    }
+    /** The caret belongs to the last block, and only while streaming. */
+    caretOn(index) {
+        return this.streaming() && !this.tree() && index === this.blocks().length - 1;
+    }
+    onInternal(event, href) {
+        // A modified click is the browser's — a new tab, a saved link.
+        const e = event;
+        if (e.metaKey || e.ctrlKey || e.shiftKey || e.altKey || e.button !== 0)
+            return;
+        event.preventDefault();
+        this.navigate.emit(href);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctMarkdown, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: StrctMarkdown, isStandalone: true, selector: "strct-markdown", inputs: { source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: false, transformFunction: null }, tree: { classPropertyName: "tree", publicName: "tree", isSignal: true, isRequired: false, transformFunction: null }, streaming: { classPropertyName: "streaming", publicName: "streaming", isSignal: true, isRequired: false, transformFunction: null }, headingOffset: { classPropertyName: "headingOffset", publicName: "headingOffset", isSignal: true, isRequired: false, transformFunction: null }, linkPolicy: { classPropertyName: "linkPolicy", publicName: "linkPolicy", isSignal: true, isRequired: false, transformFunction: null }, tokens: { classPropertyName: "tokens", publicName: "tokens", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { navigate: "navigate" }, host: { classAttribute: "strct-md" }, queries: [{ propertyName: "tokenDefs", predicate: StrctMarkdownToken, isSignal: true }], ngImport: i0, template: `
+    @for (block of blocks(); track $index) {
+      @switch (block.kind) {
+        @case ('p') {
+          <p class="strct-md__p">
+            <ng-container
+              [ngTemplateOutlet]="inlineRun"
+              [ngTemplateOutletContext]="{ $implicit: block.inlines }"
+            />
+            @if (caretOn($index)) {
+              <span class="strct-md__caret" aria-hidden="true"></span>
+            }
+          </p>
+        }
+        @case ('heading') {
+          <!-- A message is a region inside a dialog, so the document's own
+               outline is not the model's to set: the offset pulls them down. -->
+          @switch (level(block.level)) {
+            @case (1) {
+              <h1 class="strct-md__h">
+                <ng-container
+                  [ngTemplateOutlet]="inlineRun"
+                  [ngTemplateOutletContext]="{ $implicit: block.inlines }"
+                />
+              </h1>
+            }
+            @case (2) {
+              <h2 class="strct-md__h">
+                <ng-container
+                  [ngTemplateOutlet]="inlineRun"
+                  [ngTemplateOutletContext]="{ $implicit: block.inlines }"
+                />
+              </h2>
+            }
+            @case (3) {
+              <h3 class="strct-md__h">
+                <ng-container
+                  [ngTemplateOutlet]="inlineRun"
+                  [ngTemplateOutletContext]="{ $implicit: block.inlines }"
+                />
+              </h3>
+            }
+            @case (4) {
+              <h4 class="strct-md__h">
+                <ng-container
+                  [ngTemplateOutlet]="inlineRun"
+                  [ngTemplateOutletContext]="{ $implicit: block.inlines }"
+                />
+              </h4>
+            }
+            @case (5) {
+              <h5 class="strct-md__h">
+                <ng-container
+                  [ngTemplateOutlet]="inlineRun"
+                  [ngTemplateOutletContext]="{ $implicit: block.inlines }"
+                />
+              </h5>
+            }
+            @default {
+              <h6 class="strct-md__h">
+                <ng-container
+                  [ngTemplateOutlet]="inlineRun"
+                  [ngTemplateOutletContext]="{ $implicit: block.inlines }"
+                />
+              </h6>
+            }
+          }
+        }
+        @case ('code') {
+          <strct-code class="strct-md__code" [code]="block.text" [language]="block.lang" wrap />
+        }
+        @case ('rule') {
+          <hr class="strct-md__rule" />
+        }
+        @case ('quote') {
+          <blockquote class="strct-md__quote">
+            <ng-container
+              [ngTemplateOutlet]="blockRun"
+              [ngTemplateOutletContext]="{ $implicit: block.blocks }"
+            />
+          </blockquote>
+        }
+        @case ('list') {
+          @if (block.ordered) {
+            <ol class="strct-md__list" [attr.start]="block.start">
+              @for (item of block.items; track $index) {
+                <li>
+                  <ng-container
+                    [ngTemplateOutlet]="blockRun"
+                    [ngTemplateOutletContext]="{ $implicit: item }"
+                  />
+                </li>
+              }
+            </ol>
+          } @else {
+            <ul class="strct-md__list">
+              @for (item of block.items; track $index) {
+                <li>
+                  <ng-container
+                    [ngTemplateOutlet]="blockRun"
+                    [ngTemplateOutletContext]="{ $implicit: item }"
+                  />
+                </li>
+              }
+            </ul>
+          }
+        }
+        @case ('table') {
+          <div class="strct-md__tablewrap">
+            <table class="strct-md__table">
+              <thead>
+                <tr>
+                  @for (cell of block.head; track $index) {
+                    <th scope="col" [style.text-align]="block.align[$index] ?? 'start'">
+                      <ng-container
+                        [ngTemplateOutlet]="inlineRun"
+                        [ngTemplateOutletContext]="{ $implicit: cell }"
+                      />
+                    </th>
+                  }
+                </tr>
+              </thead>
+              <tbody>
+                @for (row of block.rows; track $index) {
+                  <tr>
+                    @for (cell of row; track $index) {
+                      <td [style.text-align]="block.align[$index] ?? 'start'">
+                        <ng-container
+                          [ngTemplateOutlet]="inlineRun"
+                          [ngTemplateOutletContext]="{ $implicit: cell }"
+                        />
+                      </td>
+                    }
+                  </tr>
+                }
+              </tbody>
+            </table>
+          </div>
+        }
+      }
+    }
+
+    <!-- Blocks inside a list item or a quote. -->
+    <ng-template #blockRun let-blocks>
+      @for (b of blocks; track $index) {
+        <strct-markdown
+          [tree]="[b]"
+          [headingOffset]="headingOffset()"
+          [linkPolicy]="linkPolicy()"
+          (navigate)="navigate.emit($event)"
+        />
+      }
+    </ng-template>
+
+    <!-- One run of inline nodes. -->
+    <ng-template #inlineRun let-inlines>
+      @for (node of inlines; track $index) {
+        @switch (node.kind) {
+          @case ('text') {
+            <ng-container>{{ node.text }}</ng-container>
+          }
+          @case ('code') {
+            <code class="strct-md__codespan">{{ node.text }}</code>
+          }
+          @case ('break') {
+            <br />
+          }
+          @case ('strong') {
+            <strong>
+              <ng-container
+                [ngTemplateOutlet]="inlineRun"
+                [ngTemplateOutletContext]="{ $implicit: node.children }"
+              />
+            </strong>
+          }
+          @case ('em') {
+            <em>
+              <ng-container
+                [ngTemplateOutlet]="inlineRun"
+                [ngTemplateOutletContext]="{ $implicit: node.children }"
+              />
+            </em>
+          }
+          @case ('del') {
+            <del>
+              <ng-container
+                [ngTemplateOutlet]="inlineRun"
+                [ngTemplateOutletContext]="{ $implicit: node.children }"
+              />
+            </del>
+          }
+          @case ('token') {
+            @if (tokenTemplate(node.token); as tpl) {
+              <ng-container
+                [ngTemplateOutlet]="tpl"
+                [ngTemplateOutletContext]="{ $implicit: node.text, data: node.data }"
+              />
+            } @else {
+              <ng-container>{{ node.text }}</ng-container>
+            }
+          }
+          @case ('link') {
+            @switch (hrefKind(node.href)) {
+              @case ('external') {
+                <a
+                  class="strct-md__link"
+                  [attr.href]="node.href"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  <ng-container
+                    [ngTemplateOutlet]="inlineRun"
+                    [ngTemplateOutletContext]="{ $implicit: node.children }"
+                  />
+                  <strct-icon
+                    class="strct-md__ext"
+                    strictName="externalLink"
+                    [size]="11"
+                    aria-hidden="true"
+                  />
+                </a>
+              }
+              @case ('internal') {
+                <a
+                  class="strct-md__link"
+                  [attr.href]="node.href"
+                  (click)="onInternal($event, node.href)"
+                >
+                  <ng-container
+                    [ngTemplateOutlet]="inlineRun"
+                    [ngTemplateOutletContext]="{ $implicit: node.children }"
+                  />
+                </a>
+              }
+              @default {
+                <!-- Not a link we will follow: the characters, as written. -->
+                <ng-container
+                  [ngTemplateOutlet]="inlineRun"
+                  [ngTemplateOutletContext]="{ $implicit: node.children }"
+                />
+              }
+            }
+          }
+        }
+      }
+    </ng-template>
+  `, isInline: true, styles: [".strct-md{display:block;color:var(--t1);font-size:13px;line-height:1.55}.strct-md__p{margin:0 0 var(--space-2)}.strct-md__p:last-child{margin-bottom:0}.strct-md__h{margin:var(--space-3) 0 var(--space-2);font-size:14px;font-weight:600;color:var(--t1)}.strct-md__h:first-child{margin-top:0}.strct-md__list{margin:0 0 var(--space-2);padding-inline-start:20px}.strct-md__list li{margin-block:2px}.strct-md__quote{margin:0 0 var(--space-2);padding-inline-start:var(--space-3);border-inline-start:2px solid var(--b2);color:var(--t2)}.strct-md__rule{border:0;border-block-start:1px solid var(--b1);margin:var(--space-3) 0}.strct-md__codespan{font-family:var(--mono);font-size:.92em;background:var(--bg-2);border-radius:var(--radius-sm);padding:1px 4px}.strct-md__code{margin-block-end:var(--space-2)}.strct-md__link{color:var(--acc)}.strct-md__ext{margin-inline-start:2px;vertical-align:-1px}.strct-md__tablewrap{overflow-x:auto;margin-block-end:var(--space-2)}.strct-md__table{border-collapse:collapse;width:max-content;min-width:100%}.strct-md__table th,.strct-md__table td{border:1px solid var(--b1);padding:4px 8px;text-align:start}.strct-md__table th{background:var(--bg-2);font-weight:600}.strct-md__caret{display:inline-block;width:2px;height:1em;margin-inline-start:2px;vertical-align:-2px;background:var(--acc);animation:strct-md-caret 1s steps(2) infinite}@keyframes strct-md-caret{50%{opacity:0}}@media(prefers-reduced-motion:reduce){.strct-md__caret{animation:none}}\n"], dependencies: [{ kind: "component", type: StrctMarkdown, selector: "strct-markdown", inputs: ["source", "tree", "streaming", "headingOffset", "linkPolicy", "tokens"], outputs: ["navigate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: StrctCode, selector: "strct-code", inputs: ["code", "title", "language", "copyable", "collapsible", "collapsed", "lineNumbers", "wrap", "maxHeight", "collapseLabel", "expandLabel", "regionLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: StrctIcon, selector: "strct-icon", inputs: ["name", "strictName", "size", "strokeWidth", "badge", "ariaLabel", "count", "countMax", "countStatus", "countLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctMarkdown, decorators: [{
+            type: Component,
+            args: [{ selector: 'strct-markdown', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [NgTemplateOutlet, StrctCode, StrctIcon], template: `
+    @for (block of blocks(); track $index) {
+      @switch (block.kind) {
+        @case ('p') {
+          <p class="strct-md__p">
+            <ng-container
+              [ngTemplateOutlet]="inlineRun"
+              [ngTemplateOutletContext]="{ $implicit: block.inlines }"
+            />
+            @if (caretOn($index)) {
+              <span class="strct-md__caret" aria-hidden="true"></span>
+            }
+          </p>
+        }
+        @case ('heading') {
+          <!-- A message is a region inside a dialog, so the document's own
+               outline is not the model's to set: the offset pulls them down. -->
+          @switch (level(block.level)) {
+            @case (1) {
+              <h1 class="strct-md__h">
+                <ng-container
+                  [ngTemplateOutlet]="inlineRun"
+                  [ngTemplateOutletContext]="{ $implicit: block.inlines }"
+                />
+              </h1>
+            }
+            @case (2) {
+              <h2 class="strct-md__h">
+                <ng-container
+                  [ngTemplateOutlet]="inlineRun"
+                  [ngTemplateOutletContext]="{ $implicit: block.inlines }"
+                />
+              </h2>
+            }
+            @case (3) {
+              <h3 class="strct-md__h">
+                <ng-container
+                  [ngTemplateOutlet]="inlineRun"
+                  [ngTemplateOutletContext]="{ $implicit: block.inlines }"
+                />
+              </h3>
+            }
+            @case (4) {
+              <h4 class="strct-md__h">
+                <ng-container
+                  [ngTemplateOutlet]="inlineRun"
+                  [ngTemplateOutletContext]="{ $implicit: block.inlines }"
+                />
+              </h4>
+            }
+            @case (5) {
+              <h5 class="strct-md__h">
+                <ng-container
+                  [ngTemplateOutlet]="inlineRun"
+                  [ngTemplateOutletContext]="{ $implicit: block.inlines }"
+                />
+              </h5>
+            }
+            @default {
+              <h6 class="strct-md__h">
+                <ng-container
+                  [ngTemplateOutlet]="inlineRun"
+                  [ngTemplateOutletContext]="{ $implicit: block.inlines }"
+                />
+              </h6>
+            }
+          }
+        }
+        @case ('code') {
+          <strct-code class="strct-md__code" [code]="block.text" [language]="block.lang" wrap />
+        }
+        @case ('rule') {
+          <hr class="strct-md__rule" />
+        }
+        @case ('quote') {
+          <blockquote class="strct-md__quote">
+            <ng-container
+              [ngTemplateOutlet]="blockRun"
+              [ngTemplateOutletContext]="{ $implicit: block.blocks }"
+            />
+          </blockquote>
+        }
+        @case ('list') {
+          @if (block.ordered) {
+            <ol class="strct-md__list" [attr.start]="block.start">
+              @for (item of block.items; track $index) {
+                <li>
+                  <ng-container
+                    [ngTemplateOutlet]="blockRun"
+                    [ngTemplateOutletContext]="{ $implicit: item }"
+                  />
+                </li>
+              }
+            </ol>
+          } @else {
+            <ul class="strct-md__list">
+              @for (item of block.items; track $index) {
+                <li>
+                  <ng-container
+                    [ngTemplateOutlet]="blockRun"
+                    [ngTemplateOutletContext]="{ $implicit: item }"
+                  />
+                </li>
+              }
+            </ul>
+          }
+        }
+        @case ('table') {
+          <div class="strct-md__tablewrap">
+            <table class="strct-md__table">
+              <thead>
+                <tr>
+                  @for (cell of block.head; track $index) {
+                    <th scope="col" [style.text-align]="block.align[$index] ?? 'start'">
+                      <ng-container
+                        [ngTemplateOutlet]="inlineRun"
+                        [ngTemplateOutletContext]="{ $implicit: cell }"
+                      />
+                    </th>
+                  }
+                </tr>
+              </thead>
+              <tbody>
+                @for (row of block.rows; track $index) {
+                  <tr>
+                    @for (cell of row; track $index) {
+                      <td [style.text-align]="block.align[$index] ?? 'start'">
+                        <ng-container
+                          [ngTemplateOutlet]="inlineRun"
+                          [ngTemplateOutletContext]="{ $implicit: cell }"
+                        />
+                      </td>
+                    }
+                  </tr>
+                }
+              </tbody>
+            </table>
+          </div>
+        }
+      }
+    }
+
+    <!-- Blocks inside a list item or a quote. -->
+    <ng-template #blockRun let-blocks>
+      @for (b of blocks; track $index) {
+        <strct-markdown
+          [tree]="[b]"
+          [headingOffset]="headingOffset()"
+          [linkPolicy]="linkPolicy()"
+          (navigate)="navigate.emit($event)"
+        />
+      }
+    </ng-template>
+
+    <!-- One run of inline nodes. -->
+    <ng-template #inlineRun let-inlines>
+      @for (node of inlines; track $index) {
+        @switch (node.kind) {
+          @case ('text') {
+            <ng-container>{{ node.text }}</ng-container>
+          }
+          @case ('code') {
+            <code class="strct-md__codespan">{{ node.text }}</code>
+          }
+          @case ('break') {
+            <br />
+          }
+          @case ('strong') {
+            <strong>
+              <ng-container
+                [ngTemplateOutlet]="inlineRun"
+                [ngTemplateOutletContext]="{ $implicit: node.children }"
+              />
+            </strong>
+          }
+          @case ('em') {
+            <em>
+              <ng-container
+                [ngTemplateOutlet]="inlineRun"
+                [ngTemplateOutletContext]="{ $implicit: node.children }"
+              />
+            </em>
+          }
+          @case ('del') {
+            <del>
+              <ng-container
+                [ngTemplateOutlet]="inlineRun"
+                [ngTemplateOutletContext]="{ $implicit: node.children }"
+              />
+            </del>
+          }
+          @case ('token') {
+            @if (tokenTemplate(node.token); as tpl) {
+              <ng-container
+                [ngTemplateOutlet]="tpl"
+                [ngTemplateOutletContext]="{ $implicit: node.text, data: node.data }"
+              />
+            } @else {
+              <ng-container>{{ node.text }}</ng-container>
+            }
+          }
+          @case ('link') {
+            @switch (hrefKind(node.href)) {
+              @case ('external') {
+                <a
+                  class="strct-md__link"
+                  [attr.href]="node.href"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  <ng-container
+                    [ngTemplateOutlet]="inlineRun"
+                    [ngTemplateOutletContext]="{ $implicit: node.children }"
+                  />
+                  <strct-icon
+                    class="strct-md__ext"
+                    strictName="externalLink"
+                    [size]="11"
+                    aria-hidden="true"
+                  />
+                </a>
+              }
+              @case ('internal') {
+                <a
+                  class="strct-md__link"
+                  [attr.href]="node.href"
+                  (click)="onInternal($event, node.href)"
+                >
+                  <ng-container
+                    [ngTemplateOutlet]="inlineRun"
+                    [ngTemplateOutletContext]="{ $implicit: node.children }"
+                  />
+                </a>
+              }
+              @default {
+                <!-- Not a link we will follow: the characters, as written. -->
+                <ng-container
+                  [ngTemplateOutlet]="inlineRun"
+                  [ngTemplateOutletContext]="{ $implicit: node.children }"
+                />
+              }
+            }
+          }
+        }
+      }
+    </ng-template>
+  `, host: { class: 'strct-md' }, styles: [".strct-md{display:block;color:var(--t1);font-size:13px;line-height:1.55}.strct-md__p{margin:0 0 var(--space-2)}.strct-md__p:last-child{margin-bottom:0}.strct-md__h{margin:var(--space-3) 0 var(--space-2);font-size:14px;font-weight:600;color:var(--t1)}.strct-md__h:first-child{margin-top:0}.strct-md__list{margin:0 0 var(--space-2);padding-inline-start:20px}.strct-md__list li{margin-block:2px}.strct-md__quote{margin:0 0 var(--space-2);padding-inline-start:var(--space-3);border-inline-start:2px solid var(--b2);color:var(--t2)}.strct-md__rule{border:0;border-block-start:1px solid var(--b1);margin:var(--space-3) 0}.strct-md__codespan{font-family:var(--mono);font-size:.92em;background:var(--bg-2);border-radius:var(--radius-sm);padding:1px 4px}.strct-md__code{margin-block-end:var(--space-2)}.strct-md__link{color:var(--acc)}.strct-md__ext{margin-inline-start:2px;vertical-align:-1px}.strct-md__tablewrap{overflow-x:auto;margin-block-end:var(--space-2)}.strct-md__table{border-collapse:collapse;width:max-content;min-width:100%}.strct-md__table th,.strct-md__table td{border:1px solid var(--b1);padding:4px 8px;text-align:start}.strct-md__table th{background:var(--bg-2);font-weight:600}.strct-md__caret{display:inline-block;width:2px;height:1em;margin-inline-start:2px;vertical-align:-2px;background:var(--acc);animation:strct-md-caret 1s steps(2) infinite}@keyframes strct-md-caret{50%{opacity:0}}@media(prefers-reduced-motion:reduce){.strct-md__caret{animation:none}}\n"] }]
+        }], propDecorators: { source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: false }] }], tree: [{ type: i0.Input, args: [{ isSignal: true, alias: "tree", required: false }] }], streaming: [{ type: i0.Input, args: [{ isSignal: true, alias: "streaming", required: false }] }], headingOffset: [{ type: i0.Input, args: [{ isSignal: true, alias: "headingOffset", required: false }] }], linkPolicy: [{ type: i0.Input, args: [{ isSignal: true, alias: "linkPolicy", required: false }] }], tokens: [{ type: i0.Input, args: [{ isSignal: true, alias: "tokens", required: false }] }], navigate: [{ type: i0.Output, args: ["navigate"] }], tokenDefs: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => StrctMarkdownToken), { isSignal: true }] }] } });
+
 /**
  * Public API surface of the strct UI library.
  */
@@ -28303,5 +29449,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { FOCUSABLE_SELECTOR, STRCT_DP_DOW, STRCT_DP_DOW_FULL, STRCT_DP_MONTHS, STRCT_ICONS, STRCT_ICON_GROUPS, STRCT_ICON_NAMES, STRCT_MASKS, STRCT_NOTIFICATION_HISTORY_LIMIT, STRCT_PALETTES, STRCT_RAW_ICONS, STRCT_TIME_RANGE_PRESETS, STRCT_WIZARD_DEFAULTS, StrctAccordion, StrctAccordionPanel, StrctAlert, StrctAlertActions, StrctAnnouncer, StrctAvatar, StrctBadge, StrctBreadcrumb, StrctBreadcrumbItem, StrctButton, StrctButtonGroup, StrctBytesPipe, StrctCard, StrctCardBlock, StrctCardFooter, StrctCardHeader, StrctCardHeaderActions, StrctCardHeaderLeading, StrctCardHeaderMeta, StrctCardHeaderNote, StrctCascadeColumn, StrctCascadeHost, StrctCascadeSelect, StrctCellDef, StrctCellStatus, StrctChange, StrctChart, StrctChatAttachment, StrctChatComposer, StrctChatMessage, StrctChatThread, StrctCheckbox, StrctChips, StrctCode, StrctCodeInline, StrctColorPicker, StrctCombobox, StrctCommandPalette, StrctConfirmOutlet, StrctConfirmService, StrctContextMenu, StrctContextMenuTrigger, StrctControlDescription, StrctCopy, StrctDatagrid, StrctDatagridActionBar, StrctDatagridActionBarCaption, StrctDatepicker, StrctDatetimePicker, StrctDesc, StrctDescriptionList, StrctDetailPaneActions, StrctDetailPaneMeta, StrctDetailPaneTitle, StrctDiff, StrctDivider, StrctDonut, StrctDrawer, StrctDrawerFooter, StrctDropdown, StrctDropdownDivider, StrctDropdownItem, StrctDropdownItemAction, StrctDropdownTrigger, StrctDurationPipe, StrctEmptyState, StrctField, StrctFieldGroup, StrctFieldHint, StrctFieldPrefix, StrctFieldSuffix, StrctFieldValue, StrctFile, StrctFilterBar, StrctFlow, StrctFlowNodeTemplate, StrctFooter, StrctGauge, StrctGroupHeaderDef, StrctHeader, StrctHeatmap, StrctHero, StrctHotkeysHelp, StrctHotkeysService, StrctIcon, StrctInlineEdit, StrctInput, StrctInputMask, StrctInputOtp, StrctKbd, StrctKnob, StrctLegend, StrctList, StrctListItem, StrctListItemDescription, StrctListItemLeading, StrctListItemMeta, StrctListItemTrailing, StrctLiveIndicator, StrctLogViewer, StrctLogin, StrctMediaFrame, StrctMenuPanel, StrctMenuService, StrctMenubar, StrctMetricTile, StrctModal, StrctModalContent, StrctNav, StrctNavItem, StrctNotificationCenter, StrctNumber, StrctOverlay, StrctPageHeader, StrctPageHeaderActions, StrctPageHeaderCrumbs, StrctPageHeaderTitleMeta, StrctPagination, StrctPassword, StrctPopover, StrctPopoverTrigger, StrctProgress, StrctQr, StrctRadio, StrctRadioGroup, StrctRail, StrctRange, StrctRatePipe, StrctRating, StrctReorder, StrctReorderGroup, StrctReorderHandle, StrctReorderItem, StrctResizeHandle, StrctRowDetailDef, StrctSearchbox, StrctSectionHeader, StrctSectionHeaderActions, StrctSectionHeaderMeta, StrctSectionMenu, StrctSegmented, StrctSelect, StrctShell, StrctShellService, StrctSiPipe, StrctSignpost, StrctSignpostTrigger, StrctSkeleton, StrctSparkline, StrctSpeedDial, StrctSpinner, StrctSplitButton, StrctSplitter, StrctStack, StrctStackItem, StrctStatusDot, StrctStep, StrctStepAction, StrctSteps, StrctSubmenu, StrctTab, StrctTable, StrctTabs, StrctTag, StrctTagLeading, StrctThemeService, StrctThemeSwitcher, StrctTimeRangePicker, StrctTimeline, StrctTimelineItem, StrctToastOutlet, StrctToastService, StrctToggle, StrctToolbar, StrctToolbarCaption, StrctToolbarSpacer, StrctTooltip, StrctTour, StrctTransfer, StrctTree, StrctTreeNode, StrctTreeSelect, StrctVerticalNav, StrctWatermark, StrctWindow, StrctWindowDock, StrctWindowDockItem, StrctWindowService, StrctWizard, StrctWizardAside, __qrInternals, focusFirstIn, keepTabInside, lockBodyScroll, parseAnsi, provideStrctWizardDefaults, registerStrctIcon, restoreFocus, saveFocusedElement, strctCheckHostDisplay, strctCheckHostInputs, strctComputeDiff, strctDpPad, strctFormatBytes, strctFormatDuration, strctFormatRate, strctFormatSi, strctQrMatrix, strctValidationIcon, strctValidationTone, unlockBodyScroll };
+export { FOCUSABLE_SELECTOR, STRCT_DP_DOW, STRCT_DP_DOW_FULL, STRCT_DP_MONTHS, STRCT_ICONS, STRCT_ICON_GROUPS, STRCT_ICON_NAMES, STRCT_MASKS, STRCT_MD_LIMITS, STRCT_NOTIFICATION_HISTORY_LIMIT, STRCT_PALETTES, STRCT_RAW_ICONS, STRCT_TIME_RANGE_PRESETS, STRCT_WIZARD_DEFAULTS, StrctAccordion, StrctAccordionPanel, StrctAlert, StrctAlertActions, StrctAnnouncer, StrctAvatar, StrctBadge, StrctBreadcrumb, StrctBreadcrumbItem, StrctButton, StrctButtonGroup, StrctBytesPipe, StrctCard, StrctCardBlock, StrctCardFooter, StrctCardHeader, StrctCardHeaderActions, StrctCardHeaderLeading, StrctCardHeaderMeta, StrctCardHeaderNote, StrctCascadeColumn, StrctCascadeHost, StrctCascadeSelect, StrctCellDef, StrctCellStatus, StrctChange, StrctChart, StrctChatAttachment, StrctChatComposer, StrctChatMessage, StrctChatMessageActions, StrctChatThread, StrctCheckbox, StrctChips, StrctCode, StrctCodeInline, StrctColorPicker, StrctCombobox, StrctCommandPalette, StrctConfirmOutlet, StrctConfirmService, StrctContextMenu, StrctContextMenuTrigger, StrctControlDescription, StrctCopy, StrctDatagrid, StrctDatagridActionBar, StrctDatagridActionBarCaption, StrctDatepicker, StrctDatetimePicker, StrctDesc, StrctDescriptionList, StrctDetailPaneActions, StrctDetailPaneMeta, StrctDetailPaneTitle, StrctDiff, StrctDivider, StrctDonut, StrctDrawer, StrctDrawerFooter, StrctDropdown, StrctDropdownDivider, StrctDropdownItem, StrctDropdownItemAction, StrctDropdownTrigger, StrctDurationPipe, StrctEmptyState, StrctField, StrctFieldGroup, StrctFieldHint, StrctFieldPrefix, StrctFieldSuffix, StrctFieldValue, StrctFile, StrctFilterBar, StrctFlow, StrctFlowNodeTemplate, StrctFooter, StrctGauge, StrctGroupHeaderDef, StrctHeader, StrctHeatmap, StrctHero, StrctHotkeysHelp, StrctHotkeysService, StrctIcon, StrctInlineEdit, StrctInput, StrctInputMask, StrctInputOtp, StrctKbd, StrctKnob, StrctLegend, StrctList, StrctListItem, StrctListItemDescription, StrctListItemLeading, StrctListItemMeta, StrctListItemTrailing, StrctLiveIndicator, StrctLogViewer, StrctLogin, StrctMarkdown, StrctMarkdownToken, StrctMediaFrame, StrctMenuPanel, StrctMenuService, StrctMenubar, StrctMetricTile, StrctModal, StrctModalContent, StrctNav, StrctNavItem, StrctNotificationCenter, StrctNumber, StrctOverlay, StrctPageHeader, StrctPageHeaderActions, StrctPageHeaderCrumbs, StrctPageHeaderTitleMeta, StrctPagination, StrctPassword, StrctPopover, StrctPopoverTrigger, StrctProgress, StrctQr, StrctRadio, StrctRadioGroup, StrctRail, StrctRange, StrctRatePipe, StrctRating, StrctReorder, StrctReorderGroup, StrctReorderHandle, StrctReorderItem, StrctResizeHandle, StrctRowDetailDef, StrctSearchbox, StrctSectionHeader, StrctSectionHeaderActions, StrctSectionHeaderMeta, StrctSectionMenu, StrctSegmented, StrctSelect, StrctShell, StrctShellService, StrctSiPipe, StrctSignpost, StrctSignpostTrigger, StrctSkeleton, StrctSparkline, StrctSpeedDial, StrctSpinner, StrctSplitButton, StrctSplitter, StrctStack, StrctStackItem, StrctStatusDot, StrctStep, StrctStepAction, StrctSteps, StrctSubmenu, StrctTab, StrctTable, StrctTabs, StrctTag, StrctTagLeading, StrctThemeService, StrctThemeSwitcher, StrctTimeRangePicker, StrctTimeline, StrctTimelineItem, StrctToastOutlet, StrctToastService, StrctToggle, StrctToolbar, StrctToolbarCaption, StrctToolbarSpacer, StrctTooltip, StrctTour, StrctTransfer, StrctTree, StrctTreeNode, StrctTreeSelect, StrctVerticalNav, StrctWatermark, StrctWindow, StrctWindowDock, StrctWindowDockItem, StrctWindowService, StrctWizard, StrctWizardAside, __qrInternals, focusFirstIn, keepTabInside, lockBodyScroll, parseAnsi, parseInlines, provideStrctWizardDefaults, registerStrctIcon, restoreFocus, saveFocusedElement, strctCheckHostDisplay, strctCheckHostInputs, strctClassifyHref, strctComputeDiff, strctDpPad, strctFormatBytes, strctFormatDuration, strctFormatRate, strctFormatSi, strctParseMarkdown, strctQrMatrix, strctValidationIcon, strctValidationTone, unlockBodyScroll };
 //# sourceMappingURL=akcelik-strct.mjs.map