@m3e/react 2.1.0 → 2.1.2

package/dist/all.js

@@ -3,7 +3,6 @@
  * Copyright (c) 2025 matraic
  * See LICENSE file in the project root for full license text.
  */
-
 import React from 'react';
 import { createComponent } from '@lit/react';
 import { M3eAppBarElement } from '@m3e/web/app-bar';
@@ -67,9 +66,9 @@ import { M3eRichTooltipElement, M3eRichTooltipActionElement, M3eTooltipElement }
  * styling, accessibility, and supported events.
  */
 const M3eAppBar = createComponent({
-    tagName: "m3e-app-bar",
-    elementClass: M3eAppBarElement,
-    react: React,
+  tagName: "m3e-app-bar",
+  elementClass: M3eAppBarElement,
+  react: React
 });
 
 /**
@@ -86,13 +85,13 @@ const M3eAppBar = createComponent({
  * styling, accessibility, and supported events.
  */
 const M3eAutocomplete = createComponent({
-    tagName: "m3e-autocomplete",
-    elementClass: M3eAutocompleteElement,
-    react: React,
-    events: {
-        onToggle: "toggle",
-        onQuery: "query",
-    },
+  tagName: "m3e-autocomplete",
+  elementClass: M3eAutocompleteElement,
+  react: React,
+  events: {
+    onToggle: "toggle",
+    onQuery: "query"
+  }
 });
 
 /**
@@ -109,9 +108,9 @@ const M3eAutocomplete = createComponent({
  * styling, accessibility, and supported events.
  */
 const M3eAvatar = createComponent({
-    tagName: "m3e-avatar",
-    elementClass: M3eAvatarElement,
-    react: React,
+  tagName: "m3e-avatar",
+  elementClass: M3eAvatarElement,
+  react: React
 });
 
 /**
@@ -128,9 +127,9 @@ const M3eAvatar = createComponent({
  * styling, accessibility, and supported events.
  */
 const M3eBadge = createComponent({
-    tagName: "m3e-badge",
-    elementClass: M3eBadgeElement,
-    react: React,
+  tagName: "m3e-badge",
+  elementClass: M3eBadgeElement,
+  react: React
 });
 
 /**
@@ -147,16 +146,16 @@ const M3eBadge = createComponent({
  * accessibility, and supported events.
  */
 const M3eBottomSheet = createComponent({
-    tagName: "m3e-bottom-sheet",
-    elementClass: M3eBottomSheetElement,
-    react: React,
-    events: {
-        onOpening: "opening",
-        onOpened: "opened",
-        onClosing: "closing",
-        onClosed: "closed",
-        onCancel: "cancel",
-    },
+  tagName: "m3e-bottom-sheet",
+  elementClass: M3eBottomSheetElement,
+  react: React,
+  events: {
+    onOpening: "opening",
+    onOpened: "opened",
+    onClosing: "closing",
+    onClosed: "closed",
+    onCancel: "cancel"
+  }
 });
 
 /**
@@ -173,9 +172,9 @@ const M3eBottomSheet = createComponent({
  * accessibility, and supported events.
  */
 const M3eBottomSheetAction = createComponent({
-    tagName: "m3e-bottom-sheet-action",
-    elementClass: M3eBottomSheetActionElement,
-    react: React,
+  tagName: "m3e-bottom-sheet-action",
+  elementClass: M3eBottomSheetActionElement,
+  react: React
 });
 
 /**
@@ -192,9 +191,9 @@ const M3eBottomSheetAction = createComponent({
  * accessibility, and supported events.
  */
 const M3eBottomSheetTrigger = createComponent({
-    tagName: "m3e-bottom-sheet-trigger",
-    elementClass: M3eBottomSheetTriggerElement,
-    react: React,
+  tagName: "m3e-bottom-sheet-trigger",
+  elementClass: M3eBottomSheetTriggerElement,
+  react: React
 });
 
 /**
@@ -211,14 +210,14 @@ const M3eBottomSheetTrigger = createComponent({
  * styling, accessibility, and supported events.
  */
 const M3eButton = createComponent({
-    tagName: "m3e-button",
-    elementClass: M3eButtonElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-        onClick: "click",
-    },
+  tagName: "m3e-button",
+  elementClass: M3eButtonElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change",
+    onClick: "click"
+  }
 });
 
 /**
@@ -235,9 +234,9 @@ const M3eButton = createComponent({
  * styling, accessibility, and supported events.
  */
 const M3eButtonGroup = createComponent({
-    tagName: "m3e-button-group",
-    elementClass: M3eButtonGroupElement,
-    react: React,
+  tagName: "m3e-button-group",
+  elementClass: M3eButtonGroupElement,
+  react: React
 });
 
 /**
@@ -254,12 +253,12 @@ const M3eButtonGroup = createComponent({
  * styling, accessibility, and supported events.
  */
 const M3eCard = createComponent({
-    tagName: "m3e-card",
-    elementClass: M3eCardElement,
-    react: React,
-    events: {
-        onClick: "click",
-    },
+  tagName: "m3e-card",
+  elementClass: M3eCardElement,
+  react: React,
+  events: {
+    onClick: "click"
+  }
 });
 
 /**
@@ -276,15 +275,15 @@ const M3eCard = createComponent({
  * styling, accessibility, and supported events.
  */
 const M3eCheckbox = createComponent({
-    tagName: "m3e-checkbox",
-    elementClass: M3eCheckboxElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onInvalid: "invalid",
-        onChange: "change",
-        onClick: "click",
-    },
+  tagName: "m3e-checkbox",
+  elementClass: M3eCheckboxElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onInvalid: "invalid",
+    onChange: "change",
+    onClick: "click"
+  }
 });
 
 /**
@@ -301,12 +300,12 @@ const M3eCheckbox = createComponent({
  * accessibility, and supported events.
  */
 const M3eAssistChip = createComponent({
-    tagName: "m3e-assist-chip",
-    elementClass: M3eAssistChipElement,
-    react: React,
-    events: {
-        onClick: "click",
-    },
+  tagName: "m3e-assist-chip",
+  elementClass: M3eAssistChipElement,
+  react: React,
+  events: {
+    onClick: "click"
+  }
 });
 
 /**
@@ -323,9 +322,9 @@ const M3eAssistChip = createComponent({
  * accessibility, and supported events.
  */
 const M3eChip = createComponent({
-    tagName: "m3e-chip",
-    elementClass: M3eChipElement,
-    react: React,
+  tagName: "m3e-chip",
+  elementClass: M3eChipElement,
+  react: React
 });
 
 /**
@@ -342,9 +341,9 @@ const M3eChip = createComponent({
  * accessibility, and supported events.
  */
 const M3eChipSet = createComponent({
-    tagName: "m3e-chip-set",
-    elementClass: M3eChipSetElement,
-    react: React,
+  tagName: "m3e-chip-set",
+  elementClass: M3eChipSetElement,
+  react: React
 });
 
 /**
@@ -361,14 +360,14 @@ const M3eChipSet = createComponent({
  * accessibility, and supported events.
  */
 const M3eFilterChip = createComponent({
-    tagName: "m3e-filter-chip",
-    elementClass: M3eFilterChipElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-        onClick: "click",
-    },
+  tagName: "m3e-filter-chip",
+  elementClass: M3eFilterChipElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change",
+    onClick: "click"
+  }
 });
 
 /**
@@ -385,13 +384,13 @@ const M3eFilterChip = createComponent({
  * accessibility, and supported events.
  */
 const M3eFilterChipSet = createComponent({
-    tagName: "m3e-filter-chip-set",
-    elementClass: M3eFilterChipSetElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-    },
+  tagName: "m3e-filter-chip-set",
+  elementClass: M3eFilterChipSetElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change"
+  }
 });
 
 /**
@@ -408,13 +407,13 @@ const M3eFilterChipSet = createComponent({
  * accessibility, and supported events.
  */
 const M3eInputChip = createComponent({
-    tagName: "m3e-input-chip",
-    elementClass: M3eInputChipElement,
-    react: React,
-    events: {
-        onClick: "click",
-        onRemove: "remove",
-    },
+  tagName: "m3e-input-chip",
+  elementClass: M3eInputChipElement,
+  react: React,
+  events: {
+    onClick: "click",
+    onRemove: "remove"
+  }
 });
 
 /**
@@ -431,12 +430,12 @@ const M3eInputChip = createComponent({
  * accessibility, and supported events.
  */
 const M3eInputChipSet = createComponent({
-    tagName: "m3e-input-chip-set",
-    elementClass: M3eInputChipSetElement,
-    react: React,
-    events: {
-        onChange: "change",
-    },
+  tagName: "m3e-input-chip-set",
+  elementClass: M3eInputChipSetElement,
+  react: React,
+  events: {
+    onChange: "change"
+  }
 });
 
 /**
@@ -453,12 +452,12 @@ const M3eInputChipSet = createComponent({
  * accessibility, and supported events.
  */
 const M3eSuggestionChip = createComponent({
-    tagName: "m3e-suggestion-chip",
-    elementClass: M3eSuggestionChipElement,
-    react: React,
-    events: {
-        onClick: "click",
-    },
+  tagName: "m3e-suggestion-chip",
+  elementClass: M3eSuggestionChipElement,
+  react: React,
+  events: {
+    onClick: "click"
+  }
 });
 
 /**
@@ -475,15 +474,15 @@ const M3eSuggestionChip = createComponent({
  * accessibility, and supported events.
  */
 const M3eCollapsible = createComponent({
-    tagName: "m3e-collapsible",
-    elementClass: M3eCollapsibleElement,
-    react: React,
-    events: {
-        onOpening: "opening",
-        onOpened: "opened",
-        onClosing: "closing",
-        onClosed: "closed",
-    },
+  tagName: "m3e-collapsible",
+  elementClass: M3eCollapsibleElement,
+  react: React,
+  events: {
+    onOpening: "opening",
+    onOpened: "opened",
+    onClosing: "closing",
+    onClosed: "closed"
+  }
 });
 
 /**
@@ -500,9 +499,9 @@ const M3eCollapsible = createComponent({
  * accessibility, and supported events.
  */
 const M3eElevation = createComponent({
-    tagName: "m3e-elevation",
-    elementClass: M3eElevationElement,
-    react: React,
+  tagName: "m3e-elevation",
+  elementClass: M3eElevationElement,
+  react: React
 });
 
 /**
@@ -519,9 +518,9 @@ const M3eElevation = createComponent({
  * accessibility, and supported events.
  */
 const M3eFocusRing = createComponent({
-    tagName: "m3e-focus-ring",
-    elementClass: M3eFocusRingElement,
-    react: React,
+  tagName: "m3e-focus-ring",
+  elementClass: M3eFocusRingElement,
+  react: React
 });
 
 /**
@@ -538,9 +537,9 @@ const M3eFocusRing = createComponent({
  * accessibility, and supported events.
  */
 const M3ePseudoCheckbox = createComponent({
-    tagName: "m3e-pseudo-checkbox",
-    elementClass: M3ePseudoCheckboxElement,
-    react: React,
+  tagName: "m3e-pseudo-checkbox",
+  elementClass: M3ePseudoCheckboxElement,
+  react: React
 });
 
 /**
@@ -557,9 +556,9 @@ const M3ePseudoCheckbox = createComponent({
  * accessibility, and supported events.
  */
 const M3ePseudoRadio = createComponent({
-    tagName: "m3e-pseudo-radio",
-    elementClass: M3ePseudoRadioElement,
-    react: React,
+  tagName: "m3e-pseudo-radio",
+  elementClass: M3ePseudoRadioElement,
+  react: React
 });
 
 /**
@@ -576,9 +575,9 @@ const M3ePseudoRadio = createComponent({
  * accessibility, and supported events.
  */
 const M3eRipple = createComponent({
-    tagName: "m3e-ripple",
-    elementClass: M3eRippleElement,
-    react: React,
+  tagName: "m3e-ripple",
+  elementClass: M3eRippleElement,
+  react: React
 });
 
 /**
@@ -595,9 +594,9 @@ const M3eRipple = createComponent({
  * accessibility, and supported events.
  */
 const M3eScrollContainer = createComponent({
-    tagName: "m3e-scroll-container",
-    elementClass: M3eScrollContainerElement,
-    react: React,
+  tagName: "m3e-scroll-container",
+  elementClass: M3eScrollContainerElement,
+  react: React
 });
 
 /**
@@ -614,9 +613,9 @@ const M3eScrollContainer = createComponent({
  * accessibility, and supported events.
  */
 const M3eSlide = createComponent({
-    tagName: "m3e-slide",
-    elementClass: M3eSlideElement,
-    react: React,
+  tagName: "m3e-slide",
+  elementClass: M3eSlideElement,
+  react: React
 });
 
 /**
@@ -633,9 +632,9 @@ const M3eSlide = createComponent({
  * accessibility, and supported events.
  */
 const M3eStateLayer = createComponent({
-    tagName: "m3e-state-layer",
-    elementClass: M3eStateLayerElement,
-    react: React,
+  tagName: "m3e-state-layer",
+  elementClass: M3eStateLayerElement,
+  react: React
 });
 
 /**
@@ -652,9 +651,9 @@ const M3eStateLayer = createComponent({
  * accessibility, and supported events.
  */
 const M3eTextHighlight = createComponent({
-    tagName: "m3e-text-highlight",
-    elementClass: M3eTextHighlightElement,
-    react: React,
+  tagName: "m3e-text-highlight",
+  elementClass: M3eTextHighlightElement,
+  react: React
 });
 
 /**
@@ -671,9 +670,9 @@ const M3eTextHighlight = createComponent({
  * accessibility, and supported events.
  */
 const M3eTextOverflow = createComponent({
-    tagName: "m3e-text-overflow",
-    elementClass: M3eTextOverflowElement,
-    react: React,
+  tagName: "m3e-text-overflow",
+  elementClass: M3eTextOverflowElement,
+  react: React
 });
 
 /**
@@ -690,16 +689,16 @@ const M3eTextOverflow = createComponent({
  * styling, accessibility, and supported events.
  */
 const M3eDialog = createComponent({
-    tagName: "m3e-dialog",
-    elementClass: M3eDialogElement,
-    react: React,
-    events: {
-        onOpening: "opening",
-        onOpened: "opened",
-        onClosing: "closing",
-        onClosed: "closed",
-        onCancel: "cancel",
-    },
+  tagName: "m3e-dialog",
+  elementClass: M3eDialogElement,
+  react: React,
+  events: {
+    onOpening: "opening",
+    onOpened: "opened",
+    onClosing: "closing",
+    onClosed: "closed",
+    onCancel: "cancel"
+  }
 });
 
 /**
@@ -716,9 +715,9 @@ const M3eDialog = createComponent({
  * accessibility, and supported events.
  */
 const M3eDialogAction = createComponent({
-    tagName: "m3e-dialog-action",
-    elementClass: M3eDialogActionElement,
-    react: React,
+  tagName: "m3e-dialog-action",
+  elementClass: M3eDialogActionElement,
+  react: React
 });
 
 /**
@@ -735,9 +734,9 @@ const M3eDialogAction = createComponent({
  * accessibility, and supported events.
  */
 const M3eDialogTrigger = createComponent({
-    tagName: "m3e-dialog-trigger",
-    elementClass: M3eDialogTriggerElement,
-    react: React,
+  tagName: "m3e-dialog-trigger",
+  elementClass: M3eDialogTriggerElement,
+  react: React
 });
 
 /**
@@ -754,9 +753,9 @@ const M3eDialogTrigger = createComponent({
  * styling, accessibility, and supported events.
  */
 const M3eDivider = createComponent({
-    tagName: "m3e-divider",
-    elementClass: M3eDividerElement,
-    react: React,
+  tagName: "m3e-divider",
+  elementClass: M3eDividerElement,
+  react: React
 });
 
 /**
@@ -773,12 +772,12 @@ const M3eDivider = createComponent({
  * styling, accessibility, and supported events.
  */
 const M3eDrawerContainer = createComponent({
-    tagName: "m3e-drawer-container",
-    elementClass: M3eDrawerContainerElement,
-    react: React,
-    events: {
-        onChange: "change",
-    },
+  tagName: "m3e-drawer-container",
+  elementClass: M3eDrawerContainerElement,
+  react: React,
+  events: {
+    onChange: "change"
+  }
 });
 
 /**
@@ -795,9 +794,9 @@ const M3eDrawerContainer = createComponent({
  * accessibility, and supported events.
  */
 const M3eDrawerToggle = createComponent({
-    tagName: "m3e-drawer-toggle",
-    elementClass: M3eDrawerToggleElement,
-    react: React,
+  tagName: "m3e-drawer-toggle",
+  elementClass: M3eDrawerToggleElement,
+  react: React
 });
 
 /**
@@ -814,9 +813,9 @@ const M3eDrawerToggle = createComponent({
  * accessibility, and supported events.
  */
 const M3eAccordion = createComponent({
-    tagName: "m3e-accordion",
-    elementClass: M3eAccordionElement,
-    react: React,
+  tagName: "m3e-accordion",
+  elementClass: M3eAccordionElement,
+  react: React
 });
 
 /**
@@ -833,15 +832,15 @@ const M3eAccordion = createComponent({
  * accessibility, and supported events.
  */
 const M3eExpansionPanel = createComponent({
-    tagName: "m3e-expansion-panel",
-    elementClass: M3eExpansionPanelElement,
-    react: React,
-    events: {
-        onOpening: "opening",
-        onOpened: "opened",
-        onClosing: "closing",
-        onClosed: "closed",
-    },
+  tagName: "m3e-expansion-panel",
+  elementClass: M3eExpansionPanelElement,
+  react: React,
+  events: {
+    onOpening: "opening",
+    onOpened: "opened",
+    onClosing: "closing",
+    onClosed: "closed"
+  }
 });
 
 /**
@@ -858,12 +857,12 @@ const M3eExpansionPanel = createComponent({
  * accessibility, and supported events.
  */
 const M3eFab = createComponent({
-    tagName: "m3e-fab",
-    elementClass: M3eFabElement,
-    react: React,
-    events: {
-        onClick: "click",
-    },
+  tagName: "m3e-fab",
+  elementClass: M3eFabElement,
+  react: React,
+  events: {
+    onClick: "click"
+  }
 });
 
 /**
@@ -880,13 +879,13 @@ const M3eFab = createComponent({
  * accessibility, and supported events.
  */
 const M3eFabMenu = createComponent({
-    tagName: "m3e-fab-menu",
-    elementClass: M3eFabMenuElement,
-    react: React,
-    events: {
-        onBeforeToggle: "beforetoggle",
-        onToggle: "toggle",
-    },
+  tagName: "m3e-fab-menu",
+  elementClass: M3eFabMenuElement,
+  react: React,
+  events: {
+    onBeforeToggle: "beforetoggle",
+    onToggle: "toggle"
+  }
 });
 
 /**
@@ -903,12 +902,12 @@ const M3eFabMenu = createComponent({
  * accessibility, and supported events.
  */
 const M3eFabMenuItem = createComponent({
-    tagName: "m3e-fab-menu-item",
-    elementClass: M3eFabMenuItemElement,
-    react: React,
-    events: {
-        onClick: "click",
-    },
+  tagName: "m3e-fab-menu-item",
+  elementClass: M3eFabMenuItemElement,
+  react: React,
+  events: {
+    onClick: "click"
+  }
 });
 
 /**
@@ -925,9 +924,9 @@ const M3eFabMenuItem = createComponent({
  * accessibility, and supported events.
  */
 const M3eFabMenuTrigger = createComponent({
-    tagName: "m3e-fab-menu-trigger",
-    elementClass: M3eFabMenuTriggerElement,
-    react: React,
+  tagName: "m3e-fab-menu-trigger",
+  elementClass: M3eFabMenuTriggerElement,
+  react: React
 });
 
 /**
@@ -944,9 +943,9 @@ const M3eFabMenuTrigger = createComponent({
  * accessibility, and supported events.
  */
 const M3eFormField = createComponent({
-    tagName: "m3e-form-field",
-    elementClass: M3eFormFieldElement,
-    react: React,
+  tagName: "m3e-form-field",
+  elementClass: M3eFormFieldElement,
+  react: React
 });
 
 /**
@@ -963,9 +962,9 @@ const M3eFormField = createComponent({
  * accessibility, and supported events.
  */
 const M3eHeading = createComponent({
-    tagName: "m3e-heading",
-    elementClass: M3eHeadingElement,
-    react: React,
+  tagName: "m3e-heading",
+  elementClass: M3eHeadingElement,
+  react: React
 });
 
 /**
@@ -982,9 +981,9 @@ const M3eHeading = createComponent({
  * accessibility, and supported events.
  */
 const M3eIcon = createComponent({
-    tagName: "m3e-icon",
-    elementClass: M3eIconElement,
-    react: React,
+  tagName: "m3e-icon",
+  elementClass: M3eIconElement,
+  react: React
 });
 
 /**
@@ -1001,14 +1000,14 @@ const M3eIcon = createComponent({
  * accessibility, and supported events.
  */
 const M3eIconButton = createComponent({
-    tagName: "m3e-icon-button",
-    elementClass: M3eIconButtonElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-        onClick: "click",
-    },
+  tagName: "m3e-icon-button",
+  elementClass: M3eIconButtonElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change",
+    onClick: "click"
+  }
 });
 
 /**
@@ -1025,9 +1024,9 @@ const M3eIconButton = createComponent({
  * accessibility, and supported events.
  */
 const M3eActionList = createComponent({
-    tagName: "m3e-action-list",
-    elementClass: M3eActionListElement,
-    react: React,
+  tagName: "m3e-action-list",
+  elementClass: M3eActionListElement,
+  react: React
 });
 
 /**
@@ -1044,15 +1043,15 @@ const M3eActionList = createComponent({
  * accessibility, and supported events.
  */
 const M3eExpandableListItem = createComponent({
-    tagName: "m3e-expandable-list-item",
-    elementClass: M3eExpandableListItemElement,
-    react: React,
-    events: {
-        onOpening: "opening",
-        onOpened: "opened",
-        onClosing: "closing",
-        onClosed: "closed",
-    },
+  tagName: "m3e-expandable-list-item",
+  elementClass: M3eExpandableListItemElement,
+  react: React,
+  events: {
+    onOpening: "opening",
+    onOpened: "opened",
+    onClosing: "closing",
+    onClosed: "closed"
+  }
 });
 
 /**
@@ -1069,9 +1068,9 @@ const M3eExpandableListItem = createComponent({
  * accessibility, and supported events.
  */
 const M3eList = createComponent({
-    tagName: "m3e-list",
-    elementClass: M3eListElement,
-    react: React,
+  tagName: "m3e-list",
+  elementClass: M3eListElement,
+  react: React
 });
 
 /**
@@ -1088,12 +1087,12 @@ const M3eList = createComponent({
  * accessibility, and supported events.
  */
 const M3eListAction = createComponent({
-    tagName: "m3e-list-action",
-    elementClass: M3eListActionElement,
-    react: React,
-    events: {
-        onClick: "click",
-    },
+  tagName: "m3e-list-action",
+  elementClass: M3eListActionElement,
+  react: React,
+  events: {
+    onClick: "click"
+  }
 });
 
 /**
@@ -1110,9 +1109,9 @@ const M3eListAction = createComponent({
  * accessibility, and supported events.
  */
 const M3eListItem = createComponent({
-    tagName: "m3e-list-item",
-    elementClass: M3eListItemElement,
-    react: React,
+  tagName: "m3e-list-item",
+  elementClass: M3eListItemElement,
+  react: React
 });
 
 /**
@@ -1129,14 +1128,14 @@ const M3eListItem = createComponent({
  * accessibility, and supported events.
  */
 const M3eListOption = createComponent({
-    tagName: "m3e-list-option",
-    elementClass: M3eListOptionElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-        onClick: "click",
-    },
+  tagName: "m3e-list-option",
+  elementClass: M3eListOptionElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change",
+    onClick: "click"
+  }
 });
 
 /**
@@ -1153,13 +1152,13 @@ const M3eListOption = createComponent({
  * accessibility, and supported events.
  */
 const M3eSelectionList = createComponent({
-    tagName: "m3e-selection-list",
-    elementClass: M3eSelectionListElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-    },
+  tagName: "m3e-selection-list",
+  elementClass: M3eSelectionListElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change"
+  }
 });
 
 /**
@@ -1176,9 +1175,9 @@ const M3eSelectionList = createComponent({
  * accessibility, and supported events.
  */
 const M3eLoadingIndicator = createComponent({
-    tagName: "m3e-loading-indicator",
-    elementClass: M3eLoadingIndicatorElement,
-    react: React,
+  tagName: "m3e-loading-indicator",
+  elementClass: M3eLoadingIndicatorElement,
+  react: React
 });
 
 /**
@@ -1195,13 +1194,13 @@ const M3eLoadingIndicator = createComponent({
  * accessibility, and supported events.
  */
 const M3eMenu = createComponent({
-    tagName: "m3e-menu",
-    elementClass: M3eMenuElement,
-    react: React,
-    events: {
-        onBeforeToggle: "beforetoggle",
-        onToggle: "toggle",
-    },
+  tagName: "m3e-menu",
+  elementClass: M3eMenuElement,
+  react: React,
+  events: {
+    onBeforeToggle: "beforetoggle",
+    onToggle: "toggle"
+  }
 });
 
 /**
@@ -1218,12 +1217,12 @@ const M3eMenu = createComponent({
  * accessibility, and supported events.
  */
 const M3eMenuItem = createComponent({
-    tagName: "m3e-menu-item",
-    elementClass: M3eMenuItemElement,
-    react: React,
-    events: {
-        onClick: "click",
-    },
+  tagName: "m3e-menu-item",
+  elementClass: M3eMenuItemElement,
+  react: React,
+  events: {
+    onClick: "click"
+  }
 });
 
 /**
@@ -1240,12 +1239,12 @@ const M3eMenuItem = createComponent({
  * accessibility, and supported events.
  */
 const M3eMenuItemCheckbox = createComponent({
-    tagName: "m3e-menu-item-checkbox",
-    elementClass: M3eMenuItemCheckboxElement,
-    react: React,
-    events: {
-        onClick: "click",
-    },
+  tagName: "m3e-menu-item-checkbox",
+  elementClass: M3eMenuItemCheckboxElement,
+  react: React,
+  events: {
+    onClick: "click"
+  }
 });
 
 /**
@@ -1262,9 +1261,9 @@ const M3eMenuItemCheckbox = createComponent({
  * accessibility, and supported events.
  */
 const M3eMenuItemGroup = createComponent({
-    tagName: "m3e-menu-item-group",
-    elementClass: M3eMenuItemGroupElement,
-    react: React,
+  tagName: "m3e-menu-item-group",
+  elementClass: M3eMenuItemGroupElement,
+  react: React
 });
 
 /**
@@ -1281,12 +1280,12 @@ const M3eMenuItemGroup = createComponent({
  * accessibility, and supported events.
  */
 const M3eMenuItemRadio = createComponent({
-    tagName: "m3e-menu-item-radio",
-    elementClass: M3eMenuItemRadioElement,
-    react: React,
-    events: {
-        onClick: "click",
-    },
+  tagName: "m3e-menu-item-radio",
+  elementClass: M3eMenuItemRadioElement,
+  react: React,
+  events: {
+    onClick: "click"
+  }
 });
 
 /**
@@ -1303,9 +1302,9 @@ const M3eMenuItemRadio = createComponent({
  * accessibility, and supported events.
  */
 const M3eMenuTrigger = createComponent({
-    tagName: "m3e-menu-trigger",
-    elementClass: M3eMenuTriggerElement,
-    react: React,
+  tagName: "m3e-menu-trigger",
+  elementClass: M3eMenuTriggerElement,
+  react: React
 });
 
 /**
@@ -1322,12 +1321,12 @@ const M3eMenuTrigger = createComponent({
  * accessibility, and supported events.
  */
 const M3eNavBar = createComponent({
-    tagName: "m3e-nav-bar",
-    elementClass: M3eNavBarElement,
-    react: React,
-    events: {
-        onChange: "change",
-    },
+  tagName: "m3e-nav-bar",
+  elementClass: M3eNavBarElement,
+  react: React,
+  events: {
+    onChange: "change"
+  }
 });
 
 /**
@@ -1344,14 +1343,14 @@ const M3eNavBar = createComponent({
  * accessibility, and supported events.
  */
 const M3eNavItem = createComponent({
-    tagName: "m3e-nav-item",
-    elementClass: M3eNavItemElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-        onClick: "click",
-    },
+  tagName: "m3e-nav-item",
+  elementClass: M3eNavItemElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change",
+    onClick: "click"
+  }
 });
 
 /**
@@ -1368,9 +1367,9 @@ const M3eNavItem = createComponent({
  * accessibility, and supported events.
  */
 const M3eNavMenu = createComponent({
-    tagName: "m3e-nav-menu",
-    elementClass: M3eNavMenuElement,
-    react: React,
+  tagName: "m3e-nav-menu",
+  elementClass: M3eNavMenuElement,
+  react: React
 });
 
 /**
@@ -1387,16 +1386,16 @@ const M3eNavMenu = createComponent({
  * accessibility, and supported events.
  */
 const M3eNavMenuItem = createComponent({
-    tagName: "m3e-nav-menu-item",
-    elementClass: M3eNavMenuItemElement,
-    react: React,
-    events: {
-        onOpening: "opening",
-        onOpened: "opened",
-        onClosing: "closing",
-        onClosed: "closed",
-        onClick: "click",
-    },
+  tagName: "m3e-nav-menu-item",
+  elementClass: M3eNavMenuItemElement,
+  react: React,
+  events: {
+    onOpening: "opening",
+    onOpened: "opened",
+    onClosing: "closing",
+    onClosed: "closed",
+    onClick: "click"
+  }
 });
 
 /**
@@ -1413,9 +1412,9 @@ const M3eNavMenuItem = createComponent({
  * accessibility, and supported events.
  */
 const M3eNavMenuItemGroup = createComponent({
-    tagName: "m3e-nav-menu-item-group",
-    elementClass: M3eNavMenuItemGroupElement,
-    react: React,
+  tagName: "m3e-nav-menu-item-group",
+  elementClass: M3eNavMenuItemGroupElement,
+  react: React
 });
 
 /**
@@ -1432,12 +1431,12 @@ const M3eNavMenuItemGroup = createComponent({
  * accessibility, and supported events.
  */
 const M3eNavRail = createComponent({
-    tagName: "m3e-nav-rail",
-    elementClass: M3eNavRailElement,
-    react: React,
-    events: {
-        onChange: "change",
-    },
+  tagName: "m3e-nav-rail",
+  elementClass: M3eNavRailElement,
+  react: React,
+  events: {
+    onChange: "change"
+  }
 });
 
 /**
@@ -1454,9 +1453,9 @@ const M3eNavRail = createComponent({
  * accessibility, and supported events.
  */
 const M3eNavRailToggle = createComponent({
-    tagName: "m3e-nav-rail-toggle",
-    elementClass: M3eNavRailToggleElement,
-    react: React,
+  tagName: "m3e-nav-rail-toggle",
+  elementClass: M3eNavRailToggleElement,
+  react: React
 });
 
 /**
@@ -1473,9 +1472,9 @@ const M3eNavRailToggle = createComponent({
  * accessibility, and supported events.
  */
 const M3eOption = createComponent({
-    tagName: "m3e-option",
-    elementClass: M3eOptionElement,
-    react: React,
+  tagName: "m3e-option",
+  elementClass: M3eOptionElement,
+  react: React
 });
 
 /**
@@ -1492,9 +1491,9 @@ const M3eOption = createComponent({
  * accessibility, and supported events.
  */
 const M3eOptGroup = createComponent({
-    tagName: "m3e-optgroup",
-    elementClass: M3eOptGroupElement,
-    react: React,
+  tagName: "m3e-optgroup",
+  elementClass: M3eOptGroupElement,
+  react: React
 });
 
 /**
@@ -1511,12 +1510,12 @@ const M3eOptGroup = createComponent({
  * accessibility, and supported events.
  */
 const M3ePaginator = createComponent({
-    tagName: "m3e-paginator",
-    elementClass: M3ePaginatorElement,
-    react: React,
-    events: {
-        onPage: "page",
-    },
+  tagName: "m3e-paginator",
+  elementClass: M3ePaginatorElement,
+  react: React,
+  events: {
+    onPage: "page"
+  }
 });
 
 /**
@@ -1533,9 +1532,9 @@ const M3ePaginator = createComponent({
  * accessibility, and supported events.
  */
 const M3eCircularProgressIndicator = createComponent({
-    tagName: "m3e-circular-progress-indicator",
-    elementClass: M3eCircularProgressIndicatorElement,
-    react: React,
+  tagName: "m3e-circular-progress-indicator",
+  elementClass: M3eCircularProgressIndicatorElement,
+  react: React
 });
 
 /**
@@ -1552,9 +1551,9 @@ const M3eCircularProgressIndicator = createComponent({
  * accessibility, and supported events.
  */
 const M3eLinearProgressIndicator = createComponent({
-    tagName: "m3e-linear-progress-indicator",
-    elementClass: M3eLinearProgressIndicatorElement,
-    react: React,
+  tagName: "m3e-linear-progress-indicator",
+  elementClass: M3eLinearProgressIndicatorElement,
+  react: React
 });
 
 /**
@@ -1571,14 +1570,14 @@ const M3eLinearProgressIndicator = createComponent({
  * accessibility, and supported events.
  */
 const M3eRadio = createComponent({
-    tagName: "m3e-radio",
-    elementClass: M3eRadioElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-        onClick: "click",
-    },
+  tagName: "m3e-radio",
+  elementClass: M3eRadioElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change",
+    onClick: "click"
+  }
 });
 
 /**
@@ -1595,12 +1594,12 @@ const M3eRadio = createComponent({
  * accessibility, and supported events.
  */
 const M3eRadioGroup = createComponent({
-    tagName: "m3e-radio-group",
-    elementClass: M3eRadioGroupElement,
-    react: React,
-    events: {
-        onChange: "change",
-    },
+  tagName: "m3e-radio-group",
+  elementClass: M3eRadioGroupElement,
+  react: React,
+  events: {
+    onChange: "change"
+  }
 });
 
 /**
@@ -1617,13 +1616,13 @@ const M3eRadioGroup = createComponent({
  * accessibility, and supported events.
  */
 const M3eSegmentedButton = createComponent({
-    tagName: "m3e-segmented-button",
-    elementClass: M3eSegmentedButtonElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-    },
+  tagName: "m3e-segmented-button",
+  elementClass: M3eSegmentedButtonElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change"
+  }
 });
 
 /**
@@ -1640,14 +1639,14 @@ const M3eSegmentedButton = createComponent({
  * accessibility, and supported events.
  */
 const M3eButtonSegment = createComponent({
-    tagName: "m3e-button-segment",
-    elementClass: M3eButtonSegmentElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-        onClick: "click",
-    },
+  tagName: "m3e-button-segment",
+  elementClass: M3eButtonSegmentElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change",
+    onClick: "click"
+  }
 });
 
 /**
@@ -1664,13 +1663,13 @@ const M3eButtonSegment = createComponent({
  * accessibility, and supported events.
  */
 const M3eSelect = createComponent({
-    tagName: "m3e-select",
-    elementClass: M3eSelectElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-    },
+  tagName: "m3e-select",
+  elementClass: M3eSelectElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change"
+  }
 });
 
 /**
@@ -1687,9 +1686,9 @@ const M3eSelect = createComponent({
  * accessibility, and supported events.
  */
 const M3eShape = createComponent({
-    tagName: "m3e-shape",
-    elementClass: M3eShapeElement,
-    react: React,
+  tagName: "m3e-shape",
+  elementClass: M3eShapeElement,
+  react: React
 });
 
 /**
@@ -1706,9 +1705,9 @@ const M3eShape = createComponent({
  * accessibility, and supported events.
  */
 const M3eSlideGroup = createComponent({
-    tagName: "m3e-slide-group",
-    elementClass: M3eSlideGroupElement,
-    react: React,
+  tagName: "m3e-slide-group",
+  elementClass: M3eSlideGroupElement,
+  react: React
 });
 
 /**
@@ -1725,9 +1724,9 @@ const M3eSlideGroup = createComponent({
  * accessibility, and supported events.
  */
 const M3eSlider = createComponent({
-    tagName: "m3e-slider",
-    elementClass: M3eSliderElement,
-    react: React,
+  tagName: "m3e-slider",
+  elementClass: M3eSliderElement,
+  react: React
 });
 
 /**
@@ -1744,14 +1743,14 @@ const M3eSlider = createComponent({
  * accessibility, and supported events.
  */
 const M3eSliderThumb = createComponent({
-    tagName: "m3e-slider-thumb",
-    elementClass: M3eSliderThumbElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-        onClick: "click",
-    },
+  tagName: "m3e-slider-thumb",
+  elementClass: M3eSliderThumbElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change",
+    onClick: "click"
+  }
 });
 
 /**
@@ -1768,9 +1767,9 @@ const M3eSliderThumb = createComponent({
  * accessibility, and supported events.
  */
 const M3eSplitButton = createComponent({
-    tagName: "m3e-split-button",
-    elementClass: M3eSplitButtonElement,
-    react: React,
+  tagName: "m3e-split-button",
+  elementClass: M3eSplitButtonElement,
+  react: React
 });
 
 /**
@@ -1787,14 +1786,14 @@ const M3eSplitButton = createComponent({
  * accessibility, and supported events.
  */
 const M3eStep = createComponent({
-    tagName: "m3e-step",
-    elementClass: M3eStepElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-        onClick: "click",
-    },
+  tagName: "m3e-step",
+  elementClass: M3eStepElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change",
+    onClick: "click"
+  }
 });
 
 /**
@@ -1811,9 +1810,9 @@ const M3eStep = createComponent({
  * accessibility, and supported events.
  */
 const M3eStepPanel = createComponent({
-    tagName: "m3e-step-panel",
-    elementClass: M3eStepPanelElement,
-    react: React,
+  tagName: "m3e-step-panel",
+  elementClass: M3eStepPanelElement,
+  react: React
 });
 
 /**
@@ -1830,12 +1829,12 @@ const M3eStepPanel = createComponent({
  * accessibility, and supported events.
  */
 const M3eStepper = createComponent({
-    tagName: "m3e-stepper",
-    elementClass: M3eStepperElement,
-    react: React,
-    events: {
-        onChange: "change",
-    },
+  tagName: "m3e-stepper",
+  elementClass: M3eStepperElement,
+  react: React,
+  events: {
+    onChange: "change"
+  }
 });
 
 /**
@@ -1852,9 +1851,9 @@ const M3eStepper = createComponent({
  * accessibility, and supported events.
  */
 const M3eStepperNext = createComponent({
-    tagName: "m3e-stepper-next",
-    elementClass: M3eStepperNextElement,
-    react: React,
+  tagName: "m3e-stepper-next",
+  elementClass: M3eStepperNextElement,
+  react: React
 });
 
 /**
@@ -1871,9 +1870,9 @@ const M3eStepperNext = createComponent({
  * accessibility, and supported events.
  */
 const M3eStepperPrevious = createComponent({
-    tagName: "m3e-stepper-previous",
-    elementClass: M3eStepperPreviousElement,
-    react: React,
+  tagName: "m3e-stepper-previous",
+  elementClass: M3eStepperPreviousElement,
+  react: React
 });
 
 /**
@@ -1890,9 +1889,9 @@ const M3eStepperPrevious = createComponent({
  * accessibility, and supported events.
  */
 const M3eStepperReset = createComponent({
-    tagName: "m3e-stepper-reset",
-    elementClass: M3eStepperResetElement,
-    react: React,
+  tagName: "m3e-stepper-reset",
+  elementClass: M3eStepperResetElement,
+  react: React
 });
 
 /**
@@ -1909,14 +1908,14 @@ const M3eStepperReset = createComponent({
  * accessibility, and supported events.
  */
 const M3eSwitch = createComponent({
-    tagName: "m3e-switch",
-    elementClass: M3eSwitchElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-        onClick: "click",
-    },
+  tagName: "m3e-switch",
+  elementClass: M3eSwitchElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change",
+    onClick: "click"
+  }
 });
 
 /**
@@ -1933,14 +1932,14 @@ const M3eSwitch = createComponent({
  * accessibility, and supported events.
  */
 const M3eTab = createComponent({
-    tagName: "m3e-tab",
-    elementClass: M3eTabElement,
-    react: React,
-    events: {
-        onInput: "input",
-        onChange: "change",
-        onClick: "click",
-    },
+  tagName: "m3e-tab",
+  elementClass: M3eTabElement,
+  react: React,
+  events: {
+    onInput: "input",
+    onChange: "change",
+    onClick: "click"
+  }
 });
 
 /**
@@ -1957,9 +1956,9 @@ const M3eTab = createComponent({
  * accessibility, and supported events.
  */
 const M3eTabPanel = createComponent({
-    tagName: "m3e-tab-panel",
-    elementClass: M3eTabPanelElement,
-    react: React,
+  tagName: "m3e-tab-panel",
+  elementClass: M3eTabPanelElement,
+  react: React
 });
 
 /**
@@ -1976,12 +1975,12 @@ const M3eTabPanel = createComponent({
  * accessibility, and supported events.
  */
 const M3eTabs = createComponent({
-    tagName: "m3e-tabs",
-    elementClass: M3eTabsElement,
-    react: React,
-    events: {
-        onChange: "change",
-    },
+  tagName: "m3e-tabs",
+  elementClass: M3eTabsElement,
+  react: React,
+  events: {
+    onChange: "change"
+  }
 });
 
 /**
@@ -1998,9 +1997,9 @@ const M3eTabs = createComponent({
  * accessibility, and supported events.
  */
 const M3eTextareaAutosize = createComponent({
-    tagName: "m3e-textarea-autosize",
-    elementClass: M3eTextareaAutosizeElement,
-    react: React,
+  tagName: "m3e-textarea-autosize",
+  elementClass: M3eTextareaAutosizeElement,
+  react: React
 });
 
 /**
@@ -2017,12 +2016,12 @@ const M3eTextareaAutosize = createComponent({
  * accessibility, and supported events.
  */
 const M3eTheme = createComponent({
-    tagName: "m3e-theme",
-    elementClass: M3eThemeElement,
-    react: React,
-    events: {
-        onChange: "change",
-    },
+  tagName: "m3e-theme",
+  elementClass: M3eThemeElement,
+  react: React,
+  events: {
+    onChange: "change"
+  }
 });
 
 /**
@@ -2039,9 +2038,9 @@ const M3eTheme = createComponent({
  * accessibility, and supported events.
  */
 const M3eToc = createComponent({
-    tagName: "m3e-toc",
-    elementClass: M3eTocElement,
-    react: React,
+  tagName: "m3e-toc",
+  elementClass: M3eTocElement,
+  react: React
 });
 
 /**
@@ -2058,9 +2057,9 @@ const M3eToc = createComponent({
  * accessibility, and supported events.
  */
 const M3eToolbar = createComponent({
-    tagName: "m3e-toolbar",
-    elementClass: M3eToolbarElement,
-    react: React,
+  tagName: "m3e-toolbar",
+  elementClass: M3eToolbarElement,
+  react: React
 });
 
 /**
@@ -2077,13 +2076,13 @@ const M3eToolbar = createComponent({
  * accessibility, and supported events.
  */
 const M3eRichTooltip = createComponent({
-    tagName: "m3e-rich-tooltip",
-    elementClass: M3eRichTooltipElement,
-    react: React,
-    events: {
-        onBeforeToggle: "beforetoggle",
-        onToggle: "toggle",
-    },
+  tagName: "m3e-rich-tooltip",
+  elementClass: M3eRichTooltipElement,
+  react: React,
+  events: {
+    onBeforeToggle: "beforetoggle",
+    onToggle: "toggle"
+  }
 });
 
 /**
@@ -2100,9 +2099,9 @@ const M3eRichTooltip = createComponent({
  * accessibility, and supported events.
  */
 const M3eRichTooltipAction = createComponent({
-    tagName: "m3e-rich-tooltip-action",
-    elementClass: M3eRichTooltipActionElement,
-    react: React,
+  tagName: "m3e-rich-tooltip-action",
+  elementClass: M3eRichTooltipActionElement,
+  react: React
 });
 
 /**
@@ -2119,9 +2118,9 @@ const M3eRichTooltipAction = createComponent({
  * accessibility, and supported events.
  */
 const M3eTooltip = createComponent({
-    tagName: "m3e-tooltip",
-    elementClass: M3eTooltipElement,
-    react: React,
+  tagName: "m3e-tooltip",
+  elementClass: M3eTooltipElement,
+  react: React
 });
 
 export { M3eAccordion, M3eActionList, M3eAppBar, M3eAssistChip, M3eAutocomplete, M3eAvatar, M3eBadge, M3eBottomSheet, M3eBottomSheetAction, M3eBottomSheetTrigger, M3eButton, M3eButtonGroup, M3eButtonSegment, M3eCard, M3eCheckbox, M3eChip, M3eChipSet, M3eCircularProgressIndicator, M3eCollapsible, M3eDialog, M3eDialogAction, M3eDialogTrigger, M3eDivider, M3eDrawerContainer, M3eDrawerToggle, M3eElevation, M3eExpandableListItem, M3eExpansionPanel, M3eFab, M3eFabMenu, M3eFabMenuItem, M3eFabMenuTrigger, M3eFilterChip, M3eFilterChipSet, M3eFocusRing, M3eFormField, M3eHeading, M3eIcon, M3eIconButton, M3eInputChip, M3eInputChipSet, M3eLinearProgressIndicator, M3eList, M3eListAction, M3eListItem, M3eListOption, M3eLoadingIndicator, M3eMenu, M3eMenuItem, M3eMenuItemCheckbox, M3eMenuItemGroup, M3eMenuItemRadio, M3eMenuTrigger, M3eNavBar, M3eNavItem, M3eNavMenu, M3eNavMenuItem, M3eNavMenuItemGroup, M3eNavRail, M3eNavRailToggle, M3eOptGroup, M3eOption, M3ePaginator, M3ePseudoCheckbox, M3ePseudoRadio, M3eRadio, M3eRadioGroup, M3eRichTooltip, M3eRichTooltipAction, M3eRipple, M3eScrollContainer, M3eSegmentedButton, M3eSelect, M3eSelectionList, M3eShape, M3eSlide, M3eSlideGroup, M3eSlider, M3eSliderThumb, M3eSplitButton, M3eStateLayer, M3eStep, M3eStepPanel, M3eStepper, M3eStepperNext, M3eStepperPrevious, M3eStepperReset, M3eSuggestionChip, M3eSwitch, M3eTab, M3eTabPanel, M3eTabs, M3eTextHighlight, M3eTextOverflow, M3eTextareaAutosize, M3eTheme, M3eToc, M3eToolbar, M3eTooltip };