@skra/ui 0.2.0

package/types/skra-ui-switch.d.ts

@@ -0,0 +1,54 @@
+import { SkraFieldContext } from '@skra/ui/field';
+import * as i0 from '@angular/core';
+
+/**
+ * Wires a native `<input type="checkbox">` to the **switch** role + skin when inside
+ * `<skra-field>` (ADR 013), or standalone with no cascade. Per ADR 039/040, Forge ships
+ * no `<skra-switch>` wrapper — this is a Component-on-the-native-host (`<input>` is void →
+ * `template: ''`, ADR 040 §2) carrying its own `switch.scss` via Emulated encapsulation. The
+ * ADR 039 revision history named this exact pattern as the future switch primitive.
+ *
+ * **The directive SETS `role="switch"`** (it is not part of the selector) — the consumer must
+ * not be asked to repeat an obvious, required ARIA role. No native HTML element produces switch
+ * semantics, so `role="switch"` is the legitimate ARIA mechanism (native-attr-first rule 2). The
+ * browser maps the native checked state to `aria-checked` (on/off) under this role.
+ *
+ *   <!-- inside Field -->
+ *   <skra-field>
+ *     <input type="checkbox" skraSwitch [checked]="x()" (change)="x.set($any($event.target).checked)" />
+ *     <label skraLabelFor>Enable notifications</label>
+ *   </skra-field>
+ *
+ *   <!-- standalone (label wraps input — no id/for needed) -->
+ *   <label>
+ *     <input type="checkbox" skraSwitch [checked]="x()" (change)="x.set($any($event.target).checked)" />
+ *     Dark mode
+ *   </label>
+ *
+ * Value channel stays consumer-owned per ADR 037 (native `[checked]` + `(change)`, Reactive
+ * Forms `formControlName`, Signal Forms `[formField]`, or `[(ngModel)]` — all orthogonal). Toggle
+ * state is NOT reflected as `data-skra-*` (that would require Forge to observe native state,
+ * violating ADR 037); the skin keys off the native `:checked` pseudo-class.
+ *
+ * Distinct from `skraCheckbox` (the atom-granularity split): a switch is strictly binary —
+ * `role="switch"` forbids `aria-checked="mixed"`, so there is **no `indeterminate` input**.
+ */
+declare class SkraSwitch {
+    private readonly el;
+    readonly context: SkraFieldContext | null;
+    constructor();
+    /**
+     * Readonly enforcement — native checkbox has no `[readonly]`, so without this the
+     * `aria-readonly` we announce would be a lie (the user could still toggle it).
+     * `preventDefault` on `click` blocks the toggle from both pointer and Space (keyboard
+     * activation dispatches a click on form controls). Mirrors the checkbox/radio guards.
+     */
+    protected blockWhenReadonly(event: Event): void;
+    /** Block keyboard activation (Space) when readonly; let `Tab` through. */
+    protected blockKeyWhenReadonly(event: KeyboardEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SkraSwitch, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SkraSwitch, "input[type=\"checkbox\"][skraSwitch]", never, {}, {}, never, never, true, never>;
+}
+
+export { SkraSwitch };
+//# sourceMappingURL=skra-ui-switch.d.ts.map

package/types/skra-ui-switch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skra-ui-switch.d.ts","sources":["../../../../libs/ui/switch/src/lib/switch/switch.ts"],"mappings":";;;AAUA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BG;AACH,cAqBa,UAAU;AACrB;sBACgB,gBAAA;;AAiBhB;;;;;AAKG;AACH,uCAAmC,KAAK;;AAKxC,0CAAsC,aAAa;yCA9BxC,UAAU;2CAAV,UAAU;AAmCtB;;;;","names":[]}

package/types/skra-ui-tabs.d.ts

@@ -0,0 +1,191 @@
+import * as _angular_core from '@angular/core';
+
+/**
+ * SkraTabs — the WAI-ARIA APG **Tabs** coordinator. A directive on a wrapping element that holds a
+ * `[skraTablist]` (the `role="tablist"` with its `button[skraTab]` children) and the
+ * `[skraTabPanel]` panels as DI descendants. It provides `SkraTabsContext` (the ADR 013 §3.6 non-form
+ * Contextual-ID-Sync bus), owns the consumer-facing `[selected]` / `(selectedChange)` (controlled,
+ * ADR 037 — NO internal selection state) and `[activation]`, and drives the roving-tabindex keyboard
+ * (`SkraTabsKeyboard` → CDK `FocusKeyManager`).
+ *
+ *   <div skraTabs [selected]="tab()" (selectedChange)="tab.set($event)">
+ *     <div skraTablist aria-label="Account">
+ *       <button skraTab value="profile">Profile</button>
+ *       <button skraTab value="security">Security</button>
+ *     </div>
+ *     <div skraTabPanel value="profile">…</div>
+ *     <div skraTabPanel value="security">…</div>
+ *   </div>
+ *
+ * Selection is consumer-owned: a click / Enter / Space / (automatic) arrow emits `(selectedChange)`;
+ * the visible selection updates when the consumer round-trips `[selected]`. The roving focus position
+ * (`tabindex="0"`) is component-owned UI state — it moves immediately, independent of `[selected]`.
+ *
+ * Full contract: adr/specs/component-tabs-spec.md.
+ */
+declare class SkraTabs {
+    /** Consumer-owned selection key (matches a tab's `value`); '' / no-match → nothing selected (ADR 037). */
+    readonly selected: _angular_core.InputSignal<string>;
+    /** Automatic (selection follows roving focus) | manual (Enter/Space selects). */
+    readonly activation: _angular_core.InputSignal<"automatic" | "manual">;
+    /** Fires ONLY on user activation — never on a programmatic `[selected]` change. */
+    readonly selectedChange: _angular_core.OutputEmitterRef<string>;
+    private readonly ctx;
+    private readonly tabs;
+    private readonly panels;
+    private readonly keyboard;
+    constructor();
+    /** Seat the roving stop (`tabindex="0"`) on a real, enabled tab: the selected one if valid, else the
+     * first enabled tab (APG — the tablist must always have exactly one tab stop). */
+    private reseat;
+    /** A tab was activated (click / Enter / Space / automatic arrow). Move the roving stop immediately
+     * (UI state), then REQUEST selection from the consumer — never mutate selection internally (ADR 037). */
+    private selectTab;
+    private onTablistKeydown;
+    /** Dev-only nudge: every tab needs a panel of the same `value`, and vice-versa (aria-controls / -labelledby). */
+    private warnMismatches;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkraTabs, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SkraTabs, "[skraTabs]", ["skraTabs"], { "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "activation": { "alias": "activation"; "required": false; "isSignal": true; }; }, { "selectedChange": "selectedChange"; }, ["tabs", "panels"], never, true, never>;
+}
+
+/**
+ * SkraTablist — the `role="tablist"` container, a Component on the consumer's `<div skraTablist>`
+ * (ADR 040, `template: '<ng-content>'` so the projected `button[skraTab]` children render). It carries
+ * the rail styling and forwards its `keydown` to the coordinator's roving keyboard (`SkraTabsKeyboard`)
+ * via the `SkraTabsContext` bus. Name it for AT with consumer `aria-label`/`aria-labelledby` (ADR 033).
+ */
+declare class SkraTablist {
+    private readonly ctx;
+    constructor();
+    protected onKeydown(event: KeyboardEvent): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkraTablist, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkraTablist, "[skraTablist]", ["skraTablist"], {}, {}, never, ["*"], true, never>;
+}
+
+/**
+ * The tab shape the keyboard controller drives. Structurally a CDK `FocusableOption`
+ * (`focus()`), plus the tabs' own `getValue()` (roving↔selection mapping) and `isDisabled()`
+ * (disabled tabs are SKIPPED in the roving order, unlike menu items). Declared HERE —
+ * cdk-free — so the only `@angular/cdk` importer stays `tabs-keyboard.ts` (ADR 0044 §7).
+ */
+interface SkraTabKeyItem {
+    focus(): void;
+    isDisabled(): boolean;
+    getValue(): string;
+}
+
+/**
+ * SkraTab — a single tab, a Component on the native command host `button[skraTab]` (ADR 012/040:
+ * a `<button>` gives Enter/Space→click + focusability for free; its implicit role is overridden to
+ * `role="tab"`, the precedent set by `button[skraMenuItem]`).
+ *
+ * Roving tabindex: `tabindex="0"` only when this tab is the roving stop (`SkraTabsContext.activeValue`),
+ * else `-1` — the controller (`SkraTabsKeyboard`) moves real focus. `aria-selected` reflects the
+ * consumer-owned selection (`[selected]`), NOT the roving focus — and is the source of truth for the
+ * selected STYLE too (CSS keys off `:host([aria-selected="true"])`; no `data-skra-*`). On activation it
+ * REQUESTS selection from the coordinator (`ctx.select`) — it never mutates selection itself (ADR 037).
+ *
+ * **Disabled is native-attr-first (boundary #9): the consumer sets the native `disabled` attribute** —
+ * Forge OBSERVES it (no `disabled` input). A disabled tab is SKIPPED in the roving order (APG).
+ */
+declare class SkraTab implements SkraTabKeyItem {
+    /** Selection key — matched against `skraTabs [selected]` and the owning panel's `value`. */
+    readonly value: _angular_core.InputSignal<string>;
+    private readonly host;
+    private readonly ctx;
+    protected readonly tabId: _angular_core.Signal<string | null>;
+    protected readonly panelId: _angular_core.Signal<string | null>;
+    protected readonly ariaSelected: _angular_core.Signal<"true" | "false">;
+    protected readonly tabindex: _angular_core.Signal<"0" | "-1" | null>;
+    constructor();
+    focus(): void;
+    /** Disabled tabs are skipped in the roving order — read live off the native attribute (no input). */
+    isDisabled(): boolean;
+    getValue(): string;
+    protected onClick(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkraTab, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkraTab, "button[skraTab]", ["skraTab"], { "value": { "alias": "value"; "required": true; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * SkraTabPanel — the `role="tabpanel"` for one tab, a Component on the consumer's `<div skraTabPanel>`
+ * (ADR 040, `template: '<ng-content>'` so the panel body renders). It is focusable (`tabindex="0"`, APG —
+ * keyboard users Tab from the active tab into its content), auto-named by `aria-labelledby`→its tab, and
+ * `hidden` when its `value` is not the selected one (removed from the a11y tree; stays in the DOM — lazy
+ * mounting is the consumer's own `@if` on the content).
+ */
+declare class SkraTabPanel {
+    /** Selection key — matched against the owning `button[skraTab]`'s `value`. */
+    readonly value: _angular_core.InputSignal<string>;
+    private readonly ctx;
+    protected readonly panelId: _angular_core.Signal<string | null>;
+    protected readonly tabId: _angular_core.Signal<string | null>;
+    /** `''` (attribute present) when not selected → hidden; `null` (absent) when selected → shown. */
+    protected readonly hidden: _angular_core.Signal<"" | null>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkraTabPanel, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkraTabPanel, "[skraTabPanel]", ["skraTabPanel"], { "value": { "alias": "value"; "required": true; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * DI Context provided per `[skraTabs]` instance — the ADR 013 §3.6 **non-form** Contextual-ID-Sync
+ * bus wiring `tab` ↔ `tabpanel`. It carries **IDs + derived, read-only interaction state only**
+ * (`selected` mirrors the consumer's `[selected]`; `activeValue` is the roving-focus position). It
+ * **never owns value** — selection stays consumer-owned (ADR 037); a tab requests a change through
+ * `select()`, which the coordinator implements and from which it emits `(selectedChange)`.
+ */
+declare class SkraTabsContext {
+    /** Unique per `[skraTabs]` — the prefix for every tab/panel id in this group. */
+    private readonly baseId;
+    /** Mirror of the consumer's `[selected]` — drives `aria-selected` + panel visibility (read-only to children). */
+    readonly selected: _angular_core.WritableSignal<string>;
+    /** Roving-focus position — the value of the tab that currently carries `tabindex="0"` (read-only to children). */
+    readonly activeValue: _angular_core.WritableSignal<string>;
+    /** Activation model (read-only to children). */
+    readonly activation: _angular_core.WritableSignal<"automatic" | "manual">;
+    tabId(value: string): string;
+    panelId(value: string): string;
+    isSelected(value: string): boolean;
+    /** Coordinator-assigned: a tab/keyboard requests selection (the coordinator emits `(selectedChange)`). */
+    select: (value: string) => void;
+    /** Coordinator-assigned: the tablist forwards its `keydown` here (routed to the keyboard controller). */
+    handleKeydown: (event: KeyboardEvent) => void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkraTabsContext, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<SkraTabsContext>;
+}
+
+/**
+ * SkraTabsKeyboard — the WAI-ARIA APG **Tabs** roving-tabindex keyboard model, confined to ONE file.
+ *
+ * This is the **only** module in `@skra/navigation` that imports `@angular/cdk` (ADR 0044 §7,
+ * generalized library-wide 2026-06-19). It wraps CDK `FocusKeyManager` (roving REAL focus) so the
+ * engine is swappable in one file — exactly as `SkraMenuKeyboard` does for the menu. Unlike the menu,
+ * tabs use **horizontal** orientation (Left/Right) and **skip** disabled tabs.
+ *
+ * Owns: Left/Right roving (wrap), Home/End. Enter/Space (native button activation) and selection are
+ * the coordinator's job — the controller only moves focus and reports the active tab's value.
+ */
+declare class SkraTabsKeyboard {
+    private manager?;
+    private items;
+    /**
+     * (Re)build the manager from the current projected tab set. Called from an `effect` on the signal
+     * `contentChildren` — a passed array is a static snapshot, so the manager is rebuilt whenever the
+     * tab set changes (the documented signal↔CDK seam, mirroring `menu-keyboard.ts`).
+     */
+    setItems(items: readonly SkraTabKeyItem[]): void;
+    /** Delegate Left/Right/Home/End. Enter/Space/Tab are intentionally left to the platform/coordinator. */
+    onKeydown(event: KeyboardEvent): void;
+    /** The value of the tab the manager currently considers active (focused after `onKeydown`). */
+    activeValue(): string | undefined;
+    /** Sync the manager's active index to a value WITHOUT moving focus (after a click / on init). */
+    setActive(value: string): void;
+    /** The first non-disabled tab's value (the roving stop when nothing is selected) — APG. */
+    firstEnabledValue(): string | undefined;
+    hasValue(value: string): boolean;
+    destroy(): void;
+}
+
+export { SkraTab, SkraTabPanel, SkraTablist, SkraTabs, SkraTabsContext, SkraTabsKeyboard };
+export type { SkraTabKeyItem };
+//# sourceMappingURL=skra-ui-tabs.d.ts.map

package/types/skra-ui-tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skra-ui-tabs.d.ts","sources":["../../../../libs/ui/tabs/src/lib/tabs/tabs.ts","../../../../libs/ui/tabs/src/lib/tabs/tablist.ts","../../../../libs/ui/tabs/src/lib/tabs/tabs-types.ts","../../../../libs/ui/tabs/src/lib/tabs/tab.ts","../../../../libs/ui/tabs/src/lib/tabs/tab-panel.ts","../../../../libs/ui/tabs/src/lib/tabs/tabs-context.ts","../../../../libs/ui/tabs/src/lib/tabs/tabs-keyboard.ts"],"mappings":";;AAiBA;;;;;;;;;;;;;;;;;;;;;;AAsBG;AACH,cAMa,QAAQ;;uBAEF,aAAA,CAAA,WAAA;;yBAEE,aAAA,CAAA,WAAA;;6BAEI,aAAA,CAAA,gBAAA;AAEvB;AACA;AACA;AAGA;;AAyBA;AACkF;AAClF;AASA;AACyG;AACzG;AAOA;;AAWA;oDArEW,QAAQ;sDAAR,QAAQ;AAqFpB;;ACxHD;;;;;AAKG;AACH,cAca,WAAW;AACtB;;AAaA,+BAA2B,aAAa;oDAd7B,WAAW;sDAAX,WAAW;AAiBvB;;AChDD;;;;;AAKG;UACc,cAAc;;;;AAI9B;;ACKD;;;;;;;;;;;;;AAaG;AACH,cAkBa,OAAQ,YAAW,cAAc;;oBAE9B,aAAA,CAAA,WAAA;AAEd;AACA;AAEA,8BAAwB,aAAA,CAAA,MAAA;AAGxB,gCAA0B,aAAA,CAAA,MAAA;AAG1B,qCAA+B,aAAA,CAAA,MAAA;AAG/B,iCAA2B,aAAA,CAAA,MAAA;;AAiB3B;;AAIA;AAGA;;oDAxCW,OAAO;sDAAP,OAAO;AAgDnB;;AClFD;;;;;;AAMG;AACH,cAgBa,YAAY;;oBAET,aAAA,CAAA,WAAA;AAEd;AAEA,gCAA0B,aAAA,CAAA,MAAA;AAG1B,8BAAwB,aAAA,CAAA,MAAA;;AAIxB,+BAAyB,aAAA,CAAA,MAAA;;oDAbd,YAAY;sDAAZ,YAAY;AA2BxB;;AClDD;;;;;;AAMG;AACH,cACa,eAAe;;AAE1B;;uBAGiB,aAAA,CAAA,cAAA;;0BAEG,aAAA,CAAA,cAAA;;yBAED,aAAA,CAAA,cAAA;AAEnB;AAGA;AAGA;;AAKA;;AAEA,2BAAuB,aAAa;oDAxBzB,eAAe;wDAAf,eAAe;AAyB3B;;AC1CD;;;;;;;;;;AAUG;AACH,cAAa,gBAAgB;;;AAI3B;;;;AAIG;AACH,6BAAyB,cAAc;;AAYvC,qBAAiB,aAAa;;;;AAU9B;;;AAUA;AAIA;AAID;;;;","names":[]}

package/types/skra-ui-textarea.d.ts

@@ -0,0 +1,55 @@
+import { SkraFieldContext } from '@skra/ui/field';
+import * as i0 from '@angular/core';
+
+/**
+ * `textarea[skraTextarea]` — multiline text atom. Per ADR 040 this is a
+ * Component-on-a-native-host carrying its own host-scoped CSS (`textarea.scss`)
+ * via Emulated encapsulation, replacing the ADR 038 slice branch.
+ *
+ * `<textarea>` is a content-bearing host (its value is its text content), so the
+ * template MUST be `<ng-content>` — `template: ''` would discard the consumer's
+ * initial text. See ADR 040 §2.
+ *
+ * Sibling atom to SkraInput — split per atom-granularity rule (memory
+ * `feedback_atom_granularity.md`): textarea has capabilities `<input>` does not
+ * (multi-line content, native `rows` / `cols`, autosize composition via the
+ * sibling `[skraAutoResize]` directive).
+ *
+ *   <skra-field>
+ *     <label skraLabelFor>Bio</label>
+ *     <textarea skraTextarea skraAutoResize rows="3"></textarea>
+ *   </skra-field>
+ *
+ * Native `rows` / `cols` remain the consumer-facing sizing primitives — Forge
+ * does not duplicate them as Angular inputs (boundary #9 native-attr-first).
+ */
+declare class SkraTextarea {
+    readonly context: SkraFieldContext;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SkraTextarea, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SkraTextarea, "textarea[skraTextarea]", never, {}, {}, never, ["*"], true, never>;
+}
+
+/**
+ * Marker directive enabling content-driven sizing on a native form control via
+ * the modern CSS `field-sizing: content` declaration shipped from the skin's
+ * global utilities layer (`tokens/skins/skra/utilities.scss`).
+ *
+ *   <textarea skraTextarea skraAutoResize rows="2"></textarea>
+ *   <input skraInput skraAutoResize type="text" />
+ *
+ * Composition-over-configuration: the host opts in by adding the attribute,
+ * not by toggling a boolean Angular input. The directive has no host bindings,
+ * no DI, and no template — its sole job is to make the selector available at
+ * Angular's compilation stage; CSS does the rest.
+ *
+ * Wide selector (textarea + input) reflects that `field-sizing: content` is a
+ * native CSS capability for both: textarea grows in block-size with rows,
+ * input grows in inline-size with content width.
+ */
+declare class SkraAutoResizeDirective {
+    static ɵfac: i0.ɵɵFactoryDeclaration<SkraAutoResizeDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SkraAutoResizeDirective, "textarea[skraAutoResize], input[skraAutoResize]", never, {}, {}, never, never, true, never>;
+}
+
+export { SkraAutoResizeDirective, SkraTextarea };
+//# sourceMappingURL=skra-ui-textarea.d.ts.map

package/types/skra-ui-textarea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skra-ui-textarea.d.ts","sources":["../../../../libs/ui/textarea/src/lib/textarea/textarea.ts","../../../../libs/ui/textarea/src/lib/auto-resize/auto-resize.directive.ts"],"mappings":";;;AAQA;;;;;;;;;;;;;;;;;;;;;AAqBG;AACH,cAoBa,YAAY;sBACP,gBAAA;yCADL,YAAY;2CAAZ,YAAY;AAExB;;AClDD;;;;;;;;;;;;;;;;AAgBG;AACH,cAIa,uBAAuB;yCAAvB,uBAAuB;2CAAvB,uBAAuB;AAAG;;;;","names":[]}

package/types/skra-ui-toast.d.ts

@@ -0,0 +1,140 @@
+import * as _angular_core from '@angular/core';
+import { InjectionToken } from '@angular/core';
+
+/**
+ * Marker directive for the leading icon slot of `<skra-toast>`.
+ * Detected via `contentChild` (ADR 020 Smart Slots v2.0) to toggle the icon
+ * wrapper without emitting an empty DOM node. Feedback-local (not the button
+ * lib's `[skra-start]`) to avoid a cross-lib marker dependency — mirrors
+ * `[skra-alert-icon]` / `[skra-badge-icon]`.
+ */
+declare class SkraToastIcon {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkraToastIcon, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SkraToastIcon, "[skra-toast-icon]", never, {}, {}, never, never, true, never>;
+}
+
+/**
+ * ToastIntent — semantic feedback meaning (ADR 035 §3.1, downward subset). Excludes the
+ * action intents `primary`/`secondary`. Same enum as Alert/Badge.
+ */
+type ToastIntent = 'neutral' | 'info' | 'success' | 'warning' | 'danger';
+/** ToastEmphasis — `high` = filled, `medium` = soft. `low` deferred (ADR 035 §3.1). */
+type ToastEmphasis = 'high' | 'medium';
+/**
+ * ToastLive — screen-reader announcement politeness (ADR 0052). For Toast the politeness
+ * is routed to the REGION's announcer (ADR 0052 §7); it does NOT set a role on this host.
+ * Default `polite` (toasts are always dynamically presented — ADR 0052 §4). `assertive`
+ * for error toasts, set explicitly by the consumer — NEVER auto-derived from `intent`.
+ */
+type ToastLive = 'off' | 'polite' | 'assertive';
+/**
+ * `<skra-toast>` — an ephemeral, auto-dismissing feedback message rendered inside a
+ * `<skra-toast-region>` top-layer stack (Feedback/Status family, ADR 0052; Tier 2 overlay,
+ * ADR 0044). Visually an Alert (intent×emphasis seam, 4th consumer) with a timer.
+ *
+ * Announcement (ADR 0052 §7): this host carries NO `role`/`aria-live`. On appearance the
+ * toast pushes its message text into the region's persistent role-only announcer via the
+ * injected `SkraToastAnnouncer`, at the politeness of `live` (`off` → no announcement).
+ *
+ * Auto-dismiss (WCAG 2.2.1): after `duration` ms the toast emits `(dismissed)`. The timer
+ * PAUSES on hover and on focus-within and resumes with the remaining time; `duration=0`
+ * disables it (persistent — pair with `dismissible`). Forge does NOT self-remove — the
+ * consumer removes the model from its array on `(dismissed)` (agnostic doctrine; the Alert
+ * precedent). `(dismissed)` is the single removal channel (timer elapse OR close control).
+ */
+declare class SkraToast {
+    readonly intent: _angular_core.InputSignal<ToastIntent>;
+    readonly emphasis: _angular_core.InputSignal<ToastEmphasis>;
+    readonly live: _angular_core.InputSignal<ToastLive>;
+    readonly duration: _angular_core.InputSignal<number>;
+    readonly dismissible: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly dismissed: _angular_core.OutputEmitterRef<void>;
+    readonly iconSlot: _angular_core.Signal<SkraToastIcon | undefined>;
+    readonly hasIcon: _angular_core.Signal<boolean>;
+    /** The message column — its text is the announcement (excludes the icon + sr-only close label). */
+    private readonly contentRef;
+    private readonly announcer;
+    private timerId;
+    private remaining;
+    private startedAt;
+    constructor();
+    protected onDismiss(): void;
+    /** Pause the countdown, banking the remaining time (WCAG 2.2.1). */
+    protected pause(): void;
+    /** Resume the countdown with the banked remaining time. */
+    protected resume(): void;
+    private start;
+    private clear;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkraToast, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkraToast, "skra-toast", never, { "intent": { "alias": "intent"; "required": false; "isSignal": true; }; "emphasis": { "alias": "emphasis"; "required": false; "isSignal": true; }; "live": { "alias": "live"; "required": false; "isSignal": true; }; "duration": { "alias": "duration"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; }, { "dismissed": "dismissed"; }, ["iconSlot"], ["[skra-toast-icon]", "*", "[skra-toast-close-label]"], true, never>;
+}
+
+/**
+ * Politeness routed to the toast region's role-only announcer (ADR 0052 §7).
+ * `off` never reaches the announcer (no announcement), so the seam only carries
+ * the two announced levels.
+ */
+type SkraToastPoliteness = 'polite' | 'assertive';
+/**
+ * The ADR 0052 §7 announcement seam. Provided by `<skra-toast-region>` and injected
+ * (optionally) by each projected `<skra-toast>`. The toast pushes its message text on
+ * appearance; the region writes it into the matching PERSISTENT, role-only announcer
+ * (`role="status"` for polite / `role="alert"` for assertive) — never a role/`aria-live`
+ * on the ephemeral toast host. This is why a live region pre-exists the content it
+ * announces (WCAG 4.1.3): the announcers are rendered from the region's first render.
+ *
+ * Narrow seam (like `SkraSelectPanel` / `SkraFieldContext`): the toast depends on the
+ * interface, not the concrete region. Content-projected toasts inject from their DECLARED
+ * parent element (= the region), the same DI mechanism as `SkraFieldContext` (ADR 013).
+ */
+interface SkraToastAnnouncer {
+    /** Announce `text` at the given politeness by writing it into the matching live region. */
+    announce(text: string, politeness: SkraToastPoliteness): void;
+}
+declare const SKRA_TOAST_ANNOUNCER: InjectionToken<SkraToastAnnouncer>;
+
+/**
+ * ToastPlacement — viewport corner, logical (RTL-correct). `block-start`/`block-end` = the
+ * top/bottom edge; `inline-start`/`center`/`inline-end` = the horizontal position.
+ */
+type ToastPlacement = 'block-start inline-start' | 'block-start center' | 'block-start inline-end' | 'block-end inline-start' | 'block-end center' | 'block-end inline-end';
+/**
+ * `<skra-toast-region>` — the persistent, app-root manager for `<skra-toast>` (ADR 0044 §7
+ * non-anchored top-layer; ADR 0052 §7 announcer). Place ONCE near the app root; the consumer
+ * projects its own `@for` of toast models into it and owns the array (agnostic doctrine —
+ * a `ToastService` push/remove helper is a consumer recipe, NOT shipped here).
+ *
+ * Two mechanisms:
+ *   - Announcement (ADR 0052 §7): provides `SkraToastAnnouncer` + renders TWO persistent,
+ *     visually-hidden, role-only announcers (`role="status"` polite / `role="alert"` assertive).
+ *     A toast pushes its text on appearance; identical repeated messages re-announce via a
+ *     clear-then-set across two frames (forces a live-region mutation).
+ *   - Top layer (ADR 0044 §7): a SINGLE `popover="manual"` stack (not `auto` — no light-dismiss /
+ *     Escape collapse; not N popovers). Shown when non-empty; RE-ASSERTS top-layer order on each
+ *     addition (`hidePopover()`+`showPopover()`) so a toast raised over an open modal `<dialog>`
+ *     paints above it. Paint-only — never moves focus, never disturbs the dialog. Zero z-index.
+ */
+declare class SkraToastRegion implements SkraToastAnnouncer {
+    readonly placement: _angular_core.InputSignal<ToastPlacement>;
+    /** The two persistent role-only announcer buffers (ADR 0052 §7). */
+    protected readonly politeMsg: _angular_core.WritableSignal<string>;
+    protected readonly assertiveMsg: _angular_core.WritableSignal<string>;
+    private readonly toasts;
+    private readonly stackEl;
+    /** Tracked locally — jsdom/SSR have no `:popover-open`; never read it back. */
+    private shown;
+    private prevCount;
+    constructor();
+    /**
+     * ADR 0052 §7 — write `text` into the matching persistent announcer. Clear-then-set across two
+     * animation frames so a repeated IDENTICAL message still mutates the live region and re-announces
+     * (the "repeated action" case). `off` toasts never call this.
+     */
+    announce(text: string, politeness: SkraToastPoliteness): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkraToastRegion, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkraToastRegion, "skra-toast-region", never, { "placement": { "alias": "placement"; "required": false; "isSignal": true; }; }, {}, ["toasts"], ["*"], true, never>;
+}
+
+export { SKRA_TOAST_ANNOUNCER, SkraToast, SkraToastIcon, SkraToastRegion };
+export type { SkraToastAnnouncer, SkraToastPoliteness, ToastEmphasis, ToastIntent, ToastLive, ToastPlacement };
+//# sourceMappingURL=skra-ui-toast.d.ts.map

package/types/skra-ui-toast.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skra-ui-toast.d.ts","sources":["../../../../libs/ui/toast/src/lib/toast.directives.ts","../../../../libs/ui/toast/src/lib/toast/toast.ts","../../../../libs/ui/toast/src/lib/toast/toast-announcer.ts","../../../../libs/ui/toast/src/lib/toast/toast-region.ts"],"mappings":";;;AAEA;;;;;;AAMG;AACH,cAIa,aAAa;oDAAb,aAAa;sDAAb,aAAa;AAAG;;ACQ7B;;;AAGG;AACG,KAAM,WAAW;AAEvB;KACY,aAAa;AAEzB;;;;;AAKG;AACG,KAAM,SAAS;AAErB;;;;;;;;;;;;;;AAcG;AACH,cAsBa,SAAS;qBAEL,aAAA,CAAA,WAAA,CAAA,WAAA;uBACE,aAAA,CAAA,WAAA,CAAA,aAAA;mBAGJ,aAAA,CAAA,WAAA,CAAA,SAAA;uBAGI,aAAA,CAAA,WAAA;0BACG,aAAA,CAAA,wBAAA;wBACF,aAAA,CAAA,gBAAA;uBAGD,aAAA,CAAA,MAAA,CAAA,aAAA;sBACD,aAAA,CAAA,MAAA;;AAGhB;AAGA;;;;;;;;;;AA0CA;AASA;oDAxEW,SAAS;sDAAT,SAAS;AA8ErB;;ACvJD;;;;AAIG;KACS,mBAAmB;AAE/B;;;;;;;;;;;AAWG;UACc,kBAAkB;;uCAEE,mBAAmB;AACvD;AAED,cAAa,oBAAoB,EAAA,cAAA,CAAA,kBAAA;;ACRjC;;;AAGG;AACG,KAAM,cAAc;AAQ1B;;;;;;;;;;;;;;;AAeG;AACH,cAYa,eAAgB,YAAW,kBAAkB;wBACtC,aAAA,CAAA,WAAA,CAAA,cAAA;;AAGlB,kCAA4B,aAAA,CAAA,cAAA;AAC5B,qCAA+B,aAAA,CAAA,cAAA;AAE/B;AACA;;;;;AAmCA;;;;AAIG;uCACgC,mBAAmB;oDAhD3C,eAAe;sDAAf,eAAe;AAsD3B;;;;","names":[]}

package/types/skra-ui-tooltip.d.ts

@@ -0,0 +1,90 @@
+import * as i0 from '@angular/core';
+import { SkraPlacement } from '@skra/ui/core';
+export { SkraPlacement } from '@skra/ui/core';
+
+/**
+ * SkraTooltip — a supplementary, non-interactive text description on a focusable trigger, shown on
+ * hover AND keyboard focus (ADR 0044 native top layer via the Popover API). Applied to the consumer's
+ * own trigger: `<button skraButton [skraTooltip]="'Settings'">`.
+ *
+ * The bulk of this directive is the WCAG 1.4.13 (Content on Hover or Focus) state machine — the
+ * platform's `popover="manual"` gives top-layer rendering but no dismiss/Escape, so Forge wires it:
+ *   - Dismissible: Escape hides WITHOUT moving focus.
+ *   - Hoverable:   a hide grace-delay lets the pointer travel trigger→panel; hovering the panel keeps it.
+ *   - Persistent:  no auto-timeout.
+ *   - Keyboard:    focus shows immediately (no delay).
+ *
+ * Accessible-name contract (ADR 033, describedby-only): the tooltip is a DESCRIPTION, never the name —
+ * it MERGES its panel id into the trigger's `aria-describedby` (preserving any existing value) and
+ * removes only its own token on destroy. The trigger owns its own accessible name (an icon-only button
+ * still needs its own `aria-label`). No `ariaLabel` input, no `aria-labelledby` wiring.
+ *
+ * The panel is created EAGERLY (hidden) so `aria-describedby` resolves and a screen reader announces
+ * the description on first focus. Positioning is delegated to `SkraPositioner` (single JS path,
+ * geometry-only inline; ADR 0044 §3 rules 4–5). Full contract: adr/specs/component-tooltip-spec.md.
+ */
+declare class SkraTooltip {
+    /** The tooltip text (bound as `[skraTooltip]="..."`). */
+    readonly skraTooltip: i0.InputSignal<string>;
+    /** Placement intent; `flip`/`shift` adjust at runtime. */
+    readonly placement: i0.InputSignal<SkraPlacement>;
+    private readonly host;
+    private readonly vcr;
+    private readonly renderer;
+    private readonly panelRef;
+    private readonly panelEl;
+    private readonly panelId;
+    private positioner?;
+    private showTimer?;
+    private hideTimer?;
+    private docEscapeUnlisten?;
+    private open;
+    private hovered;
+    private focused;
+    private panelHovered;
+    constructor();
+    protected onPointerEnter(): void;
+    protected onPointerLeave(): void;
+    protected onFocusIn(): void;
+    protected onFocusOut(): void;
+    private scheduleShow;
+    private scheduleHide;
+    private show;
+    private hide;
+    private wireDescribedBy;
+    private unwireDescribedBy;
+    private describedByTokens;
+    private cssTimeMs;
+    private cssLenPx;
+    private warnIfTriggerNotFocusable;
+    private teardown;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SkraTooltip, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SkraTooltip, "[skraTooltip]", ["skraTooltip"], { "skraTooltip": { "alias": "skraTooltip"; "required": true; "isSignal": true; }; "placement": { "alias": "placement"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * SkraTooltipPanel — the floating tooltip surface (ADR 0044 native top layer via the Popover API).
+ *
+ * INTERNAL: never placed by consumers in a template. `SkraTooltip` creates it programmatically with
+ * `ViewContainerRef.createComponent` (Angular-idiomatic, in-tree → inherits the design-context cascade
+ * + the O-8 Shadow-DOM bridge per ADR 0044 §3 rule 3) and drives `showPopover()`/`hidePopover()` on the
+ * host element.
+ *
+ * `popover="manual"` (NOT `auto`): a hover/focus tooltip's show/hide is Forge-owned, not click-toggle
+ * light-dismiss. `role="tooltip"` is the AT semantics; the trigger references this panel's `id` via
+ * `aria-describedby` (wired by the directive). The 13-axis Universal Surface (ADR 025) + motion live in
+ * `tooltip.scss`; geometry (`left`/`top` + `data-skra-placement`) is written by `SkraPositioner`.
+ *
+ * Full contract: adr/specs/component-tooltip-spec.md.
+ */
+declare class SkraTooltipPanel {
+    /** Tooltip text; set by the directive and kept in sync. */
+    readonly text: i0.InputSignal<string>;
+    /** Stable unique id — target of the trigger's `aria-describedby`. */
+    readonly panelId: string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SkraTooltipPanel, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SkraTooltipPanel, "skra-tooltip-panel", never, { "text": { "alias": "text"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+export { SkraTooltip, SkraTooltipPanel };
+//# sourceMappingURL=skra-ui-tooltip.d.ts.map

package/types/skra-ui-tooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skra-ui-tooltip.d.ts","sources":["../../../../libs/ui/tooltip/src/lib/tooltip/tooltip.ts","../../../../libs/ui/tooltip/src/lib/tooltip/tooltip-panel.ts"],"mappings":";;;;AA0BA;;;;;;;;;;;;;;;;;;;;AAoBG;AACH,cAWa,WAAW;;0BAEFA,EAAA,CAAA,WAAA;;wBAEFA,EAAA,CAAA,WAAA,CAAA,aAAA;AAElB;AACA;AACA;AAEA;AACA;AACA;;;;;;;;;;;;;;AAkEA;AAUA;AASA;AA8BA;AAcA;AAUA;AAkBA;AAOA;AAOA;AAWA;AAWA;yCA7MW,WAAW;2CAAX,WAAW;AAqNvB;;ACtQD;;;;;;;;;;;;;;AAcG;AACH,cAaa,gBAAgB;;mBAEdA,EAAA,CAAA,WAAA;;;yCAFF,gBAAgB;2CAAhB,gBAAgB;AAM5B;;;;","names":["_angular_core"]}

package/types/skra-ui-typography.d.ts

@@ -0,0 +1,17 @@
+import * as _angular_core from '@angular/core';
+
+type TypographyRole = 'display-large' | 'display-medium' | 'display-small' | 'headline-large' | 'headline-medium' | 'headline-small' | 'title-large' | 'title-medium' | 'title-small' | 'body-large' | 'body-medium' | 'body-small' | 'label-large' | 'label-medium' | 'label-small';
+type TypographySeverity = 'error' | 'warning' | 'success';
+type TypographyTruncate = 'single' | 'multi';
+declare class SkraTypography {
+    readonly role: _angular_core.InputSignal<TypographyRole>;
+    readonly severity: _angular_core.InputSignal<TypographySeverity | null>;
+    readonly truncate: _angular_core.InputSignal<TypographyTruncate | null>;
+    readonly lineClamp: _angular_core.InputSignal<number>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkraTypography, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkraTypography, "[skraTypography]", never, { "role": { "alias": "skraTypography"; "required": false; "isSignal": true; }; "severity": { "alias": "severity"; "required": false; "isSignal": true; }; "truncate": { "alias": "truncate"; "required": false; "isSignal": true; }; "lineClamp": { "alias": "lineClamp"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+export { SkraTypography };
+export type { TypographyRole, TypographySeverity, TypographyTruncate };
+//# sourceMappingURL=skra-ui-typography.d.ts.map

package/types/skra-ui-typography.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skra-ui-typography.d.ts","sources":["../../../../libs/ui/typography/src/lib/typography/typography.ts"],"mappings":";;AAOM,KAAM,cAAc;AAiBpB,KAAM,kBAAkB;KAClB,kBAAkB;AAE9B,cAwBa,cAAc;mBACZ,aAAA,CAAA,WAAA,CAAA,cAAA;uBAGI,aAAA,CAAA,WAAA,CAAA,kBAAA;uBACA,aAAA,CAAA,WAAA,CAAA,kBAAA;wBACC,aAAA,CAAA,WAAA;oDANP,cAAc;sDAAd,cAAc;AAO1B;;;;","names":[]}

package/types/skra-ui.d.ts

@@ -0,0 +1,3 @@
+
+export { };
+//# sourceMappingURL=skra-ui.d.ts.map

package/types/skra-ui.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skra-ui.d.ts","sources":[],"mappings":"","names":[]}