@bmxc/pami-elements 0.1.0-beta.1 → 0.1.0-beta.2

package/dist/types/components.d.ts

@@ -15,6 +15,7 @@ import { PamiBreadcrumbSelectDetail } from "./components/pami-breadcrumb-item/pa
 import { PamiBreadcrumbsExpandDetail } from "./components/pami-breadcrumbs/pami-breadcrumbs.js";
 import { PamiButtonChangeDetail, PamiButtonClickDetail } from "./components/pami-button/pami-button.js";
 import { PamiButtonGroupChangeDetail } from "./components/pami-button-group/pami-button-group.js";
+import { PamiStatusTone } from "./utils/status-surface.js";
 import { PamiCardDragDetail } from "./components/pami-card/pami-card.js";
 import { ColorFormat, ColorPickerVariant } from "./components/pami-color-picker/pami-color-picker.js";
 import { PamiDatePickerChangeDetail, PamiDatePickerMenuOpenDetail, PamiDatePickerMenuSelectDetail, PamiDatePickerModeChangeDetail, PamiDatePickerSelectedDetail, PamiDatePickerViewChangeDetail } from "./components/pami-date-picker/pami-date-picker.js";
@@ -45,6 +46,7 @@ export { PamiBreadcrumbSelectDetail } from "./components/pami-breadcrumb-item/pa
 export { PamiBreadcrumbsExpandDetail } from "./components/pami-breadcrumbs/pami-breadcrumbs.js";
 export { PamiButtonChangeDetail, PamiButtonClickDetail } from "./components/pami-button/pami-button.js";
 export { PamiButtonGroupChangeDetail } from "./components/pami-button-group/pami-button-group.js";
+export { PamiStatusTone } from "./utils/status-surface.js";
 export { PamiCardDragDetail } from "./components/pami-card/pami-card.js";
 export { ColorFormat, ColorPickerVariant } from "./components/pami-color-picker/pami-color-picker.js";
 export { PamiDatePickerChangeDetail, PamiDatePickerMenuOpenDetail, PamiDatePickerMenuSelectDetail, PamiDatePickerModeChangeDetail, PamiDatePickerSelectedDetail, PamiDatePickerViewChangeDetail } from "./components/pami-date-picker/pami-date-picker.js";
@@ -1369,6 +1371,25 @@ export namespace Components {
          */
         "variant": 'standard' | 'connected';
     }
+    /**
+     * An explanation or notification in the content flow.
+     * @tag pami-callout
+     * @csspart container - Message surface
+     * @csspart content - Heading and message
+     * @csspart actions - Action region
+     */
+    interface PamiCallout {
+        /**
+          * Announce message updates. Use assertive only for urgent interruptions.
+          * @default 'off'
+         */
+        "announcement": 'off' | 'polite' | 'assertive';
+        /**
+          * Semantic colour; does not determine announcement urgency.
+          * @default 'neutral'
+         */
+        "tone": PamiStatusTone;
+    }
     interface PamiCard {
         /**
           * Local density rung. Drives the same `--md-sys-density-scale` signal that a global `data-density` ancestor sets, so a local value simply overrides the inherited one. 0 = default, -4 = ultra-compact.
@@ -3320,6 +3341,24 @@ export namespace Components {
          */
         "select": (index: number) => Promise<void>;
     }
+    /**
+     * A labelled section of navigation destinations. The label is not interactive.
+     * @tag pami-navigation-group
+     * @csspart label - Section label
+     * @csspart items - Destination container
+     */
+    interface PamiNavigationGroup {
+        /**
+          * Managed by the rail: show the section label in its expanded layout.
+          * @default true
+         */
+        "expanded": boolean;
+        /**
+          * Section name; kept accessible when the rail is collapsed.
+          * @default ''
+         */
+        "label": string;
+    }
     /**
      * Material Design 3 — Navigation Rail
      * A vertical navigation surface for the left or right edge of medium / large
@@ -3337,11 +3376,25 @@ export namespace Components {
           * @default -1
          */
         "activeIndex": number;
+        /**
+          * Controlled destination value. When supplied, takes precedence over activeIndex.
+         */
+        "activeValue"?: string;
         /**
           * Vertical alignment of destinations relative to the rail.
           * @default 'top'
          */
         "alignment": 'top' | 'middle' | 'bottom';
+        /**
+          * Short name of the tool within the platform.
+         */
+        "appName"?: string;
+        "close": () => Promise<void>;
+        /**
+          * Accessible drawer close-control name.
+          * @default 'Close navigation'
+         */
+        "closeLabel": string;
         /**
           * Programmatically collapse the rail (standard 80px width).
          */
@@ -3351,6 +3404,10 @@ export namespace Components {
           * @default 0
          */
         "density": 0 | -1 | -2 | -3 | -4;
+        /**
+          * Optional functional description, available in the brand tooltip.
+         */
+        "description"?: string;
         /**
           * Set to `true` to disable focus management (roving tabindex + arrow keys). Use when embedding inside a custom focus management system.
           * @default false
@@ -3393,6 +3450,11 @@ export namespace Components {
           * @default false
          */
         "modal": boolean;
+        /**
+          * Drawer visibility. Does not change the rail variant.
+          * @default false
+         */
+        "open": boolean;
         /**
           * Layout axis.  - `vertical` (default) — the MD3 rail: a fixed-width column on the leading   edge. - `horizontal` — the same parts laid out as a top-of-page bar: logo   leading, destinations in a row, FAB and footer trailing. For wide layouts   where a side rail would spend width the content wants.  The expand/collapse affordance is vertical-only — a bar has nowhere to grow — so `expandable` is ignored while horizontal.
           * @default 'vertical'
@@ -3408,6 +3470,16 @@ export namespace Components {
           * @default 'More'
          */
         "overflowLabel": string;
+        /**
+          * Platform name, shown above the tool name in the brand area.
+         */
+        "platformName"?: string;
+        /**
+          * Docked rail or modal navigation drawer using the same authored content.
+          * @default 'rail'
+         */
+        "presentation": 'rail' | 'drawer';
+        "show": () => Promise<void>;
         /**
           * Toggle between expanded and standard.
          */
@@ -3422,6 +3494,7 @@ export namespace Components {
           * @default 'standard'
          */
         "variant": 'standard' | 'expanded';
+        "whenClosed": () => Promise<void>;
     }
     /**
      * Material Design 3 — Navigation Rail Destination (Tab)
@@ -3429,10 +3502,16 @@ export namespace Components {
      * active-indicator pill (56×32) around the icon, with an optional label
      * underneath (or inline when the parent rail is expanded). Supports badges,
      * disabled state, link mode (`href`) and slotted custom icons.
+     * @tag pami-navigation-rail-tab
+     * @fires pamiChildrenToggle - Disclosure changes independently of routing
+     * @csspart destination - Branch destination button or link
+     * @csspart disclosure - Branch disclosure button
+     * @csspart children - Inline or popup children region
+     * @csspart row - Parent destination and disclosure row
      * Spec:
-     *   - https://m3.material.io/components/navigation-rail/specs
-     *   - https://m3.material.io/components/navigation-rail/guidelines
-     *   - https://m3.material.io/components/navigation-rail/accessibility
+     * - https://m3.material.io/components/navigation-rail/specs
+     * - https://m3.material.io/components/navigation-rail/guidelines
+     * - https://m3.material.io/components/navigation-rail/accessibility
      */
     interface PamiNavigationRailTab {
         /**
@@ -3450,6 +3529,15 @@ export namespace Components {
           * @default ''
          */
         "badgeValue": string;
+        /**
+          * Accessible disclosure name; defaults to the destination label.
+         */
+        "childrenLabel"?: string;
+        /**
+          * Whether the destinations in the children slot are disclosed.
+          * @default false
+         */
+        "childrenOpen": boolean;
         /**
           * Drop whatever row this destination's dropdown had marked as chosen.  The rail calls this when a *different* destination becomes active. Without it the bar ends up with two highlighted destinations: the newly active one, and the one still wearing the child-selected pill because its menu row was never unmarked.
          */
@@ -3469,6 +3557,10 @@ export namespace Components {
           * @default false
          */
         "expanded": boolean;
+        /**
+          * Focus this destination, including the native control used by a branch.
+         */
+        "focusDestination": () => Promise<void>;
         /**
           * When set, the tab is rendered as a link (anchor) with the given href. Activates link semantics (uses `aria-current="page"` when active).
           * @default ''
@@ -3489,6 +3581,15 @@ export namespace Components {
           * @default 'all'
          */
         "labelVisibility": 'all' | 'selected' | 'none';
+        /**
+          * Managed by the rail: destination semantics for grouped navigation.
+          * @default false
+         */
+        "navigation": boolean;
+        /**
+          * Change the disclosure without activating the parent route.
+         */
+        "setChildrenOpen": (open: boolean) => Promise<void>;
         /**
           * Optional target for the link (when `href` is set).
           * @default ''
@@ -6664,6 +6765,19 @@ export namespace Components {
          */
         "width": string;
     }
+    /**
+     * A static status label. Text supplies the meaning; colour reinforces it.
+     * @tag pami-tag
+     * @csspart container - Label surface
+     * @csspart content - Status text
+     */
+    interface PamiTag {
+        /**
+          * Semantic colour; applications own the status vocabulary.
+          * @default 'neutral'
+         */
+        "tone": PamiStatusTone;
+    }
     interface PamiTextField {
         /**
           * Force the field to render in its focused visual state regardless of the underlying input's actual focus. Use when the field acts as an *anchor* for a popover, dialog, or menu, and the OS focus has moved into that surface — for example the `pami-time-picker` keeps its trigger field in the focused look while the picker modal is open, so the trigger and the modal read as one connected control.  Visual-only: affects the notched-outline width / colour, the floating label position, and the leading-icon colour through pami-text-field's existing `.pami-text-field--focused` rules. Does NOT alter formatter / blur-format behaviour (those keep tracking real focus events), so `formatOn="blur"` still flips between formatted and raw on real focus/blur even while `appear-focused` is on.
@@ -7955,6 +8069,19 @@ declare global {
         prototype: HTMLPamiButtonGroupElement;
         new (): HTMLPamiButtonGroupElement;
     };
+    /**
+     * An explanation or notification in the content flow.
+     * @tag pami-callout
+     * @csspart container - Message surface
+     * @csspart content - Heading and message
+     * @csspart actions - Action region
+     */
+    interface HTMLPamiCalloutElement extends Components.PamiCallout, HTMLStencilElement {
+    }
+    var HTMLPamiCalloutElement: {
+        prototype: HTMLPamiCalloutElement;
+        new (): HTMLPamiCalloutElement;
+    };
     interface HTMLPamiCardElementEventMap {
         "pamiClick": MouseEvent;
         "pamiDragStart": PamiCardDragDetail;
@@ -8420,8 +8547,22 @@ declare global {
         prototype: HTMLPamiNavigationBarElement;
         new (): HTMLPamiNavigationBarElement;
     };
+    /**
+     * A labelled section of navigation destinations. The label is not interactive.
+     * @tag pami-navigation-group
+     * @csspart label - Section label
+     * @csspart items - Destination container
+     */
+    interface HTMLPamiNavigationGroupElement extends Components.PamiNavigationGroup, HTMLStencilElement {
+    }
+    var HTMLPamiNavigationGroupElement: {
+        prototype: HTMLPamiNavigationGroupElement;
+        new (): HTMLPamiNavigationGroupElement;
+    };
     interface HTMLPamiNavigationRailElementEventMap {
-        "pamiTabChange": { index: number; value: string };
+        "pamiOpen": void;
+        "pamiClose": void;
+        "pamiTabChange": { index: number; value: string; path?: string[] };
         "pamiExpand": void;
         "pamiCollapse": void;
     }
@@ -8451,6 +8592,7 @@ declare global {
         new (): HTMLPamiNavigationRailElement;
     };
     interface HTMLPamiNavigationRailTabElementEventMap {
+        "pamiChildrenToggle": { value: string; open: boolean };
         "pamiTabClick": { value: string };
         "pamiSubmenuToggle": { open: boolean };
     }
@@ -8460,10 +8602,16 @@ declare global {
      * active-indicator pill (56×32) around the icon, with an optional label
      * underneath (or inline when the parent rail is expanded). Supports badges,
      * disabled state, link mode (`href`) and slotted custom icons.
+     * @tag pami-navigation-rail-tab
+     * @fires pamiChildrenToggle - Disclosure changes independently of routing
+     * @csspart destination - Branch destination button or link
+     * @csspart disclosure - Branch disclosure button
+     * @csspart children - Inline or popup children region
+     * @csspart row - Parent destination and disclosure row
      * Spec:
-     *   - https://m3.material.io/components/navigation-rail/specs
-     *   - https://m3.material.io/components/navigation-rail/guidelines
-     *   - https://m3.material.io/components/navigation-rail/accessibility
+     * - https://m3.material.io/components/navigation-rail/specs
+     * - https://m3.material.io/components/navigation-rail/guidelines
+     * - https://m3.material.io/components/navigation-rail/accessibility
      */
     interface HTMLPamiNavigationRailTabElement extends Components.PamiNavigationRailTab, HTMLStencilElement {
         addEventListener<K extends keyof HTMLPamiNavigationRailTabElementEventMap>(type: K, listener: (this: HTMLPamiNavigationRailTabElement, ev: PamiNavigationRailTabCustomEvent<HTMLPamiNavigationRailTabElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -9459,6 +9607,18 @@ declare global {
         prototype: HTMLPamiTabsElement;
         new (): HTMLPamiTabsElement;
     };
+    /**
+     * A static status label. Text supplies the meaning; colour reinforces it.
+     * @tag pami-tag
+     * @csspart container - Label surface
+     * @csspart content - Status text
+     */
+    interface HTMLPamiTagElement extends Components.PamiTag, HTMLStencilElement {
+    }
+    var HTMLPamiTagElement: {
+        prototype: HTMLPamiTagElement;
+        new (): HTMLPamiTagElement;
+    };
     interface HTMLPamiTextFieldElementEventMap {
         "pamiInput": string;
         "pamiChange": string;
@@ -9607,6 +9767,7 @@ declare global {
         "pami-breadcrumbs": HTMLPamiBreadcrumbsElement;
         "pami-button": HTMLPamiButtonElement;
         "pami-button-group": HTMLPamiButtonGroupElement;
+        "pami-callout": HTMLPamiCalloutElement;
         "pami-card": HTMLPamiCardElement;
         "pami-checkbox": HTMLPamiCheckboxElement;
         "pami-chip": HTMLPamiChipElement;
@@ -9629,6 +9790,7 @@ declare global {
         "pami-meter": HTMLPamiMeterElement;
         "pami-multi-select": HTMLPamiMultiSelectElement;
         "pami-navigation-bar": HTMLPamiNavigationBarElement;
+        "pami-navigation-group": HTMLPamiNavigationGroupElement;
         "pami-navigation-rail": HTMLPamiNavigationRailElement;
         "pami-navigation-rail-tab": HTMLPamiNavigationRailTabElement;
         "pami-navigation-tab": HTMLPamiNavigationTabElement;
@@ -9671,6 +9833,7 @@ declare global {
         "pami-table-sort-label": HTMLPamiTableSortLabelElement;
         "pami-table-toolbar": HTMLPamiTableToolbarElement;
         "pami-tabs": HTMLPamiTabsElement;
+        "pami-tag": HTMLPamiTagElement;
         "pami-text-field": HTMLPamiTextFieldElement;
         "pami-time-picker": HTMLPamiTimePickerElement;
         "pami-toolbar": HTMLPamiToolbarElement;
@@ -11043,6 +11206,25 @@ declare namespace LocalJSX {
          */
         "variant"?: 'standard' | 'connected';
     }
+    /**
+     * An explanation or notification in the content flow.
+     * @tag pami-callout
+     * @csspart container - Message surface
+     * @csspart content - Heading and message
+     * @csspart actions - Action region
+     */
+    interface PamiCallout {
+        /**
+          * Announce message updates. Use assertive only for urgent interruptions.
+          * @default 'off'
+         */
+        "announcement"?: 'off' | 'polite' | 'assertive';
+        /**
+          * Semantic colour; does not determine announcement urgency.
+          * @default 'neutral'
+         */
+        "tone"?: PamiStatusTone;
+    }
     interface PamiCard {
         /**
           * Local density rung. Drives the same `--md-sys-density-scale` signal that a global `data-density` ancestor sets, so a local value simply overrides the inherited one. 0 = default, -4 = ultra-compact.
@@ -13032,6 +13214,24 @@ declare namespace LocalJSX {
          */
         "onPamiChange"?: (event: PamiNavigationBarCustomEvent<{ index: number; previousIndex: number }>) => void;
     }
+    /**
+     * A labelled section of navigation destinations. The label is not interactive.
+     * @tag pami-navigation-group
+     * @csspart label - Section label
+     * @csspart items - Destination container
+     */
+    interface PamiNavigationGroup {
+        /**
+          * Managed by the rail: show the section label in its expanded layout.
+          * @default true
+         */
+        "expanded"?: boolean;
+        /**
+          * Section name; kept accessible when the rail is collapsed.
+          * @default ''
+         */
+        "label"?: string;
+    }
     /**
      * Material Design 3 — Navigation Rail
      * A vertical navigation surface for the left or right edge of medium / large
@@ -13049,16 +13249,33 @@ declare namespace LocalJSX {
           * @default -1
          */
         "activeIndex"?: number;
+        /**
+          * Controlled destination value. When supplied, takes precedence over activeIndex.
+         */
+        "activeValue"?: string;
         /**
           * Vertical alignment of destinations relative to the rail.
           * @default 'top'
          */
         "alignment"?: 'top' | 'middle' | 'bottom';
+        /**
+          * Short name of the tool within the platform.
+         */
+        "appName"?: string;
+        /**
+          * Accessible drawer close-control name.
+          * @default 'Close navigation'
+         */
+        "closeLabel"?: string;
         /**
           * Local density rung. Drives the same `--md-sys-density-scale` signal that a global `data-density` ancestor sets, so a local value simply overrides the inherited one. 0 = default, -4 = ultra-compact.
           * @default 0
          */
         "density"?: 0 | -1 | -2 | -3 | -4;
+        /**
+          * Optional functional description, available in the brand tooltip.
+         */
+        "description"?: string;
         /**
           * Set to `true` to disable focus management (roving tabindex + arrow keys). Use when embedding inside a custom focus management system.
           * @default false
@@ -13093,6 +13310,7 @@ declare namespace LocalJSX {
           * @default false
          */
         "modal"?: boolean;
+        "onPamiClose"?: (event: PamiNavigationRailCustomEvent<void>) => void;
         /**
           * Emitted when the rail transitions from expanded → collapsed.
          */
@@ -13101,10 +13319,16 @@ declare namespace LocalJSX {
           * Emitted when the rail transitions from collapsed → expanded.
          */
         "onPamiExpand"?: (event: PamiNavigationRailCustomEvent<void>) => void;
+        "onPamiOpen"?: (event: PamiNavigationRailCustomEvent<void>) => void;
         /**
           * Emitted when the user selects a destination.
          */
-        "onPamiTabChange"?: (event: PamiNavigationRailCustomEvent<{ index: number; value: string }>) => void;
+        "onPamiTabChange"?: (event: PamiNavigationRailCustomEvent<{ index: number; value: string; path?: string[] }>) => void;
+        /**
+          * Drawer visibility. Does not change the rail variant.
+          * @default false
+         */
+        "open"?: boolean;
         /**
           * Layout axis.  - `vertical` (default) — the MD3 rail: a fixed-width column on the leading   edge. - `horizontal` — the same parts laid out as a top-of-page bar: logo   leading, destinations in a row, FAB and footer trailing. For wide layouts   where a side rail would spend width the content wants.  The expand/collapse affordance is vertical-only — a bar has nowhere to grow — so `expandable` is ignored while horizontal.
           * @default 'vertical'
@@ -13120,6 +13344,15 @@ declare namespace LocalJSX {
           * @default 'More'
          */
         "overflowLabel"?: string;
+        /**
+          * Platform name, shown above the tool name in the brand area.
+         */
+        "platformName"?: string;
+        /**
+          * Docked rail or modal navigation drawer using the same authored content.
+          * @default 'rail'
+         */
+        "presentation"?: 'rail' | 'drawer';
         /**
           * Accessible label for the built-in toggle button (only rendered when `expandable` is set). Announced to assistive tech as the button's name.
           * @default 'Toggle navigation'
@@ -13137,10 +13370,16 @@ declare namespace LocalJSX {
      * active-indicator pill (56×32) around the icon, with an optional label
      * underneath (or inline when the parent rail is expanded). Supports badges,
      * disabled state, link mode (`href`) and slotted custom icons.
+     * @tag pami-navigation-rail-tab
+     * @fires pamiChildrenToggle - Disclosure changes independently of routing
+     * @csspart destination - Branch destination button or link
+     * @csspart disclosure - Branch disclosure button
+     * @csspart children - Inline or popup children region
+     * @csspart row - Parent destination and disclosure row
      * Spec:
-     *   - https://m3.material.io/components/navigation-rail/specs
-     *   - https://m3.material.io/components/navigation-rail/guidelines
-     *   - https://m3.material.io/components/navigation-rail/accessibility
+     * - https://m3.material.io/components/navigation-rail/specs
+     * - https://m3.material.io/components/navigation-rail/guidelines
+     * - https://m3.material.io/components/navigation-rail/accessibility
      */
     interface PamiNavigationRailTab {
         /**
@@ -13158,6 +13397,15 @@ declare namespace LocalJSX {
           * @default ''
          */
         "badgeValue"?: string;
+        /**
+          * Accessible disclosure name; defaults to the destination label.
+         */
+        "childrenLabel"?: string;
+        /**
+          * Whether the destinations in the children slot are disclosed.
+          * @default false
+         */
+        "childrenOpen"?: boolean;
         /**
           * Local density rung. Drives the same `--md-sys-density-scale` signal that a global `data-density` ancestor sets, so a local value simply overrides the inherited one. 0 = default, -4 = ultra-compact.
           * @default 0
@@ -13193,6 +13441,15 @@ declare namespace LocalJSX {
           * @default 'all'
          */
         "labelVisibility"?: 'all' | 'selected' | 'none';
+        /**
+          * Managed by the rail: destination semantics for grouped navigation.
+          * @default false
+         */
+        "navigation"?: boolean;
+        /**
+          * Fired when the user opens or closes the children disclosure.
+         */
+        "onPamiChildrenToggle"?: (event: PamiNavigationRailTabCustomEvent<{ value: string; open: boolean }>) => void;
         /**
           * Fired when this destination's slotted dropdown opens or closes. `pami-menu`'s own `pamiOpen` / `pamiClose` are deliberately non-bubbling and non-composed, so the rail has no way to hear them — this is the signal it listens for (it lifts its stacking context so the fixed-position menu is not trapped).
          */
@@ -16418,6 +16675,19 @@ declare namespace LocalJSX {
          */
         "width"?: string;
     }
+    /**
+     * A static status label. Text supplies the meaning; colour reinforces it.
+     * @tag pami-tag
+     * @csspart container - Label surface
+     * @csspart content - Status text
+     */
+    interface PamiTag {
+        /**
+          * Semantic colour; applications own the status vocabulary.
+          * @default 'neutral'
+         */
+        "tone"?: PamiStatusTone;
+    }
     interface PamiTextField {
         /**
           * Force the field to render in its focused visual state regardless of the underlying input's actual focus. Use when the field acts as an *anchor* for a popover, dialog, or menu, and the OS focus has moved into that surface — for example the `pami-time-picker` keeps its trigger field in the focused look while the picker modal is open, so the trigger and the modal read as one connected control.  Visual-only: affects the notched-outline width / colour, the floating label position, and the leading-icon colour through pami-text-field's existing `.pami-text-field--focused` rules. Does NOT alter formatter / blur-format behaviour (those keep tracking real focus events), so `formatOn="blur"` still flips between formatted and raw on real focus/blur even while `appear-focused` is on.
@@ -17375,6 +17645,10 @@ declare namespace LocalJSX {
         "fullWidth": boolean;
         "density": 0 | -1 | -2 | -3 | -4;
     }
+    interface PamiCalloutAttributes {
+        "tone": PamiStatusTone;
+        "announcement": 'off' | 'polite' | 'assertive';
+    }
     interface PamiCardAttributes {
         "variant": 'elevated' | 'filled' | 'outlined';
         "interactive": boolean;
@@ -17744,6 +18018,10 @@ declare namespace LocalJSX {
         "manualActivation": boolean;
         "density": 0 | -1 | -2 | -3 | -4;
     }
+    interface PamiNavigationGroupAttributes {
+        "label": string;
+        "expanded": boolean;
+    }
     interface PamiNavigationRailAttributes {
         "variant": 'standard' | 'expanded';
         "modal": boolean;
@@ -17754,6 +18032,13 @@ declare namespace LocalJSX {
         "labelVisibility": 'all' | 'selected' | 'none';
         "activeIndex": number;
         "label": string;
+        "platformName": string;
+        "appName": string;
+        "description": string;
+        "activeValue": string;
+        "presentation": 'rail' | 'drawer';
+        "open": boolean;
+        "closeLabel": string;
         "disableFocusManagement": boolean;
         "density": 0 | -1 | -2 | -3 | -4;
         "orientation": 'vertical' | 'horizontal';
@@ -17773,6 +18058,9 @@ declare namespace LocalJSX {
         "value": string;
         "labelVisibility": 'all' | 'selected' | 'none';
         "expanded": boolean;
+        "navigation": boolean;
+        "childrenOpen": boolean;
+        "childrenLabel": string;
         "density": 0 | -1 | -2 | -3 | -4;
     }
     interface PamiNavigationTabAttributes {
@@ -18337,6 +18625,9 @@ declare namespace LocalJSX {
         "tabWidth": string;
         "width": string;
     }
+    interface PamiTagAttributes {
+        "tone": PamiStatusTone;
+    }
     interface PamiTextFieldAttributes {
         "reserveSupportingSpace": boolean;
         "label": string;
@@ -18484,6 +18775,7 @@ declare namespace LocalJSX {
         "pami-breadcrumbs": Omit<PamiBreadcrumbs, keyof PamiBreadcrumbsAttributes> & { [K in keyof PamiBreadcrumbs & keyof PamiBreadcrumbsAttributes]?: PamiBreadcrumbs[K] } & { [K in keyof PamiBreadcrumbs & keyof PamiBreadcrumbsAttributes as `attr:${K}`]?: PamiBreadcrumbsAttributes[K] } & { [K in keyof PamiBreadcrumbs & keyof PamiBreadcrumbsAttributes as `prop:${K}`]?: PamiBreadcrumbs[K] };
         "pami-button": Omit<PamiButton, keyof PamiButtonAttributes> & { [K in keyof PamiButton & keyof PamiButtonAttributes]?: PamiButton[K] } & { [K in keyof PamiButton & keyof PamiButtonAttributes as `attr:${K}`]?: PamiButtonAttributes[K] } & { [K in keyof PamiButton & keyof PamiButtonAttributes as `prop:${K}`]?: PamiButton[K] };
         "pami-button-group": Omit<PamiButtonGroup, keyof PamiButtonGroupAttributes> & { [K in keyof PamiButtonGroup & keyof PamiButtonGroupAttributes]?: PamiButtonGroup[K] } & { [K in keyof PamiButtonGroup & keyof PamiButtonGroupAttributes as `attr:${K}`]?: PamiButtonGroupAttributes[K] } & { [K in keyof PamiButtonGroup & keyof PamiButtonGroupAttributes as `prop:${K}`]?: PamiButtonGroup[K] };
+        "pami-callout": Omit<PamiCallout, keyof PamiCalloutAttributes> & { [K in keyof PamiCallout & keyof PamiCalloutAttributes]?: PamiCallout[K] } & { [K in keyof PamiCallout & keyof PamiCalloutAttributes as `attr:${K}`]?: PamiCalloutAttributes[K] } & { [K in keyof PamiCallout & keyof PamiCalloutAttributes as `prop:${K}`]?: PamiCallout[K] };
         "pami-card": Omit<PamiCard, keyof PamiCardAttributes> & { [K in keyof PamiCard & keyof PamiCardAttributes]?: PamiCard[K] } & { [K in keyof PamiCard & keyof PamiCardAttributes as `attr:${K}`]?: PamiCardAttributes[K] } & { [K in keyof PamiCard & keyof PamiCardAttributes as `prop:${K}`]?: PamiCard[K] };
         "pami-checkbox": Omit<PamiCheckbox, keyof PamiCheckboxAttributes> & { [K in keyof PamiCheckbox & keyof PamiCheckboxAttributes]?: PamiCheckbox[K] } & { [K in keyof PamiCheckbox & keyof PamiCheckboxAttributes as `attr:${K}`]?: PamiCheckboxAttributes[K] } & { [K in keyof PamiCheckbox & keyof PamiCheckboxAttributes as `prop:${K}`]?: PamiCheckbox[K] };
         "pami-chip": Omit<PamiChip, keyof PamiChipAttributes> & { [K in keyof PamiChip & keyof PamiChipAttributes]?: PamiChip[K] } & { [K in keyof PamiChip & keyof PamiChipAttributes as `attr:${K}`]?: PamiChipAttributes[K] } & { [K in keyof PamiChip & keyof PamiChipAttributes as `prop:${K}`]?: PamiChip[K] };
@@ -18506,6 +18798,7 @@ declare namespace LocalJSX {
         "pami-meter": Omit<PamiMeter, keyof PamiMeterAttributes> & { [K in keyof PamiMeter & keyof PamiMeterAttributes]?: PamiMeter[K] } & { [K in keyof PamiMeter & keyof PamiMeterAttributes as `attr:${K}`]?: PamiMeterAttributes[K] } & { [K in keyof PamiMeter & keyof PamiMeterAttributes as `prop:${K}`]?: PamiMeter[K] };
         "pami-multi-select": Omit<PamiMultiSelect, keyof PamiMultiSelectAttributes> & { [K in keyof PamiMultiSelect & keyof PamiMultiSelectAttributes]?: PamiMultiSelect[K] } & { [K in keyof PamiMultiSelect & keyof PamiMultiSelectAttributes as `attr:${K}`]?: PamiMultiSelectAttributes[K] } & { [K in keyof PamiMultiSelect & keyof PamiMultiSelectAttributes as `prop:${K}`]?: PamiMultiSelect[K] };
         "pami-navigation-bar": Omit<PamiNavigationBar, keyof PamiNavigationBarAttributes> & { [K in keyof PamiNavigationBar & keyof PamiNavigationBarAttributes]?: PamiNavigationBar[K] } & { [K in keyof PamiNavigationBar & keyof PamiNavigationBarAttributes as `attr:${K}`]?: PamiNavigationBarAttributes[K] } & { [K in keyof PamiNavigationBar & keyof PamiNavigationBarAttributes as `prop:${K}`]?: PamiNavigationBar[K] };
+        "pami-navigation-group": Omit<PamiNavigationGroup, keyof PamiNavigationGroupAttributes> & { [K in keyof PamiNavigationGroup & keyof PamiNavigationGroupAttributes]?: PamiNavigationGroup[K] } & { [K in keyof PamiNavigationGroup & keyof PamiNavigationGroupAttributes as `attr:${K}`]?: PamiNavigationGroupAttributes[K] } & { [K in keyof PamiNavigationGroup & keyof PamiNavigationGroupAttributes as `prop:${K}`]?: PamiNavigationGroup[K] };
         "pami-navigation-rail": Omit<PamiNavigationRail, keyof PamiNavigationRailAttributes> & { [K in keyof PamiNavigationRail & keyof PamiNavigationRailAttributes]?: PamiNavigationRail[K] } & { [K in keyof PamiNavigationRail & keyof PamiNavigationRailAttributes as `attr:${K}`]?: PamiNavigationRailAttributes[K] } & { [K in keyof PamiNavigationRail & keyof PamiNavigationRailAttributes as `prop:${K}`]?: PamiNavigationRail[K] };
         "pami-navigation-rail-tab": Omit<PamiNavigationRailTab, keyof PamiNavigationRailTabAttributes> & { [K in keyof PamiNavigationRailTab & keyof PamiNavigationRailTabAttributes]?: PamiNavigationRailTab[K] } & { [K in keyof PamiNavigationRailTab & keyof PamiNavigationRailTabAttributes as `attr:${K}`]?: PamiNavigationRailTabAttributes[K] } & { [K in keyof PamiNavigationRailTab & keyof PamiNavigationRailTabAttributes as `prop:${K}`]?: PamiNavigationRailTab[K] };
         "pami-navigation-tab": Omit<PamiNavigationTab, keyof PamiNavigationTabAttributes> & { [K in keyof PamiNavigationTab & keyof PamiNavigationTabAttributes]?: PamiNavigationTab[K] } & { [K in keyof PamiNavigationTab & keyof PamiNavigationTabAttributes as `attr:${K}`]?: PamiNavigationTabAttributes[K] } & { [K in keyof PamiNavigationTab & keyof PamiNavigationTabAttributes as `prop:${K}`]?: PamiNavigationTab[K] };
@@ -18548,6 +18841,7 @@ declare namespace LocalJSX {
         "pami-table-sort-label": Omit<PamiTableSortLabel, keyof PamiTableSortLabelAttributes> & { [K in keyof PamiTableSortLabel & keyof PamiTableSortLabelAttributes]?: PamiTableSortLabel[K] } & { [K in keyof PamiTableSortLabel & keyof PamiTableSortLabelAttributes as `attr:${K}`]?: PamiTableSortLabelAttributes[K] } & { [K in keyof PamiTableSortLabel & keyof PamiTableSortLabelAttributes as `prop:${K}`]?: PamiTableSortLabel[K] };
         "pami-table-toolbar": Omit<PamiTableToolbar, keyof PamiTableToolbarAttributes> & { [K in keyof PamiTableToolbar & keyof PamiTableToolbarAttributes]?: PamiTableToolbar[K] } & { [K in keyof PamiTableToolbar & keyof PamiTableToolbarAttributes as `attr:${K}`]?: PamiTableToolbarAttributes[K] } & { [K in keyof PamiTableToolbar & keyof PamiTableToolbarAttributes as `prop:${K}`]?: PamiTableToolbar[K] };
         "pami-tabs": Omit<PamiTabs, keyof PamiTabsAttributes> & { [K in keyof PamiTabs & keyof PamiTabsAttributes]?: PamiTabs[K] } & { [K in keyof PamiTabs & keyof PamiTabsAttributes as `attr:${K}`]?: PamiTabsAttributes[K] } & { [K in keyof PamiTabs & keyof PamiTabsAttributes as `prop:${K}`]?: PamiTabs[K] };
+        "pami-tag": Omit<PamiTag, keyof PamiTagAttributes> & { [K in keyof PamiTag & keyof PamiTagAttributes]?: PamiTag[K] } & { [K in keyof PamiTag & keyof PamiTagAttributes as `attr:${K}`]?: PamiTagAttributes[K] } & { [K in keyof PamiTag & keyof PamiTagAttributes as `prop:${K}`]?: PamiTag[K] };
         "pami-text-field": Omit<PamiTextField, keyof PamiTextFieldAttributes> & { [K in keyof PamiTextField & keyof PamiTextFieldAttributes]?: PamiTextField[K] } & { [K in keyof PamiTextField & keyof PamiTextFieldAttributes as `attr:${K}`]?: PamiTextFieldAttributes[K] } & { [K in keyof PamiTextField & keyof PamiTextFieldAttributes as `prop:${K}`]?: PamiTextField[K] };
         "pami-time-picker": Omit<PamiTimePicker, keyof PamiTimePickerAttributes> & { [K in keyof PamiTimePicker & keyof PamiTimePickerAttributes]?: PamiTimePicker[K] } & { [K in keyof PamiTimePicker & keyof PamiTimePickerAttributes as `attr:${K}`]?: PamiTimePickerAttributes[K] } & { [K in keyof PamiTimePicker & keyof PamiTimePickerAttributes as `prop:${K}`]?: PamiTimePicker[K] };
         "pami-toolbar": Omit<PamiToolbar, keyof PamiToolbarAttributes> & { [K in keyof PamiToolbar & keyof PamiToolbarAttributes]?: PamiToolbar[K] } & { [K in keyof PamiToolbar & keyof PamiToolbarAttributes as `attr:${K}`]?: PamiToolbarAttributes[K] } & { [K in keyof PamiToolbar & keyof PamiToolbarAttributes as `prop:${K}`]?: PamiToolbar[K] };
@@ -18659,6 +18953,14 @@ declare module "@stencil/core" {
             "pami-breadcrumbs": LocalJSX.IntrinsicElements["pami-breadcrumbs"] & JSXBase.HTMLAttributes<HTMLPamiBreadcrumbsElement>;
             "pami-button": LocalJSX.IntrinsicElements["pami-button"] & JSXBase.HTMLAttributes<HTMLPamiButtonElement>;
             "pami-button-group": LocalJSX.IntrinsicElements["pami-button-group"] & JSXBase.HTMLAttributes<HTMLPamiButtonGroupElement>;
+            /**
+             * An explanation or notification in the content flow.
+             * @tag pami-callout
+             * @csspart container - Message surface
+             * @csspart content - Heading and message
+             * @csspart actions - Action region
+             */
+            "pami-callout": LocalJSX.IntrinsicElements["pami-callout"] & JSXBase.HTMLAttributes<HTMLPamiCalloutElement>;
             "pami-card": LocalJSX.IntrinsicElements["pami-card"] & JSXBase.HTMLAttributes<HTMLPamiCardElement>;
             /**
              * `pami-checkbox` — Material Design 3 checkbox (with tri-state / indeterminate).
@@ -18766,6 +19068,13 @@ declare module "@stencil/core" {
              *   - {@link https://m3.material.io/components/navigation-bar/accessibility Accessibility}
              */
             "pami-navigation-bar": LocalJSX.IntrinsicElements["pami-navigation-bar"] & JSXBase.HTMLAttributes<HTMLPamiNavigationBarElement>;
+            /**
+             * A labelled section of navigation destinations. The label is not interactive.
+             * @tag pami-navigation-group
+             * @csspart label - Section label
+             * @csspart items - Destination container
+             */
+            "pami-navigation-group": LocalJSX.IntrinsicElements["pami-navigation-group"] & JSXBase.HTMLAttributes<HTMLPamiNavigationGroupElement>;
             /**
              * Material Design 3 — Navigation Rail
              * A vertical navigation surface for the left or right edge of medium / large
@@ -18784,10 +19093,16 @@ declare module "@stencil/core" {
              * active-indicator pill (56×32) around the icon, with an optional label
              * underneath (or inline when the parent rail is expanded). Supports badges,
              * disabled state, link mode (`href`) and slotted custom icons.
+             * @tag pami-navigation-rail-tab
+             * @fires pamiChildrenToggle - Disclosure changes independently of routing
+             * @csspart destination - Branch destination button or link
+             * @csspart disclosure - Branch disclosure button
+             * @csspart children - Inline or popup children region
+             * @csspart row - Parent destination and disclosure row
              * Spec:
-             *   - https://m3.material.io/components/navigation-rail/specs
-             *   - https://m3.material.io/components/navigation-rail/guidelines
-             *   - https://m3.material.io/components/navigation-rail/accessibility
+             * - https://m3.material.io/components/navigation-rail/specs
+             * - https://m3.material.io/components/navigation-rail/guidelines
+             * - https://m3.material.io/components/navigation-rail/accessibility
              */
             "pami-navigation-rail-tab": LocalJSX.IntrinsicElements["pami-navigation-rail-tab"] & JSXBase.HTMLAttributes<HTMLPamiNavigationRailTabElement>;
             /**
@@ -19196,6 +19511,13 @@ declare module "@stencil/core" {
              */
             "pami-table-toolbar": LocalJSX.IntrinsicElements["pami-table-toolbar"] & JSXBase.HTMLAttributes<HTMLPamiTableToolbarElement>;
             "pami-tabs": LocalJSX.IntrinsicElements["pami-tabs"] & JSXBase.HTMLAttributes<HTMLPamiTabsElement>;
+            /**
+             * A static status label. Text supplies the meaning; colour reinforces it.
+             * @tag pami-tag
+             * @csspart container - Label surface
+             * @csspart content - Status text
+             */
+            "pami-tag": LocalJSX.IntrinsicElements["pami-tag"] & JSXBase.HTMLAttributes<HTMLPamiTagElement>;
             "pami-text-field": LocalJSX.IntrinsicElements["pami-text-field"] & JSXBase.HTMLAttributes<HTMLPamiTextFieldElement>;
             "pami-time-picker": LocalJSX.IntrinsicElements["pami-time-picker"] & JSXBase.HTMLAttributes<HTMLPamiTimePickerElement>;
             /**