@oicl/openbridge-webcomponents-svelte 2.0.0-next.167 → 2.0.0-next.169

package/dist/ar/poi-card/ObcPoiCard.svelte

@@ -61,14 +61,15 @@ import type {ObcPoiCardHeaderVariant} from '@oicl/openbridge-webcomponents/dist/
      hasAlert?: boolean
    }
       export interface Events {
-    onCardClick?: (event: CustomEvent<PoiCardClickDetail>) => void
+    onCardClick?: (event: CustomEvent<PoiCardClickDetail>) => void;
+    onCloseClick?: (event: CustomEvent<void>) => void
   }
       export interface Slots {
   children?: Snippet;
   leadingIcon?: Snippet;
   poiIcon?: Snippet
 }
-      const {onCardClick, class: className, style, children, leadingIcon, poiIcon, ...props} = $props<Props & Events & Slots>();
+      const {onCardClick, onCloseClick, class: className, style, children, leadingIcon, poiIcon, ...props} = $props<Props & Events & Slots>();
       
 
     </script>
@@ -77,7 +78,7 @@ import type {ObcPoiCardHeaderVariant} from '@oicl/openbridge-webcomponents/dist/
     
     class={className}
     style={style}
-    use:forwardEvents={{'card-click': onCardClick}} >
+    use:forwardEvents={{'card-click': onCardClick, 'close-click': onCloseClick}} >
       
       {#if children}
         {@render children()}

package/dist/ar/poi-card/ObcPoiCard.svelte.d.ts

@@ -55,6 +55,7 @@ export interface Props {
 }
 export interface Events {
     onCardClick?: (event: CustomEvent<PoiCardClickDetail>) => void;
+    onCloseClick?: (event: CustomEvent<void>) => void;
 }
 export interface Slots {
     children?: Snippet;

package/dist/components/alert-list-details-experimental/ObcAlertListDetailsExperimental.svelte

@@ -12,6 +12,8 @@ import type {Alert} from '@oicl/openbridge-webcomponents/dist/types.js';
       export interface Props {
      class?: string;
      style?: string;
+     /** Accessible name of the list, mapped to the `aria-label` attribute and forwarded to its table. `aria-labelledby` is not supported: ID references cannot cross the shadow boundary. */
+     ariaLabel?: string | null;
      /** Which alerts to list. */
      filterMode?: FilterModes;
      /** Alerts to list. */

package/dist/components/alert-list-details-experimental/ObcAlertListDetailsExperimental.svelte.d.ts

@@ -5,6 +5,8 @@ import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
+    /** Accessible name of the list, mapped to the `aria-label` attribute and forwarded to its table. `aria-labelledby` is not supported: ID references cannot cross the shadow boundary. */
+    ariaLabel?: string | null;
     /** Which alerts to list. */
     filterMode?: FilterModes;
     /** Alerts to list. */

package/dist/components/alert-menu/ObcAlertMenu.svelte

@@ -10,6 +10,14 @@
       export interface Props {
      class?: string;
      style?: string;
+     /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+     softDismiss?: boolean;
+     /**
+      * Whether the menu is showing.
+      *
+      * Available when `softDismiss==true`.
+      */
+     open?: boolean;
      /** If true, displays the "Shelved" tab and enables shelving support for alerts. Set to false to hide the "Shelved" tab and related filtering. */
      hasShelved?: boolean;
      /** If true, enables the "ACK visible" button, allowing users to acknowledge all currently visible alerts in the active tab. Should be set to true only when there are unacknowledged alerts in view. */
@@ -22,7 +30,8 @@
       export interface Events {
     onAckAllVisibleClick?: (event: ObcAckAllVisibleClickEvent) => void;
     onSilenceClick?: (event: CustomEvent) => void;
-    onGoToAlertListClick?: (event: CustomEvent) => void
+    onGoToAlertListClick?: (event: CustomEvent) => void;
+    onClose?: (event: CustomEvent<void>) => void
   }
       export interface Slots {
   children?: Snippet;
@@ -30,7 +39,7 @@
   emptyDescription?: Snippet<[any]>;
   emptyIcon?: Snippet<[any]>
 }
-      const {onAckAllVisibleClick, onSilenceClick, onGoToAlertListClick, class: className, style, children, emptyTitle, emptyDescription, emptyIcon, ...props} = $props<Props & Events & Slots>();
+      const {onAckAllVisibleClick, onSilenceClick, onGoToAlertListClick, onClose, class: className, style, children, emptyTitle, emptyDescription, emptyIcon, ...props} = $props<Props & Events & Slots>();
       
 
     </script>
@@ -39,7 +48,7 @@
     
     class={className}
     style={style}
-    use:forwardEvents={{'ack-all-visible-click': onAckAllVisibleClick, 'silence-click': onSilenceClick, 'go-to-alert-list-click': onGoToAlertListClick}} >
+    use:forwardEvents={{'ack-all-visible-click': onAckAllVisibleClick, 'silence-click': onSilenceClick, 'go-to-alert-list-click': onGoToAlertListClick, 'close': onClose}} >
       
       {#if children}
         {@render children()}

package/dist/components/alert-menu/ObcAlertMenu.svelte.d.ts

@@ -4,6 +4,14 @@ import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
+    /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+    softDismiss?: boolean;
+    /**
+     * Whether the menu is showing.
+     *
+     * Available when `softDismiss==true`.
+     */
+    open?: boolean;
     /** If true, displays the "Shelved" tab and enables shelving support for alerts. Set to false to hide the "Shelved" tab and related filtering. */
     hasShelved?: boolean;
     /** If true, enables the "ACK visible" button, allowing users to acknowledge all currently visible alerts in the active tab. Should be set to true only when there are unacknowledged alerts in view. */
@@ -17,6 +25,7 @@ export interface Events {
     onAckAllVisibleClick?: (event: ObcAckAllVisibleClickEvent) => void;
     onSilenceClick?: (event: CustomEvent) => void;
     onGoToAlertListClick?: (event: CustomEvent) => void;
+    onClose?: (event: CustomEvent<void>) => void;
 }
 export interface Slots {
     children?: Snippet;

package/dist/components/app-menu/ObcAppMenu.svelte

@@ -9,15 +9,23 @@
       export interface Props {
      class?: string;
      style?: string;
-     
+     /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+     softDismiss?: boolean;
+     /**
+      * Whether the menu is showing.
+      *
+      * Available when `softDismiss==true`.
+      */
+     open?: boolean
    }
       export interface Events {
-    onSearch?: (event: CustomEvent<string>) => void
+    onSearch?: (event: CustomEvent<string>) => void;
+    onClose?: (event: CustomEvent<void>) => void
   }
       export interface Slots {
   children?: Snippet
 }
-      const {onSearch, class: className, style, children, ...props} = $props<Props & Events & Slots>();
+      const {onSearch, onClose, class: className, style, children, ...props} = $props<Props & Events & Slots>();
       
 
     </script>
@@ -26,7 +34,7 @@
     
     class={className}
     style={style}
-    use:forwardEvents={{'search': onSearch}} >
+    use:forwardEvents={{'search': onSearch, 'close': onClose}} >
       
       {#if children}
         {@render children()}

package/dist/components/app-menu/ObcAppMenu.svelte.d.ts

@@ -3,9 +3,18 @@ import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
+    /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+    softDismiss?: boolean;
+    /**
+     * Whether the menu is showing.
+     *
+     * Available when `softDismiss==true`.
+     */
+    open?: boolean;
 }
 export interface Events {
     onSearch?: (event: CustomEvent<string>) => void;
+    onClose?: (event: CustomEvent<void>) => void;
 }
 export interface Slots {
     children?: Snippet;

package/dist/components/brilliance-menu/ObcBrillianceMenu.svelte

@@ -10,6 +10,14 @@
       export interface Props {
      class?: string;
      style?: string;
+     /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+     softDismiss?: boolean;
+     /**
+      * Whether the menu is showing.
+      *
+      * Available when `softDismiss==true`.
+      */
+     open?: boolean;
      /** The currently selected palette. Possible values: `'night'`, `'dusk'`, `'day'`, `'bright'`. Defaults to `'day'`. */
      palette?: ObcPalette;
      /** The current brightness value (0–100). Defaults to `50`. */
@@ -48,12 +56,13 @@
     onBrightnessChanged?: (event: ObcBrightnessChangeEvent) => void;
     onLinkPaletteChanged?: (event: ObcLinkPaletteChangeEvent) => void;
     onLinkBrightnessChanged?: (event: ObcLinkBrightnessChangeEvent) => void;
-    onScreenControlLinkClicked?: (event: CustomEvent) => void
+    onScreenControlLinkClicked?: (event: CustomEvent) => void;
+    onClose?: (event: CustomEvent<void>) => void
   }
       export interface Slots {
   additionalScreenControls?: Snippet
 }
-      const {onPaletteChanged, onBrightnessChanged, onLinkPaletteChanged, onLinkBrightnessChanged, onScreenControlLinkClicked, class: className, style, additionalScreenControls, ...props} = $props<Props & Events & Slots>();
+      const {onPaletteChanged, onBrightnessChanged, onLinkPaletteChanged, onLinkBrightnessChanged, onScreenControlLinkClicked, onClose, class: className, style, additionalScreenControls, ...props} = $props<Props & Events & Slots>();
       
 
     </script>
@@ -62,7 +71,7 @@
     
     class={className}
     style={style}
-    use:forwardEvents={{'palette-changed': onPaletteChanged, 'brightness-changed': onBrightnessChanged, 'link-palette-changed': onLinkPaletteChanged, 'link-brightness-changed': onLinkBrightnessChanged, 'screen-control-link-clicked': onScreenControlLinkClicked}} >
+    use:forwardEvents={{'palette-changed': onPaletteChanged, 'brightness-changed': onBrightnessChanged, 'link-palette-changed': onLinkPaletteChanged, 'link-brightness-changed': onLinkBrightnessChanged, 'screen-control-link-clicked': onScreenControlLinkClicked, 'close': onClose}} >
       
       {#if additionalScreenControls}
         <NamedSlot name="additional-screen-controls" content={additionalScreenControls} />

package/dist/components/brilliance-menu/ObcBrillianceMenu.svelte.d.ts

@@ -4,6 +4,14 @@ import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
+    /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+    softDismiss?: boolean;
+    /**
+     * Whether the menu is showing.
+     *
+     * Available when `softDismiss==true`.
+     */
+    open?: boolean;
     /** The currently selected palette. Possible values: `'night'`, `'dusk'`, `'day'`, `'bright'`. Defaults to `'day'`. */
     palette?: ObcPalette;
     /** The current brightness value (0–100). Defaults to `50`. */
@@ -43,6 +51,7 @@ export interface Events {
     onLinkPaletteChanged?: (event: ObcLinkPaletteChangeEvent) => void;
     onLinkBrightnessChanged?: (event: ObcLinkBrightnessChangeEvent) => void;
     onScreenControlLinkClicked?: (event: CustomEvent) => void;
+    onClose?: (event: CustomEvent<void>) => void;
 }
 export interface Slots {
     additionalScreenControls?: Snippet;

package/dist/components/calendar/ObcCalendar.svelte

@@ -27,12 +27,13 @@
     onDateSelect?: (event: CustomEvent<{date: Date, events: CalendarEvent[]}>) => void;
     onTodayClick?: (event: CustomEvent<void>) => void;
     onNewEventClick?: (event: CustomEvent<void>) => void;
-    onCalendarClick?: (event: CustomEvent<void>) => void
+    onCalendarClick?: (event: CustomEvent<void>) => void;
+    onEventClick?: (event: CustomEvent<{title: string, startTime: string, endTime: string}>) => void
   }
       export interface Slots {
   children?: Snippet
 }
-      const {onMonthChange, onDateSelect, onTodayClick, onNewEventClick, onCalendarClick, class: className, style, children, ...props} = $props<Props & Events & Slots>();
+      const {onMonthChange, onDateSelect, onTodayClick, onNewEventClick, onCalendarClick, onEventClick, class: className, style, children, ...props} = $props<Props & Events & Slots>();
       
 
     </script>
@@ -41,7 +42,7 @@
     
     class={className}
     style={style}
-    use:forwardEvents={{'month-change': onMonthChange, 'date-select': onDateSelect, 'today-click': onTodayClick, 'new-event-click': onNewEventClick, 'calendar-click': onCalendarClick}} >
+    use:forwardEvents={{'month-change': onMonthChange, 'date-select': onDateSelect, 'today-click': onTodayClick, 'new-event-click': onNewEventClick, 'calendar-click': onCalendarClick, 'event-click': onEventClick}} >
       
     {#if children}
       {@render children()}

package/dist/components/calendar/ObcCalendar.svelte.d.ts

@@ -28,6 +28,11 @@ export interface Events {
     onTodayClick?: (event: CustomEvent<void>) => void;
     onNewEventClick?: (event: CustomEvent<void>) => void;
     onCalendarClick?: (event: CustomEvent<void>) => void;
+    onEventClick?: (event: CustomEvent<{
+        title: string;
+        startTime: string;
+        endTime: string;
+    }>) => void;
 }
 export interface Slots {
     children?: Snippet;

package/dist/components/command-menu/ObcCommandMenu.svelte

@@ -10,13 +10,22 @@
       export interface Props {
      class?: string;
      style?: string;
+     /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+     softDismiss?: boolean;
+     /**
+      * Whether the menu is showing.
+      *
+      * Available when `softDismiss==true`.
+      */
+     open?: boolean;
      /** Whether the menu is in the "in command" state. Controls the toggle and visual state. */
      inCommand?: boolean;
      /** Whether to display the location slot. If false, the location is omitted from the menu. */
      showLocation?: boolean
    }
       export interface Events {
-    onChange?: (event: CustomEvent<{inCommand: boolean}>) => void
+    onChange?: (event: CustomEvent<{inCommand: boolean}>) => void;
+    onClose?: (event: CustomEvent<void>) => void
   }
       export interface Slots {
   commandIcon?: Snippet;
@@ -29,7 +38,7 @@
   toogleStateNoCommandLabel?: Snippet;
   toogleStateInCommandIcon?: Snippet
 }
-      const {onChange, class: className, style, commandIcon, commandStatus, commandDescription, commandLocation, toogleActionToInCommandLabel, toogleActionToNoCommandLabel, toogleStateInCommandLabel, toogleStateNoCommandLabel, toogleStateInCommandIcon, ...props} = $props<Props & Events & Slots>();
+      const {onChange, onClose, class: className, style, commandIcon, commandStatus, commandDescription, commandLocation, toogleActionToInCommandLabel, toogleActionToNoCommandLabel, toogleStateInCommandLabel, toogleStateNoCommandLabel, toogleStateInCommandIcon, ...props} = $props<Props & Events & Slots>();
       
 
     </script>
@@ -38,7 +47,7 @@
     
     class={className}
     style={style}
-    use:forwardEvents={{'change': onChange}} >
+    use:forwardEvents={{'change': onChange, 'close': onClose}} >
       
       {#if commandIcon}
         <NamedSlot name="command-icon" content={commandIcon} />

package/dist/components/command-menu/ObcCommandMenu.svelte.d.ts

@@ -3,6 +3,14 @@ import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
+    /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+    softDismiss?: boolean;
+    /**
+     * Whether the menu is showing.
+     *
+     * Available when `softDismiss==true`.
+     */
+    open?: boolean;
     /** Whether the menu is in the "in command" state. Controls the toggle and visual state. */
     inCommand?: boolean;
     /** Whether to display the location slot. If false, the location is omitted from the menu. */
@@ -12,6 +20,7 @@ export interface Events {
     onChange?: (event: CustomEvent<{
         inCommand: boolean;
     }>) => void;
+    onClose?: (event: CustomEvent<void>) => void;
 }
 export interface Slots {
     commandIcon?: Snippet;

package/dist/components/context-menu-input/ObcContextMenuInput.svelte

@@ -9,6 +9,14 @@
       export interface Props {
      class?: string;
      style?: string;
+     /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+     softDismiss?: boolean;
+     /**
+      * Whether the menu is showing.
+      *
+      * Available when `softDismiss==true`.
+      */
+     open?: boolean;
      /** Menu variant: `regular` (default) is a single-select navigation menu, `checkboxes` and `nested-checkboxes` are flat and hierarchical multi-select, `flyout` has expandable cascading groups, and `multi` and `multi-with-subtitles` lay the menu out in columns, the latter with group subtitles. */
      type?: ContextMenuType;
      /** Menu options, each with a unique `value` and a `label`, and optionally an `icon` template for the leading icon, a `level` giving the nesting depth for nested checkboxes, and `children` for a flyout or nested menu. */

package/dist/components/context-menu-input/ObcContextMenuInput.svelte.d.ts

@@ -4,6 +4,14 @@ import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
+    /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+    softDismiss?: boolean;
+    /**
+     * Whether the menu is showing.
+     *
+     * Available when `softDismiss==true`.
+     */
+    open?: boolean;
     /** Menu variant: `regular` (default) is a single-select navigation menu, `checkboxes` and `nested-checkboxes` are flat and hierarchical multi-select, `flyout` has expandable cascading groups, and `multi` and `multi-with-subtitles` lay the menu out in columns, the latter with group subtitles. */
     type?: ContextMenuType;
     /** Menu options, each with a unique `value` and a `label`, and optionally an `icon` template for the leading icon, a `level` giving the nesting depth for nested checkboxes, and `children` for a flyout or nested menu. */

package/dist/components/date-item/ObcDateItem.svelte

@@ -27,12 +27,13 @@ import type {DateItemSize} from '@oicl/openbridge-webcomponents/dist/components/
 date?: number
    }
       export interface Events {
-    onDateClick?: (event: CustomEvent<{date: number, events: DateItemEvent[], isToday: boolean, checked: boolean}>) => void
+    onDateClick?: (event: CustomEvent<{date: number, events: DateItemEvent[], isToday: boolean, checked: boolean}>) => void;
+    onEventClick?: (event: CustomEvent<{title: string, startTime: string, endTime: string}>) => void
   }
       export interface Slots {
   children?: Snippet
 }
-      const {onDateClick, class: className, style, children, ...props} = $props<Props & Events & Slots>();
+      const {onDateClick, onEventClick, class: className, style, children, ...props} = $props<Props & Events & Slots>();
       
 
     </script>
@@ -41,7 +42,7 @@ date?: number
     
     class={className}
     style={style}
-    use:forwardEvents={{'date-click': onDateClick}} >
+    use:forwardEvents={{'date-click': onDateClick, 'event-click': onEventClick}} >
       
       {#if children}
         {@render children()}

package/dist/components/date-item/ObcDateItem.svelte.d.ts

@@ -27,6 +27,11 @@ export interface Events {
         isToday: boolean;
         checked: boolean;
     }>) => void;
+    onEventClick?: (event: CustomEvent<{
+        title: string;
+        startTime: string;
+        endTime: string;
+    }>) => void;
 }
 export interface Slots {
     children?: Snippet;

package/dist/components/event-list/ObcEventList.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {DateItemEvent} from '@oicl/openbridge-webcomponents/dist/components/event-item/event-item.js';
       import '@oicl/openbridge-webcomponents/dist/components/event-list/event-list.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {DateItemEvent} from '@oicl/openbridge-webcomponents/dist/components/event-item/event-item.js';
       import type { Snippet } from 'svelte';
 
@@ -19,12 +19,12 @@
      locale?: string | undefined
    }
       export interface Events {
-    
+    onEventClick?: (event: CustomEvent<{title: string, startTime: string, endTime: string}>) => void
   }
       export interface Slots {
   children?: Snippet
 }
-      const { class: className, style, children, ...props} = $props<Props & Events & Slots>();
+      const {onEventClick, class: className, style, children, ...props} = $props<Props & Events & Slots>();
       
 
     </script>
@@ -33,7 +33,7 @@
     
     class={className}
     style={style}
-     >
+    use:forwardEvents={{'event-click': onEventClick}} >
       
       {#if children}
         {@render children()}

package/dist/components/event-list/ObcEventList.svelte.d.ts

@@ -14,6 +14,11 @@ export interface Props {
     locale?: string | undefined;
 }
 export interface Events {
+    onEventClick?: (event: CustomEvent<{
+        title: string;
+        startTime: string;
+        endTime: string;
+    }>) => void;
 }
 export interface Slots {
     children?: Snippet;

package/dist/components/icon-button/ObcIconButton.svelte

@@ -30,6 +30,8 @@
      hasLabel?: boolean;
      /** If false, and cornerLeft or cornerRight is true, the divider is not shown. */
      showDivider?: boolean;
+     /** Whether the button is in the tab sequence. Turn it off for a button inside a composite widget that owns the tab stop, and give the widget a key for the action. */
+     focusable?: boolean;
      /** Accessible name forwarded to the inner `<button>`, mapped to the `aria-label` attribute. `aria-labelledby` is not supported: ID references cannot cross the shadow boundary. */
      ariaLabel?: string | null
    }

package/dist/components/icon-button/ObcIconButton.svelte.d.ts

@@ -24,6 +24,8 @@ export interface Props {
     hasLabel?: boolean;
     /** If false, and cornerLeft or cornerRight is true, the divider is not shown. */
     showDivider?: boolean;
+    /** Whether the button is in the tab sequence. Turn it off for a button inside a composite widget that owns the tab stop, and give the widget a key for the action. */
+    focusable?: boolean;
     /** Accessible name forwarded to the inner `<button>`, mapped to the `aria-label` attribute. `aria-labelledby` is not supported: ID references cannot cross the shadow boundary. */
     ariaLabel?: string | null;
 }

package/dist/components/navigation-menu/ObcNavigationMenu.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcNavigationMenuVariant, ObcNavigationMenuFlyoutVariant} from '@oicl/openbridge-webcomponents/dist/components/navigation-menu/navigation-menu.js';
       import '@oicl/openbridge-webcomponents/dist/components/navigation-menu/navigation-menu.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import NamedSlot from "../../NamedSlot.svelte";
       import type {ObcNavigationMenuVariant, ObcNavigationMenuFlyoutVariant} from '@oicl/openbridge-webcomponents/dist/components/navigation-menu/navigation-menu.js';
       import type { Snippet } from 'svelte';
@@ -10,6 +10,14 @@
       export interface Props {
      class?: string;
      style?: string;
+     /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+     softDismiss?: boolean;
+     /**
+      * Whether the menu is showing.
+      *
+      * Available when `softDismiss==true`.
+      */
+     open?: boolean;
      /** Visual style and layout: `full` (default) shows icons and labels, `icon-only` is the compact icon-only menu and takes no flyouts or groups, `icon-only-large` is the icon-only menu that does, `compact` is the space-saving menu, and `tree` expands groups inline and indents rows by depth. */
      variant?: ObcNavigationMenuVariant;
      /**
@@ -22,14 +30,14 @@
      smallScreen?: boolean
    }
       export interface Events {
-    
+    onClose?: (event: CustomEvent<void>) => void
   }
       export interface Slots {
   main?: Snippet;
   footer?: Snippet;
   logo?: Snippet
 }
-      const { class: className, style, main, footer, logo, ...props} = $props<Props & Events & Slots>();
+      const {onClose, class: className, style, main, footer, logo, ...props} = $props<Props & Events & Slots>();
       
 
     </script>
@@ -38,7 +46,7 @@
     
     class={className}
     style={style}
-     >
+    use:forwardEvents={{'close': onClose}} >
       
       {#if main}
         <NamedSlot name="main" content={main} />

package/dist/components/navigation-menu/ObcNavigationMenu.svelte.d.ts

@@ -4,6 +4,14 @@ import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
+    /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+    softDismiss?: boolean;
+    /**
+     * Whether the menu is showing.
+     *
+     * Available when `softDismiss==true`.
+     */
+    open?: boolean;
     /** Visual style and layout: `full` (default) shows icons and labels, `icon-only` is the compact icon-only menu and takes no flyouts or groups, `icon-only-large` is the icon-only menu that does, `compact` is the space-saving menu, and `tree` expands groups inline and indents rows by depth. */
     variant?: ObcNavigationMenuVariant;
     /**
@@ -16,6 +24,7 @@ export interface Props {
     smallScreen?: boolean;
 }
 export interface Events {
+    onClose?: (event: CustomEvent<void>) => void;
 }
 export interface Slots {
     main?: Snippet;

package/dist/components/system-menu/ObcSystemMenu.svelte

@@ -10,6 +10,14 @@
       export interface Props {
      class?: string;
      style?: string;
+     /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+     softDismiss?: boolean;
+     /**
+      * Whether the menu is showing.
+      *
+      * Available when `softDismiss==true`.
+      */
+     open?: boolean;
      wifiState?: WifiState | undefined;
      audioState?: AudioState | undefined;
      microphoneState?: MicrophoneState | undefined;
@@ -35,12 +43,13 @@
     onSettingsClick?: (event: CustomEvent<unknown>) => void;
     onToSubMenuClick?: (event: CustomEvent<unknown>) => void;
     onWifiOptionsClick?: (event: CustomEvent<unknown>) => void;
-    onWifiDisconnectClick?: (event: CustomEvent<unknown>) => void
+    onWifiDisconnectClick?: (event: CustomEvent<unknown>) => void;
+    onClose?: (event: CustomEvent<void>) => void
   }
       export interface Slots {
   batteryStatus?: Snippet
 }
-      const {onWifiClick, onAudioClick, onAudioVolumeChange, onMicrophoneClick, onPushToTalkChange, onBatteryUsageClick, onBatterySavingModeChange, onBatteryModeChange, onWifiNetworkChange, onAudioOutputChange, onMicrophoneInputChange, onSettingsClick, onToSubMenuClick, onWifiOptionsClick, onWifiDisconnectClick, class: className, style, batteryStatus, ...props} = $props<Props & Events & Slots>();
+      const {onWifiClick, onAudioClick, onAudioVolumeChange, onMicrophoneClick, onPushToTalkChange, onBatteryUsageClick, onBatterySavingModeChange, onBatteryModeChange, onWifiNetworkChange, onAudioOutputChange, onMicrophoneInputChange, onSettingsClick, onToSubMenuClick, onWifiOptionsClick, onWifiDisconnectClick, onClose, class: className, style, batteryStatus, ...props} = $props<Props & Events & Slots>();
       
 
     </script>
@@ -49,7 +58,7 @@
     
     class={className}
     style={style}
-    use:forwardEvents={{'wifi-click': onWifiClick, 'audio-click': onAudioClick, 'audio-volume-change': onAudioVolumeChange, 'microphone-click': onMicrophoneClick, 'push-to-talk-change': onPushToTalkChange, 'battery-usage-click': onBatteryUsageClick, 'battery-saving-mode-change': onBatterySavingModeChange, 'battery-mode-change': onBatteryModeChange, 'wifi-network-change': onWifiNetworkChange, 'audio-output-change': onAudioOutputChange, 'microphone-input-change': onMicrophoneInputChange, 'settings-click': onSettingsClick, 'to-sub-menu-click': onToSubMenuClick, 'wifi-options-click': onWifiOptionsClick, 'wifi-disconnect-click': onWifiDisconnectClick}} >
+    use:forwardEvents={{'wifi-click': onWifiClick, 'audio-click': onAudioClick, 'audio-volume-change': onAudioVolumeChange, 'microphone-click': onMicrophoneClick, 'push-to-talk-change': onPushToTalkChange, 'battery-usage-click': onBatteryUsageClick, 'battery-saving-mode-change': onBatterySavingModeChange, 'battery-mode-change': onBatteryModeChange, 'wifi-network-change': onWifiNetworkChange, 'audio-output-change': onAudioOutputChange, 'microphone-input-change': onMicrophoneInputChange, 'settings-click': onSettingsClick, 'to-sub-menu-click': onToSubMenuClick, 'wifi-options-click': onWifiOptionsClick, 'wifi-disconnect-click': onWifiDisconnectClick, 'close': onClose}} >
       
       {#if batteryStatus}
         <NamedSlot name="battery-status" content={batteryStatus} />

package/dist/components/system-menu/ObcSystemMenu.svelte.d.ts

@@ -4,6 +4,14 @@ import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
+    /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+    softDismiss?: boolean;
+    /**
+     * Whether the menu is showing.
+     *
+     * Available when `softDismiss==true`.
+     */
+    open?: boolean;
     wifiState?: WifiState | undefined;
     audioState?: AudioState | undefined;
     microphoneState?: MicrophoneState | undefined;
@@ -30,6 +38,7 @@ export interface Events {
     onToSubMenuClick?: (event: CustomEvent<unknown>) => void;
     onWifiOptionsClick?: (event: CustomEvent<unknown>) => void;
     onWifiDisconnectClick?: (event: CustomEvent<unknown>) => void;
+    onClose?: (event: CustomEvent<void>) => void;
 }
 export interface Slots {
     batteryStatus?: Snippet;

package/dist/components/tab-item/ObcTabItem.svelte

@@ -43,6 +43,8 @@
      disabled?: boolean;
      /** Whether the tab is in the tab order. `obc-tab-row` manages this as a roving tabindex (one tab focusable at a time); a standalone tab stays tabbable. */
      focusable?: boolean;
+     /** The panel this tab shows, announced as the tab's `aria-controls`. `obc-tab-row` sets it when it renders panels; the panel has to live in this tab's tree or one it sits inside. */
+     panel?: Element | null;
      /** Available when `hasBadge==true`. */
      badgeType?: string;
      /** Available when `hasBadge==true`. */

package/dist/components/tab-item/ObcTabItem.svelte.d.ts

@@ -37,6 +37,8 @@ export interface Props {
     disabled?: boolean;
     /** Whether the tab is in the tab order. `obc-tab-row` manages this as a roving tabindex (one tab focusable at a time); a standalone tab stays tabbable. */
     focusable?: boolean;
+    /** The panel this tab shows, announced as the tab's `aria-controls`. `obc-tab-row` sets it when it renders panels; the panel has to live in this tab's tree or one it sits inside. */
+    panel?: Element | null;
     /** Available when `hasBadge==true`. */
     badgeType?: string;
     /** Available when `hasBadge==true`. */

package/dist/components/tab-row/ObcTabRow.svelte

@@ -22,7 +22,11 @@
      /** Whether to display subtitle text for each tab. Individual tabs can override this with `tab.showSubtitle`. */
      showSubtitle?: boolean;
      /** Whether to display an "add new tab" button at the end of the tab row. When clicked, emits the `add-new-tab` event. */
-     hasAddNewTab?: boolean
+     hasAddNewTab?: boolean;
+     /** Renders one panel per tab from its `tab-<id>-panel` slot, shows the selected one, and links each tab to its panel for assistive technology. */
+     hasPanels?: boolean;
+     /** Accessible name of the tab list, read out before its tabs. */
+     label?: string
    }
       export interface Events {
     onTabSelected?: (event: CustomEvent<{tab: TabData, id: string, index: number}>) => void;
@@ -31,9 +35,10 @@
   }
       export interface Slots {
   tabIcon?: Snippet<[any]>;
-  tab?: Snippet<[any]>
+  tab?: Snippet<[any]>;
+  tabPanel?: Snippet<[any]>
 }
-      const {onTabSelected, onTabClosed, onAddNewTab, class: className, style, tabIcon, tab, ...props} = $props<Props & Events & Slots>();
+      const {onTabSelected, onTabClosed, onAddNewTab, class: className, style, tabIcon, tab, tabPanel, ...props} = $props<Props & Events & Slots>();
       
 
     </script>
@@ -55,4 +60,10 @@
           <NamedSlot name="tab-{item.id}-<iconSlotName>" content={tab} arg={item} />
         {/each}
       {/if}
+
+      {#if props.tabs && tabPanel}
+        {#each props.tabs as item}
+          <NamedSlot name="tab-{item.id}-panel" content={tabPanel} arg={item} />
+        {/each}
+      {/if}
     </obc-tab-row>

package/dist/components/tab-row/ObcTabRow.svelte.d.ts

@@ -17,6 +17,10 @@ export interface Props {
     showSubtitle?: boolean;
     /** Whether to display an "add new tab" button at the end of the tab row. When clicked, emits the `add-new-tab` event. */
     hasAddNewTab?: boolean;
+    /** Renders one panel per tab from its `tab-<id>-panel` slot, shows the selected one, and links each tab to its panel for assistive technology. */
+    hasPanels?: boolean;
+    /** Accessible name of the tab list, read out before its tabs. */
+    label?: string;
 }
 export interface Events {
     onTabSelected?: (event: CustomEvent<{
@@ -34,6 +38,7 @@ export interface Events {
 export interface Slots {
     tabIcon?: Snippet<[any]>;
     tab?: Snippet<[any]>;
+    tabPanel?: Snippet<[any]>;
 }
 type $$ComponentProps = Props & Events & Slots;
 declare const ObcTabRow: import("svelte").Component<$$ComponentProps, {

package/dist/components/table/ObcTable.svelte

@@ -9,6 +9,8 @@
       export interface Props {
      class?: string;
      style?: string;
+     /** Accessible name of the table, mapped to the `aria-label` attribute and forwarded to the grid. `aria-labelledby` is not supported: ID references cannot cross the shadow boundary. */
+     ariaLabel?: string | null;
      data?: ObcTableRow[];
      columns?: ObcTableColumn<ObcTableCellData, ObcTableRow>[];
      rowDivider?: boolean;

package/dist/components/table/ObcTable.svelte.d.ts

@@ -4,6 +4,8 @@ import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
+    /** Accessible name of the table, mapped to the `aria-label` attribute and forwarded to the grid. `aria-labelledby` is not supported: ID references cannot cross the shadow boundary. */
+    ariaLabel?: string | null;
     data?: ObcTableRow[];
     columns?: ObcTableColumn<ObcTableCellData, ObcTableRow>[];
     rowDivider?: boolean;

package/dist/components/user-menu/ObcUserMenu.svelte

@@ -10,6 +10,14 @@
       export interface Props {
      class?: string;
      style?: string;
+     /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+     softDismiss?: boolean;
+     /**
+      * Whether the menu is showing.
+      *
+      * Available when `softDismiss==true`.
+      */
+     open?: boolean;
      /** Controls the visual layout of the user menu. */
      type?: ObcUserMenuType;
      /** Controls the overall size of the user menu. */
@@ -100,12 +108,13 @@
     onSignOutClick?: (event: CustomEvent<void>) => void;
     onUseAnotherAccountClick?: (event: CustomEvent<void>) => void;
     onSignedInActionClick?: (event: CustomEvent<{id: string, label: string}>) => void;
-    onRecentUserClick?: (event: ObcUserMenuRecentUserClickEvent) => void
+    onRecentUserClick?: (event: ObcUserMenuRecentUserClickEvent) => void;
+    onClose?: (event: CustomEvent<void>) => void
   }
       export interface Slots {
   signedInActionIcon?: Snippet<[any]>
 }
-      const {onSignInClick, onSignOutClick, onUseAnotherAccountClick, onSignedInActionClick, onRecentUserClick, class: className, style, signedInActionIcon, ...props} = $props<Props & Events & Slots>();
+      const {onSignInClick, onSignOutClick, onUseAnotherAccountClick, onSignedInActionClick, onRecentUserClick, onClose, class: className, style, signedInActionIcon, ...props} = $props<Props & Events & Slots>();
       
 
     </script>
@@ -114,7 +123,7 @@
     
     class={className}
     style={style}
-    use:forwardEvents={{'sign-in-click': onSignInClick, 'sign-out-click': onSignOutClick, 'use-another-account-click': onUseAnotherAccountClick, 'signed-in-action-click': onSignedInActionClick, 'recent-user-click': onRecentUserClick}} >
+    use:forwardEvents={{'sign-in-click': onSignInClick, 'sign-out-click': onSignOutClick, 'use-another-account-click': onUseAnotherAccountClick, 'signed-in-action-click': onSignedInActionClick, 'recent-user-click': onRecentUserClick, 'close': onClose}} >
       
       {#if signedInActionIcon}
         <NamedSlot name="signed-in-action-icon-<id>" content={signedInActionIcon} />

package/dist/components/user-menu/ObcUserMenu.svelte.d.ts

@@ -4,6 +4,14 @@ import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
+    /** Let the browser close this menu on its own: on a click outside it, on `Escape`, or when another menu opens. Leave it off to keep showing and hiding the menu yourself. */
+    softDismiss?: boolean;
+    /**
+     * Whether the menu is showing.
+     *
+     * Available when `softDismiss==true`.
+     */
+    open?: boolean;
     /** Controls the visual layout of the user menu. */
     type?: ObcUserMenuType;
     /** Controls the overall size of the user menu. */
@@ -101,6 +109,7 @@ export interface Events {
         label: string;
     }>) => void;
     onRecentUserClick?: (event: ObcUserMenuRecentUserClickEvent) => void;
+    onClose?: (event: CustomEvent<void>) => void;
 }
 export interface Slots {
     signedInActionIcon?: Snippet<[any]>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oicl/openbridge-webcomponents-svelte",
-  "version": "2.0.0-next.167",
+  "version": "2.0.0-next.169",
   "scripts": {
     "dev": "vite dev",
     "build": "vite build && npm run prepack",
@@ -34,7 +34,7 @@
     }
   },
   "dependencies": {
-    "@oicl/openbridge-webcomponents": "^2.0.0-next.167"
+    "@oicl/openbridge-webcomponents": "^2.0.0-next.169"
   },
   "peerDependencies": {
     "svelte": "^5.0.0"