@oicl/openbridge-webcomponents-svelte 2.0.0-next.113 → 2.0.0-next.115

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';
 
@@ -33,7 +33,7 @@ allowDeselect?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    onchange={onChange} >
+    use:forwardEvents={{'change': onChange}} >
       
       {#if children}
         {@render children()}

package/dist/components/progress-button/ObcProgressButton.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ProgressButtonClickEvent, ProgressButtonType, ButtonStyle, ProgressMode} from '@oicl/openbridge-webcomponents/dist/components/progress-button/progress-button.js';
       import '@oicl/openbridge-webcomponents/dist/components/progress-button/progress-button.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ProgressButtonClickEvent, ProgressButtonType, ButtonStyle, ProgressMode} from '@oicl/openbridge-webcomponents/dist/components/progress-button/progress-button.js';
       import type { Snippet } from 'svelte';
 
@@ -49,7 +49,7 @@ showLabel?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    onobc-click={onObcClick} >
+    use:forwardEvents={{'obc-click': onObcClick}} >
       
       {#if leadingIcon}
         <div slot="leading-icon">

package/dist/components/radio/ObcRadio.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     
       import '@oicl/openbridge-webcomponents/dist/components/radio/radio.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       
       import type { Snippet } from 'svelte';
 
@@ -42,7 +42,7 @@ inputId?: string
     use:setProperties={props}
     class={className}
     style={style}
-    onchange={onChange} >
+    use:forwardEvents={{'change': onChange}} >
       
       {#if children}
         {@render children()}

package/dist/components/rich-button/ObcRichButton.svelte

@@ -3,7 +3,7 @@
     export type {HTMLTemplateResult} from 'lit';
 export type {RichButtonDirection} from '@oicl/openbridge-webcomponents/dist/components/rich-button/rich-button.js';
       import '@oicl/openbridge-webcomponents/dist/components/rich-button/rich-button.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {HTMLTemplateResult} from 'lit';
 import type {RichButtonDirection} from '@oicl/openbridge-webcomponents/dist/components/rich-button/rich-button.js';
       import type { Snippet } from 'svelte';
@@ -42,7 +42,7 @@ disabled?: boolean;
     use:setProperties={props}
     class={className}
     style={style}
-    onrich-button-click={onRichButtonClick} >
+    use:forwardEvents={{'rich-button-click': onRichButtonClick}} >
       
       {#if leadingIcon}
         <div slot="leading-icon">

package/dist/components/sequence-modal/ObcSequenceModal.svelte

@@ -3,7 +3,7 @@
     export type {ObcSequenceModalType} from '@oicl/openbridge-webcomponents/dist/components/sequence-modal/sequence-modal.js';
 export type {SequenceValue} from '@oicl/openbridge-webcomponents/dist/components/sequence-step/sequence-step.js';
       import '@oicl/openbridge-webcomponents/dist/components/sequence-modal/sequence-modal.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcSequenceModalType} from '@oicl/openbridge-webcomponents/dist/components/sequence-modal/sequence-modal.js';
 import type {SequenceValue} from '@oicl/openbridge-webcomponents/dist/components/sequence-step/sequence-step.js';
       import type { Snippet } from 'svelte';
@@ -36,7 +36,7 @@ import type {SequenceValue} from '@oicl/openbridge-webcomponents/dist/components
     use:setProperties={props}
     class={className}
     style={style}
-    onclose-click={onCloseClick} >
+    use:forwardEvents={{'close-click': onCloseClick}} >
       
       {#if actions}
         <div slot="actions">

package/dist/components/sequence-toolbar/ObcSequenceToolbar.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {SequenceToolbarType} from '@oicl/openbridge-webcomponents/dist/components/sequence-toolbar/sequence-toolbar.js';
       import '@oicl/openbridge-webcomponents/dist/components/sequence-toolbar/sequence-toolbar.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {SequenceToolbarType} from '@oicl/openbridge-webcomponents/dist/components/sequence-toolbar/sequence-toolbar.js';
       import type { Snippet } from 'svelte';
 
@@ -31,9 +31,7 @@
     use:setProperties={props}
     class={className}
     style={style}
-    onprev-click={onPrevClick}
-   onnext-click={onNextClick}
-   onadd-click={onAddClick} >
+    use:forwardEvents={{'prev-click': onPrevClick, 'next-click': onNextClick, 'add-click': onAddClick}} >
       
       {#if children}
         {@render children()}

package/dist/components/slide-button/ObcSlideButton.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcSlideButtonSlideEvent} from '@oicl/openbridge-webcomponents/dist/components/slide-button/slide-button.js';
       import '@oicl/openbridge-webcomponents/dist/components/slide-button/slide-button.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcSlideButtonSlideEvent} from '@oicl/openbridge-webcomponents/dist/components/slide-button/slide-button.js';
       import type { Snippet } from 'svelte';
 
@@ -32,7 +32,7 @@ autoDisable?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    onslide={onSlide} >
+    use:forwardEvents={{'slide': onSlide}} >
       
       {#if leadingIcon}
         <div slot="leading-icon">

package/dist/components/slider/ObcSlider.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcSliderValueEvent, ObcSliderChangeEvent, ObcSliderVariant} from '@oicl/openbridge-webcomponents/dist/components/slider/slider.js';
       import '@oicl/openbridge-webcomponents/dist/components/slider/slider.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcSliderValueEvent, ObcSliderChangeEvent, ObcSliderVariant} from '@oicl/openbridge-webcomponents/dist/components/slider/slider.js';
       import type { Snippet } from 'svelte';
 
@@ -72,8 +72,7 @@ seekingSpeed?: number;
     use:setProperties={props}
     class={className}
     style={style}
-    onvalue={onValue}
-   onchange={onChange} >
+    use:forwardEvents={{'value': onValue, 'change': onChange}} >
       
       {#if iconLeft}
         <div slot="icon-left">

package/dist/components/slider-double/ObcSliderDouble.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcSliderDoubleValueEvent, ObcSliderDoubleChangeEvent, ObcSliderDoubleVariant} from '@oicl/openbridge-webcomponents/dist/components/slider-double/slider-double.js';
       import '@oicl/openbridge-webcomponents/dist/components/slider-double/slider-double.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcSliderDoubleValueEvent, ObcSliderDoubleChangeEvent, ObcSliderDoubleVariant} from '@oicl/openbridge-webcomponents/dist/components/slider-double/slider-double.js';
       import type { Snippet } from 'svelte';
 
@@ -80,8 +80,7 @@ hugContainer?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    onvalue={onValue}
-   onchange={onChange} >
+    use:forwardEvents={{'value': onValue, 'change': onChange}} >
       
       {#if leftReadout}
         <div slot="left-readout">

package/dist/components/split-button/ObcSplitButton.svelte

@@ -3,7 +3,7 @@
     export type {ObcSplitButtonClickEvent, ObcSplitButtonChangeEvent} from '@oicl/openbridge-webcomponents/dist/components/split-button/split-button.js';
 export type {ContextMenuOption, ContextMenuType, ColumnGroup} from '@oicl/openbridge-webcomponents/dist/components/context-menu-input/context-menu-input.js';
       import '@oicl/openbridge-webcomponents/dist/components/split-button/split-button.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcSplitButtonClickEvent, ObcSplitButtonChangeEvent} from '@oicl/openbridge-webcomponents/dist/components/split-button/split-button.js';
 import type {ContextMenuOption, ContextMenuType, ColumnGroup} from '@oicl/openbridge-webcomponents/dist/components/context-menu-input/context-menu-input.js';
       import type { Snippet } from 'svelte';
@@ -68,8 +68,7 @@ columnGroups?: ColumnGroup[]
     use:setProperties={props}
     class={className}
     style={style}
-    onclick={onClick}
-   onchange={onChange} >
+    use:forwardEvents={{'click': onClick, 'change': onChange}} >
       
       {#if icon}
         <div slot="icon">

package/dist/components/start-stop-switch/ObcStartStopSwitch.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcStartStopSwitchChangeEvent, StartStopSwitchVariant, StartStopSwitchSize} from '@oicl/openbridge-webcomponents/dist/components/start-stop-switch/start-stop-switch.js';
       import '@oicl/openbridge-webcomponents/dist/components/start-stop-switch/start-stop-switch.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcStartStopSwitchChangeEvent, StartStopSwitchVariant, StartStopSwitchSize} from '@oicl/openbridge-webcomponents/dist/components/start-stop-switch/start-stop-switch.js';
       import type { Snippet } from 'svelte';
 
@@ -81,7 +81,7 @@ description?: string
     use:setProperties={props}
     class={className}
     style={style}
-    onchange={onChange} >
+    use:forwardEvents={{'change': onChange}} >
       
       {#if checkedStateIcon}
         <div slot="checked-state-icon">

package/dist/components/stepper-box/ObcStepperBox.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcStepperBoxType} from '@oicl/openbridge-webcomponents/dist/components/stepper-box/stepper-box.js';
       import '@oicl/openbridge-webcomponents/dist/components/stepper-box/stepper-box.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcStepperBoxType} from '@oicl/openbridge-webcomponents/dist/components/stepper-box/stepper-box.js';
       import type { Snippet } from 'svelte';
 
@@ -54,10 +54,7 @@ readonly?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    ondown={onDown}
-   onup={onUp}
-   oninput={onInput}
-   onchange={onChange} >
+    use:forwardEvents={{'down': onDown, 'up': onUp, 'input': onInput, 'change': onChange}} >
       
     {#if children}
       {@render children()}

package/dist/components/system-button/ObcSystemButton.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {SystemState, SystemButtonVariant, ActivePanel} from '@oicl/openbridge-webcomponents/dist/components/system-button/system-button.js';
       import '@oicl/openbridge-webcomponents/dist/components/system-button/system-button.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {SystemState, SystemButtonVariant, ActivePanel} from '@oicl/openbridge-webcomponents/dist/components/system-button/system-button.js';
       import type { Snippet } from 'svelte';
 
@@ -48,11 +48,7 @@ activePanel?: ActivePanel | null
     use:setProperties={props}
     class={className}
     style={style}
-    onmenu-toggle={onMenuToggle}
-   onsystem-state-change={onSystemStateChange}
-   onmicrophone-panel-open={onMicrophonePanelOpen}
-   onvolume-panel-open={onVolumePanelOpen}
-   onsystem-icons-panel-open={onSystemIconsPanelOpen} >
+    use:forwardEvents={{'menu-toggle': onMenuToggle, 'system-state-change': onSystemStateChange, 'microphone-panel-open': onMicrophonePanelOpen, 'volume-panel-open': onVolumePanelOpen, 'system-icons-panel-open': onSystemIconsPanelOpen}} >
       
     {#if children}
       {@render children()}

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

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {WifiState, AudioState, MicrophoneState, BatteryState, SystemSubMenu} from '@oicl/openbridge-webcomponents/dist/components/system-menu/system-menu.js';
       import '@oicl/openbridge-webcomponents/dist/components/system-menu/system-menu.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {WifiState, AudioState, MicrophoneState, BatteryState, SystemSubMenu} from '@oicl/openbridge-webcomponents/dist/components/system-menu/system-menu.js';
       import type { Snippet } from 'svelte';
 
@@ -46,21 +46,7 @@
     use:setProperties={props}
     class={className}
     style={style}
-    onwifi-click={onWifiClick}
-   onaudio-click={onAudioClick}
-   onaudio-volume-change={onAudioVolumeChange}
-   onmicrophone-click={onMicrophoneClick}
-   onpush-to-talk-change={onPushToTalkChange}
-   onbattery-usage-click={onBatteryUsageClick}
-   onbattery-saving-mode-change={onBatterySavingModeChange}
-   onbattery-mode-change={onBatteryModeChange}
-   onwifi-network-change={onWifiNetworkChange}
-   onaudio-output-change={onAudioOutputChange}
-   onmicrophone-input-change={onMicrophoneInputChange}
-   onsettings-click={onSettingsClick}
-   onto-sub-menu-click={onToSubMenuClick}
-   onwifi-options-click={onWifiOptionsClick}
-   onwifi-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}} >
       
       {#if batteryStatus}
         <div slot="battery-status">

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

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {TabItemBadge} from '@oicl/openbridge-webcomponents/dist/components/tab-item/tab-item.js';
       import '@oicl/openbridge-webcomponents/dist/components/tab-item/tab-item.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {TabItemBadge} from '@oicl/openbridge-webcomponents/dist/components/tab-item/tab-item.js';
       import type { Snippet } from 'svelte';
 
@@ -98,8 +98,7 @@ disabled?: boolean;
     use:setProperties={props}
     class={className}
     style={style}
-    ontab-click={onTabClick}
-   ontab-close={onTabClose} >
+    use:forwardEvents={{'tab-click': onTabClick, 'tab-close': onTabClose}} >
       
       {#if leadingIcon}
         <div slot="leading-icon">

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

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {TabData} from '@oicl/openbridge-webcomponents/dist/components/tab-row/tab-row.js';
       import '@oicl/openbridge-webcomponents/dist/components/tab-row/tab-row.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {TabData} from '@oicl/openbridge-webcomponents/dist/components/tab-row/tab-row.js';
       import type { Snippet } from 'svelte';
 
@@ -63,9 +63,7 @@ hasAddNewTab?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    ontab-selected={onTabSelected}
-   ontab-closed={onTabClosed}
-   onadd-new-tab={onAddNewTab} >
+    use:forwardEvents={{'tab-selected': onTabSelected, 'tab-closed': onTabClosed, 'add-new-tab': onAddNewTab}} >
       
       {#if props.tabs && tabIcon}
         {#each props.tabs as item}

package/dist/components/tabbed-card/ObcTabbedCard.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     
       import '@oicl/openbridge-webcomponents/dist/components/tabbed-card/tabbed-card.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       
       import type { Snippet } from 'svelte';
 
@@ -47,7 +47,7 @@ hasTabIcons?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    ontab-change={onTabChange} >
+    use:forwardEvents={{'tab-change': onTabChange}} >
       
       {#if children}
         {@render children()}

package/dist/components/table/ObcTable.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcTableRowClickEvent, ObcTableCellClickEvent, ObcTableCellCheckboxChangeEvent, ObcTableCellTagClickEvent, ObcTableSelectionChangeEvent, ObcTableRow, ObcTableColumn, ObcTableCellData} from '@oicl/openbridge-webcomponents/dist/components/table/table.js';
       import '@oicl/openbridge-webcomponents/dist/components/table/table.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcTableRowClickEvent, ObcTableCellClickEvent, ObcTableCellCheckboxChangeEvent, ObcTableCellTagClickEvent, ObcTableSelectionChangeEvent, ObcTableRow, ObcTableColumn, ObcTableCellData} from '@oicl/openbridge-webcomponents/dist/components/table/table.js';
       import type { Snippet } from 'svelte';
 
@@ -37,11 +37,7 @@
     use:setProperties={props}
     class={className}
     style={style}
-    onrow-click={onRowClick}
-   oncell-button-click={onCellButtonClick}
-   oncell-checkbox-change={onCellCheckboxChange}
-   oncell-tag-click={onCellTagClick}
-   onselection-change={onSelectionChange} >
+    use:forwardEvents={{'row-click': onRowClick, 'cell-button-click': onCellButtonClick, 'cell-checkbox-change': onCellCheckboxChange, 'cell-tag-click': onCellTagClick, 'selection-change': onSelectionChange}} >
       
     {#if children}
       {@render children()}

package/dist/components/text-input-field/ObcTextInputField.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {HTMLInputTypeAttribute, ObcTextInputFieldTextAlign, ObcTextInputFieldSize, ObcTextInputFieldPlacement} from '@oicl/openbridge-webcomponents/dist/components/text-input-field/text-input-field.js';
       import '@oicl/openbridge-webcomponents/dist/components/text-input-field/text-input-field.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {HTMLInputTypeAttribute, ObcTextInputFieldTextAlign, ObcTextInputFieldSize, ObcTextInputFieldPlacement} from '@oicl/openbridge-webcomponents/dist/components/text-input-field/text-input-field.js';
       import type { Snippet } from 'svelte';
 
@@ -60,10 +60,7 @@ hasClearButton?: boolean;
     use:setProperties={props}
     class={className}
     style={style}
-    oninput={onInput}
-   onchange={onChange}
-   onclear={onClear}
-   onblur={onBlur} >
+    use:forwardEvents={{'input': onInput, 'change': onChange, 'clear': onClear, 'blur': onBlur}} >
       
       {#if leadingIcon}
         <div slot="leading-icon">

package/dist/components/textarea-field/ObcTextareaField.svelte

@@ -3,7 +3,7 @@
     export type {VoiceActionDetail, TextareaFieldType, Attachment} from '@oicl/openbridge-webcomponents/dist/components/textarea-field/textarea-field.js';
 export type {AudioRecordingStatus} from '@oicl/openbridge-webcomponents/dist/components/audio-recording-item/audio-recording-item.js';
       import '@oicl/openbridge-webcomponents/dist/components/textarea-field/textarea-field.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {VoiceActionDetail, TextareaFieldType, Attachment} from '@oicl/openbridge-webcomponents/dist/components/textarea-field/textarea-field.js';
 import type {AudioRecordingStatus} from '@oicl/openbridge-webcomponents/dist/components/audio-recording-item/audio-recording-item.js';
       import type { Snippet } from 'svelte';
@@ -85,16 +85,7 @@ attachments?: Attachment[]
     use:setProperties={props}
     class={className}
     style={style}
-    onchange={onChange}
-   oninput={onInput}
-   onblur={onBlur}
-   onsend-click={onSendClick}
-   onadd-click={onAddClick}
-   onscreenshot-click={onScreenshotClick}
-   onimage-click={onImageClick}
-   onattachment-click={onAttachmentClick}
-   onvoice-action={onVoiceAction}
-   onattachment-remove={onAttachmentRemove} >
+    use:forwardEvents={{'change': onChange, 'input': onInput, 'blur': onBlur, 'send-click': onSendClick, 'add-click': onAddClick, 'screenshot-click': onScreenshotClick, 'image-click': onImageClick, 'attachment-click': onAttachmentClick, 'voice-action': onVoiceAction, 'attachment-remove': onAttachmentRemove}} >
       
       {#if leadingIcon}
         <div slot="leading-icon">

package/dist/components/title-container/ObcTitleContainer.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcTitleContainerState} from '@oicl/openbridge-webcomponents/dist/components/title-container/title-container.js';
       import '@oicl/openbridge-webcomponents/dist/components/title-container/title-container.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcTitleContainerState} from '@oicl/openbridge-webcomponents/dist/components/title-container/title-container.js';
       import type { Snippet } from 'svelte';
 
@@ -29,7 +29,7 @@
     use:setProperties={props}
     class={className}
     style={style}
-    onaction-click={onActionClick} >
+    use:forwardEvents={{'action-click': onActionClick}} >
       
       {#if icon}
         <div slot="icon">

package/dist/components/toggle-button-group/ObcToggleButtonGroup.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcToggleButtonOptionType, ObcToggleButtonOptionVariant} from '@oicl/openbridge-webcomponents/dist/components/toggle-button-option/toggle-button-option.js';
       import '@oicl/openbridge-webcomponents/dist/components/toggle-button-group/toggle-button-group.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcToggleButtonOptionType, ObcToggleButtonOptionVariant} from '@oicl/openbridge-webcomponents/dist/components/toggle-button-option/toggle-button-option.js';
       import type { Snippet } from 'svelte';
 
@@ -78,8 +78,7 @@ large?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    onvalue={onValue}
-   onchange={onChange} >
+    use:forwardEvents={{'value': onValue, 'change': onChange}} >
       
       {#if children}
         {@render children()}

package/dist/components/toggle-button-option/ObcToggleButtonOption.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcToggleButtonOptionType, ObcToggleButtonOptionVariant} from '@oicl/openbridge-webcomponents/dist/components/toggle-button-option/toggle-button-option.js';
       import '@oicl/openbridge-webcomponents/dist/components/toggle-button-option/toggle-button-option.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcToggleButtonOptionType, ObcToggleButtonOptionVariant} from '@oicl/openbridge-webcomponents/dist/components/toggle-button-option/toggle-button-option.js';
       import type { Snippet } from 'svelte';
 
@@ -45,7 +45,7 @@ large?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    onselected={onSelected} >
+    use:forwardEvents={{'selected': onSelected}} >
       
       {#if children}
         {@render children()}

package/dist/components/toggle-button-three-state/ObcToggleButtonThreeState.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcToggleButtonThreeStateChangeEvent, ObcToggleButtonThreeStateValue} from '@oicl/openbridge-webcomponents/dist/components/toggle-button-three-state/toggle-button-three-state.js';
       import '@oicl/openbridge-webcomponents/dist/components/toggle-button-three-state/toggle-button-three-state.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcToggleButtonThreeStateChangeEvent, ObcToggleButtonThreeStateValue} from '@oicl/openbridge-webcomponents/dist/components/toggle-button-three-state/toggle-button-three-state.js';
       import type { Snippet } from 'svelte';
 
@@ -27,7 +27,7 @@ disabled?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    onchange={onChange} >
+    use:forwardEvents={{'change': onChange}} >
       
     {#if children}
       {@render children()}

package/dist/components/toggle-button-vertical-group/ObcToggleButtonVerticalGroup.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcToggleButtonVerticalOptionType} from '@oicl/openbridge-webcomponents/dist/components/toggle-button-vertical-option/toggle-button-vertical-option.js';
       import '@oicl/openbridge-webcomponents/dist/components/toggle-button-vertical-group/toggle-button-vertical-group.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcToggleButtonVerticalOptionType} from '@oicl/openbridge-webcomponents/dist/components/toggle-button-vertical-option/toggle-button-vertical-option.js';
       import type { Snippet } from 'svelte';
 
@@ -50,8 +50,7 @@ disabled?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    onvalue={onValue}
-   onchange={onChange} >
+    use:forwardEvents={{'value': onValue, 'change': onChange}} >
       
       {#if children}
         {@render children()}

package/dist/components/toggle-button-vertical-option/ObcToggleButtonVerticalOption.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcToggleButtonVerticalOptionType, ObcToggleButtonLabelPlacement} from '@oicl/openbridge-webcomponents/dist/components/toggle-button-vertical-option/toggle-button-vertical-option.js';
       import '@oicl/openbridge-webcomponents/dist/components/toggle-button-vertical-option/toggle-button-vertical-option.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcToggleButtonVerticalOptionType, ObcToggleButtonLabelPlacement} from '@oicl/openbridge-webcomponents/dist/components/toggle-button-vertical-option/toggle-button-vertical-option.js';
       import type { Snippet } from 'svelte';
 
@@ -45,7 +45,7 @@ labelPlacement?: ObcToggleButtonLabelPlacement
     use:setProperties={props}
     class={className}
     style={style}
-    onselected={onSelected} >
+    use:forwardEvents={{'selected': onSelected}} >
       
       {#if icon}
         <div slot="icon">

package/dist/components/toggle-switch/ObcToggleSwitch.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     
       import '@oicl/openbridge-webcomponents/dist/components/toggle-switch/toggle-switch.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       
       import type { Snippet } from 'svelte';
 
@@ -45,8 +45,7 @@ externalControl?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    oninput={onInput}
-   onchange={onChange} >
+    use:forwardEvents={{'input': onInput, 'change': onChange}} >
       
       {#if icon}
         <div slot="icon">

package/dist/components/toggletip/ObcToggletip.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ToggletipVariant} from '@oicl/openbridge-webcomponents/dist/components/toggletip/toggletip.js';
       import '@oicl/openbridge-webcomponents/dist/components/toggletip/toggletip.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ToggletipVariant} from '@oicl/openbridge-webcomponents/dist/components/toggletip/toggletip.js';
       import type { Snippet } from 'svelte';
 
@@ -62,8 +62,7 @@ secondaryButtonLabel?: string
     use:setProperties={props}
     class={className}
     style={style}
-    onprimary-action={onPrimaryAction}
-   onsecondary-action={onSecondaryAction} >
+    use:forwardEvents={{'primary-action': onPrimaryAction, 'secondary-action': onSecondaryAction}} >
       
       {#if leadingIcon}
         <div slot="leading-icon">

package/dist/components/top-bar/ObcTopBar.svelte

@@ -3,7 +3,7 @@
     export type {BreadcrumbClickEvent, BreadcrumbItem} from '@oicl/openbridge-webcomponents/dist/components/breadcrumb/breadcrumb.js';
 export type {ObcTopBarMenuButtonIcon} from '@oicl/openbridge-webcomponents/dist/components/top-bar/top-bar.js';
       import '@oicl/openbridge-webcomponents/dist/components/top-bar/top-bar.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {BreadcrumbClickEvent, BreadcrumbItem} from '@oicl/openbridge-webcomponents/dist/components/breadcrumb/breadcrumb.js';
 import type {ObcTopBarMenuButtonIcon} from '@oicl/openbridge-webcomponents/dist/components/top-bar/top-bar.js';
       import type { Snippet } from 'svelte';
@@ -86,16 +86,7 @@ breadcrumbItems?: BreadcrumbItem[]
     use:setProperties={props}
     class={className}
     style={style}
-    onmenu-button-clicked={onMenuButtonClicked}
-   ondimming-button-clicked={onDimmingButtonClicked}
-   onapps-button-clicked={onAppsButtonClicked}
-   onleft-more-button-clicked={onLeftMoreButtonClicked}
-   onuser-button-clicked={onUserButtonClicked}
-   onclose={onClose}
-   onback={onBack}
-   onemergency-brightness-start={onEmergencyBrightnessStart}
-   onemergency-brightness-stop={onEmergencyBrightnessStop}
-   onbreadcrumb-click={onBreadcrumbClick} >
+    use:forwardEvents={{'menu-button-clicked': onMenuButtonClicked, 'dimming-button-clicked': onDimmingButtonClicked, 'apps-button-clicked': onAppsButtonClicked, 'left-more-button-clicked': onLeftMoreButtonClicked, 'user-button-clicked': onUserButtonClicked, 'close': onClose, 'back': onBack, 'emergency-brightness-start': onEmergencyBrightnessStart, 'emergency-brightness-stop': onEmergencyBrightnessStop, 'breadcrumb-click': onBreadcrumbClick}} >
       
       {#if appIcon}
         <div slot="app-icon">

package/dist/components/topbar-message-item/ObcTopbarMessageItem.svelte

@@ -2,7 +2,7 @@
   <script lang="ts">
     export type {ObcTopbarMessageItemType, ObcTopbarMessageItemSize} from '@oicl/openbridge-webcomponents/dist/components/topbar-message-item/topbar-message-item.js';
       import '@oicl/openbridge-webcomponents/dist/components/topbar-message-item/topbar-message-item.js';
-      import { setProperties } from "../../util.js";
+      import { setProperties, forwardEvents } from "../../util.js";
       import type {ObcTopbarMessageItemType, ObcTopbarMessageItemSize} from '@oicl/openbridge-webcomponents/dist/components/topbar-message-item/topbar-message-item.js';
       import type { Snippet } from 'svelte';
 
@@ -58,8 +58,7 @@ hasSecondaryIcon?: boolean
     use:setProperties={props}
     class={className}
     style={style}
-    onmessage-click={onMessageClick}
-   onaction-click={onActionClick} >
+    use:forwardEvents={{'message-click': onMessageClick, 'action-click': onActionClick}} >
       
       {#if primaryIcon}
         <div slot="primary-icon">