@akcelik/strct 5.14.0 → 5.16.0

package/fesm2022/akcelik-strct.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, DOCUMENT, signal, computed, Injectable, input, isDevMode, ViewEncapsulation, ChangeDetectionStrategy, Component, ElementRef, NgZone, booleanAttribute, afterNextRender, Directive, HostListener, TemplateRef, contentChildren, viewChild, effect, untracked, model, output, ApplicationRef, EnvironmentInjector, createComponent, PLATFORM_ID, forwardRef, DestroyRef, contentChild, InjectionToken, ViewContainerRef, Injector, viewChildren, Renderer2, Pipe, afterRenderEffect } from '@angular/core';
+import { inject, DOCUMENT, signal, computed, Injectable, input, isDevMode, ViewEncapsulation, ChangeDetectionStrategy, Component, ElementRef, NgZone, booleanAttribute, afterNextRender, Directive, HostListener, TemplateRef, contentChildren, viewChild, effect, untracked, model, output, contentChild, ApplicationRef, EnvironmentInjector, createComponent, PLATFORM_ID, forwardRef, DestroyRef, InjectionToken, ViewContainerRef, Injector, viewChildren, Renderer2, Pipe, afterRenderEffect } from '@angular/core';
 import { DomSanitizer } from '@angular/platform-browser';
 import { DOCUMENT as DOCUMENT$1, NgTemplateOutlet, isPlatformBrowser } from '@angular/common';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
@@ -1135,7 +1135,7 @@ class StrctDropdown {
         const target = event.target;
         if (target?.closest('.strct-dd__itemaction'))
             return; // the second action is not the item
-        const item = target?.closest('strct-dropdown-item');
+        const item = target?.closest(DD_ITEM);
         if (item && item.getAttribute('aria-disabled') !== 'true')
             this.close(true);
     }
@@ -1183,14 +1183,14 @@ class StrctDropdown {
     onItemActionKey(event, key) {
         const target = event.target;
         if (key === 'ArrowLeft') {
-            const item = target.closest('strct-dropdown-item');
+            const item = target.closest(DD_ITEM);
             if (!target.classList.contains('strct-dd__itemaction') || !item)
                 return;
             event.preventDefault();
             item.focus();
             return;
         }
-        const item = target.closest('strct-dropdown-item');
+        const item = target.closest(DD_ITEM);
         const action = item?.querySelector('.strct-dd__itemaction');
         if (!item || item !== target || !action)
             return;
@@ -1202,7 +1202,9 @@ class StrctDropdown {
     }
     enabledItems() {
         return [
-            ...this.host.nativeElement.querySelectorAll('strct-dropdown-item:not([aria-disabled="true"]), strct-submenu .strct-submenu__trigger'),
+            ...this.host.nativeElement.querySelectorAll(`${DD_ITEM.split(', ')
+                .map((sel) => `${sel}:not([aria-disabled="true"])`)
+                .join(', ')}, strct-submenu .strct-submenu__trigger`),
         ];
     }
     /** What the arrow keys visit: enabled items, plus disabled ones that carry a
@@ -1210,7 +1212,7 @@ class StrctDropdown {
     navItems() {
         const host = this.host.nativeElement;
         const rows = [
-            ...host.querySelectorAll('strct-dropdown-item'),
+            ...host.querySelectorAll(DD_ITEM),
             ...host.querySelectorAll('strct-submenu .strct-submenu__trigger'),
         ].filter((el) => el.getAttribute('aria-disabled') !== 'true' ||
             el.classList.contains('strct-dd__item--hinted'));
@@ -1414,6 +1416,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
                     host: { class: 'strct-dd__itemdesc' },
                 }]
         }] });
+/**
+ * The two forms a menu row can take. `a[strctDropdownItem]` is the one for a
+ * row that goes somewhere: a real link (middle-click, ⌘-click, open in a new
+ * tab, copy address) wearing the menu's semantics.
+ */
+const DD_ITEM = 'strct-dropdown-item, a[strctDropdownItem]';
 class StrctDropdownItem {
     /**
      * Select-like usage: bind `selected` and the item becomes a
@@ -1475,7 +1483,7 @@ class StrctDropdownItem {
         }, { capture: true });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctDropdownItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: StrctDropdownItem, isStandalone: true, selector: "strct-dropdown-item", inputs: { selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, critical: { classPropertyName: "critical", publicName: "critical", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.role": "selected() === null ? 'menuitem' : 'menuitemradio'", "attr.aria-checked": "selected()", "attr.tabindex": "tabindex()", "attr.title": "hint() || null", "attr.aria-describedby": "hint() ? hintId : null", "class.strct-dd__item--hinted": "!!hint()", "class.strct-dd__item--critical": "critical()", "class.strct-dd__item--selected": "selected() === true", "attr.aria-disabled": "disabled() || null" }, classAttribute: "strct-dd__item" }, ngImport: i0, template: `@if (selected() !== null) {
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: StrctDropdownItem, isStandalone: true, selector: "strct-dropdown-item, a[strctDropdownItem]", inputs: { selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, critical: { classPropertyName: "critical", publicName: "critical", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.role": "selected() === null ? 'menuitem' : 'menuitemradio'", "attr.aria-checked": "selected()", "attr.tabindex": "tabindex()", "attr.title": "hint() || null", "attr.aria-describedby": "hint() ? hintId : null", "class.strct-dd__item--hinted": "!!hint()", "class.strct-dd__item--critical": "critical()", "class.strct-dd__item--selected": "selected() === true", "attr.aria-disabled": "disabled() || null" }, classAttribute: "strct-dd__item" }, ngImport: i0, template: `@if (selected() !== null) {
       <span class="strct-dd__check" aria-hidden="true">
         @if (selected()) {
           <strct-icon strictName="check" [size]="12" [strokeWidth]="1.8" />
@@ -1500,7 +1508,7 @@ class StrctDropdownItem {
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctDropdownItem, decorators: [{
             type: Component,
-            args: [{ selector: 'strct-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [StrctIcon], template: `@if (selected() !== null) {
+            args: [{ selector: 'strct-dropdown-item, a[strctDropdownItem]', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [StrctIcon], template: `@if (selected() !== null) {
       <span class="strct-dd__check" aria-hidden="true">
         @if (selected()) {
           <strct-icon strictName="check" [size]="12" [strokeWidth]="1.8" />
@@ -1876,7 +1884,7 @@ class StrctHeader {
         }
       </span>
     }
-  `, isInline: true, styles: [".strct-vnav__backdrop{position:fixed;inset:0;z-index:calc(var(--z-nav) - 1);background:var(--backdrop);animation:strct-vnav-backdrop-in .2s ease}@media(min-width:769px){.strct-vnav__backdrop{display:none}}@keyframes strct-vnav-backdrop-in{0%{opacity:0}to{opacity:1}}.strct-header{display:flex;align-items:center;gap:var(--strct-header-gap, 14px);height:56px;padding:0 var(--strct-header-pad, 18px);background:var(--hdr);border-bottom:1px solid var(--b2);color:var(--hdr-fg)}.strct-header--accent{box-shadow:inset 0 -3px 0 var(--strct-header-accent, var(--acc))}.strct-header__actions{display:flex;align-items:center;gap:inherit;min-width:0}.strct-header__more{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:0;border-radius:var(--radius-sm);background:transparent;color:inherit;cursor:pointer}.strct-header__more:hover{background:#ffffff1f}.strct-header__moreslot{display:flex;align-items:center;padding:6px 10px}.strct-header__morecmd{display:flex;align-items:center;gap:8px;width:100%;box-sizing:border-box;padding:9px 10px;border:0;border-radius:5px;background:transparent;color:var(--t1);font-size:13px;font-family:var(--font);text-align:start;cursor:pointer}.strct-header__morecmd:hover,.strct-header__morecmd:focus-visible{background:var(--bg-3);outline:none}@media(max-width:600px){.strct-header{gap:var(--strct-header-gap, 4px);padding:0 var(--strct-header-pad, 6px)}}.strct-header .strct-btn--flat:not(.strct-modal__dialog *,.strct-drawer *,.strct-popover__panel *,.strct-dd__menu *,.strct-tour__card *){color:color-mix(in srgb,var(--hdr-fg) 72%,transparent)}.strct-header .strct-btn--flat:not(.strct-modal__dialog *,.strct-drawer *,.strct-popover__panel *,.strct-dd__menu *,.strct-tour__card *):hover:not(:disabled){background:color-mix(in srgb,var(--hdr-fg) 12%,transparent);color:var(--hdr-fg)}.strct-header .strct-btn--flat:not(.strct-modal__dialog *,.strct-drawer *,.strct-popover__panel *,.strct-dd__menu *,.strct-tour__card *):focus-visible{outline-color:color-mix(in srgb,var(--hdr-fg) 60%,transparent)}.strct-header__drawer-toggle{display:none;align-items:center;justify-content:center;padding:4px;border:0;border-radius:5px;background:transparent;color:color-mix(in srgb,var(--hdr-fg) 85%,transparent);cursor:pointer}.strct-header__drawer-toggle:hover{background:#ffffff1f;color:var(--hdr-fg)}@media(max-width:768px){.strct-header__drawer-toggle{display:inline-flex}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: StrctIcon, selector: "strct-icon", inputs: ["name", "strictName", "size", "strokeWidth", "badge", "ariaLabel", "count", "countMax", "countStatus", "countLabel"] }, { kind: "component", type: StrctDropdown, selector: "strct-dropdown", inputs: ["align", "popover", "popoverLabel", "focusable"] }, { kind: "directive", type: StrctDropdownTrigger, selector: "[strctDropdownTrigger]" }, { kind: "component", type: StrctDropdownItem, selector: "strct-dropdown-item", inputs: ["selected", "critical", "disabled", "hint"] }, { kind: "directive", type: StrctDropdownItemIcon, selector: "[strctDropdownItemIcon]", inputs: ["tone"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, styles: [".strct-vnav__backdrop{position:fixed;inset:0;z-index:calc(var(--z-nav) - 1);background:var(--backdrop);animation:strct-vnav-backdrop-in .2s ease}@media(min-width:769px){.strct-vnav__backdrop{display:none}}@keyframes strct-vnav-backdrop-in{0%{opacity:0}to{opacity:1}}.strct-header{display:flex;align-items:center;gap:var(--strct-header-gap, 14px);height:56px;padding:0 var(--strct-header-pad, 18px);background:var(--hdr);border-bottom:1px solid var(--b2);color:var(--hdr-fg)}.strct-header--accent{box-shadow:inset 0 -3px 0 var(--strct-header-accent, var(--acc))}.strct-header__actions{display:flex;align-items:center;gap:inherit;min-width:0}.strct-header__more{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:0;border-radius:var(--radius-sm);background:transparent;color:inherit;cursor:pointer}.strct-header__more:hover{background:#ffffff1f}.strct-header__moreslot{display:flex;align-items:center;padding:6px 10px}.strct-header__morecmd{display:flex;align-items:center;gap:8px;width:100%;box-sizing:border-box;padding:9px 10px;border:0;border-radius:5px;background:transparent;color:var(--t1);font-size:13px;font-family:var(--font);text-align:start;cursor:pointer}.strct-header__morecmd:hover,.strct-header__morecmd:focus-visible{background:var(--bg-3);outline:none}@media(max-width:600px){.strct-header{gap:var(--strct-header-gap, 4px);padding:0 var(--strct-header-pad, 6px)}}.strct-header .strct-btn--flat:not(.strct-modal__dialog *,.strct-drawer *,.strct-popover__panel *,.strct-dd__menu *,.strct-tour__card *){color:color-mix(in srgb,var(--hdr-fg) 72%,transparent)}.strct-header .strct-btn--flat:not(.strct-modal__dialog *,.strct-drawer *,.strct-popover__panel *,.strct-dd__menu *,.strct-tour__card *):hover:not(:disabled){background:color-mix(in srgb,var(--hdr-fg) 12%,transparent);color:var(--hdr-fg)}.strct-header .strct-btn--flat:not(.strct-modal__dialog *,.strct-drawer *,.strct-popover__panel *,.strct-dd__menu *,.strct-tour__card *):focus-visible{outline-color:color-mix(in srgb,var(--hdr-fg) 60%,transparent)}.strct-header__drawer-toggle{display:none;align-items:center;justify-content:center;padding:4px;border:0;border-radius:5px;background:transparent;color:color-mix(in srgb,var(--hdr-fg) 85%,transparent);cursor:pointer}.strct-header__drawer-toggle:hover{background:#ffffff1f;color:var(--hdr-fg)}@media(max-width:768px){.strct-header__drawer-toggle{display:inline-flex}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: StrctIcon, selector: "strct-icon", inputs: ["name", "strictName", "size", "strokeWidth", "badge", "ariaLabel", "count", "countMax", "countStatus", "countLabel"] }, { kind: "component", type: StrctDropdown, selector: "strct-dropdown", inputs: ["align", "popover", "popoverLabel", "focusable"] }, { kind: "directive", type: StrctDropdownTrigger, selector: "[strctDropdownTrigger]" }, { kind: "component", type: StrctDropdownItem, selector: "strct-dropdown-item, a[strctDropdownItem]", inputs: ["selected", "critical", "disabled", "hint"] }, { kind: "directive", type: StrctDropdownItemIcon, selector: "[strctDropdownItemIcon]", inputs: ["tone"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctHeader, decorators: [{
             type: Component,
@@ -3946,6 +3954,15 @@ class StrctCard {
     loading = input(false, { ...(ngDevMode ? { debugName: "loading" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     /** Allow collapsing to just the header (a chevron appears in the header). */
     collapsible = input(false, { ...(ngDevMode ? { debugName: "collapsible" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Opt-in: a click anywhere on `strct-card-header` toggles the card, which
+     * is where an operator clicks — the title, not the chevron. A click on an
+     * interactive descendant (a button, a link, a form control) keeps its own,
+     * and so does the chevron, which would otherwise toggle twice and leave the
+     * card closed while the consumer's state said open. The chevron stays the
+     * keyboard control: a header is not a button.
+     */
+    headerToggles = input(false, { ...(ngDevMode ? { debugName: "headerToggles" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     /** Collapsed state (two-way; only meaningful with `collapsible`). */
     collapsed = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "collapsed" }] : /* istanbul ignore next */ []));
@@ -3953,7 +3970,7 @@ class StrctCard {
         this.collapsed.update((v) => !v);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctCard, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: StrctCard, isStandalone: true, selector: "strct-card", inputs: { status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, interactive: { classPropertyName: "interactive", publicName: "interactive", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, dense: { classPropertyName: "dense", publicName: "dense", isSignal: true, isRequired: false, transformFunction: null }, fill: { classPropertyName: "fill", publicName: "fill", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, collapsible: { classPropertyName: "collapsible", publicName: "collapsible", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapsed: "collapsedChange" }, host: { properties: { "class.strct-card--accent": "status() === 'accent'", "class.strct-card--success": "status() === 'success'", "class.strct-card--warning": "status() === 'warning'", "class.strct-card--critical": "status() === 'critical'", "class.strct-card--interactive": "interactive()", "class.strct-card--selected": "selected()", "class.strct-card--dense": "dense()", "class.strct-card--loading": "loading()", "class.strct-card--fill": "fill()", "class.strct-card--collapsed": "collapsible() && collapsed()", "attr.aria-busy": "loading() ? \"true\" : null" }, classAttribute: "strct-card" }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: [".strct-card{position:relative;display:block;background:var(--bg-1);border:1px solid var(--b2);border-radius:var(--radius-lg);box-shadow:var(--sh);overflow:hidden}.strct-card--fill{display:flex;flex-direction:column;height:100%}.strct-card--fill .strct-card__block{flex:1}.strct-card--fill .strct-card__footer{margin-block-start:auto}.strct-card--accent{border-inline-start:3px solid var(--acc)}.strct-card--success{border-inline-start:3px solid var(--success)}.strct-card--warning{border-inline-start:3px solid var(--warning)}.strct-card--critical{border-inline-start:3px solid var(--critical)}.strct-card--interactive{cursor:pointer;transition:border-color .14s ease,transform .14s ease,box-shadow .14s ease}.strct-card--interactive:hover{border-color:var(--acc50);transform:translateY(-1px);box-shadow:var(--shh)}.strct-card--interactive:focus-within{border-color:var(--acc)}.strct-card--selected{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc),var(--sh)}.strct-card--dense{--strct-card-px: var(--space-3);--strct-card-py: var(--space-2);--strct-card-pb: var(--space-3)}.strct-card--loading:before{content:\"\";position:absolute;top:0;left:0;height:2px;width:40%;background:var(--acc);animation:strct-card-load 1.1s ease-in-out infinite;z-index:var(--z-base)}.strct-card--loading>strct-card-block,.strct-card--loading>strct-card-footer{opacity:.55;pointer-events:none}@keyframes strct-card-load{0%{transform:translate(-100%)}to{transform:translate(280%)}}.strct-card--collapsed>strct-card-block,.strct-card--collapsed>strct-card-footer{display:none}.strct-card--collapsed>strct-card-header{border-bottom:0}@media(prefers-reduced-motion:reduce){.strct-card--interactive{transition:none}.strct-card--interactive:hover{transform:none}.strct-card--loading:before{animation:none;width:100%;opacity:.4}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: StrctCard, isStandalone: true, selector: "strct-card", inputs: { status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, interactive: { classPropertyName: "interactive", publicName: "interactive", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, dense: { classPropertyName: "dense", publicName: "dense", isSignal: true, isRequired: false, transformFunction: null }, fill: { classPropertyName: "fill", publicName: "fill", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, collapsible: { classPropertyName: "collapsible", publicName: "collapsible", isSignal: true, isRequired: false, transformFunction: null }, headerToggles: { classPropertyName: "headerToggles", publicName: "headerToggles", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapsed: "collapsedChange" }, host: { properties: { "class.strct-card--accent": "status() === 'accent'", "class.strct-card--success": "status() === 'success'", "class.strct-card--warning": "status() === 'warning'", "class.strct-card--critical": "status() === 'critical'", "class.strct-card--interactive": "interactive()", "class.strct-card--selected": "selected()", "class.strct-card--dense": "dense()", "class.strct-card--loading": "loading()", "class.strct-card--fill": "fill()", "class.strct-card--collapsed": "collapsible() && collapsed()", "attr.aria-busy": "loading() ? \"true\" : null" }, classAttribute: "strct-card" }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: [".strct-card{position:relative;display:block;background:var(--bg-1);border:1px solid var(--b2);border-radius:var(--radius-lg);box-shadow:var(--sh);overflow:hidden}.strct-card--fill{display:flex;flex-direction:column;height:100%}.strct-card--fill .strct-card__block{flex:1}.strct-card--fill .strct-card__footer{margin-block-start:auto}.strct-card--accent{border-inline-start:3px solid var(--acc)}.strct-card--success{border-inline-start:3px solid var(--success)}.strct-card--warning{border-inline-start:3px solid var(--warning)}.strct-card--critical{border-inline-start:3px solid var(--critical)}.strct-card--interactive{cursor:pointer;transition:border-color .14s ease,transform .14s ease,box-shadow .14s ease}.strct-card--interactive:hover{border-color:var(--acc50);transform:translateY(-1px);box-shadow:var(--shh)}.strct-card--interactive:focus-within{border-color:var(--acc)}.strct-card--selected{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc),var(--sh)}.strct-card--dense{--strct-card-px: var(--space-3);--strct-card-py: var(--space-2);--strct-card-pb: var(--space-3)}.strct-card--loading:before{content:\"\";position:absolute;top:0;left:0;height:2px;width:40%;background:var(--acc);animation:strct-card-load 1.1s ease-in-out infinite;z-index:var(--z-base)}.strct-card--loading>strct-card-block,.strct-card--loading>strct-card-footer{opacity:.55;pointer-events:none}@keyframes strct-card-load{0%{transform:translate(-100%)}to{transform:translate(280%)}}.strct-card--collapsed>strct-card-block,.strct-card--collapsed>strct-card-footer{display:none}.strct-card--collapsed>strct-card-header{border-bottom:0}@media(prefers-reduced-motion:reduce){.strct-card--interactive{transition:none}.strct-card--interactive:hover{transform:none}.strct-card--loading:before{animation:none;width:100%;opacity:.4}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctCard, decorators: [{
             type: Component,
@@ -3971,7 +3988,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
                         '[class.strct-card--collapsed]': 'collapsible() && collapsed()',
                         '[attr.aria-busy]': 'loading() ? "true" : null',
                     }, styles: [".strct-card{position:relative;display:block;background:var(--bg-1);border:1px solid var(--b2);border-radius:var(--radius-lg);box-shadow:var(--sh);overflow:hidden}.strct-card--fill{display:flex;flex-direction:column;height:100%}.strct-card--fill .strct-card__block{flex:1}.strct-card--fill .strct-card__footer{margin-block-start:auto}.strct-card--accent{border-inline-start:3px solid var(--acc)}.strct-card--success{border-inline-start:3px solid var(--success)}.strct-card--warning{border-inline-start:3px solid var(--warning)}.strct-card--critical{border-inline-start:3px solid var(--critical)}.strct-card--interactive{cursor:pointer;transition:border-color .14s ease,transform .14s ease,box-shadow .14s ease}.strct-card--interactive:hover{border-color:var(--acc50);transform:translateY(-1px);box-shadow:var(--shh)}.strct-card--interactive:focus-within{border-color:var(--acc)}.strct-card--selected{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc),var(--sh)}.strct-card--dense{--strct-card-px: var(--space-3);--strct-card-py: var(--space-2);--strct-card-pb: var(--space-3)}.strct-card--loading:before{content:\"\";position:absolute;top:0;left:0;height:2px;width:40%;background:var(--acc);animation:strct-card-load 1.1s ease-in-out infinite;z-index:var(--z-base)}.strct-card--loading>strct-card-block,.strct-card--loading>strct-card-footer{opacity:.55;pointer-events:none}@keyframes strct-card-load{0%{transform:translate(-100%)}to{transform:translate(280%)}}.strct-card--collapsed>strct-card-block,.strct-card--collapsed>strct-card-footer{display:none}.strct-card--collapsed>strct-card-header{border-bottom:0}@media(prefers-reduced-motion:reduce){.strct-card--interactive{transition:none}.strct-card--interactive:hover{transform:none}.strct-card--loading:before{animation:none;width:100%;opacity:.4}}\n"] }]
-        }], propDecorators: { status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], interactive: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactive", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], dense: [{ type: i0.Input, args: [{ isSignal: true, alias: "dense", required: false }] }], fill: [{ type: i0.Input, args: [{ isSignal: true, alias: "fill", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], collapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsible", required: false }] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }, { type: i0.Output, args: ["collapsedChange"] }] } });
+        }], propDecorators: { status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], interactive: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactive", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], dense: [{ type: i0.Input, args: [{ isSignal: true, alias: "dense", required: false }] }], fill: [{ type: i0.Input, args: [{ isSignal: true, alias: "fill", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], collapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsible", required: false }] }], headerToggles: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerToggles", required: false }] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }, { type: i0.Output, args: ["collapsedChange"] }] } });
 /** Header section of a {@link StrctCard}. */
 class StrctCardHeader {
     /** Optional leading icon (StrctIcon set). */
@@ -3998,8 +4015,29 @@ class StrctCardHeader {
     expandLabel = input('Expand', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "expandLabel" }] : /* istanbul ignore next */ []));
     card = inject(StrctCard, { optional: true });
+    /** Only a collapsible card that asked for it toggles from its header. */
+    togglesOnClick() {
+        return !!this.card?.collapsible() && !!this.card?.headerToggles();
+    }
+    /**
+     * Anything with a click of its own keeps it — including our own chevron,
+     * whose click would otherwise bubble here and toggle a second time, leaving
+     * the card closed while the consumer's state said open.
+     */
+    onHeaderClick(event) {
+        if (!this.togglesOnClick())
+            return;
+        const target = event.target;
+        if (target?.closest('button, a[href], input, select, textarea, label, summary, [role="button"], [role="link"], [role="checkbox"], [role="switch"], [contenteditable]')) {
+            return;
+        }
+        // Selecting the heading's text is not a click on the header.
+        if (typeof getSelection === 'function' && getSelection()?.toString())
+            return;
+        this.card?.toggle();
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctCardHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: StrctCardHeader, isStandalone: true, selector: "strct-card-header", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, wrap: { classPropertyName: "wrap", publicName: "wrap", isSignal: true, isRequired: false, transformFunction: null }, collapseLabel: { classPropertyName: "collapseLabel", publicName: "collapseLabel", isSignal: true, isRequired: false, transformFunction: null }, expandLabel: { classPropertyName: "expandLabel", publicName: "expandLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.strct-card__header--overline": "appearance() === 'overline'", "class.strct-card__header--wrap": "wrap()" }, classAttribute: "strct-card__header" }, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: StrctCardHeader, isStandalone: true, selector: "strct-card-header", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, wrap: { classPropertyName: "wrap", publicName: "wrap", isSignal: true, isRequired: false, transformFunction: null }, collapseLabel: { classPropertyName: "collapseLabel", publicName: "collapseLabel", isSignal: true, isRequired: false, transformFunction: null }, expandLabel: { classPropertyName: "expandLabel", publicName: "expandLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onHeaderClick($event)" }, properties: { "class.strct-card__header--overline": "appearance() === 'overline'", "class.strct-card__header--wrap": "wrap()", "class.strct-card__header--toggles": "togglesOnClick()" }, classAttribute: "strct-card__header" }, ngImport: i0, template: `
     <span class="strct-card__hmain">
       <!-- Declared before the catch-all so the selector wins; CSS order keeps
            it first. A drag grip leads the title this way. -->
@@ -4056,7 +4094,7 @@ class StrctCardHeader {
         />
       </button>
     }
-  `, isInline: true, styles: [".strct-card__header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);padding:var(--strct-card-py, var(--space-3)) var(--strct-card-px, var(--space-4));border-bottom:1px solid var(--b1);font-size:13px;font-weight:600;color:var(--t1)}.strct-card__hmain,.strct-card__hend{display:flex;align-items:center;gap:var(--space-2);min-width:0}.strct-card__hend:empty{display:none}.strct-card__htitle{min-width:0;margin:0;font:inherit;color:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strct-card__header--wrap{align-items:flex-start}.strct-card__header--wrap .strct-card__htitle{overflow:visible;text-overflow:clip;white-space:normal}.strct-card__header--wrap .strct-card__hmain{flex-wrap:wrap}.strct-card__header--overline .strct-card__htitle{font-size:var(--text-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--t2)}[strctCardHeaderNote]{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:400;font-size:var(--text-sm);color:var(--t3)}.strct-card__hicon{color:var(--t2);flex-shrink:0}.strct-card__collapse{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin:-4px;margin-inline-start:0;padding:0;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--t3);cursor:pointer;flex-shrink:0}.strct-card__collapse:hover{color:var(--t1);background:var(--bg-3)}.strct-card__collapse:focus-visible{outline:none;box-shadow:0 0 0 2px var(--acc50)}.strct-card__collapse strct-icon{transition:transform .15s ease}.strct-card__chev--collapsed{transform:rotate(-90deg)}@media(prefers-reduced-motion:reduce){.strct-card__collapse strct-icon{transition:none}}\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-card__header--toggles{cursor:pointer}.strct-card__header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);padding:var(--strct-card-py, var(--space-3)) var(--strct-card-px, var(--space-4));border-bottom:1px solid var(--b1);font-size:13px;font-weight:600;color:var(--t1)}.strct-card__hmain,.strct-card__hend{display:flex;align-items:center;gap:var(--space-2);min-width:0}.strct-card__hend:empty{display:none}.strct-card__htitle{min-width:0;margin:0;font:inherit;color:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strct-card__header--wrap{align-items:flex-start}.strct-card__header--wrap .strct-card__htitle{overflow:visible;text-overflow:clip;white-space:normal}.strct-card__header--wrap .strct-card__hmain{flex-wrap:wrap}.strct-card__header--overline .strct-card__htitle{font-size:var(--text-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--t2)}[strctCardHeaderNote]{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:400;font-size:var(--text-sm);color:var(--t3)}.strct-card__hicon{color:var(--t2);flex-shrink:0}.strct-card__collapse{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin:-4px;margin-inline-start:0;padding:0;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--t3);cursor:pointer;flex-shrink:0}.strct-card__collapse:hover{color:var(--t1);background:var(--bg-3)}.strct-card__collapse:focus-visible{outline:none;box-shadow:0 0 0 2px var(--acc50)}.strct-card__collapse strct-icon{transition:transform .15s ease}.strct-card__chev--collapsed{transform:rotate(-90deg)}@media(prefers-reduced-motion:reduce){.strct-card__collapse strct-icon{transition:none}}\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: StrctCardHeader, decorators: [{
             type: Component,
@@ -4121,7 +4159,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
                         class: 'strct-card__header',
                         '[class.strct-card__header--overline]': "appearance() === 'overline'",
                         '[class.strct-card__header--wrap]': 'wrap()',
-                    }, styles: [".strct-card__header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);padding:var(--strct-card-py, var(--space-3)) var(--strct-card-px, var(--space-4));border-bottom:1px solid var(--b1);font-size:13px;font-weight:600;color:var(--t1)}.strct-card__hmain,.strct-card__hend{display:flex;align-items:center;gap:var(--space-2);min-width:0}.strct-card__hend:empty{display:none}.strct-card__htitle{min-width:0;margin:0;font:inherit;color:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strct-card__header--wrap{align-items:flex-start}.strct-card__header--wrap .strct-card__htitle{overflow:visible;text-overflow:clip;white-space:normal}.strct-card__header--wrap .strct-card__hmain{flex-wrap:wrap}.strct-card__header--overline .strct-card__htitle{font-size:var(--text-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--t2)}[strctCardHeaderNote]{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:400;font-size:var(--text-sm);color:var(--t3)}.strct-card__hicon{color:var(--t2);flex-shrink:0}.strct-card__collapse{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin:-4px;margin-inline-start:0;padding:0;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--t3);cursor:pointer;flex-shrink:0}.strct-card__collapse:hover{color:var(--t1);background:var(--bg-3)}.strct-card__collapse:focus-visible{outline:none;box-shadow:0 0 0 2px var(--acc50)}.strct-card__collapse strct-icon{transition:transform .15s ease}.strct-card__chev--collapsed{transform:rotate(-90deg)}@media(prefers-reduced-motion:reduce){.strct-card__collapse strct-icon{transition:none}}\n"] }]
+                        '[class.strct-card__header--toggles]': 'togglesOnClick()',
+                        '(click)': 'onHeaderClick($event)',
+                    }, styles: [".strct-card__header--toggles{cursor:pointer}.strct-card__header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);padding:var(--strct-card-py, var(--space-3)) var(--strct-card-px, var(--space-4));border-bottom:1px solid var(--b1);font-size:13px;font-weight:600;color:var(--t1)}.strct-card__hmain,.strct-card__hend{display:flex;align-items:center;gap:var(--space-2);min-width:0}.strct-card__hend:empty{display:none}.strct-card__htitle{min-width:0;margin:0;font:inherit;color:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strct-card__header--wrap{align-items:flex-start}.strct-card__header--wrap .strct-card__htitle{overflow:visible;text-overflow:clip;white-space:normal}.strct-card__header--wrap .strct-card__hmain{flex-wrap:wrap}.strct-card__header--overline .strct-card__htitle{font-size:var(--text-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--t2)}[strctCardHeaderNote]{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:400;font-size:var(--text-sm);color:var(--t3)}.strct-card__hicon{color:var(--t2);flex-shrink:0}.strct-card__collapse{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin:-4px;margin-inline-start:0;padding:0;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--t3);cursor:pointer;flex-shrink:0}.strct-card__collapse:hover{color:var(--t1);background:var(--bg-3)}.strct-card__collapse:focus-visible{outline:none;box-shadow:0 0 0 2px var(--acc50)}.strct-card__collapse strct-icon{transition:transform .15s ease}.strct-card__chev--collapsed{transform:rotate(-90deg)}@media(prefers-reduced-motion:reduce){.strct-card__collapse strct-icon{transition:none}}\n"] }]
         }], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], level: [{ type: i0.Input, args: [{ isSignal: true, alias: "level", required: false }] }], wrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "wrap", required: false }] }], collapseLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapseLabel", required: false }] }], expandLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandLabel", required: false }] }] } });
 /** Leads the card's heading — a drag grip, a status dot, an avatar. */
 class StrctCardHeaderLeading {
@@ -4188,11 +4228,35 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
             args: [{ selector: 'strct-accordion', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `<ng-content />`, host: { class: 'strct-accordion' }, styles: [".strct-accordion{display:flex;flex-direction:column;border:1px solid var(--b2);border-radius:8px;overflow:hidden;background:var(--bg-1)}\n"] }]
         }] });
 let accordionCounter = 0;
+/**
+ * Badges, tags or a result in a panel's header, after the title:
+ * `<strct-badge strctAccordionPanelMeta status="critical">Failed</strct-badge>`.
+ * It is projected into the header but kept **outside** the button, so the
+ * button is still called by its heading alone — the result is read after it,
+ * as the button's description.
+ */
+class StrctAccordionPanelMeta {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctAccordionPanelMeta, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.4", type: StrctAccordionPanelMeta, isStandalone: true, selector: "[strctAccordionPanelMeta]", host: { classAttribute: "strct-acc__metaitem" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctAccordionPanelMeta, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[strctAccordionPanelMeta]',
+                    host: { class: 'strct-acc__metaitem' },
+                }]
+        }] });
 /** Collapsible panel with a header. `expanded` is two-way bindable. */
 class StrctAccordionPanel {
     /** Panel heading. */
     heading = input.required(/* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []));
+    /**
+     * A tone rail on the leading edge, as `strct-card [status]` has — the
+     * result of the thing the panel reports, said in colour as well as words.
+     */
+    status = input('neutral', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "status" }] : /* istanbul ignore next */ []));
     /** Whether the panel is open (two-way). */
     expanded = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "expanded" }] : /* istanbul ignore next */ []));
@@ -4203,49 +4267,71 @@ class StrctAccordionPanel {
      */
     appearance = input('boxed', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []));
+    /** Whatever a consumer put beside the title, so the button can describe it. */
+    meta = contentChild(StrctAccordionPanelMeta, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "meta" }] : /* istanbul ignore next */ []));
     bodyId = `strct-acc-${++accordionCounter}`;
     headId = `${this.bodyId}-head`;
+    metaId = `${this.bodyId}-meta`;
     toggle() {
         this.expanded.update((v) => !v);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctAccordionPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: StrctAccordionPanel, isStandalone: true, selector: "strct-accordion-panel", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: true, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "expandedChange" }, host: { properties: { "class.strct-acc--quiet": "appearance() === 'quiet'" }, classAttribute: "strct-acc" }, ngImport: i0, template: `
-    <button
-      type="button"
-      class="strct-acc__head"
-      [id]="headId"
-      [attr.aria-expanded]="expanded()"
-      [attr.aria-controls]="bodyId"
-      (click)="toggle()"
-    >
-      <span class="strct-acc__chevron" [class.strct-acc__chevron--open]="expanded()">
-        <strct-icon name="chevronRight" [size]="13" [strokeWidth]="1.7" />
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: StrctAccordionPanel, isStandalone: true, selector: "strct-accordion-panel", inputs: { heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: true, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "expandedChange" }, host: { properties: { "class.strct-acc--quiet": "appearance() === 'quiet'", "class.strct-acc--accent": "status() === 'accent'", "class.strct-acc--success": "status() === 'success'", "class.strct-acc--warning": "status() === 'warning'", "class.strct-acc--critical": "status() === 'critical'" }, classAttribute: "strct-acc" }, queries: [{ propertyName: "meta", first: true, predicate: StrctAccordionPanelMeta, descendants: true, isSignal: true }], ngImport: i0, template: `
+    <div class="strct-acc__header">
+      <button
+        type="button"
+        class="strct-acc__head"
+        [id]="headId"
+        [attr.aria-expanded]="expanded()"
+        [attr.aria-controls]="bodyId"
+        [attr.aria-describedby]="meta() ? metaId : null"
+        (click)="toggle()"
+      >
+        <span class="strct-acc__chevron" [class.strct-acc__chevron--open]="expanded()">
+          <strct-icon name="chevronRight" [size]="13" [strokeWidth]="1.7" />
+        </span>
+        <span class="strct-acc__title">{{ heading() }}</span>
+      </button>
+      <!-- Outside the button on purpose: a badge in the name would make the
+           button "Cluster time — Failed", and a tag you can click cannot
+           live inside another button at all. -->
+      <span class="strct-acc__meta" [id]="metaId">
+        <ng-content select="[strctAccordionPanelMeta]" />
       </span>
-      <span class="strct-acc__title">{{ heading() }}</span>
-    </button>
+    </div>
     @if (expanded()) {
       <div class="strct-acc__body" [id]="bodyId" role="region" [attr.aria-labelledby]="headId">
         <ng-content />
       </div>
     }
-  `, isInline: true, styles: [".strct-acc{display:block}.strct-acc+.strct-acc{border-top:1px solid var(--b2)}.strct-acc__head{display:flex;align-items:center;gap:9px;width:100%;padding:11px 14px;border:0;background:transparent;cursor:pointer;font-family:var(--font);font-size:13px;font-weight:500;color:var(--t1);text-align:start}.strct-acc__head:hover{background:var(--bg-3)}.strct-acc__chevron{display:inline-flex;color:var(--t3);transition:transform .16s ease}.strct-acc__chevron--open{transform:rotate(90deg);color:var(--acc)}[dir=rtl] .strct-acc__chevron:not(.strct-acc__chevron--open){transform:rotate(180deg)}.strct-acc__title{flex:1}.strct-acc__body{padding:4px 14px 14px;padding-inline-start:32px;color:var(--t2);font-size:13px;border-top:1px solid var(--b1)}.strct-acc--quiet+.strct-acc--quiet{border-top:0}.strct-acc--quiet .strct-acc__head{width:auto;padding:2px 0;gap:6px;font-size:var(--text-sm);font-weight:400;color:var(--t2)}.strct-acc--quiet .strct-acc__head:hover{background:none;color:var(--t1);text-decoration:underline}.strct-acc--quiet .strct-acc__head:focus-visible{outline:2px solid var(--acc50);outline-offset:2px;border-radius:var(--radius-sm)}.strct-acc--quiet .strct-acc__title{flex:none}.strct-acc--quiet .strct-acc__body{padding:4px 0 8px;padding-inline-start:var(--space-3);border-top:0;font-size:var(--text-sm)}\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-acc{display:block}.strct-acc+.strct-acc{border-top:1px solid var(--b2)}.strct-acc__header{display:flex;align-items:center;gap:9px}.strct-acc__meta{display:flex;align-items:center;gap:6px;flex:none;padding-inline-end:14px}.strct-acc__meta:empty{display:none}.strct-acc--accent{border-inline-start:3px solid var(--acc)}.strct-acc--success{border-inline-start:3px solid var(--success)}.strct-acc--warning{border-inline-start:3px solid var(--warning)}.strct-acc--critical{border-inline-start:3px solid var(--critical)}.strct-acc__head{display:flex;align-items:center;gap:9px;width:100%;padding:11px 14px;border:0;background:transparent;cursor:pointer;font-family:var(--font);font-size:13px;font-weight:500;color:var(--t1);text-align:start}.strct-acc__head:hover{background:var(--bg-3)}.strct-acc__chevron{display:inline-flex;color:var(--t3);transition:transform .16s ease}.strct-acc__chevron--open{transform:rotate(90deg);color:var(--acc)}[dir=rtl] .strct-acc__chevron:not(.strct-acc__chevron--open){transform:rotate(180deg)}.strct-acc__title{flex:1}.strct-acc__body{padding:4px 14px 14px;padding-inline-start:32px;color:var(--t2);font-size:13px;border-top:1px solid var(--b1)}.strct-acc--quiet+.strct-acc--quiet{border-top:0}.strct-acc--quiet .strct-acc__meta{padding-inline-end:0}.strct-acc--quiet .strct-acc__head{width:auto;padding:2px 0;gap:6px;font-size:var(--text-sm);font-weight:400;color:var(--t2)}.strct-acc--quiet .strct-acc__head:hover{background:none;color:var(--t1);text-decoration:underline}.strct-acc--quiet .strct-acc__head:focus-visible{outline:2px solid var(--acc50);outline-offset:2px;border-radius:var(--radius-sm)}.strct-acc--quiet .strct-acc__title{flex:none}.strct-acc--quiet .strct-acc__body{padding:4px 0 8px;padding-inline-start:var(--space-3);border-top:0;font-size:var(--text-sm)}\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: StrctAccordionPanel, decorators: [{
             type: Component,
             args: [{ selector: 'strct-accordion-panel', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [StrctIcon], template: `
-    <button
-      type="button"
-      class="strct-acc__head"
-      [id]="headId"
-      [attr.aria-expanded]="expanded()"
-      [attr.aria-controls]="bodyId"
-      (click)="toggle()"
-    >
-      <span class="strct-acc__chevron" [class.strct-acc__chevron--open]="expanded()">
-        <strct-icon name="chevronRight" [size]="13" [strokeWidth]="1.7" />
+    <div class="strct-acc__header">
+      <button
+        type="button"
+        class="strct-acc__head"
+        [id]="headId"
+        [attr.aria-expanded]="expanded()"
+        [attr.aria-controls]="bodyId"
+        [attr.aria-describedby]="meta() ? metaId : null"
+        (click)="toggle()"
+      >
+        <span class="strct-acc__chevron" [class.strct-acc__chevron--open]="expanded()">
+          <strct-icon name="chevronRight" [size]="13" [strokeWidth]="1.7" />
+        </span>
+        <span class="strct-acc__title">{{ heading() }}</span>
+      </button>
+      <!-- Outside the button on purpose: a badge in the name would make the
+           button "Cluster time — Failed", and a tag you can click cannot
+           live inside another button at all. -->
+      <span class="strct-acc__meta" [id]="metaId">
+        <ng-content select="[strctAccordionPanelMeta]" />
       </span>
-      <span class="strct-acc__title">{{ heading() }}</span>
-    </button>
+    </div>
     @if (expanded()) {
       <div class="strct-acc__body" [id]="bodyId" role="region" [attr.aria-labelledby]="headId">
         <ng-content />
@@ -4254,8 +4340,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
   `, host: {
                         class: 'strct-acc',
                         '[class.strct-acc--quiet]': "appearance() === 'quiet'",
-                    }, styles: [".strct-acc{display:block}.strct-acc+.strct-acc{border-top:1px solid var(--b2)}.strct-acc__head{display:flex;align-items:center;gap:9px;width:100%;padding:11px 14px;border:0;background:transparent;cursor:pointer;font-family:var(--font);font-size:13px;font-weight:500;color:var(--t1);text-align:start}.strct-acc__head:hover{background:var(--bg-3)}.strct-acc__chevron{display:inline-flex;color:var(--t3);transition:transform .16s ease}.strct-acc__chevron--open{transform:rotate(90deg);color:var(--acc)}[dir=rtl] .strct-acc__chevron:not(.strct-acc__chevron--open){transform:rotate(180deg)}.strct-acc__title{flex:1}.strct-acc__body{padding:4px 14px 14px;padding-inline-start:32px;color:var(--t2);font-size:13px;border-top:1px solid var(--b1)}.strct-acc--quiet+.strct-acc--quiet{border-top:0}.strct-acc--quiet .strct-acc__head{width:auto;padding:2px 0;gap:6px;font-size:var(--text-sm);font-weight:400;color:var(--t2)}.strct-acc--quiet .strct-acc__head:hover{background:none;color:var(--t1);text-decoration:underline}.strct-acc--quiet .strct-acc__head:focus-visible{outline:2px solid var(--acc50);outline-offset:2px;border-radius:var(--radius-sm)}.strct-acc--quiet .strct-acc__title{flex:none}.strct-acc--quiet .strct-acc__body{padding:4px 0 8px;padding-inline-start:var(--space-3);border-top:0;font-size:var(--text-sm)}\n"] }]
-        }], propDecorators: { heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: true }] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }, { type: i0.Output, args: ["expandedChange"] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }] } });
+                        '[class.strct-acc--accent]': "status() === 'accent'",
+                        '[class.strct-acc--success]': "status() === 'success'",
+                        '[class.strct-acc--warning]': "status() === 'warning'",
+                        '[class.strct-acc--critical]': "status() === 'critical'",
+                    }, styles: [".strct-acc{display:block}.strct-acc+.strct-acc{border-top:1px solid var(--b2)}.strct-acc__header{display:flex;align-items:center;gap:9px}.strct-acc__meta{display:flex;align-items:center;gap:6px;flex:none;padding-inline-end:14px}.strct-acc__meta:empty{display:none}.strct-acc--accent{border-inline-start:3px solid var(--acc)}.strct-acc--success{border-inline-start:3px solid var(--success)}.strct-acc--warning{border-inline-start:3px solid var(--warning)}.strct-acc--critical{border-inline-start:3px solid var(--critical)}.strct-acc__head{display:flex;align-items:center;gap:9px;width:100%;padding:11px 14px;border:0;background:transparent;cursor:pointer;font-family:var(--font);font-size:13px;font-weight:500;color:var(--t1);text-align:start}.strct-acc__head:hover{background:var(--bg-3)}.strct-acc__chevron{display:inline-flex;color:var(--t3);transition:transform .16s ease}.strct-acc__chevron--open{transform:rotate(90deg);color:var(--acc)}[dir=rtl] .strct-acc__chevron:not(.strct-acc__chevron--open){transform:rotate(180deg)}.strct-acc__title{flex:1}.strct-acc__body{padding:4px 14px 14px;padding-inline-start:32px;color:var(--t2);font-size:13px;border-top:1px solid var(--b1)}.strct-acc--quiet+.strct-acc--quiet{border-top:0}.strct-acc--quiet .strct-acc__meta{padding-inline-end:0}.strct-acc--quiet .strct-acc__head{width:auto;padding:2px 0;gap:6px;font-size:var(--text-sm);font-weight:400;color:var(--t2)}.strct-acc--quiet .strct-acc__head:hover{background:none;color:var(--t1);text-decoration:underline}.strct-acc--quiet .strct-acc__head:focus-visible{outline:2px solid var(--acc50);outline-offset:2px;border-radius:var(--radius-sm)}.strct-acc--quiet .strct-acc__title{flex:none}.strct-acc--quiet .strct-acc__body{padding:4px 0 8px;padding-inline-start:var(--space-3);border-top:0;font-size:var(--text-sm)}\n"] }]
+        }], propDecorators: { heading: [{ type: i0.Input, args: [{ isSignal: true, alias: "heading", required: true }] }], status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }, { type: i0.Output, args: ["expandedChange"] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], meta: [{ type: i0.ContentChild, args: [i0.forwardRef(() => StrctAccordionPanelMeta), { isSignal: true }] }] } });
 
 let tabsCounter = 0;
 /** A single tab. Place inside `<strct-tabs>`; `label` names its button. */
@@ -6762,7 +6852,9 @@ class StrctSubmenu {
     panelItems() {
         const panel = this.panel()?.nativeElement;
         return panel
-            ? [...panel.querySelectorAll('strct-dropdown-item')].filter((i) => i.getAttribute('aria-disabled') !== 'true' ||
+            ? [
+                ...panel.querySelectorAll('strct-dropdown-item, a[strctDropdownItem]'),
+            ].filter((i) => i.getAttribute('aria-disabled') !== 'true' ||
                 i.classList.contains('strct-dd__item--hinted'))
             : [];
     }
@@ -23657,7 +23749,7 @@ class StrctSplitButton {
         }
       </strct-dropdown>
     </div>
-  `, isInline: true, styles: [".strct-sbt{display:inline-flex;align-items:stretch}.strct-sbt .strct-dd{display:inline-flex;align-self:stretch}.strct-sbt .strct-dd__trigger{display:inline-flex;align-items:stretch}.strct-sbt__chev{align-self:stretch;height:100%}.strct-sbt__main,.strct-sbt__chev{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--acc);background:transparent;color:var(--acc);font-family:var(--font);font-size:13px;font-weight:600;line-height:1;cursor:pointer;padding:var(--space-2) var(--space-4)}.strct-sbt__main{border-start-start-radius:var(--radius-md);border-end-start-radius:var(--radius-md);border-inline-end:0}.strct-sbt__chev{padding:var(--space-2);border-start-end-radius:var(--radius-md);border-end-end-radius:var(--radius-md);border-inline-start:1px solid var(--acc50)}.strct-sbt--solid .strct-sbt__main,.strct-sbt--solid .strct-sbt__chev{background:var(--acc);color:var(--inv)}.strct-sbt--solid .strct-sbt__chev{border-inline-start-color:color-mix(in srgb,var(--inv) 30%,var(--acc))}.strct-sbt__main:hover:not(:disabled),.strct-sbt__chev:hover:not(:disabled){background:var(--acc18)}.strct-sbt--solid .strct-sbt__main:hover:not(:disabled),.strct-sbt--solid .strct-sbt__chev:hover:not(:disabled){filter:brightness(1.08);background:var(--acc)}.strct-sbt__main:disabled,.strct-sbt__chev:disabled{opacity:.5;cursor:default}.strct-sbt__main:focus-visible,.strct-sbt__chev:focus-visible{outline:2px solid var(--acc50);outline-offset:1px;position:relative;z-index:var(--z-base)}\n"], dependencies: [{ kind: "component", type: StrctDropdown, selector: "strct-dropdown", inputs: ["align", "popover", "popoverLabel", "focusable"] }, { kind: "component", type: StrctDropdownDivider, selector: "strct-dropdown-divider" }, { kind: "component", type: StrctDropdownItem, selector: "strct-dropdown-item", inputs: ["selected", "critical", "disabled", "hint"] }, { kind: "directive", type: StrctDropdownTrigger, selector: "[strctDropdownTrigger]" }, { 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-sbt{display:inline-flex;align-items:stretch}.strct-sbt .strct-dd{display:inline-flex;align-self:stretch}.strct-sbt .strct-dd__trigger{display:inline-flex;align-items:stretch}.strct-sbt__chev{align-self:stretch;height:100%}.strct-sbt__main,.strct-sbt__chev{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--acc);background:transparent;color:var(--acc);font-family:var(--font);font-size:13px;font-weight:600;line-height:1;cursor:pointer;padding:var(--space-2) var(--space-4)}.strct-sbt__main{border-start-start-radius:var(--radius-md);border-end-start-radius:var(--radius-md);border-inline-end:0}.strct-sbt__chev{padding:var(--space-2);border-start-end-radius:var(--radius-md);border-end-end-radius:var(--radius-md);border-inline-start:1px solid var(--acc50)}.strct-sbt--solid .strct-sbt__main,.strct-sbt--solid .strct-sbt__chev{background:var(--acc);color:var(--inv)}.strct-sbt--solid .strct-sbt__chev{border-inline-start-color:color-mix(in srgb,var(--inv) 30%,var(--acc))}.strct-sbt__main:hover:not(:disabled),.strct-sbt__chev:hover:not(:disabled){background:var(--acc18)}.strct-sbt--solid .strct-sbt__main:hover:not(:disabled),.strct-sbt--solid .strct-sbt__chev:hover:not(:disabled){filter:brightness(1.08);background:var(--acc)}.strct-sbt__main:disabled,.strct-sbt__chev:disabled{opacity:.5;cursor:default}.strct-sbt__main:focus-visible,.strct-sbt__chev:focus-visible{outline:2px solid var(--acc50);outline-offset:1px;position:relative;z-index:var(--z-base)}\n"], dependencies: [{ kind: "component", type: StrctDropdown, selector: "strct-dropdown", inputs: ["align", "popover", "popoverLabel", "focusable"] }, { kind: "component", type: StrctDropdownDivider, selector: "strct-dropdown-divider" }, { kind: "component", type: StrctDropdownItem, selector: "strct-dropdown-item, a[strctDropdownItem]", inputs: ["selected", "critical", "disabled", "hint"] }, { kind: "directive", type: StrctDropdownTrigger, selector: "[strctDropdownTrigger]" }, { 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: StrctSplitButton, decorators: [{
             type: Component,
@@ -30083,6 +30175,307 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
   `, 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 }] }] } });
 
+/**
+ * The product switcher every multi-product console grows: a chip beside the
+ * logo saying where you are, opening the products you may use with a line of
+ * health each, and the platform after a divider.
+ *
+ *   <strct-product-switcher
+ *     [items]="products" [(current)]="productId" [footerItems]="[admin]"
+ *     (opened)="loadHealth()" (select)="go($event)" />
+ *
+ * A person offered one product sees a plain chip, not a menu of one.
+ */
+class StrctProductSwitcher {
+    /** The products this person may switch to. */
+    items = input([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
+    /** Entries after a divider — the shared platform, administration. */
+    footerItems = input([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "footerItems" }] : /* istanbul ignore next */ []));
+    /** Which product you are in, two-way. */
+    current = model(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "current" }] : /* istanbul ignore next */ []));
+    /**
+     * What the chip is for, after the product's name:
+     * "HyperStruct Backup — switch product".
+     */
+    switchLabel = input('switch product', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "switchLabel" }] : /* istanbul ignore next */ []));
+    /**
+     * Below this width (px) the chip shows each item's `shortLabel` instead of
+     * its label. The full name stays in the accessible name.
+     */
+    shortLabelWidth = input(600, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "shortLabelWidth" }] : /* istanbul ignore next */ []));
+    /** The menu has opened — read the health lines now, not before. */
+    opened = output();
+    /** A product was chosen (plain activation only, as the rail does). */
+    select = output();
+    menu = viewChild('menu', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "menu" }] : /* istanbul ignore next */ []));
+    narrow = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "narrow" }] : /* istanbul ignore next */ []));
+    wasOpen = false;
+    /** With one product and nowhere else to go, there is no menu to open. */
+    hasMenu = computed(() => this.items().length + this.footerItems().length > 1, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hasMenu" }] : /* istanbul ignore next */ []));
+    currentItem = computed(() => [...this.items(), ...this.footerItems()].find((i) => i.id === this.current()) ??
+        this.items()[0] ??
+        null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "currentItem" }] : /* istanbul ignore next */ []));
+    chipText = computed(() => {
+        const item = this.currentItem();
+        if (!item)
+            return '';
+        const full = item.label ?? item.name;
+        return this.narrow() ? (item.shortLabel ?? full) : full;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "chipText" }] : /* istanbul ignore next */ []));
+    chipAriaLabel = computed(() => {
+        const item = this.currentItem();
+        if (!item)
+            return this.switchLabel();
+        return `${item.name} — ${this.switchLabel()}`;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "chipAriaLabel" }] : /* istanbul ignore next */ []));
+    constructor() {
+        // The short label is a width question, and a width question the component
+        // has to answer in script: the text it draws changes, not only its size.
+        effect((onCleanup) => {
+            const px = this.shortLabelWidth();
+            if (typeof matchMedia !== 'function')
+                return;
+            const query = matchMedia(`(max-width: ${px}px)`);
+            const update = () => this.narrow.set(query.matches);
+            update();
+            query.addEventListener('change', update);
+            onCleanup(() => query.removeEventListener('change', update));
+        });
+        // (opened) fires once per opening, so an app can fetch the health lines
+        // then — the menu never waits for them.
+        effect(() => {
+            const open = this.menu()?.open() ?? false;
+            if (open && !this.wasOpen)
+                this.opened.emit();
+            this.wasOpen = open;
+        });
+    }
+    pick(item, event) {
+        if (item.disabled)
+            return;
+        // A modified or non-primary click on a link is the browser's — a new tab,
+        // a copied address — and must not switch the product here.
+        if (event &&
+            (item.routerLink != null || item.href) &&
+            (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey)) {
+            return;
+        }
+        this.current.set(item.id);
+        this.select.emit(item);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctProductSwitcher, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: StrctProductSwitcher, isStandalone: true, selector: "strct-product-switcher", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, footerItems: { classPropertyName: "footerItems", publicName: "footerItems", isSignal: true, isRequired: false, transformFunction: null }, current: { classPropertyName: "current", publicName: "current", isSignal: true, isRequired: false, transformFunction: null }, switchLabel: { classPropertyName: "switchLabel", publicName: "switchLabel", isSignal: true, isRequired: false, transformFunction: null }, shortLabelWidth: { classPropertyName: "shortLabelWidth", publicName: "shortLabelWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { current: "currentChange", opened: "opened", select: "select" }, host: { classAttribute: "strct-ps" }, viewQueries: [{ propertyName: "menu", first: true, predicate: ["menu"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    <!-- What a row holds, whichever element carries it. -->
+    <ng-template #rowBody let-item>
+      @if (item.icon) {
+        <strct-icon strctDropdownItemIcon [tone]="item.tone ?? ''" [name]="item.icon" [size]="16" />
+      }
+      <span strctDropdownItemLabel>{{ item.name }}</span>
+      @if (item.description) {
+        <span strctDropdownItemDescription>
+          @if (item.status) {
+            <strct-status-dot [status]="item.status" />
+          }
+          {{ item.description }}
+        </span>
+      }
+    </ng-template>
+
+    <!-- A row is a link where the product has an address, so it can be opened
+         in a new tab — and a menuitemradio either way, checked on the one you
+         are in. -->
+    <ng-template #row let-item>
+      @if (item.routerLink !== null && item.routerLink !== undefined && !item.disabled) {
+        <a
+          strctDropdownItem
+          [routerLink]="item.routerLink"
+          [selected]="item.id === current()"
+          (click)="pick(item, $event)"
+        >
+          <ng-container *ngTemplateOutlet="rowBody; context: { $implicit: item }" />
+        </a>
+      } @else if (item.href && !item.disabled) {
+        <a
+          strctDropdownItem
+          [href]="item.href"
+          [selected]="item.id === current()"
+          (click)="pick(item, $event)"
+        >
+          <ng-container *ngTemplateOutlet="rowBody; context: { $implicit: item }" />
+        </a>
+      } @else {
+        <strct-dropdown-item
+          [selected]="item.id === current()"
+          [disabled]="!!item.disabled"
+          (click)="pick(item)"
+        >
+          <ng-container *ngTemplateOutlet="rowBody; context: { $implicit: item }" />
+        </strct-dropdown-item>
+      }
+    </ng-template>
+
+    @if (hasMenu()) {
+      <strct-dropdown #menu align="start">
+        <button
+          type="button"
+          class="strct-ps__chip"
+          strctDropdownTrigger
+          [attr.aria-label]="chipAriaLabel()"
+        >
+          <ng-container *ngTemplateOutlet="chipBody" />
+          <strct-icon class="strct-ps__chevron" name="chevronDown" [size]="13" />
+        </button>
+        @for (item of items(); track item.id) {
+          <ng-container *ngTemplateOutlet="row; context: { $implicit: item }" />
+        }
+        @if (footerItems().length) {
+          <strct-dropdown-divider />
+          @for (item of footerItems(); track item.id) {
+            <ng-container *ngTemplateOutlet="row; context: { $implicit: item }" />
+          }
+        }
+      </strct-dropdown>
+    } @else {
+      <!-- One product: a chip that says where you are, not a menu of one. -->
+      <span class="strct-ps__chip strct-ps__chip--plain">
+        <ng-container *ngTemplateOutlet="chipBody" />
+      </span>
+    }
+
+    <ng-template #chipBody>
+      @if (currentItem(); as item) {
+        @if (item.icon) {
+          <strct-icon
+            class="strct-ps__icon"
+            [name]="item.icon"
+            [size]="16"
+            [style.color]="item.tone || null"
+          />
+        }
+        <span class="strct-ps__label">{{ chipText() }}</span>
+      }
+    </ng-template>
+  `, isInline: true, styles: [".strct-ps{display:inline-flex;align-items:center;min-width:0}.strct-ps__chip{display:inline-flex;align-items:center;gap:7px;max-width:100%;padding:5px 8px;border:1px solid var(--b2);border-radius:var(--radius-sm);background:transparent;color:inherit;font:inherit;font-size:13px;font-weight:600;cursor:pointer}.strct-ps__chip:hover{background:#ffffff14}.strct-ps__chip--plain{cursor:default;border-color:transparent}.strct-ps__chip--plain:hover{background:transparent}.strct-ps__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strct-ps__icon{flex:none}.strct-ps__chevron{flex:none;opacity:.7}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "component", type: StrctIcon, selector: "strct-icon", inputs: ["name", "strictName", "size", "strokeWidth", "badge", "ariaLabel", "count", "countMax", "countStatus", "countLabel"] }, { kind: "component", type: StrctStatusDot, selector: "strct-status-dot", inputs: ["status", "label", "size", "pulse", "variant"] }, { kind: "component", type: StrctDropdown, selector: "strct-dropdown", inputs: ["align", "popover", "popoverLabel", "focusable"] }, { kind: "directive", type: StrctDropdownTrigger, selector: "[strctDropdownTrigger]" }, { kind: "component", type: StrctDropdownItem, selector: "strct-dropdown-item, a[strctDropdownItem]", inputs: ["selected", "critical", "disabled", "hint"] }, { kind: "directive", type: StrctDropdownItemIcon, selector: "[strctDropdownItemIcon]", inputs: ["tone"] }, { kind: "directive", type: StrctDropdownItemLabel, selector: "[strctDropdownItemLabel]" }, { kind: "directive", type: StrctDropdownItemDescription, selector: "[strctDropdownItemDescription]" }, { kind: "component", type: StrctDropdownDivider, selector: "strct-dropdown-divider" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: StrctProductSwitcher, decorators: [{
+            type: Component,
+            args: [{ selector: 'strct-product-switcher', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
+                        NgTemplateOutlet,
+                        RouterLink,
+                        StrctIcon,
+                        StrctStatusDot,
+                        StrctDropdown,
+                        StrctDropdownTrigger,
+                        StrctDropdownItem,
+                        StrctDropdownItemIcon,
+                        StrctDropdownItemLabel,
+                        StrctDropdownItemDescription,
+                        StrctDropdownDivider,
+                    ], template: `
+    <!-- What a row holds, whichever element carries it. -->
+    <ng-template #rowBody let-item>
+      @if (item.icon) {
+        <strct-icon strctDropdownItemIcon [tone]="item.tone ?? ''" [name]="item.icon" [size]="16" />
+      }
+      <span strctDropdownItemLabel>{{ item.name }}</span>
+      @if (item.description) {
+        <span strctDropdownItemDescription>
+          @if (item.status) {
+            <strct-status-dot [status]="item.status" />
+          }
+          {{ item.description }}
+        </span>
+      }
+    </ng-template>
+
+    <!-- A row is a link where the product has an address, so it can be opened
+         in a new tab — and a menuitemradio either way, checked on the one you
+         are in. -->
+    <ng-template #row let-item>
+      @if (item.routerLink !== null && item.routerLink !== undefined && !item.disabled) {
+        <a
+          strctDropdownItem
+          [routerLink]="item.routerLink"
+          [selected]="item.id === current()"
+          (click)="pick(item, $event)"
+        >
+          <ng-container *ngTemplateOutlet="rowBody; context: { $implicit: item }" />
+        </a>
+      } @else if (item.href && !item.disabled) {
+        <a
+          strctDropdownItem
+          [href]="item.href"
+          [selected]="item.id === current()"
+          (click)="pick(item, $event)"
+        >
+          <ng-container *ngTemplateOutlet="rowBody; context: { $implicit: item }" />
+        </a>
+      } @else {
+        <strct-dropdown-item
+          [selected]="item.id === current()"
+          [disabled]="!!item.disabled"
+          (click)="pick(item)"
+        >
+          <ng-container *ngTemplateOutlet="rowBody; context: { $implicit: item }" />
+        </strct-dropdown-item>
+      }
+    </ng-template>
+
+    @if (hasMenu()) {
+      <strct-dropdown #menu align="start">
+        <button
+          type="button"
+          class="strct-ps__chip"
+          strctDropdownTrigger
+          [attr.aria-label]="chipAriaLabel()"
+        >
+          <ng-container *ngTemplateOutlet="chipBody" />
+          <strct-icon class="strct-ps__chevron" name="chevronDown" [size]="13" />
+        </button>
+        @for (item of items(); track item.id) {
+          <ng-container *ngTemplateOutlet="row; context: { $implicit: item }" />
+        }
+        @if (footerItems().length) {
+          <strct-dropdown-divider />
+          @for (item of footerItems(); track item.id) {
+            <ng-container *ngTemplateOutlet="row; context: { $implicit: item }" />
+          }
+        }
+      </strct-dropdown>
+    } @else {
+      <!-- One product: a chip that says where you are, not a menu of one. -->
+      <span class="strct-ps__chip strct-ps__chip--plain">
+        <ng-container *ngTemplateOutlet="chipBody" />
+      </span>
+    }
+
+    <ng-template #chipBody>
+      @if (currentItem(); as item) {
+        @if (item.icon) {
+          <strct-icon
+            class="strct-ps__icon"
+            [name]="item.icon"
+            [size]="16"
+            [style.color]="item.tone || null"
+          />
+        }
+        <span class="strct-ps__label">{{ chipText() }}</span>
+      }
+    </ng-template>
+  `, host: { class: 'strct-ps' }, styles: [".strct-ps{display:inline-flex;align-items:center;min-width:0}.strct-ps__chip{display:inline-flex;align-items:center;gap:7px;max-width:100%;padding:5px 8px;border:1px solid var(--b2);border-radius:var(--radius-sm);background:transparent;color:inherit;font:inherit;font-size:13px;font-weight:600;cursor:pointer}.strct-ps__chip:hover{background:#ffffff14}.strct-ps__chip--plain{cursor:default;border-color:transparent}.strct-ps__chip--plain:hover{background:transparent}.strct-ps__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.strct-ps__icon{flex:none}.strct-ps__chevron{flex:none;opacity:.7}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], footerItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "footerItems", required: false }] }], current: [{ type: i0.Input, args: [{ isSignal: true, alias: "current", required: false }] }, { type: i0.Output, args: ["currentChange"] }], switchLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "switchLabel", required: false }] }], shortLabelWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "shortLabelWidth", required: false }] }], opened: [{ type: i0.Output, args: ["opened"] }], select: [{ type: i0.Output, args: ["select"] }], menu: [{ type: i0.ViewChild, args: ['menu', { isSignal: true }] }] } });
+
 /**
  * Public API surface of the strct UI library.
  */
@@ -30092,5 +30485,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_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, StrctDropdownGroup, StrctDropdownItem, StrctDropdownItemAction, StrctDropdownItemDescription, StrctDropdownItemIcon, StrctDropdownItemLabel, StrctDropdownTrigger, StrctDurationPipe, StrctEmptyState, StrctField, StrctFieldGroup, StrctFieldHint, StrctFieldPrefix, StrctFieldSuffix, StrctFieldValue, StrctFile, StrctFilterBar, StrctFlow, StrctFlowNodeTemplate, StrctFooter, StrctGauge, StrctGroupHeaderDef, StrctHeader, StrctHeaderAction, 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 };
+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, StrctAccordionPanelMeta, 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, StrctDropdownGroup, StrctDropdownItem, StrctDropdownItemAction, StrctDropdownItemDescription, StrctDropdownItemIcon, StrctDropdownItemLabel, StrctDropdownTrigger, StrctDurationPipe, StrctEmptyState, StrctField, StrctFieldGroup, StrctFieldHint, StrctFieldPrefix, StrctFieldSuffix, StrctFieldValue, StrctFile, StrctFilterBar, StrctFlow, StrctFlowNodeTemplate, StrctFooter, StrctGauge, StrctGroupHeaderDef, StrctHeader, StrctHeaderAction, 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, StrctProductSwitcher, 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