@akcelik/strct 1.16.0 → 1.19.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@akcelik/strct",
-  "version": "1.16.0",
+  "version": "1.19.0",
   "description": "UIStruct — a standalone Angular component library with a tokenised, multi-palette theme system, built for datacenter / infrastructure management UIs.",
   "author": "Serkan Akcelik <serkan.akcelik@gmail.com>",
   "license": "MIT",

package/types/akcelik-strct.d.ts

@@ -1231,10 +1231,23 @@ declare class StrctDropdown {
     readonly popoverLabel: _angular_core.InputSignal<string>;
     readonly open: _angular_core.WritableSignal<boolean>;
     constructor();
+    /** Where focus was when the menu opened — restored on Escape/selection. */
+    private lastFocused;
     toggle(): void;
-    close(): void;
-    /** Menu items close on activation; popover form controls never do. */
-    protected onInnerActivate(): void;
+    /** Open (if closed) and move focus into the menu — ArrowDown on the trigger. */
+    openMenu(): void;
+    close(restoreFocus?: boolean): void;
+    /**
+     * Menu mode closes ONLY on a real item activation — a click that lands on
+     * the menu's padding or a divider (a 2px miss) keeps it open instead of
+     * throwing the whole interaction away. Popover form controls never close.
+     */
+    protected onInnerActivate(event: Event): void;
+    /** APG menu keyboarding: arrows rove, Home/End jump, Enter/Space activate. */
+    protected onMenuKeydown(event: KeyboardEvent): void;
+    private enabledItems;
+    /** Focus the selected item if there is one, else the first — after render. */
+    private focusInitialItem;
     protected onDocClick(event: MouseEvent): void;
     protected onEscape(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctDropdown, never>;
@@ -1247,17 +1260,25 @@ declare class StrctDropdown {
  */
 declare class StrctDropdownTrigger {
     protected readonly dd: StrctDropdown | null;
+    protected onArrowDown(event: Event): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctDropdownTrigger, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<StrctDropdownTrigger, "[strctDropdownTrigger]", never, {}, {}, never, never, true, never>;
 }
 /** A selectable row inside a `<strct-dropdown>`. */
 declare class StrctDropdownItem {
+    /**
+     * Select-like usage: bind `selected` and the item becomes a
+     * `menuitemradio` with `aria-checked`, a leading ✓ on the current choice
+     * and an aligned lead slot — so reopening the menu shows what is chosen.
+     * Leave unbound for plain action items.
+     */
+    readonly selected: _angular_core.InputSignal<boolean | null>;
     /** Danger. */
     readonly critical: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /** Static disable flag. */
     readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctDropdownItem, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctDropdownItem, "strct-dropdown-item", never, { "critical": { "alias": "critical"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctDropdownItem, "strct-dropdown-item", never, { "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "critical": { "alias": "critical"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 /** Thin separator between groups of menu items. */
 declare class StrctDropdownDivider {
@@ -1358,7 +1379,7 @@ declare function provideStrctWizardDefaults(defaults: StrctWizardDefaults): Prov
  * rail — dashed-ring states (idle ⊙ / active ●⊙ / done ✓), a progress bar
  * with an “n/N” counter, and click-back navigation to visited steps — plus an
  * optional right column projected via `strctWizardAside` (live summaries).
- * The rail never flips horizontal: under ~720px of component width it
+ * The rail never flips horizontal: under ~700px of component width it
  * collapses to a compact vertical ring column (container query).
  *
  *   <strct-wizard vertical title="Create virtual machine">
@@ -1396,6 +1417,13 @@ declare class StrctWizard {
     readonly flush: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /** Rail heading shown above the progress bar (vertical mode). */
     readonly title: _angular_core.InputSignal<string>;
+    /**
+     * Name the content pane after the active step (vertical mode): the step's
+     * `label` as a heading, its `description` as the lede. In the compact
+     * narrow rail this is the only visible step name. On by default;
+     * `[contentHeader]="false"` opts out.
+     */
+    readonly contentHeader: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /** Label for the final-step button (default "Finish"). */
     readonly finishLabel: _angular_core.InputSignal<string>;
     /** Labels for the Back / Next / Cancel buttons (localizable). */
@@ -1421,6 +1449,7 @@ declare class StrctWizard {
     /** Furthest step reached — drives the progress bar and rail clickability. */
     protected readonly maxVisited: _angular_core.WritableSignal<number>;
     protected readonly progressPct: _angular_core.Signal<number>;
+    protected readonly activeStep: _angular_core.Signal<StrctStep>;
     protected readonly isLast: _angular_core.Signal<boolean>;
     /** Whether the current step permits advancing (its `canAdvance`). */
     protected readonly canAdvance: _angular_core.Signal<boolean>;
@@ -1431,7 +1460,7 @@ declare class StrctWizard {
     goTo(index: number): void;
     finish(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctWizard, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctWizard, "strct-wizard", never, { "current": { "alias": "current"; "required": false; "isSignal": true; }; "vertical": { "alias": "vertical"; "required": false; "isSignal": true; }; "flush": { "alias": "flush"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "finishLabel": { "alias": "finishLabel"; "required": false; "isSignal": true; }; "backLabel": { "alias": "backLabel"; "required": false; "isSignal": true; }; "nextLabel": { "alias": "nextLabel"; "required": false; "isSignal": true; }; "cancelLabel": { "alias": "cancelLabel"; "required": false; "isSignal": true; }; "submittingLabel": { "alias": "submittingLabel"; "required": false; "isSignal": true; }; "progressLabel": { "alias": "progressLabel"; "required": false; "isSignal": true; }; "stepsLabel": { "alias": "stepsLabel"; "required": false; "isSignal": true; }; "submitting": { "alias": "submitting"; "required": false; "isSignal": true; }; "cancelable": { "alias": "cancelable"; "required": false; "isSignal": true; }; }, { "current": "currentChange"; "finished": "finished"; "cancelled": "cancelled"; "stepChange": "stepChange"; }, ["steps", "asideDef"], ["*", "[strctWizardAside]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctWizard, "strct-wizard", never, { "current": { "alias": "current"; "required": false; "isSignal": true; }; "vertical": { "alias": "vertical"; "required": false; "isSignal": true; }; "flush": { "alias": "flush"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "contentHeader": { "alias": "contentHeader"; "required": false; "isSignal": true; }; "finishLabel": { "alias": "finishLabel"; "required": false; "isSignal": true; }; "backLabel": { "alias": "backLabel"; "required": false; "isSignal": true; }; "nextLabel": { "alias": "nextLabel"; "required": false; "isSignal": true; }; "cancelLabel": { "alias": "cancelLabel"; "required": false; "isSignal": true; }; "submittingLabel": { "alias": "submittingLabel"; "required": false; "isSignal": true; }; "progressLabel": { "alias": "progressLabel"; "required": false; "isSignal": true; }; "stepsLabel": { "alias": "stepsLabel"; "required": false; "isSignal": true; }; "submitting": { "alias": "submitting"; "required": false; "isSignal": true; }; "cancelable": { "alias": "cancelable"; "required": false; "isSignal": true; }; }, { "current": "currentChange"; "finished": "finished"; "cancelled": "cancelled"; "stepChange": "stepChange"; }, ["steps", "asideDef"], ["*", "[strctWizardAside]"], true, never>;
 }
 
 /**