@oicl/openbridge-webcomponents-svelte 2.0.0-next.15 → 2.0.0-next.150

package/dist/components/notification-message-item/ObcNotificationMessageItem.svelte

@@ -2,27 +2,43 @@
   <script lang="ts">
     export type {ObcNotificationMessageItemType, ObcNotificationMessageItemSize} from '@oicl/openbridge-webcomponents/dist/components/notification-message-item/notification-message-item.js';
       import '@oicl/openbridge-webcomponents/dist/components/notification-message-item/notification-message-item.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcNotificationMessageItemType, ObcNotificationMessageItemSize} from '@oicl/openbridge-webcomponents/dist/components/notification-message-item/notification-message-item.js';
       import type { Snippet } from 'svelte';
 
       export interface Props {
      class?: string;
      style?: string;
-      /** Title or heading for the notification.
-Shown in the title slot if `hasTitle` is true. */
-title?: string;
-      /** Detailed message text for the notification.
-Shown in the description slot if `hasDescription` is true. */
-description?: string;
-      /** Primary timestamp to display (e.g., "09:12:46").
-Shown in the time slot if `hasTimestamp` is true. */
-time?: string;
-      /** Secondary timestamp (e.g., relative time like "2m ago").
-Shown in the time-secondary slot if `hasTimestamp2` is true. */
-timeSecondary?: string;
-      /** Label for the action button (used when `actionType` is "button"). */
-actionLabel?: string;
+     /**
+      * Title or heading for the notification. Shown in the title slot if `showTitle` is true.
+      *
+      * Available when `showTitle==true && type!=Inactive && empty==false`.
+      */
+     title?: string;
+     /**
+      * Detailed message text for the notification. Shown in the description slot if `showDescription` is true.
+      *
+      * Available when `showDescription==true && type!=Inactive && empty==false`.
+      */
+     description?: string;
+     /**
+      * Primary timestamp to display (e.g., "09:12:46"). Shown in the time slot if `showTimestamp` is true.
+      *
+      * Available when `showTimestamp==true && type!=Inactive && empty==false`.
+      */
+     time?: string;
+     /**
+      * Secondary timestamp (e.g., relative time like "2m ago"). Shown in the time-secondary slot if `hasTimestamp2` is true.
+      *
+      * Available when `hasTimestamp2==true && type!=Inactive && empty==false`.
+      */
+     timeSecondary?: string;
+     /**
+      * Label for the action button (used when `type` is `WithButton`).
+      *
+      * Available when `type==WithButton`.
+      */
+     actionLabel?: string;
       /** Display type of the notification.
 - `simple`: Basic notification (default).
 - `with-button`: Includes a text action button.
@@ -33,28 +49,46 @@ type?: ObcNotificationMessageItemType;
 - `regular`: Standard compact layout (default).
 - `tall`: Expanded layout for longer content. */
 size?: ObcNotificationMessageItemSize;
-      /** Whether to show the title. */
-showTitle?: boolean;
-      /** Whether to show the description.
-If false, the description slot is omitted. */
-showDescription?: boolean;
-      /** Whether to show the primary timestamp. */
-showTimestamp?: boolean;
-      /** Whether to show the secondary timestamp.
-If false, the time-secondary slot is omitted. */
-hasTimestamp2?: boolean;
-      /** Whether to show the secondary icon overlay.
-If true, renders the `secondary-icon` slot. */
-hasSecondaryIcon?: boolean;
-      /** **DEPRECATED** – Use `size="tall"` instead.
-If true, uses the tall layout. */
-large?: boolean;
-      /** **DEPRECATED** – Use `type="inactive"` instead.
-If true, shows the empty/inactive state. */
-empty?: boolean;
-      /** Text to show in the empty/inactive state.
-Used in the `empty` slot when `type="inactive"` or `empty` is true. */
-emptyText?: string
+     /**
+      * Whether to show the title.
+      *
+      * Available when `type!=Inactive && empty==false`.
+      */
+     showTitle?: boolean;
+     /**
+      * Whether to show the description. If false, the description slot is omitted.
+      *
+      * Available when `type!=Inactive && empty==false`.
+      */
+     showDescription?: boolean;
+     /**
+      * Whether to show the primary timestamp.
+      *
+      * Available when `type!=Inactive && empty==false`.
+      */
+     showTimestamp?: boolean;
+     /**
+      * Whether to show the secondary timestamp. If false, the time-secondary slot is omitted.
+      *
+      * Available when `type!=Inactive && empty==false`.
+      */
+     hasTimestamp2?: boolean;
+     /**
+      * Whether to show the secondary icon overlay. If true, renders the `secondary-icon` slot.
+      *
+      * Available when `type!=Inactive && empty==false`.
+      */
+     hasSecondaryIcon?: boolean;
+     /** **DEPRECATED** – Use `size="tall"` instead. If true, uses the tall layout. */
+     large?: boolean;
+     /** **DEPRECATED** – Use `type="inactive"` instead. If true, shows the empty/inactive state. */
+     empty?: boolean;
+     /**
+      * Text to show in the empty/inactive state. Used in the `empty` slot when `type="inactive"` or `empty` is true.
+      *
+      * Available when `type==Inactive || empty==true`.
+      */
+     emptyText?: string
    }
       export interface Events {
     onMessageClick?: (event: CustomEvent<void>) => void;
@@ -70,8 +104,7 @@ emptyText?: string
     use:setProperties={props}
     class={className}
     style={style}
-    onmessage-click={onMessageClick}
-   onaction-click={onActionClick} >
+    use:forwardEvents={{'message-click': onMessageClick, 'action-click': onActionClick}} >
       
       {#if secondaryIcon}
         <div slot="secondary-icon">

package/dist/components/notification-message-item/ObcNotificationMessageItem.svelte.d.ts

@@ -4,19 +4,35 @@ import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
-    /** Title or heading for the notification.
-Shown in the title slot if `hasTitle` is true. */
+    /**
+     * Title or heading for the notification. Shown in the title slot if `showTitle` is true.
+     *
+     * Available when `showTitle==true && type!=Inactive && empty==false`.
+     */
     title?: string;
-    /** Detailed message text for the notification.
-Shown in the description slot if `hasDescription` is true. */
+    /**
+     * Detailed message text for the notification. Shown in the description slot if `showDescription` is true.
+     *
+     * Available when `showDescription==true && type!=Inactive && empty==false`.
+     */
     description?: string;
-    /** Primary timestamp to display (e.g., "09:12:46").
-Shown in the time slot if `hasTimestamp` is true. */
+    /**
+     * Primary timestamp to display (e.g., "09:12:46"). Shown in the time slot if `showTimestamp` is true.
+     *
+     * Available when `showTimestamp==true && type!=Inactive && empty==false`.
+     */
     time?: string;
-    /** Secondary timestamp (e.g., relative time like "2m ago").
-Shown in the time-secondary slot if `hasTimestamp2` is true. */
+    /**
+     * Secondary timestamp (e.g., relative time like "2m ago"). Shown in the time-secondary slot if `hasTimestamp2` is true.
+     *
+     * Available when `hasTimestamp2==true && type!=Inactive && empty==false`.
+     */
     timeSecondary?: string;
-    /** Label for the action button (used when `actionType` is "button"). */
+    /**
+     * Label for the action button (used when `type` is `WithButton`).
+     *
+     * Available when `type==WithButton`.
+     */
     actionLabel?: string;
     /** Display type of the notification.
 - `simple`: Basic notification (default).
@@ -28,27 +44,45 @@ Shown in the time-secondary slot if `hasTimestamp2` is true. */
 - `regular`: Standard compact layout (default).
 - `tall`: Expanded layout for longer content. */
     size?: ObcNotificationMessageItemSize;
-    /** Whether to show the title. */
+    /**
+     * Whether to show the title.
+     *
+     * Available when `type!=Inactive && empty==false`.
+     */
     showTitle?: boolean;
-    /** Whether to show the description.
-If false, the description slot is omitted. */
+    /**
+     * Whether to show the description. If false, the description slot is omitted.
+     *
+     * Available when `type!=Inactive && empty==false`.
+     */
     showDescription?: boolean;
-    /** Whether to show the primary timestamp. */
+    /**
+     * Whether to show the primary timestamp.
+     *
+     * Available when `type!=Inactive && empty==false`.
+     */
     showTimestamp?: boolean;
-    /** Whether to show the secondary timestamp.
-If false, the time-secondary slot is omitted. */
+    /**
+     * Whether to show the secondary timestamp. If false, the time-secondary slot is omitted.
+     *
+     * Available when `type!=Inactive && empty==false`.
+     */
     hasTimestamp2?: boolean;
-    /** Whether to show the secondary icon overlay.
-If true, renders the `secondary-icon` slot. */
+    /**
+     * Whether to show the secondary icon overlay. If true, renders the `secondary-icon` slot.
+     *
+     * Available when `type!=Inactive && empty==false`.
+     */
     hasSecondaryIcon?: boolean;
-    /** **DEPRECATED** – Use `size="tall"` instead.
-If true, uses the tall layout. */
+    /** **DEPRECATED** – Use `size="tall"` instead. If true, uses the tall layout. */
     large?: boolean;
-    /** **DEPRECATED** – Use `type="inactive"` instead.
-If true, shows the empty/inactive state. */
+    /** **DEPRECATED** – Use `type="inactive"` instead. If true, shows the empty/inactive state. */
     empty?: boolean;
-    /** Text to show in the empty/inactive state.
-Used in the `empty` slot when `type="inactive"` or `empty` is true. */
+    /**
+     * Text to show in the empty/inactive state. Used in the `empty` slot when `type="inactive"` or `empty` is true.
+     *
+     * Available when `type==Inactive || empty==true`.
+     */
     emptyText?: string;
 }
 export interface Events {

package/dist/components/number-input-field/ObcNumberInputField.svelte

@@ -2,62 +2,75 @@
   <script lang="ts">
     export type {ObcNumberInputFieldTextAlign, ObcNumberInputFieldSize, ObcNumberInputFieldPlacement} from '@oicl/openbridge-webcomponents/dist/components/number-input-field/number-input-field.js';
       import '@oicl/openbridge-webcomponents/dist/components/number-input-field/number-input-field.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcNumberInputFieldTextAlign, ObcNumberInputFieldSize, ObcNumberInputFieldPlacement} from '@oicl/openbridge-webcomponents/dist/components/number-input-field/number-input-field.js';
       import type { Snippet } from 'svelte';
 
       export interface Props {
      class?: string;
      style?: string;
-     value?: string;
+     value?: number;
      unit?: string;
      placeholder?: string;
      textAlign?: ObcNumberInputFieldTextAlign;
      disabled?: boolean;
      readonly?: boolean;
      error?: boolean;
+     /** Available when `error==true`. */
      errorText?: string;
-      /** If true, the input field will not update its value on focus */
-rejectUpdatesOnFocus?: boolean;
-      /** If true, the value will only be initially set, and not updated on change */
-rejectUpdates?: boolean;
-      /** If true, the input field will not update its value if the value is the same as the previous value
-This is useful to avoid React re-rendering to reset the value. */
-rejectDuplicateUpdates?: boolean;
-      /** Name attribute for form integration */
-name?: string;
-      /** Maximum number of characters allowed */
-maxlength?: number | undefined;
-      /** Minimum number of characters required */
-minlength?: number | undefined;
+     /** If true, the input field will not update its value on focus */
+     rejectUpdatesOnFocus?: boolean;
+     /** If true, the value will only be initially set, and not updated on change */
+     rejectUpdates?: boolean;
+     /** If true, the input field will not update its value if the value is the same as the previous value This is useful to avoid React re-rendering to reset the value. */
+     rejectDuplicateUpdates?: boolean;
+     /** Name attribute for form integration */
+     name?: string;
+     /** Maximum number of characters allowed */
+     maxlength?: number | undefined;
+     /** Minimum number of characters required */
+     minlength?: number | undefined;
      size?: ObcNumberInputFieldSize;
      hasLeadingIcon?: boolean;
      helperText?: string;
      label?: string;
      required?: boolean;
+     /** Available when `label!=''`. */
      hasLabelIcon?: boolean;
+     /** Available when `label!=''`. */
      labelPlacement?: ObcNumberInputFieldPlacement;
+     /** Available when `helperText!='' || (error==true && errorText!='')`. */
      hasHelperIcon?: boolean;
+     /** Available when `helperText!='' || (error==true && errorText!='')`. */
      helperPlacement?: ObcNumberInputFieldPlacement;
-      /** Internal property for squared corners, used when input is used in stepper-box */
-squared?: boolean
+     /** Internal property for squared corners, used when input is used in stepper-box */
+     squared?: boolean;
+     /** Optional display text override for controlled consumers (e.g. keyboard-numeric) that manage formatted strings while the committed value may be NaN. */
+     displayOverride?: string;
+     decimalSeparator?: string | undefined;
+     groupSeparator?: string | undefined;
+     minFractionDigits?: number;
+     maxFractionDigits?: number | undefined;
+     /** Optional regex pattern. When set, any keystroke or paste whose resulting value does not match this pattern is blocked at the `beforeinput` stage. When unset, a permissive numeric filter (digits, sign, active separators, whitespace) is applied instead. */
+     validationPattern?: string
    }
       export interface Events {
-    onInput?: (event: CustomEvent<unknown>) => void
+    onInput?: (event: CustomEvent<{value: number}>) => void;
+    onChange?: (event: CustomEvent<{value: number}>) => void
   }
       export interface Slots {
   leadingIcon?: Snippet;
   labelIcon?: Snippet;
   helperIcon?: Snippet
 }
-      const {onInput, class: className, style, leadingIcon, labelIcon, helperIcon, ...props} = $props<Props & Events & Slots>();
+      const {onInput, onChange, class: className, style, leadingIcon, labelIcon, helperIcon, ...props} = $props<Props & Events & Slots>();
 
     </script>
     <obc-number-input-field
     use:setProperties={props}
     class={className}
     style={style}
-    oninput={onInput} >
+    use:forwardEvents={{'input': onInput, 'change': onChange}} >
       
       {#if leadingIcon}
         <div slot="leading-icon">

package/dist/components/number-input-field/ObcNumberInputField.svelte.d.ts

@@ -4,20 +4,20 @@ import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
-    value?: string;
+    value?: number;
     unit?: string;
     placeholder?: string;
     textAlign?: ObcNumberInputFieldTextAlign;
     disabled?: boolean;
     readonly?: boolean;
     error?: boolean;
+    /** Available when `error==true`. */
     errorText?: string;
     /** If true, the input field will not update its value on focus */
     rejectUpdatesOnFocus?: boolean;
     /** If true, the value will only be initially set, and not updated on change */
     rejectUpdates?: boolean;
-    /** If true, the input field will not update its value if the value is the same as the previous value
-This is useful to avoid React re-rendering to reset the value. */
+    /** If true, the input field will not update its value if the value is the same as the previous value This is useful to avoid React re-rendering to reset the value. */
     rejectDuplicateUpdates?: boolean;
     /** Name attribute for form integration */
     name?: string;
@@ -30,15 +30,32 @@ This is useful to avoid React re-rendering to reset the value. */
     helperText?: string;
     label?: string;
     required?: boolean;
+    /** Available when `label!=''`. */
     hasLabelIcon?: boolean;
+    /** Available when `label!=''`. */
     labelPlacement?: ObcNumberInputFieldPlacement;
+    /** Available when `helperText!='' || (error==true && errorText!='')`. */
     hasHelperIcon?: boolean;
+    /** Available when `helperText!='' || (error==true && errorText!='')`. */
     helperPlacement?: ObcNumberInputFieldPlacement;
     /** Internal property for squared corners, used when input is used in stepper-box */
     squared?: boolean;
+    /** Optional display text override for controlled consumers (e.g. keyboard-numeric) that manage formatted strings while the committed value may be NaN. */
+    displayOverride?: string;
+    decimalSeparator?: string | undefined;
+    groupSeparator?: string | undefined;
+    minFractionDigits?: number;
+    maxFractionDigits?: number | undefined;
+    /** Optional regex pattern. When set, any keystroke or paste whose resulting value does not match this pattern is blocked at the `beforeinput` stage. When unset, a permissive numeric filter (digits, sign, active separators, whitespace) is applied instead. */
+    validationPattern?: string;
 }
 export interface Events {
-    onInput?: (event: CustomEvent<unknown>) => void;
+    onInput?: (event: CustomEvent<{
+        value: number;
+    }>) => void;
+    onChange?: (event: CustomEvent<{
+        value: number;
+    }>) => void;
 }
 export interface Slots {
     leadingIcon?: Snippet;

package/dist/components/pagination/ObcPagination.svelte

@@ -1,9 +1,9 @@
 
   <script lang="ts">
-    export type {ObcPaginationValueChangeEvent, ObcPaginationNavigateEvent, PaginationVariant} from '@oicl/openbridge-webcomponents/dist/components/pagination/pagination.js';
+    export type {ObcPaginationValueChangeEvent, ObcPaginationNavigateEvent, ObcPaginationSelectPageEvent, PaginationVariant} from '@oicl/openbridge-webcomponents/dist/components/pagination/pagination.js';
       import '@oicl/openbridge-webcomponents/dist/components/pagination/pagination.js';
-      import { setProperties } from "../../util.js";
-      import type {ObcPaginationValueChangeEvent, ObcPaginationNavigateEvent, PaginationVariant} from '@oicl/openbridge-webcomponents/dist/components/pagination/pagination.js';
+      import { setProperties, forwardEvents } from "../../util.js";
+      import type {ObcPaginationValueChangeEvent, ObcPaginationNavigateEvent, ObcPaginationSelectPageEvent, PaginationVariant} from '@oicl/openbridge-webcomponents/dist/components/pagination/pagination.js';
       import type { Snippet } from 'svelte';
 
       export interface Props {
@@ -39,20 +39,20 @@ fullWidth?: boolean;
    }
       export interface Events {
     onValue?: (event: ObcPaginationValueChangeEvent) => void;
-    onNavigate?: (event: ObcPaginationNavigateEvent) => void
+    onNavigate?: (event: ObcPaginationNavigateEvent) => void;
+    onSelectPage?: (event: ObcPaginationSelectPageEvent) => void
   }
       export interface Slots {
   children?: Snippet
 }
-      const {onValue, onNavigate, class: className, style, children, ...props} = $props<Props & Events & Slots>();
+      const {onValue, onNavigate, onSelectPage, class: className, style, children, ...props} = $props<Props & Events & Slots>();
 
     </script>
     <obc-pagination
     use:setProperties={props}
     class={className}
     style={style}
-    onvalue={onValue}
-   onnavigate={onNavigate} >
+    use:forwardEvents={{'value': onValue, 'navigate': onNavigate, 'select-page': onSelectPage}} >
       
     {#if children}
       {@render children()}

package/dist/components/pagination/ObcPagination.svelte.d.ts

@@ -1,5 +1,5 @@
 import '@oicl/openbridge-webcomponents/dist/components/pagination/pagination.js';
-import type { ObcPaginationValueChangeEvent, ObcPaginationNavigateEvent, PaginationVariant } from '@oicl/openbridge-webcomponents/dist/components/pagination/pagination.js';
+import type { ObcPaginationValueChangeEvent, ObcPaginationNavigateEvent, ObcPaginationSelectPageEvent, PaginationVariant } from '@oicl/openbridge-webcomponents/dist/components/pagination/pagination.js';
 import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
@@ -35,6 +35,7 @@ Default: `false` */
 export interface Events {
     onValue?: (event: ObcPaginationValueChangeEvent) => void;
     onNavigate?: (event: ObcPaginationNavigateEvent) => void;
+    onSelectPage?: (event: ObcPaginationSelectPageEvent) => void;
 }
 export interface Slots {
     children?: Snippet;
@@ -43,6 +44,7 @@ type $$ComponentProps = Props & Events & Slots;
 declare const ObcPagination: import("svelte").Component<$$ComponentProps, {
     ObcPaginationValueChangeEvent: typeof ObcPaginationValueChangeEvent;
     ObcPaginationNavigateEvent: typeof ObcPaginationNavigateEvent;
+    ObcPaginationSelectPageEvent: typeof ObcPaginationSelectPageEvent;
     PaginationVariant: typeof PaginationVariant;
 }, "">;
 type ObcPagination = ReturnType<typeof ObcPagination>;

package/dist/components/pivot-item/ObcPivotItem.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcPivotItemDirection} from '@oicl/openbridge-webcomponents/dist/components/pivot-item/pivot-item.js';
       import '@oicl/openbridge-webcomponents/dist/components/pivot-item/pivot-item.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcPivotItemDirection} from '@oicl/openbridge-webcomponents/dist/components/pivot-item/pivot-item.js';
       import type { Snippet } from 'svelte';
 
@@ -52,7 +52,7 @@ disabled?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    onselected={onSelected} >
+    use:forwardEvents={{'selected': onSelected}} >
       
       {#if icon}
         <div slot="icon">

package/dist/components/pivot-item-group/ObcPivotItemGroup.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcPivotItemDirection} from '@oicl/openbridge-webcomponents/dist/components/pivot-item/pivot-item.js';
       import '@oicl/openbridge-webcomponents/dist/components/pivot-item-group/pivot-item-group.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcPivotItemDirection} from '@oicl/openbridge-webcomponents/dist/components/pivot-item/pivot-item.js';
       import type { Snippet } from 'svelte';
 
@@ -12,13 +12,14 @@
       /** Layout direction for the group: `'horizontal'` (default, items in a row) or `'vertical'` (items stacked).
 Changing this updates the direction of all child pivot items. */
 direction?: ObcPivotItemDirection;
-      /** The value of the currently selected pivot item.
-Set this to control selection programmatically, or listen for the `change` event to react to user selection.
-Defaults to empty string (no selection). */
-selectedValue?: string;
-      /** If true, allows the user to deselect the currently selected item by clicking it again (resulting in no selection).
-If false (default), one item is always selected unless `selectedValue` is empty. */
-allowDeselect?: boolean
+     /** The value of the currently selected pivot item. Set this to control selection programmatically, or listen for the `change` event to react to user selection. Defaults to empty string (no selection). */
+     selectedValue?: string;
+     /**
+      * If true, allows the user to deselect the currently selected item by clicking it again (resulting in no selection). If false (default), one item is always selected unless `selectedValue` is empty.
+      *
+      * Available when `selectedValue!=''`.
+      */
+     allowDeselect?: boolean
    }
       export interface Events {
     onChange?: (event: CustomEvent<{selectedValue: string}>) => void
@@ -33,7 +34,7 @@ allowDeselect?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    onchange={onChange} >
+    use:forwardEvents={{'change': onChange}} >
       
       {#if children}
         {@render children()}

package/dist/components/pivot-item-group/ObcPivotItemGroup.svelte.d.ts

@@ -7,12 +7,13 @@ export interface Props {
     /** Layout direction for the group: `'horizontal'` (default, items in a row) or `'vertical'` (items stacked).
 Changing this updates the direction of all child pivot items. */
     direction?: ObcPivotItemDirection;
-    /** The value of the currently selected pivot item.
-Set this to control selection programmatically, or listen for the `change` event to react to user selection.
-Defaults to empty string (no selection). */
+    /** The value of the currently selected pivot item. Set this to control selection programmatically, or listen for the `change` event to react to user selection. Defaults to empty string (no selection). */
     selectedValue?: string;
-    /** If true, allows the user to deselect the currently selected item by clicking it again (resulting in no selection).
-If false (default), one item is always selected unless `selectedValue` is empty. */
+    /**
+     * If true, allows the user to deselect the currently selected item by clicking it again (resulting in no selection). If false (default), one item is always selected unless `selectedValue` is empty.
+     *
+     * Available when `selectedValue!=''`.
+     */
     allowDeselect?: boolean;
 }
 export interface Events {

package/dist/components/progress-bar/ObcProgressBar.svelte

@@ -1,33 +1,87 @@
 
   <script lang="ts">
     export type {ProgressBarType, ProgressBarMode, CircularProgressState} from '@oicl/openbridge-webcomponents/dist/components/progress-bar/progress-bar.js';
+export type {Priority} from '@oicl/openbridge-webcomponents/dist/navigation-instruments/types.js';
       import '@oicl/openbridge-webcomponents/dist/components/progress-bar/progress-bar.js';
       import { setProperties } from "../../util.js";
       import type {ProgressBarType, ProgressBarMode, CircularProgressState} from '@oicl/openbridge-webcomponents/dist/components/progress-bar/progress-bar.js';
+import type {Priority} from '@oicl/openbridge-webcomponents/dist/navigation-instruments/types.js';
       import type { Snippet } from 'svelte';
 
       export interface Props {
      class?: string;
      style?: string;
+     /** Layout type: `linear` (horizontal bar) or `circular` (ring). */
      type?: ProgressBarType;
+     /**
+      * Progress mode: `determinate` tracks `value`, `indeterminate` loops indefinitely.
+      *
+      * Available when `type==linear`.
+      */
      mode?: ProgressBarMode;
+     /**
+      * Circular display state: `determinate` (numeric ring), `indeterminate` (animated ring with icon), or `icon` (ring framing the icon slot).
+      *
+      * Available when `type==circular`.
+      */
      circularState?: CircularProgressState;
+     /**
+      * Color emphasis of the bar fill: `regular` (gray) or `enhanced` (blue).
+      *
+      * Available when `type==linear`.
+      */
+     priority?: Priority;
+     /** Progress percentage (0–100); clamped when rendered. */
      value?: number;
+     /**
+      * Shows the value label above the bar (percentage when determinate, "Loading" when indeterminate).
+      *
+      * Available when `type==linear`.
+      */
      showValue?: boolean;
+     /**
+      * Appends a `%` unit next to the centered value.
+      *
+      * Available when `type==circular && (progressiveIndeterminate==true || circularState==determinate)`.
+      */
      showUnit?: boolean;
+     /**
+      * Shows the `description` text below the bar.
+      *
+      * Available when `type==linear`.
+      */
      hasDescription?: boolean;
+     /**
+      * Description text rendered below the bar.
+      *
+      * Available when `type==linear && hasDescription==true`.
+      */
      description?: string;
-     showState?: boolean;
+      /** Shows the `stateLabel` next to the value.
+
+**TODO(designer):** Confirm the intended purpose of the state indicator — the story labels
+this a "future feature". */
+showState?: boolean;
+     /**
+      * Text shown alongside the value when `showState` is enabled.
+      *
+      * Available when `type==linear && showValue==true && mode==determinate && showState==true`.
+      */
      stateLabel?: string;
+     /**
+      * Uses a progressive indeterminate ring (spinning arc that grows with `value`); takes precedence over `circularState`.
+      *
+      * Available when `type==circular`.
+      */
      progressiveIndeterminate?: boolean
    }
       export interface Events {
     
   }
       export interface Slots {
-  children?: Snippet
+  icon?: Snippet
 }
-      const { class: className, style, children, ...props} = $props<Props & Events & Slots>();
+      const { class: className, style, icon, ...props} = $props<Props & Events & Slots>();
 
     </script>
     <obc-progress-bar
@@ -36,7 +90,9 @@
     style={style}
      >
       
-    {#if children}
-      {@render children()}
-    {/if}
+      {#if icon}
+        <div slot="icon">
+          {@render icon()}
+        </div>
+      {/if}
     </obc-progress-bar>