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

package/dist/components/command-button/ObcCommandButton.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     
       import '@oicl/openbridge-webcomponents/dist/components/command-button/command-button.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       
       import type { Snippet } from 'svelte';
 
@@ -18,19 +18,19 @@ Default: `false` */
 inCommand?: boolean
    }
       export interface Events {
-    
+    onClick?: (event: CustomEvent<unknown>) => void
   }
       export interface Slots {
   children?: Snippet
 }
-      const { class: className, style, children, ...props} = $props<Props & Events & Slots>();
+      const {onClick, class: className, style, children, ...props} = $props<Props & Events & Slots>();
 
     </script>
     <obc-command-button
     use:setProperties={props}
     class={className}
     style={style}
-     >
+    use:forwardEvents={{'click': onClick}} >
       
       {#if children}
         {@render children()}

package/dist/components/command-button/ObcCommandButton.svelte.d.ts

@@ -12,6 +12,7 @@ Default: `false` */
     inCommand?: boolean;
 }
 export interface Events {
+    onClick?: (event: CustomEvent<unknown>) => void;
 }
 export interface Slots {
     children?: Snippet;

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

@@ -2,19 +2,17 @@
   <script lang="ts">
     
       import '@oicl/openbridge-webcomponents/dist/components/command-menu/command-menu.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       
       import type { Snippet } from 'svelte';
 
       export interface Props {
      class?: string;
      style?: string;
-      /** 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
+     /** 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
@@ -37,7 +35,7 @@ showLocation?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    onchange={onChange} >
+    use:forwardEvents={{'change': onChange}} >
       
       {#if commandIcon}
         <div slot="command-icon">

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

@@ -3,11 +3,9 @@ import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
-    /** Whether the menu is in the "in command" state.
-Controls the toggle and visual state. */
+    /** 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. */
+    /** Whether to display the location slot. If false, the location is omitted from the menu. */
     showLocation?: boolean;
 }
 export interface Events {

package/dist/components/communication-table/ObcCommunicationTable.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcCommunicationTableRowClickEvent, ObcCommunicationTableRow} from '@oicl/openbridge-webcomponents/dist/components/communication-table/communication-table.js';
       import '@oicl/openbridge-webcomponents/dist/components/communication-table/communication-table.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcCommunicationTableRowClickEvent, ObcCommunicationTableRow} from '@oicl/openbridge-webcomponents/dist/components/communication-table/communication-table.js';
       import type { Snippet } from 'svelte';
 
@@ -28,7 +28,7 @@
     use:setProperties={props}
     class={className}
     style={style}
-    onrow-click={onRowClick} >
+    use:forwardEvents={{'row-click': onRowClick}} >
       
     {#if children}
       {@render children()}

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

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcContextMenuInputChangeEvent, ObcContextMenuInputItemClickEvent, ContextMenuType, ContextMenuOption, ColumnGroup} from '@oicl/openbridge-webcomponents/dist/components/context-menu-input/context-menu-input.js';
       import '@oicl/openbridge-webcomponents/dist/components/context-menu-input/context-menu-input.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcContextMenuInputChangeEvent, ObcContextMenuInputItemClickEvent, ContextMenuType, ContextMenuOption, ColumnGroup} from '@oicl/openbridge-webcomponents/dist/components/context-menu-input/context-menu-input.js';
       import type { Snippet } from 'svelte';
 
@@ -35,8 +35,12 @@ selectedValues?: string[];
 
 If true, displays the `title` property and a close icon button. */
 hasTitleBar?: boolean;
-      /** Title text displayed in the title bar (if `hasTitleBar` is true). */
-title?: string;
+     /**
+      * Title text displayed in the title bar (if `hasTitleBar` is true).
+      *
+      * Available when `hasTitleBar==true`.
+      */
+     title?: string;
       /** Array of column groups for the `multi-with-subtitles` layout.
 
 Each group defines a `title`, `columns` (number of columns in the group), and `options` (array of options for that group). */
@@ -69,9 +73,7 @@ selectPerGroup?: boolean | undefined
     use:setProperties={props}
     class={className}
     style={style}
-    onchange={onChange}
-   onitem-click={onItemClick}
-   onclose={onClose} >
+    use:forwardEvents={{'change': onChange, 'item-click': onItemClick, 'close': onClose}} >
       
       {#if children}
         {@render children()}

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

@@ -30,7 +30,11 @@ For multi-select variants, can contain multiple values. For single-select, conta
 
 If true, displays the `title` property and a close icon button. */
     hasTitleBar?: boolean;
-    /** Title text displayed in the title bar (if `hasTitleBar` is true). */
+    /**
+     * Title text displayed in the title bar (if `hasTitleBar` is true).
+     *
+     * Available when `hasTitleBar==true`.
+     */
     title?: string;
     /** Array of column groups for the `multi-with-subtitles` layout.
 

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

@@ -3,7 +3,7 @@
     export type {DateItemEvent} from '@oicl/openbridge-webcomponents/dist/components/event-item/event-item.js';
 export type {DateItemSize} from '@oicl/openbridge-webcomponents/dist/components/date-item/date-item.js';
       import '@oicl/openbridge-webcomponents/dist/components/date-item/date-item.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 {DateItemSize} from '@oicl/openbridge-webcomponents/dist/components/date-item/date-item.js';
       import type { Snippet } from 'svelte';
@@ -15,21 +15,16 @@ import type {DateItemSize} from '@oicl/openbridge-webcomponents/dist/components/
 - `small`: Compact, shows only the date and event dots.
 - `large`: Expands to show event titles and descriptions for up to two events. */
 size?: DateItemSize;
-      /** Whether the date item is disabled. When true, the button is visually muted and not interactive. */
-disabled?: boolean;
-      /** Array of events to display on this date.
-In small size, shows an event dot indicator.
-In large size, displays event details using obc-event-item components. */
-events?: DateItemEvent[];
-      /** Number of events to display from the events array. When 0, shows all events.
-In small size, always caps at 2 dots regardless of this value. */
-eventCount?: number;
-      /** Whether the date item represents today.
-When true, displays the "Today" label (in large size) and uses amplified styling. */
-isToday?: boolean;
-      /** Whether the date item is checked/selected.
-When true, uses selected styling (blue filled background). */
-checked?: boolean;
+     /** Whether the date item is disabled. When true, the button is visually muted and not interactive. */
+     disabled?: boolean;
+     /** Array of events to display on this date. In small size, shows an event dot indicator. In large size, displays event details using obc-event-item components. */
+     events?: DateItemEvent[];
+     /** Number of events to display from the events array. When 0, shows all events. In small size, always caps at 2 dots regardless of this value. */
+     eventCount?: number;
+     /** Whether the date item represents today. When true, displays the "Today" label (in large size) and uses amplified styling. */
+     isToday?: boolean;
+     /** Whether the date item is checked/selected. When true, uses selected styling (blue filled background). */
+     checked?: boolean;
       /** The numeric day of the month to display (1–31). Values outside this range are clamped. */
 date?: number
    }
@@ -46,7 +41,7 @@ date?: number
     use:setProperties={props}
     class={className}
     style={style}
-    ondate-click={onDateClick} >
+    use:forwardEvents={{'date-click': onDateClick}} >
       
       {#if children}
         {@render children()}

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

@@ -11,18 +11,13 @@ export interface Props {
     size?: DateItemSize;
     /** Whether the date item is disabled. When true, the button is visually muted and not interactive. */
     disabled?: boolean;
-    /** Array of events to display on this date.
-In small size, shows an event dot indicator.
-In large size, displays event details using obc-event-item components. */
+    /** Array of events to display on this date. In small size, shows an event dot indicator. In large size, displays event details using obc-event-item components. */
     events?: DateItemEvent[];
-    /** Number of events to display from the events array. When 0, shows all events.
-In small size, always caps at 2 dots regardless of this value. */
+    /** Number of events to display from the events array. When 0, shows all events. In small size, always caps at 2 dots regardless of this value. */
     eventCount?: number;
-    /** Whether the date item represents today.
-When true, displays the "Today" label (in large size) and uses amplified styling. */
+    /** Whether the date item represents today. When true, displays the "Today" label (in large size) and uses amplified styling. */
     isToday?: boolean;
-    /** Whether the date item is checked/selected.
-When true, uses selected styling (blue filled background). */
+    /** Whether the date item is checked/selected. When true, uses selected styling (blue filled background). */
     checked?: boolean;
     /** The numeric day of the month to display (1–31). Values outside this range are clamped. */
     date?: number;

package/dist/components/dropdown-button/ObcDropdownButton.svelte

@@ -1,9 +1,9 @@
 
   <script lang="ts">
-    export type {ObcDropdownButtonChangeEvent, DropdownButtonType} from '@oicl/openbridge-webcomponents/dist/components/dropdown-button/dropdown-button.js';
+    export type {ObcDropdownButtonChangeEvent, DropdownButtonOption, DropdownButtonType} from '@oicl/openbridge-webcomponents/dist/components/dropdown-button/dropdown-button.js';
       import '@oicl/openbridge-webcomponents/dist/components/dropdown-button/dropdown-button.js';
-      import { setProperties } from "../../util.js";
-      import type {ObcDropdownButtonChangeEvent, DropdownButtonType} from '@oicl/openbridge-webcomponents/dist/components/dropdown-button/dropdown-button.js';
+      import { setProperties, forwardEvents } from "../../util.js";
+      import type {ObcDropdownButtonChangeEvent, DropdownButtonOption, DropdownButtonType} from '@oicl/openbridge-webcomponents/dist/components/dropdown-button/dropdown-button.js';
       import type { Snippet } from 'svelte';
 
       export interface Props {
@@ -16,21 +16,25 @@ Example:
   { value: 'volvo', label: 'Volvo' },
   { value: 'xc90', label: 'XC 90', level: 2 }
 ] */
-options?: { value: string; label: string; level?: number | undefined; }[];
-      /** The value of the currently selected option. If not set, defaults to the first option in the list. */
-value?: string | undefined;
+options?: DropdownButtonOption[];
+     /** The value of the currently selected option. If not set, defaults to the first option in the list unless `allowEmptySelection` is true. */
+     value?: string | undefined;
      disabled?: boolean;
-      /** If true, the select expands to fill the width of its container. Default is false. */
-fullWidth?: boolean;
+     /** If true, the select expands to fill the width of its container. Default is false. */
+     fullWidth?: boolean;
+     /** If true, a `value` that does not match any option leaves the button with no option selected, showing `placeholder` instead of defaulting to the first option. Default is false. */
+     allowEmptySelection?: boolean;
+     /** Text shown when nothing is selected and `allowEmptySelection` is true. Default is an empty string. */
+     placeholder?: string;
       /** Controls the button's display type.
 - `label`: Text label only (default)
 - `icon`: Icon only, no label
 - `label-icon`: Icon before the label */
 type?: DropdownButtonType;
-      /** If true, the dropdown menu opens above the button. */
-openTop?: boolean;
-      /** If true, the select is integration style. Default is false, only for integration bar. */
-integration?: boolean;
+     /** If true, the dropdown menu opens above the button. */
+     openTop?: boolean;
+     /** If true, the select is integration style. Default is false, only for integration bar. */
+     integration?: boolean;
      flat?: boolean
    }
       export interface Events {
@@ -48,8 +52,7 @@ integration?: boolean;
     use:setProperties={props}
     class={className}
     style={style}
-    ondropdown-change={onDropdownChange}
-   onchange={onChange} >
+    use:forwardEvents={{'dropdown-change': onDropdownChange, 'change': onChange}} >
       
       {#if children}
         {@render children()}

package/dist/components/dropdown-button/ObcDropdownButton.svelte.d.ts

@@ -1,5 +1,5 @@
 import '@oicl/openbridge-webcomponents/dist/components/dropdown-button/dropdown-button.js';
-import type { ObcDropdownButtonChangeEvent, DropdownButtonType } from '@oicl/openbridge-webcomponents/dist/components/dropdown-button/dropdown-button.js';
+import type { ObcDropdownButtonChangeEvent, DropdownButtonOption, DropdownButtonType } from '@oicl/openbridge-webcomponents/dist/components/dropdown-button/dropdown-button.js';
 import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
@@ -11,16 +11,16 @@ Example:
 { value: 'volvo', label: 'Volvo' },
 { value: 'xc90', label: 'XC 90', level: 2 }
 ] */
-    options?: {
-        value: string;
-        label: string;
-        level?: number | undefined;
-    }[];
-    /** The value of the currently selected option. If not set, defaults to the first option in the list. */
+    options?: DropdownButtonOption[];
+    /** The value of the currently selected option. If not set, defaults to the first option in the list unless `allowEmptySelection` is true. */
     value?: string | undefined;
     disabled?: boolean;
     /** If true, the select expands to fill the width of its container. Default is false. */
     fullWidth?: boolean;
+    /** If true, a `value` that does not match any option leaves the button with no option selected, showing `placeholder` instead of defaulting to the first option. Default is false. */
+    allowEmptySelection?: boolean;
+    /** Text shown when nothing is selected and `allowEmptySelection` is true. Default is an empty string. */
+    placeholder?: string;
     /** Controls the button's display type.
 - `label`: Text label only (default)
 - `icon`: Icon only, no label
@@ -43,6 +43,7 @@ export interface Slots {
 type $$ComponentProps = Props & Events & Slots;
 declare const ObcDropdownButton: import("svelte").Component<$$ComponentProps, {
     ObcDropdownButtonChangeEvent: typeof ObcDropdownButtonChangeEvent;
+    DropdownButtonOption: typeof DropdownButtonOption;
     DropdownButtonType: typeof DropdownButtonType;
 }, "">;
 type ObcDropdownButton = ReturnType<typeof ObcDropdownButton>;

package/dist/components/elevated-card/ObcElevatedCard.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcElevatedCardPosition, ObcElevatedCardSize, ObcElevatedCardTag} from '@oicl/openbridge-webcomponents/dist/components/elevated-card/elevated-card.js';
       import '@oicl/openbridge-webcomponents/dist/components/elevated-card/elevated-card.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcElevatedCardPosition, ObcElevatedCardSize, ObcElevatedCardTag} from '@oicl/openbridge-webcomponents/dist/components/elevated-card/elevated-card.js';
       import type { Snippet } from 'svelte';
 
@@ -28,42 +28,38 @@ size?: ObcElevatedCardSize;
 - `div`: Renders as a <div> (generic container).
 If not set, the tag is determined automatically based on `href` and `isClickable`. */
 overrideTag?: ObcElevatedCardTag | undefined;
-      /** If true, the card is rendered as a static (non-clickable) element.
-When set, the card uses `<article>` as its tag unless overridden.
-Useful for informational or status cards that should not be interactive. */
-isClickable?: boolean;
-      /** Applies an informational style to the card.
-When true, the card uses the "info" visual style. */
-info?: boolean;
-      /** If true, adds a border below the graphic area (when present).
-Used to visually separate the graphic from the card content. */
-graphicBorder?: boolean;
-      /** If true, adds a border to the card (top or bottom, depending on position).
-Useful for visually separating cards in a stack. */
-border?: boolean;
-      /** If true, displays an action button in the card.
-The button's content is provided via the `action` slot.
-When set, the card is rendered as static (`isClickable` is forced false). */
-hasAction?: boolean;
-      /** If true, displays a leading icon before the label.
-The icon is provided via the `leading-icon` slot. */
-hasLeadingIcon?: boolean;
-      /** If true, displays a trailing icon after the content.
-The icon is provided via the `trailing-icon` slot. */
-hasTrailingIcon?: boolean;
-      /** If true, displays a prominent graphic at the top of the card.
-The graphic is provided via the `graphic` slot. */
-hasGraphic?: boolean;
-      /** If true, displays a status indicator in the card.
-The status content is provided via the `status` slot. */
-hasStatus?: boolean;
+     /** If false, the card is rendered as a static (non-clickable) element and uses `<article>` as its tag unless `overrideTag` is set. Useful for informational or status cards that should not be interactive. */
+     isClickable?: boolean;
+     /** Applies an informational style to the card. When true, the card uses the "info" visual style. */
+     info?: boolean;
+     /**
+      * If true, adds a border below the graphic area (when present). Used to visually separate the graphic from the card content.
+      *
+      * Available when `hasGraphic==true`.
+      */
+     graphicBorder?: boolean;
+     /**
+      * If true, adds a border to the card (top or bottom, depending on position). Useful for visually separating cards in a stack.
+      *
+      * Available when `position!=regular`.
+      */
+     border?: boolean;
+     /** If true, displays an action button in the card. The button's content is provided via the `action` slot. When set, the card is rendered as static (`isClickable` is forced false). */
+     hasAction?: boolean;
+     /** If true, displays a leading icon before the label. The icon is provided via the `leading-icon` slot. */
+     hasLeadingIcon?: boolean;
+     /** If true, displays a trailing icon after the content. The icon is provided via the `trailing-icon` slot. */
+     hasTrailingIcon?: boolean;
+     /** If true, displays a prominent graphic at the top of the card. The graphic is provided via the `graphic` slot. */
+     hasGraphic?: boolean;
+     /** If true, displays a status indicator in the card. The status content is provided via the `status` slot. */
+     hasStatus?: boolean;
      compact?: boolean;
      directAction?: boolean;
-      /** If set, the card is rendered as a link (`<a>`) with this URL as the `href`.
-When present, the card is clickable and navigates to the specified URL. */
-href?: string | undefined;
-      /** Specifies the target for the link when `href` is set (e.g., `_blank`). */
-target?: string | undefined
+     /** URL the card links to. It applies whenever the rendered tag is `<a>` — the default for a clickable card with an `href`, or `overrideTag="a"`; `isClickable=false`, `hasAction` or another `overrideTag` render a tag on which the URL has no effect. */
+     href?: string | undefined;
+     /** Specifies the target for the link when `href` is set (e.g., `_blank`). */
+     target?: string | undefined
    }
       export interface Events {
     onActionClick?: (event: CustomEvent<unknown>) => void
@@ -84,7 +80,7 @@ target?: string | undefined
     use:setProperties={props}
     class={className}
     style={style}
-    onaction-click={onActionClick} >
+    use:forwardEvents={{'action-click': onActionClick}} >
       
       {#if graphic}
         <div slot="graphic">

package/dist/components/elevated-card/ObcElevatedCard.svelte.d.ts

@@ -23,39 +23,35 @@ Default is `single-line`. */
 - `div`: Renders as a <div> (generic container).
 If not set, the tag is determined automatically based on `href` and `isClickable`. */
     overrideTag?: ObcElevatedCardTag | undefined;
-    /** If true, the card is rendered as a static (non-clickable) element.
-When set, the card uses `<article>` as its tag unless overridden.
-Useful for informational or status cards that should not be interactive. */
+    /** If false, the card is rendered as a static (non-clickable) element and uses `<article>` as its tag unless `overrideTag` is set. Useful for informational or status cards that should not be interactive. */
     isClickable?: boolean;
-    /** Applies an informational style to the card.
-When true, the card uses the "info" visual style. */
+    /** Applies an informational style to the card. When true, the card uses the "info" visual style. */
     info?: boolean;
-    /** If true, adds a border below the graphic area (when present).
-Used to visually separate the graphic from the card content. */
+    /**
+     * If true, adds a border below the graphic area (when present). Used to visually separate the graphic from the card content.
+     *
+     * Available when `hasGraphic==true`.
+     */
     graphicBorder?: boolean;
-    /** If true, adds a border to the card (top or bottom, depending on position).
-Useful for visually separating cards in a stack. */
+    /**
+     * If true, adds a border to the card (top or bottom, depending on position). Useful for visually separating cards in a stack.
+     *
+     * Available when `position!=regular`.
+     */
     border?: boolean;
-    /** If true, displays an action button in the card.
-The button's content is provided via the `action` slot.
-When set, the card is rendered as static (`isClickable` is forced false). */
+    /** If true, displays an action button in the card. The button's content is provided via the `action` slot. When set, the card is rendered as static (`isClickable` is forced false). */
     hasAction?: boolean;
-    /** If true, displays a leading icon before the label.
-The icon is provided via the `leading-icon` slot. */
+    /** If true, displays a leading icon before the label. The icon is provided via the `leading-icon` slot. */
     hasLeadingIcon?: boolean;
-    /** If true, displays a trailing icon after the content.
-The icon is provided via the `trailing-icon` slot. */
+    /** If true, displays a trailing icon after the content. The icon is provided via the `trailing-icon` slot. */
     hasTrailingIcon?: boolean;
-    /** If true, displays a prominent graphic at the top of the card.
-The graphic is provided via the `graphic` slot. */
+    /** If true, displays a prominent graphic at the top of the card. The graphic is provided via the `graphic` slot. */
     hasGraphic?: boolean;
-    /** If true, displays a status indicator in the card.
-The status content is provided via the `status` slot. */
+    /** If true, displays a status indicator in the card. The status content is provided via the `status` slot. */
     hasStatus?: boolean;
     compact?: boolean;
     directAction?: boolean;
-    /** If set, the card is rendered as a link (`<a>`) with this URL as the `href`.
-When present, the card is clickable and navigates to the specified URL. */
+    /** URL the card links to. It applies whenever the rendered tag is `<a>` — the default for a clickable card with an `href`, or `overrideTag="a"`; `isClickable=false`, `hasAction` or another `overrideTag` render a tag on which the URL has no effect. */
     href?: string | undefined;
     /** Specifies the target for the link when `href` is set (e.g., `_blank`). */
     target?: string | undefined;

package/dist/components/elevated-card-radio/ObcElevatedCardRadio.svelte

@@ -2,63 +2,50 @@
   <script lang="ts">
     export type {ObcElevatedCardPosition, ObcElevatedCardSize} from '@oicl/openbridge-webcomponents/dist/components/elevated-card/elevated-card.js';
       import '@oicl/openbridge-webcomponents/dist/components/elevated-card-radio/elevated-card-radio.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcElevatedCardPosition, ObcElevatedCardSize} from '@oicl/openbridge-webcomponents/dist/components/elevated-card/elevated-card.js';
       import type { Snippet } from 'svelte';
 
       export interface Props {
      class?: string;
      style?: string;
-      /** Controls the card's layout position. Accepts values from `ObcElevatedCardPosition` enum.
-Default is `Regular`. */
-position?: ObcElevatedCardPosition;
-      /** Sets the card's size. Accepts values from `ObcElevatedCardSize` enum.
-Default is `SingleLine`. */
-size?: ObcElevatedCardSize;
-      /** If true, displays a graphic border around the card for emphasis.
-Default is false. */
-graphicBorder?: boolean;
-      /** If true, displays a standard border around the card.
-Default is false. */
-border?: boolean;
-      /** The radio group name. Radios with the same name are grouped and only one can be selected at a time. */
-name?: string;
-      /** The value submitted with the form when this radio is selected. */
-value?: string;
-      /** The label text displayed next to the radio button. */
-label?: string;
-      /** Whether this radio is currently selected. */
-checked?: boolean;
-      /** Disables the radio button and prevents user interaction. */
-disabled?: boolean;
-      /** Marks the radio as required for form validation. */
-required?: boolean
+     /** Controls the card's layout position. Accepts values from `ObcElevatedCardPosition` enum. Default is `Regular`. */
+     position?: ObcElevatedCardPosition;
+     /** Sets the card's size. Accepts values from `ObcElevatedCardSize` enum. Default is `SingleLine`. */
+     size?: ObcElevatedCardSize;
+     /** If true, displays a graphic border around the card for emphasis. Default is false. */
+     graphicBorder?: boolean;
+     /** If true, displays a standard border around the card. Default is false. */
+     border?: boolean;
+     /** The radio group name. Radios with the same name are grouped and only one can be selected at a time. */
+     name?: string;
+     /** The value submitted with the form when this radio is selected. */
+     value?: string;
+     /** The label text displayed next to the radio button. */
+     label?: string;
+     /** Whether this radio is currently selected. */
+     checked?: boolean;
+     /** Disables the radio button and prevents user interaction. */
+     disabled?: boolean;
+     /** Marks the radio as required for form validation. */
+     required?: boolean
    }
       export interface Events {
     onChange?: (event: CustomEvent<unknown>) => void
   }
       export interface Slots {
-  leadingIcon?: Snippet;
-  label?: Snippet
+  children?: Snippet
 }
-      const {onChange, class: className, style, leadingIcon, label, ...props} = $props<Props & Events & Slots>();
+      const {onChange, class: className, style, children, ...props} = $props<Props & Events & Slots>();
 
     </script>
     <obc-elevated-card-radio
     use:setProperties={props}
     class={className}
     style={style}
-    onchange={onChange} >
+    use:forwardEvents={{'change': onChange}} >
       
-      {#if leadingIcon}
-        <div slot="leading-icon">
-          {@render leadingIcon()}
-        </div>
-      {/if}
-
-      {#if label}
-        <div slot="label">
-          {@render label()}
-        </div>
-      {/if}
+    {#if children}
+      {@render children()}
+    {/if}
     </obc-elevated-card-radio>

package/dist/components/elevated-card-radio/ObcElevatedCardRadio.svelte.d.ts

@@ -4,17 +4,13 @@ import type { Snippet } from 'svelte';
 export interface Props {
     class?: string;
     style?: string;
-    /** Controls the card's layout position. Accepts values from `ObcElevatedCardPosition` enum.
-Default is `Regular`. */
+    /** Controls the card's layout position. Accepts values from `ObcElevatedCardPosition` enum. Default is `Regular`. */
     position?: ObcElevatedCardPosition;
-    /** Sets the card's size. Accepts values from `ObcElevatedCardSize` enum.
-Default is `SingleLine`. */
+    /** Sets the card's size. Accepts values from `ObcElevatedCardSize` enum. Default is `SingleLine`. */
     size?: ObcElevatedCardSize;
-    /** If true, displays a graphic border around the card for emphasis.
-Default is false. */
+    /** If true, displays a graphic border around the card for emphasis. Default is false. */
     graphicBorder?: boolean;
-    /** If true, displays a standard border around the card.
-Default is false. */
+    /** If true, displays a standard border around the card. Default is false. */
     border?: boolean;
     /** The radio group name. Radios with the same name are grouped and only one can be selected at a time. */
     name?: string;
@@ -33,8 +29,7 @@ export interface Events {
     onChange?: (event: CustomEvent<unknown>) => void;
 }
 export interface Slots {
-    leadingIcon?: Snippet;
-    label?: Snippet;
+    children?: Snippet;
 }
 type $$ComponentProps = Props & Events & Slots;
 declare const ObcElevatedCardRadio: import("svelte").Component<$$ComponentProps, {