@m3e/web 2.0.4 → 2.0.5

package/dist/all.js

@@ -4,14 +4,20 @@
  * See LICENSE file in the project root for full license text.
  */
 import { unsafeCSS, css, LitElement, html, nothing, isServer, noChange, svg } from 'lit';
-import { DesignToken as DesignToken$1, HtmlFor as HtmlFor$1, Role as Role$1, debounce as debounce$1, element as element$1, hasAssignedNodes as hasAssignedNodes$1, setCustomState as setCustomState$1, prefersReducedMotion as prefersReducedMotion$1, scrollIntoViewIfNeeded as scrollIntoViewIfNeeded$1, forcedColorsActive as forcedColorsActive$1, deleteCustomState as deleteCustomState$1, addCustomState as addCustomState$1, ActionElementBase as ActionElementBase$1, EventAttribute as EventAttribute$1, AttachInternals as AttachInternals$1, VelocityTracker as VelocityTracker$1, ScrollLockController as ScrollLockController$1, ResizeController as ResizeController$1, focusWhenReady as focusWhenReady$1, hasCustomState as hasCustomState$1, computeCssSize as computeCssSize$1, spaceSeparatedStringConverter as spaceSeparatedStringConverter$1, KeyboardClick as KeyboardClick$1, LinkButton as LinkButton$1, FormSubmitter as FormSubmitter$1, Focusable as Focusable$1, DisabledInteractive as DisabledInteractive$1, Disabled as Disabled$1, FocusController as FocusController$1, PressedController as PressedController$1, renderPseudoLink as renderPseudoLink$1, isSelectedMixin as isSelectedMixin$1, Labelled as Labelled$1, RequiredConstraintValidation as RequiredConstraintValidation$1, Dirty as Dirty$1, Touched as Touched$1, Required as Required$1, ConstraintValidation as ConstraintValidation$1, CheckedIndeterminate as CheckedIndeterminate$1, FormAssociated as FormAssociated$1, HoverController as HoverController$1, formValue as formValue$1, isDisabledMixin as isDisabledMixin$1, isDisabledInteractiveMixin as isDisabledInteractiveMixin$1, isLinkButtonMixin as isLinkButtonMixin$1, getTextContent as getTextContent$1, Vertical as Vertical$1, Selected as Selected$1, ScrollController as ScrollController$1, MutationController as MutationController$1, isReadOnlyMixin as isReadOnlyMixin$1, interceptProperty as interceptProperty$1, computeLineCount as computeLineCount$1, generateClipPaths as generateClipPaths$1, Checked as Checked$1, AnimationLoopController as AnimationLoopController$1, resolveFragmentUrl as resolveFragmentUrl$1, safeStyleMap as safeStyleMap$1, updateLabels as updateLabels$1, guid as guid$1, IntersectionController as IntersectionController$1, LongPressController as LongPressController$1 } from '@m3e/web/core';
+import { DesignToken as DesignToken$1, HtmlFor as HtmlFor$1, Role as Role$1, debounce as debounce$1, customElement as customElement$1, hasAssignedNodes as hasAssignedNodes$1, setCustomState as setCustomState$1, prefersReducedMotion as prefersReducedMotion$1, scrollIntoViewIfNeeded as scrollIntoViewIfNeeded$1, forcedColorsActive as forcedColorsActive$1, deleteCustomState as deleteCustomState$1, addCustomState as addCustomState$1, ActionElementBase as ActionElementBase$1, EventAttribute as EventAttribute$1, AttachInternals as AttachInternals$1, VelocityTracker as VelocityTracker$1, ScrollLockController as ScrollLockController$1, ResizeController as ResizeController$1, focusWhenReady as focusWhenReady$1, hasCustomState as hasCustomState$1, computeCssSize as computeCssSize$1, spaceSeparatedStringConverter as spaceSeparatedStringConverter$1, KeyboardClick as KeyboardClick$1, LinkButton as LinkButton$1, FormSubmitter as FormSubmitter$1, Focusable as Focusable$1, DisabledInteractive as DisabledInteractive$1, Disabled as Disabled$1, FocusController as FocusController$1, PressedController as PressedController$1, renderPseudoLink as renderPseudoLink$1, isSelectedMixin as isSelectedMixin$1, Labelled as Labelled$1, RequiredConstraintValidation as RequiredConstraintValidation$1, Dirty as Dirty$1, Touched as Touched$1, Required as Required$1, ConstraintValidation as ConstraintValidation$1, CheckedIndeterminate as CheckedIndeterminate$1, FormAssociated as FormAssociated$1, HoverController as HoverController$1, formValue as formValue$1, isDisabledMixin as isDisabledMixin$1, isDisabledInteractiveMixin as isDisabledInteractiveMixin$1, isLinkButtonMixin as isLinkButtonMixin$1, getTextContent as getTextContent$1, Vertical as Vertical$1, Selected as Selected$1, ScrollController as ScrollController$1, MutationController as MutationController$1, isReadOnlyMixin as isReadOnlyMixin$1, interceptProperty as interceptProperty$1, computeLineCount as computeLineCount$1, generateClipPaths as generateClipPaths$1, Checked as Checked$1, AnimationLoopController as AnimationLoopController$1, resolveFragmentUrl as resolveFragmentUrl$1, safeStyleMap as safeStyleMap$1, updateLabels as updateLabels$1, guid as guid$1, IntersectionController as IntersectionController$1, LongPressController as LongPressController$1 } from '@m3e/web/core';
 import { ListKeyManager, M3eInteractivityChecker, isModifierAllowed, addAriaReferencedId, removeAriaReferencedId, selectionManager, SelectionManager, ListManager, RovingTabIndexManager, M3eAriaDescriber, typeaheadLabel } from '@m3e/web/core/a11y';
 import { M3eDirectionality } from '@m3e/web/core/bidi';
 import { positionAnchor } from '@m3e/web/core/anchoring';
+import { M3eIconButtonElement as M3eIconButtonElement$1 } from '@m3e/web/icon-button';
 import { M3eBreakpointObserver, Breakpoint } from '@m3e/web/core/layout';
 import { M3eNavBarElement as M3eNavBarElement$1 } from '@m3e/web/nav-bar';
+import '@m3e/web/form-field';
+import '@m3e/web/select';
+import '@m3e/web/option';
+import '@m3e/web/tooltip';
 import { M3eButtonElement as M3eButtonElement$1 } from '@m3e/web/button';
-import { M3eIconButtonElement as M3eIconButtonElement$1 } from '@m3e/web/icon-button';
+import '@m3e/web/button-group';
+import '@m3e/web/slide-group';
 import { M3ePlatform } from '@m3e/web/core/platform';
 
 /******************************************************************************
@@ -795,7 +801,7 @@ __decorate([n$1({
   reflect: true
 })], M3eAppBarElement.prototype, "size", void 0);
 __decorate([debounce$1(40)], M3eAppBarElement.prototype, "_updateScroll", null);
-M3eAppBarElement = __decorate([element$1("m3e-app-bar")], M3eAppBarElement);
+M3eAppBarElement = __decorate([customElement$1("m3e-app-bar")], M3eAppBarElement);
 
 var _M3eAutocompleteElement_instances, _M3eAutocompleteElement_id, _M3eAutocompleteElement_menuId, _M3eAutocompleteElement_ignoreFocusVisible, _M3eAutocompleteElement_menu, _M3eAutocompleteElement_textHighlight, _M3eAutocompleteElement_ignoreHideMenuOnBlur, _M3eAutocompleteElement_clickHandler, _M3eAutocompleteElement_formFieldPointerDownHandler, _M3eAutocompleteElement_focusHandler, _M3eAutocompleteElement_blurHandler, _M3eAutocompleteElement_keyDownHandler, _M3eAutocompleteElement_inputHandler, _M3eAutocompleteElement_changeHandler, _M3eAutocompleteElement_menuToggleHandler, _M3eAutocompleteElement_menuPointerDownHandler, _M3eAutocompleteElement_input_get, _M3eAutocompleteElement_hasVisibleOptions_get, _M3eAutocompleteElement_minMenuWidth_get, _M3eAutocompleteElement_formField_get, _M3eAutocompleteElement_handleSlotChange, _M3eAutocompleteElement_handleClick, _M3eAutocompleteElement_handleFormFieldPointerDown, _M3eAutocompleteElement_handleFocus, _M3eAutocompleteElement_handleBlur, _M3eAutocompleteElement_handleInput, _M3eAutocompleteElement_handleChange, _M3eAutocompleteElement_handleKeyDown, _M3eAutocompleteElement_handleMenuPointerDown, _M3eAutocompleteElement_handleMenuToggle, _M3eAutocompleteElement_destroyMenu, _M3eAutocompleteElement_showMenu, _M3eAutocompleteElement_hideMenu, _M3eAutocompleteElement_activateOption, _M3eAutocompleteElement_selectOption, _M3eAutocompleteElement_filterOptions, _M3eAutocompleteElement_autoActivate, _M3eAutocompleteElement_deactivateOption;
 var M3eAutocompleteElement_1;
@@ -1269,7 +1275,7 @@ __decorate([n$1({
   attribute: "auto-activate",
   type: Boolean
 })], M3eAutocompleteElement.prototype, "autoActivate", void 0);
-M3eAutocompleteElement = M3eAutocompleteElement_1 = __decorate([element$1("m3e-autocomplete")], M3eAutocompleteElement);
+M3eAutocompleteElement = M3eAutocompleteElement_1 = __decorate([customElement$1("m3e-autocomplete")], M3eAutocompleteElement);
 
 /**
  * An image, icon or textual initials representing a user or other identity.
@@ -1325,7 +1331,7 @@ let M3eAvatarElement = class M3eAvatarElement extends LitElement {
 };
 /** The styles of the element. */
 M3eAvatarElement.styles = css`:host { display: inline-block; vertical-align: middle; aspect-ratio: 1 / 1; width: var(--m3e-avatar-size, 2.5rem); } .base { user-select: none; white-space: nowrap; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: var(--m3e-avatar-shape, ${DesignToken$1.shape.corner.full}); font-size: var(--m3e-avatar-font-size, ${DesignToken$1.typescale.standard.title.medium.fontSize}); font-weight: var(--m3e-avatar-font-weight, ${DesignToken$1.typescale.standard.title.medium.fontWeight}); line-height: var(--m3e-avatar-line-height, ${DesignToken$1.typescale.standard.title.medium.lineHeight}); letter-spacing: var(--m3e-avatar-tracking, ${DesignToken$1.typescale.standard.title.medium.tracking}); background-color: var(--m3e-avatar-color, ${DesignToken$1.color.primaryContainer}); color: var(--m3e-avatar-label-color, ${DesignToken$1.color.onPrimaryContainer}); } ::slotted(img) { display: block; margin: 0 auto; overflow: hidden; object-fit: cover; width: 100%; height: 100%; }`;
-M3eAvatarElement = __decorate([element$1("m3e-avatar")], M3eAvatarElement);
+M3eAvatarElement = __decorate([customElement$1("m3e-avatar")], M3eAvatarElement);
 
 var _M3eBadgeElement_instances, _M3eBadgeElement_directionalitySubscription, _M3eBadgeElement_anchorCleanup, _M3eBadgeElement_handleSlotChange, _M3eBadgeElement_detach, _M3eBadgeElement_attach;
 /**
@@ -1485,7 +1491,7 @@ __decorate([n$1({
 __decorate([n$1({
   reflect: true
 })], M3eBadgeElement.prototype, "position", void 0);
-M3eBadgeElement = __decorate([element$1("m3e-badge")], M3eBadgeElement);
+M3eBadgeElement = __decorate([customElement$1("m3e-badge")], M3eBadgeElement);
 
 /**
  * An element, nested within a clickable element, used to close a parenting bottom sheet.
@@ -1499,7 +1505,7 @@ let M3eBottomSheetActionElement = class M3eBottomSheetActionElement extends Acti
     this.closest("m3e-bottom-sheet")?.hide();
   }
 };
-M3eBottomSheetActionElement = __decorate([element$1("m3e-bottom-sheet-action")], M3eBottomSheetActionElement);
+M3eBottomSheetActionElement = __decorate([customElement$1("m3e-bottom-sheet-action")], M3eBottomSheetActionElement);
 
 var _M3eBottomSheetElement_instances, _M3eBottomSheetElement_documentClickHandler, _M3eBottomSheetElement_documentKeyDownHandler, _M3eBottomSheetElement_windowResizeHandler, _M3eBottomSheetElement_inerts, _M3eBottomSheetElement_velocityTracker, _M3eBottomSheetElement_scrollLockController, _M3eBottomSheetElement_resizeController, _M3eBottomSheetElement_trigger, _M3eBottomSheetElement_dragState, _M3eBottomSheetElement_dragged, _M3eBottomSheetElement_activeDetent, _M3eBottomSheetElement_requestDetent, _M3eBottomSheetElement_cachedContentHeight, _M3eBottomSheetElement_cachedHeaderHeight, _M3eBottomSheetElement_snapAnimation, _M3eBottomSheetElement_handleHeaderSlotChange, _M3eBottomSheetElement_handleHeaderPointerDown, _M3eBottomSheetElement_handleHeaderPointerMove, _M3eBottomSheetElement_handleHeaderPointerUp, _M3eBottomSheetElement_handleDocumentClick, _M3eBottomSheetElement_handleDocumentKeyDown, _M3eBottomSheetElement_handleWindowResize, _M3eBottomSheetElement_handleDragHandleClick, _M3eBottomSheetElement_handleDragHandleKeyDown, _M3eBottomSheetElement_getNextHigherDetent, _M3eBottomSheetElement_getNextLowerDetent, _M3eBottomSheetElement_getClosestDetent, _M3eBottomSheetElement_computeDetentHeight, _M3eBottomSheetElement_computeMaxHeight, _M3eBottomSheetElement_computeMinHeight, _M3eBottomSheetElement_computePeekHeight, _M3eBottomSheetElement_computeFitHeight, _M3eBottomSheetElement_handleSectionResize, _M3eBottomSheetElement_snapToDetent, _M3eBottomSheetElement_snapToHeight, _M3eBottomSheetElement_updateHeight, _M3eBottomSheetElement_applyInert, _M3eBottomSheetElement_restoreInert;
 var M3eBottomSheetElement_1;
@@ -2195,7 +2201,7 @@ __decorate([n$1({
   attribute: "hide-friction",
   type: Number
 })], M3eBottomSheetElement.prototype, "hideFriction", void 0);
-M3eBottomSheetElement = M3eBottomSheetElement_1 = __decorate([element$1("m3e-bottom-sheet")], M3eBottomSheetElement);
+M3eBottomSheetElement = M3eBottomSheetElement_1 = __decorate([customElement$1("m3e-bottom-sheet")], M3eBottomSheetElement);
 
 /**
  * An element, nested within a clickable element, used to trigger a bottom sheet.
@@ -2261,7 +2267,7 @@ __decorate([n$1({
 __decorate([n$1({
   type: Boolean
 })], M3eBottomSheetTriggerElement.prototype, "secondary", void 0);
-M3eBottomSheetTriggerElement = __decorate([element$1("m3e-bottom-sheet-trigger")], M3eBottomSheetTriggerElement);
+M3eBottomSheetTriggerElement = __decorate([customElement$1("m3e-bottom-sheet-trigger")], M3eBottomSheetTriggerElement);
 
 /**
  * Component design tokens that control the `M3eButtonElement` for all size variants.
@@ -3583,7 +3589,7 @@ __decorate([n$1({
   reflect: true
 })], M3eButtonElement.prototype, "selected", void 0);
 __decorate([debounce$1(40)], M3eButtonElement.prototype, "_handleResize", null);
-M3eButtonElement = __decorate([element$1("m3e-button")], M3eButtonElement);
+M3eButtonElement = __decorate([customElement$1("m3e-button")], M3eButtonElement);
 
 var _M3eButtonGroupElement_instances, _M3eButtonGroupElement_pressedController, _M3eButtonGroupElement_updateButtons, _M3eButtonGroupElement_handleChange;
 /**
@@ -3766,7 +3772,7 @@ __decorate([o$3({
   selector: "m3e-button,m3e-icon-button",
   flatten: true
 })], M3eButtonGroupElement.prototype, "buttons", void 0);
-M3eButtonGroupElement = __decorate([element$1("m3e-button-group")], M3eButtonGroupElement);
+M3eButtonGroupElement = __decorate([customElement$1("m3e-button-group")], M3eButtonGroupElement);
 
 /**
  * Component design tokens for `M3eCardElement`.
@@ -4149,7 +4155,7 @@ __decorate([n$1({
 __decorate([n$1({
   reflect: true
 })], M3eCardElement.prototype, "orientation", void 0);
-M3eCardElement = __decorate([element$1("m3e-card")], M3eCardElement);
+M3eCardElement = __decorate([customElement$1("m3e-card")], M3eCardElement);
 
 var _M3eCheckboxElement_instances, _M3eCheckboxElement_clickHandler, _M3eCheckboxElement_hoverController, _M3eCheckboxElement_pressedController, _M3eCheckboxElement_renderIcon, _M3eCheckboxElement_handleClick;
 /**
@@ -4323,7 +4329,7 @@ __decorate([e$4(".focus-ring")], M3eCheckboxElement.prototype, "_focusRing", voi
 __decorate([e$4(".state-layer")], M3eCheckboxElement.prototype, "_stateLayer", void 0);
 __decorate([e$4(".ripple")], M3eCheckboxElement.prototype, "_ripple", void 0);
 __decorate([n$1()], M3eCheckboxElement.prototype, "value", void 0);
-M3eCheckboxElement = __decorate([element$1("m3e-checkbox")], M3eCheckboxElement);
+M3eCheckboxElement = __decorate([customElement$1("m3e-checkbox")], M3eCheckboxElement);
 
 var _M3eChipElement_instances, _M3eChipElement_value, _M3eChipElement_textContent, _M3eChipElement_renderContent, _M3eChipElement_handleIconSlotChange, _M3eChipElement_handleTrailingIconSlotChange, _M3eChipElement_handleSlotChange;
 /**
@@ -4451,7 +4457,7 @@ __decorate([n$1({
   reflect: true
 })], M3eChipElement.prototype, "variant", void 0);
 __decorate([n$1()], M3eChipElement.prototype, "value", null);
-M3eChipElement = __decorate([element$1("m3e-chip")], M3eChipElement);
+M3eChipElement = __decorate([customElement$1("m3e-chip")], M3eChipElement);
 
 /**
  * A chip users interact with to perform a smart or automated action that can span multiple applications.
@@ -4531,7 +4537,7 @@ let M3eAssistChipElement = class M3eAssistChipElement extends FormSubmitter$1(Li
 };
 /** Indicates that this custom element participates in form submission, validation, and form state restoration. */
 M3eAssistChipElement.formAssociated = true;
-M3eAssistChipElement = __decorate([element$1("m3e-assist-chip")], M3eAssistChipElement);
+M3eAssistChipElement = __decorate([customElement$1("m3e-assist-chip")], M3eAssistChipElement);
 
 /**
  * A container used to organize chips into a cohesive unit.
@@ -4568,7 +4574,7 @@ let M3eChipSetElement = class M3eChipSetElement extends Vertical$1(LitElement) {
 };
 /** The styles of the element. */
 M3eChipSetElement.styles = css`:host { display: inline-flex; flex-wrap: wrap; vertical-align: middle; gap: var(--m3e-chip-set-spacing, 0.5rem); outline: none; } :host([vertical]) { flex-direction: column; }`;
-M3eChipSetElement = __decorate([element$1("m3e-chip-set")], M3eChipSetElement);
+M3eChipSetElement = __decorate([customElement$1("m3e-chip-set")], M3eChipSetElement);
 
 var _M3eFilterChipElement_instances, _M3eFilterChipElement_clickHandler, _M3eFilterChipElement_handleClick;
 /**
@@ -4705,7 +4711,7 @@ _M3eFilterChipElement_handleClick = function _M3eFilterChipElement_handleClick(e
 M3eFilterChipElement.formAssociated = true;
 /** The styles of the element. */
 M3eFilterChipElement.styles = [M3eChipElement.styles, css`:host([selected]:not(:state(-hide-selection))) .wrapper { padding-inline-start: var(--m3e-chip-with-icon-padding-start, 0.5rem); } .icon { display: flex; align-items: center; justify-content: center; } .check { width: 1em; font-size: var(--m3e-chip-icon-size, 1.125rem); } :host(:not(:disabled):not([disabled-interactive])) .check { color: var(--m3e-chip-selected-leading-icon-color, ${DesignToken$1.color.onSecondaryContainer}); } :host(:not([selected])) .check, :host(:state(-hide-selection)) .check, :host(:state(-hide-selection):not(:state(-with-icon))) .icon { display: none; } :host(:not(:state(-with-icon))) .icon { margin-inline-start: calc(0px - var(--m3e-chip-with-icon-padding-start, 0.5rem)); transition: margin-inline-start ${DesignToken$1.motion.spring.fastEffects}; } :host([selected]) .icon { margin-inline-start: 0; } :host([selected]:not(:state(-hide-selection))) ::slotted([slot="icon"]) { display: none !important; } :host(:not(:disabled):not([disabled-interactive]):not([selected])) .base { color: var(--m3e-chip-unselected-label-text-color, ${DesignToken$1.color.onSurfaceVariant}); --m3e-ripple-color: var(--m3e-chip-unselected-ripple-color, ${DesignToken$1.color.onSurfaceVariant}); --m3e-state-layer-focus-color: var( --m3e-chip-unselected-state-layer-focus-color, ${DesignToken$1.color.onSurfaceVariant} ); --m3e-state-layer-hover-color: var( --m3e-chip-unselected-state-layer-hover-color, ${DesignToken$1.color.onSurfaceVariant} ); } :host(:not(:disabled):not([disabled-interactive]):not([selected])) ::slotted([slot="icon"]) { color: var(--m3e-chip-unselected-leading-icon-color, ${DesignToken$1.color.primary}); } :host(:not(:disabled):not([disabled-interactive]):not([selected])) ::slotted([slot="trailing-icon"]) { color: var(--m3e-chip-unselected-trailing-icon-color, ${DesignToken$1.color.onSurfaceVariant}); } :host(:not(:disabled):not([disabled-interactive])[selected]) .base { outline-offset: unset; outline-width: var(--m3e-chip-selected-outline-thickness, 0); color: var(--m3e-chip-selected-label-text-color, ${DesignToken$1.color.onSecondaryContainer}); background-color: var(--m3e-chip-selected-container-color, ${DesignToken$1.color.secondaryContainer}); --m3e-state-layer-hover-color: var( --m3e-chip-selected-container-hover-color, ${DesignToken$1.color.onSecondaryContainer} ); --m3e-state-layer-focus-color: var( --m3e-chip-selected-container-focus-color, ${DesignToken$1.color.onSecondaryContainer} ); --m3e-elevation-hover-level: var(--m3e-chip-selected-hover-elevation, ${DesignToken$1.elevation.level1}); --m3e-ripple-color: var(--m3e-chip-selected-ripple-color, ${DesignToken$1.color.onSecondaryContainer}); --m3e-state-layer-focus-color: var( --m3e-chip-selected-state-layer-focus-color, ${DesignToken$1.color.onSecondaryContainer} ); --m3e-state-layer-hover-color: var( --m3e-chip-selected-state-layer-hover-color, ${DesignToken$1.color.onSecondaryContainer} ); } :host(:not(:disabled):not([disabled-interactive])[selected]) ::slotted([slot="icon"]) { color: var(--m3e-chip-selected-leading-icon-color, ${DesignToken$1.color.onSecondaryContainer}); } :host(:not(:disabled):not([disabled-interactive]):not([selected])) ::slotted([slot="trailing-icon"]) { color: var(--m3e-chip-selected-trailing-icon-color, ${DesignToken$1.color.onSecondaryContainer}); } @media (prefers-reduced-motion) { .base, :host(:not(:state(-with-icon))) .icon { transition: none; } } @media (forced-colors: active) { :host(:not(:disabled):not([disabled-interactive]):not([selected])) .base, :host(:not(:disabled):not([disabled-interactive]):not([selected])) ::slotted([slot="icon"]), :host(:not(:disabled):not([disabled-interactive]):not([selected])) ::slotted([slot="trailing-icon"]) { color: CanvasText; } :host(:not(:disabled):not([disabled-interactive])[selected]) .base, :host(:not(:disabled):not([disabled-interactive])[selected]) ::slotted([slot="icon"]), :host(:not(:disabled):not([disabled-interactive])[selected]) ::slotted([slot="trailing-icon"]), :host(:not(:disabled):not([disabled-interactive])) .check { color: ButtonText; } :host(:not(:disabled):not([disabled-interactive])[selected]) .base { outline-offset: calc(0px - var(--m3e-outlined-chip-outline-thickness, 1px)); outline-width: var(--m3e-outlined-chip-outline-thickness, 1px); outline-color: ButtonText; } }`];
-M3eFilterChipElement = __decorate([element$1("m3e-filter-chip")], M3eFilterChipElement);
+M3eFilterChipElement = __decorate([customElement$1("m3e-filter-chip")], M3eFilterChipElement);
 
 var _M3eFilterChipSetElement_instances, _M3eFilterChipSetElement_directionalitySubscription, _M3eFilterChipSetElement_handleSlotChange, _M3eFilterChipSetElement_handleKeyDown, _M3eFilterChipSetElement_handleChange, _M3eFilterChipSetElement_updateChipRole, _a$9;
 /**
@@ -4862,7 +4868,7 @@ __decorate([n$1({
   attribute: "hide-selection-indicator",
   type: Boolean
 })], M3eFilterChipSetElement.prototype, "hideSelectionIndicator", void 0);
-M3eFilterChipSetElement = __decorate([element$1("m3e-filter-chip-set")], M3eFilterChipSetElement);
+M3eFilterChipSetElement = __decorate([customElement$1("m3e-filter-chip-set")], M3eFilterChipSetElement);
 
 /**
  * @license
@@ -5306,7 +5312,7 @@ __decorate([n$1({
 __decorate([n$1({
   attribute: "remove-label"
 })], M3eInputChipElement.prototype, "removeLabel", void 0);
-M3eInputChipElement = __decorate([element$1("m3e-input-chip")], M3eInputChipElement);
+M3eInputChipElement = __decorate([customElement$1("m3e-input-chip")], M3eInputChipElement);
 
 var _M3eInputChipSetElement_instances, _M3eInputChipSetElement_directionalitySubscription, _M3eInputChipSetElement_inputChangeHandler, _M3eInputChipSetElement_inputKeyDownHandler, _M3eInputChipSetElement_focusHandler, _M3eInputChipSetElement_focusInHandler, _M3eInputChipSetElement_focusOutHandler, _M3eInputChipSetElement_chipRemoveHandler, _M3eInputChipSetElement_chipClickHandler, _M3eInputChipSetElement_listManager, _M3eInputChipSetElement_listKeyManager, _M3eInputChipSetElement_ignoreInputChange, _M3eInputChipSetElement_input, _M3eInputChipSetElement_tabindex, _M3eInputChipSetElement_handleKeyDown, _M3eInputChipSetElement_handleSlotChange, _M3eInputChipSetElement_handleInputSlotChange, _M3eInputChipSetElement_handleFocus, _M3eInputChipSetElement_handleFocusIn, _M3eInputChipSetElement_handleFocusOut, _M3eInputChipSetElement_handleChipRemove, _M3eInputChipSetElement_handleChipClick, _M3eInputChipSetElement_handleInputChange, _M3eInputChipSetElement_handleInputKeyDown;
 /**
@@ -5570,7 +5576,7 @@ _M3eInputChipSetElement_handleInputKeyDown = function _M3eInputChipSetElement_ha
 })();
 /** The styles of the element. */
 M3eInputChipSetElement.styles = [M3eChipSetElement.styles, css`::slotted([slot="input"]) { outline: unset; border: unset; background-color: transparent; box-shadow: none; font-family: inherit; font-size: inherit; line-height: initial; letter-spacing: inherit; color: var(--_form-field-input-color, inherit); flex: 1 1 auto; min-width: 0; padding: unset; } ::slotted(m3e-input-chip) { min-width: 0; } span[role="row"], span[role="gridcell"] { display: contents; }`];
-M3eInputChipSetElement = __decorate([element$1("m3e-input-chip-set")], M3eInputChipSetElement);
+M3eInputChipSetElement = __decorate([customElement$1("m3e-input-chip-set")], M3eInputChipSetElement);
 
 /**
  * A chip used to help narrow a user's intent by presenting dynamically generated suggestions, such as
@@ -5651,7 +5657,7 @@ let M3eSuggestionChipElement = class M3eSuggestionChipElement extends FormSubmit
 };
 /** Indicates that this custom element participates in form submission, validation, and form state restoration. */
 M3eSuggestionChipElement.formAssociated = true;
-M3eSuggestionChipElement = __decorate([element$1("m3e-suggestion-chip")], M3eSuggestionChipElement);
+M3eSuggestionChipElement = __decorate([customElement$1("m3e-suggestion-chip")], M3eSuggestionChipElement);
 
 var _AnimationLoopController_frameId, _AnimationLoopController_lastTime, _AnimationLoopController_running, _AnimationLoopController_callback, _AnimationLoopController_loop;
 /** A `ReactiveController` used to execute a function in an animation loop. */
@@ -6951,7 +6957,7 @@ _ResizeController_host = new WeakMap(), _ResizeController_callback = new WeakMap
  * Class decorator factory that defines the decorated class as a custom element.
  *
  * ```js
- * @element('my-element')
+ * @customElement('my-element')
  * class MyElement extends LitElement {
  *   render() {
  *     return html``;
@@ -6960,7 +6966,7 @@ _ResizeController_host = new WeakMap(), _ResizeController_callback = new WeakMap
  * ```
  * @param {string} tagName The tag name of the custom element to define.
  */
-const element = tagName => (classOrTarget, context) => {
+const customElement = tagName => (classOrTarget, context) => {
   const define = () => {
     if (typeof window !== "undefined" && !customElements.get(tagName)) {
       customElements.define(tagName, classOrTarget);
@@ -9423,7 +9429,7 @@ __decorate([n$1({
   type: Boolean,
   reflect: true
 })], M3eCollapsibleElement.prototype, "open", void 0);
-M3eCollapsibleElement = __decorate([element("m3e-collapsible")], M3eCollapsibleElement);
+M3eCollapsibleElement = __decorate([customElement("m3e-collapsible")], M3eCollapsibleElement);
 
 /**
  * Component design tokens that control the `M3eElevationElement`.
@@ -9595,7 +9601,7 @@ __decorate([n$1({
   type: Number,
   reflect: true
 })], M3eElevationElement.prototype, "level", void 0);
-M3eElevationElement = __decorate([element("m3e-elevation")], M3eElevationElement);
+M3eElevationElement = __decorate([customElement("m3e-elevation")], M3eElevationElement);
 
 /**
  * Component design tokens that control the `M3eFocusRingElement`.
@@ -9741,7 +9747,7 @@ __decorate([n$1({
   type: Boolean,
   reflect: true
 })], M3eFocusRingElement.prototype, "disabled", void 0);
-M3eFocusRingElement = __decorate([element("m3e-focus-ring")], M3eFocusRingElement);
+M3eFocusRingElement = __decorate([customElement("m3e-focus-ring")], M3eFocusRingElement);
 
 /**
  * An element which looks like a checkbox.
@@ -9794,7 +9800,7 @@ let M3ePseudoCheckboxElement = class M3ePseudoCheckboxElement extends CheckedInd
 };
 /** The styles of the element. */
 M3ePseudoCheckboxElement.styles = css`:host { display: inline-block; vertical-align: middle; width: var(--m3e-checkbox-icon-size, 1.125rem); height: var(--m3e-checkbox-icon-size, 1.125rem); border-radius: var(--m3e-checkbox-container-shape, 2px); box-sizing: border-box; flex: none; } :host(:not([checked]):not([indeterminate])) { border-width: var(--m3e-checkbox-unselected-outline-thickness, 2px); border-style: solid; } :host(:not([disabled])[checked]), :host(:not([disabled])[indeterminate]) { background-color: var(--m3e-checkbox-selected-container-color, ${DesignToken.color.primary}); color: var(--m3e-checkbox-selected-icon-color, ${DesignToken.color.onPrimary}); } :host(:not([disabled]):not([checked]):not([indeterminate])) { border-color: var(--m3e-checkbox-unselected-outline-color, ${DesignToken.color.onSurfaceVariant}); } :host([disabled]:not([checked]):not([indeterminate])) { border-color: color-mix( in srgb, var(--m3e-checkbox-unselected-disabled-outline-color, ${DesignToken.color.onSurface}) var(--m3e-checkbox-unselected-disabled-outline-opacity, 38%), transparent ); } :host([disabled][checked]), :host([disabled][indeterminate]) { background-color: color-mix( in srgb, var(--m3e-checkbox-selected-disabled-container-color, ${DesignToken.color.onSurface}) var(--m3e-checkbox-selected-disabled-container-opacity, 38%), transparent ); color: color-mix( in srgb, var(--m3e-checkbox-selected-disabled-icon-color, ${DesignToken.color.surface}) var(--m3e-checkbox-selected-disabled-icon-opacity, 100%), transparent ); }`;
-M3ePseudoCheckboxElement = __decorate([element("m3e-pseudo-checkbox")], M3ePseudoCheckboxElement);
+M3ePseudoCheckboxElement = __decorate([customElement("m3e-pseudo-checkbox")], M3ePseudoCheckboxElement);
 
 /**
  * An element which looks like a radio button.
@@ -9832,7 +9838,7 @@ let M3ePseudoRadioElement = class M3ePseudoRadioElement extends Checked(Disabled
 };
 /** The styles of the element. */
 M3ePseudoRadioElement.styles = css`:host { display: inline-block; vertical-align: middle; box-sizing: border-box; width: var(--m3e-radio-icon-size, 1.25rem); height: var(--m3e-radio-icon-size, 1.25rem); flex: none; } .circle { fill: currentColor; } :host(:not([checked])) .circle.inner { opacity: 0; } :host(:not([checked])) { color: var(--m3e-radio-unselected-icon-color, ${DesignToken.color.onSurfaceVariant}); } :host([checked]) { color: var(--m3e-radio-selected-icon-color, ${DesignToken.color.primary}); } :host([disabled]) { color: color-mix(in srgb, var(--m3e-radio-disabled-icon-color, ${DesignToken.color.onSurface}) 38%, transparent); }`;
-M3ePseudoRadioElement = __decorate([element("m3e-pseudo-radio")], M3ePseudoRadioElement);
+M3ePseudoRadioElement = __decorate([customElement("m3e-pseudo-radio")], M3ePseudoRadioElement);
 
 /**
  * Component design tokens that control the `M3eRippleElement`.
@@ -10042,7 +10048,7 @@ __decorate([n$1({
 __decorate([n$1({
   type: Number
 })], M3eRippleElement.prototype, "radius", void 0);
-M3eRippleElement = __decorate([element("m3e-ripple")], M3eRippleElement);
+M3eRippleElement = __decorate([customElement("m3e-ripple")], M3eRippleElement);
 
 var _M3eScrollContainerElement_scrollHandler;
 /**
@@ -10129,7 +10135,7 @@ __decorate([n$1({
   reflect: true
 })], M3eScrollContainerElement.prototype, "thin", void 0);
 __decorate([debounce(40)], M3eScrollContainerElement.prototype, "_updateScroll", null);
-M3eScrollContainerElement = __decorate([element("m3e-scroll-container")], M3eScrollContainerElement);
+M3eScrollContainerElement = __decorate([customElement("m3e-scroll-container")], M3eScrollContainerElement);
 
 var _M3eSlideElement_instances, _M3eSlideElement_items, _M3eSlideElement_handleSlotChange, _M3eSlideElement_updateItems;
 /**
@@ -10224,7 +10230,7 @@ __decorate([n$1({
   type: Number,
   reflect: true
 })], M3eSlideElement.prototype, "selectedIndex", void 0);
-M3eSlideElement = __decorate([element("m3e-slide")], M3eSlideElement);
+M3eSlideElement = __decorate([customElement("m3e-slide")], M3eSlideElement);
 
 /**
  * Component design tokens that control the `M3eStateLayerElement`.
@@ -10389,7 +10395,7 @@ __decorate([n$1({
   type: Boolean,
   reflect: true
 })], M3eStateLayerElement.prototype, "disableHover", void 0);
-M3eStateLayerElement = __decorate([element("m3e-state-layer")], M3eStateLayerElement);
+M3eStateLayerElement = __decorate([customElement("m3e-state-layer")], M3eStateLayerElement);
 
 /**
  * An inline container which presents an ellipsis when content overflows.
@@ -10424,7 +10430,7 @@ let M3eTextOverflowElement = class M3eTextOverflowElement extends LitElement {
 };
 /** The styles of the element. */
 M3eTextOverflowElement.styles = css`:host { flex: 1 1 auto; display: inline-flex; align-items: center; flex-wrap: nowrap; min-width: 0; } .base { flex: 1 1 auto; display: inline; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }`;
-M3eTextOverflowElement = __decorate([element("m3e-text-overflow")], M3eTextOverflowElement);
+M3eTextOverflowElement = __decorate([customElement("m3e-text-overflow")], M3eTextOverflowElement);
 
 var _M3eTextHighlightElement_instances, _M3eTextHighlightElement_id, _M3eTextHighlightElement_ranges, _M3eTextHighlightElement_styles, _M3eTextHighlightElement_isTextNode, _M3eTextHighlightElement_findTextNodes, _M3eTextHighlightElement_highlight;
 var M3eTextHighlightElement_1;
@@ -10617,7 +10623,7 @@ __decorate([n$1({
   attribute: "case-sensitive",
   type: Boolean
 })], M3eTextHighlightElement.prototype, "caseSensitive", void 0);
-M3eTextHighlightElement = M3eTextHighlightElement_1 = __decorate([element("m3e-text-highlight")], M3eTextHighlightElement);
+M3eTextHighlightElement = M3eTextHighlightElement_1 = __decorate([customElement("m3e-text-highlight")], M3eTextHighlightElement);
 
 /**
  * An element, nested within a clickable element, used to close a parenting dialog.
@@ -10644,7 +10650,7 @@ let M3eDialogActionElement = class M3eDialogActionElement extends ActionElementB
 __decorate([n$1({
   attribute: "return-value"
 })], M3eDialogActionElement.prototype, "returnValue", void 0);
-M3eDialogActionElement = __decorate([element$1("m3e-dialog-action")], M3eDialogActionElement);
+M3eDialogActionElement = __decorate([customElement$1("m3e-dialog-action")], M3eDialogActionElement);
 
 var _M3eDialogElement_instances, _M3eDialogElement_id, _M3eDialogElement_open, _M3eDialogElement_escapePressedWithoutCancel, _M3eDialogElement_scrollLockController, _M3eDialogElement_renderCloseButton, _M3eDialogElement_handleClose, _M3eDialogElement_handleCancel, _M3eDialogElement_handleClick, _M3eDialogElement_handleKeyDown, _M3eDialogElement_handleActionsSlotChange;
 var M3eDialogElement_1;
@@ -10911,7 +10917,7 @@ __decorate([n$1({
 __decorate([n$1({
   attribute: "close-label"
 })], M3eDialogElement.prototype, "closeLabel", void 0);
-M3eDialogElement = M3eDialogElement_1 = __decorate([element$1("m3e-dialog")], M3eDialogElement);
+M3eDialogElement = M3eDialogElement_1 = __decorate([customElement$1("m3e-dialog")], M3eDialogElement);
 
 /**
  * An element, nested within a clickable element, used to open a dialog.
@@ -10939,7 +10945,7 @@ let M3eDialogTriggerElement = class M3eDialogTriggerElement extends HtmlFor$1(Ac
     }
   }
 };
-M3eDialogTriggerElement = __decorate([element$1("m3e-dialog-trigger")], M3eDialogTriggerElement);
+M3eDialogTriggerElement = __decorate([customElement$1("m3e-dialog-trigger")], M3eDialogTriggerElement);
 
 /**
  * A thin line that separates content in lists or other containers.
@@ -11018,7 +11024,7 @@ __decorate([n$1({
   type: Boolean,
   reflect: true
 })], M3eDividerElement.prototype, "insetEnd", void 0);
-M3eDividerElement = __decorate([element$1("m3e-divider")], M3eDividerElement);
+M3eDividerElement = __decorate([customElement$1("m3e-divider")], M3eDividerElement);
 
 /**
  * Component design tokens that control `M3eDrawerContainerElement`.
@@ -11324,7 +11330,7 @@ __decorate([n$1({
   type: Boolean,
   reflect: true
 })], M3eDrawerContainerElement.prototype, "endDivider", void 0);
-M3eDrawerContainerElement = __decorate([element$1("m3e-drawer-container")], M3eDrawerContainerElement);
+M3eDrawerContainerElement = __decorate([customElement$1("m3e-drawer-container")], M3eDrawerContainerElement);
 
 var _M3eDrawerToggleElement_instances, _M3eDrawerToggleElement_drawerContainerChangeHandler, _M3eDrawerToggleElement_togglingDrawer, _M3eDrawerToggleElement_handleDrawerContainerChange, _M3eDrawerToggleElement_toggleDrawer, _M3eDrawerToggleElement_updateToggle;
 /**
@@ -11443,7 +11449,7 @@ async function _M3eDrawerToggleElement_updateToggle(container, syncToggle) {
     this.parentElement.ariaPressed = null;
   }
 };
-M3eDrawerToggleElement = __decorate([element$1("m3e-drawer-toggle")], M3eDrawerToggleElement);
+M3eDrawerToggleElement = __decorate([customElement$1("m3e-drawer-toggle")], M3eDrawerToggleElement);
 
 var _M3eAccordionElement_instances, _M3eAccordionElement_panels, _M3eAccordionElement_handleSlotChange, _M3eAccordionElement_handleOpening;
 /**
@@ -11525,7 +11531,7 @@ M3eAccordionElement.styles = css`:host { display: block; } ::slotted(m3e-expansi
 __decorate([n$1({
   type: Boolean
 })], M3eAccordionElement.prototype, "multi", void 0);
-M3eAccordionElement = __decorate([element$1("m3e-accordion")], M3eAccordionElement);
+M3eAccordionElement = __decorate([customElement$1("m3e-accordion")], M3eAccordionElement);
 
 /**
  * Component design tokens for `M3eExpansionHeaderElement`.
@@ -11657,7 +11663,7 @@ __decorate([n$1({
   type: Boolean,
   reflect: true
 })], M3eExpansionHeaderElement.prototype, "hideToggle", void 0);
-M3eExpansionHeaderElement = __decorate([element$1("m3e-expansion-header")], M3eExpansionHeaderElement);
+M3eExpansionHeaderElement = __decorate([customElement$1("m3e-expansion-header")], M3eExpansionHeaderElement);
 
 /* eslint-disable @typescript-eslint/no-unsafe-declaration-merging */
 var _M3eExpansionPanelElement_instances, _M3eExpansionPanelElement_id, _M3eExpansionPanelElement_contentId, _M3eExpansionPanelElement_headerId, _M3eExpansionPanelElement_directionalitySubscription, _M3eExpansionPanelElement_renderToggleIcon, _M3eExpansionPanelElement_handleHeaderClick, _M3eExpansionPanelElement_handleKeyDown, _M3eExpansionPanelElement_handleCollapsibleEvent, _M3eExpansionPanelElement_handleActionsSlotChange, _M3eExpansionPanelElement_updateHeaderToggleRotation;
@@ -11876,7 +11882,7 @@ __decorate([n$1({
   type: Boolean,
   reflect: true
 })], M3eExpansionPanelElement.prototype, "hideToggle", void 0);
-M3eExpansionPanelElement = M3eExpansionPanelElement_1 = __decorate([element$1("m3e-expansion-panel")], M3eExpansionPanelElement);
+M3eExpansionPanelElement = M3eExpansionPanelElement_1 = __decorate([customElement$1("m3e-expansion-panel")], M3eExpansionPanelElement);
 
 /**
  * Baseline styles for `M3eFabElement`.
@@ -12938,7 +12944,7 @@ __decorate([n$1({
   type: Boolean,
   reflect: true
 })], M3eFabElement.prototype, "extended", void 0);
-M3eFabElement = __decorate([element$1("m3e-fab")], M3eFabElement);
+M3eFabElement = __decorate([customElement$1("m3e-fab")], M3eFabElement);
 
 var _M3eFabMenuItemElement_instances, _M3eFabMenuItemElement_clickHandler, _M3eFabMenuItemElement_handleClick;
 /**
@@ -13030,7 +13036,7 @@ __decorate([e$4(".elevation")], M3eFabMenuItemElement.prototype, "_elevation", v
 __decorate([e$4(".focus-ring")], M3eFabMenuItemElement.prototype, "_focusRing", void 0);
 __decorate([e$4(".state-layer")], M3eFabMenuItemElement.prototype, "_stateLayer", void 0);
 __decorate([e$4(".ripple")], M3eFabMenuItemElement.prototype, "_ripple", void 0);
-M3eFabMenuItemElement = __decorate([element$1("m3e-fab-menu-item")], M3eFabMenuItemElement);
+M3eFabMenuItemElement = __decorate([customElement$1("m3e-fab-menu-item")], M3eFabMenuItemElement);
 
 var _M3eFabMenuElement_instances, _M3eFabMenuElement_fabTabIndex, _M3eFabMenuElement_trigger, _M3eFabMenuElement_anchoringCleanup, _M3eFabMenuElement_listManager, _M3eFabMenuElement_keyDownHandler, _M3eFabMenuElement_documentClickHandler, _M3eFabMenuElement_scrollController, _M3eFabMenuElement_toggleHandler, _M3eFabMenuElement_handleSlotChange, _M3eFabMenuElement_handleKeyDown, _M3eFabMenuElement_handleDocumentClick, _M3eFabMenuElement_attachFab, _M3eFabMenuElement_detachFab;
 /**
@@ -13282,7 +13288,7 @@ M3eFabMenuElement.styles = css`:host { position: absolute; flex-direction: colum
 __decorate([n$1({
   reflect: true
 })], M3eFabMenuElement.prototype, "variant", void 0);
-M3eFabMenuElement = __decorate([element$1("m3e-fab-menu")], M3eFabMenuElement);
+M3eFabMenuElement = __decorate([customElement$1("m3e-fab-menu")], M3eFabMenuElement);
 
 /**
  * An element, nested within a clickable element, used to open a floating action button (FAB) menu.
@@ -13341,7 +13347,7 @@ let M3eFabMenuTriggerElement = class M3eFabMenuTriggerElement extends HtmlFor$1(
     }
   }
 };
-M3eFabMenuTriggerElement = __decorate([element$1("m3e-fab-menu-trigger")], M3eFabMenuTriggerElement);
+M3eFabMenuTriggerElement = __decorate([customElement$1("m3e-fab-menu-trigger")], M3eFabMenuTriggerElement);
 
 /**
  * Adapted from Angular Material Form Field Control
@@ -13806,7 +13812,7 @@ __decorate([n$1({
   attribute: "float-label",
   reflect: true
 })], M3eFormFieldElement.prototype, "floatLabel", void 0);
-M3eFormFieldElement = __decorate([element$1("m3e-form-field")], M3eFormFieldElement);
+M3eFormFieldElement = __decorate([customElement$1("m3e-form-field")], M3eFormFieldElement);
 
 /**
  * A heading to a page or section.
@@ -13993,7 +13999,7 @@ __decorate([n$1({
 __decorate([n$1({
   type: Number
 })], M3eHeadingElement.prototype, "level", void 0);
-M3eHeadingElement = __decorate([element$1("m3e-heading")], M3eHeadingElement);
+M3eHeadingElement = __decorate([customElement$1("m3e-heading")], M3eHeadingElement);
 
 /**
  * A small symbol used to easily identify an action or category.
@@ -14107,7 +14113,7 @@ __decorate([n$1({
   attribute: "optical-size",
   type: Number
 })], M3eIconElement.prototype, "opticalSize", void 0);
-M3eIconElement = __decorate([element$1("m3e-icon")], M3eIconElement);
+M3eIconElement = __decorate([customElement$1("m3e-icon")], M3eIconElement);
 
 /**
  * Component design tokens that control the `M3eIconButtonElement` for all size variants.
@@ -15144,7 +15150,7 @@ __decorate([n$1({
   reflect: true
 })], M3eIconButtonElement.prototype, "selected", void 0);
 __decorate([debounce$1(40)], M3eIconButtonElement.prototype, "_handleResize", null);
-M3eIconButtonElement = __decorate([element$1("m3e-icon-button")], M3eIconButtonElement);
+M3eIconButtonElement = __decorate([customElement$1("m3e-icon-button")], M3eIconButtonElement);
 
 var _M3eListItemElement_instances, _M3eListItemElement_resizeController, _M3eListItemElement_leadingContentType, _M3eListItemElement_trailingContentType, _M3eListItemElement_updateMultiline, _M3eListItemElement_getSlotContentType;
 /**
@@ -15310,7 +15316,7 @@ _M3eListItemElement_getSlotContentType = function _M3eListItemElement_getSlotCon
 };
 /** The styles of the element. */
 M3eListItemElement.styles = css`:host { display: block; } .base { display: flex; min-height: inherit; width: 100%; box-sizing: border-box; column-gap: var(--m3e-list-item-between-space, 1rem); padding-inline-start: var(--m3e-list-item-leading-space, 1rem); padding-inline-end: var(--m3e-list-item-trailing-space, 1rem); border-top-left-radius: var( --_list-item-top-container-shape, var(--m3e-list-item-container-shape, ${DesignToken$1.shape.corner.none}) ); border-top-right-radius: var( --_list-item-top-container-shape, var(--m3e-list-item-container-shape, ${DesignToken$1.shape.corner.none}) ); border-bottom-left-radius: var( --_list-item-bottom-container-shape, var(--m3e-list-item-container-shape, ${DesignToken$1.shape.corner.none}) ); border-bottom-right-radius: var( --_list-item-bottom-container-shape, var(--m3e-list-item-container-shape, ${DesignToken$1.shape.corner.none}) ); transition: ${unsafeCSS(`border-radius ${DesignToken$1.motion.spring.fastEffects}, background-color ${DesignToken$1.motion.duration.short4} ${DesignToken$1.motion.easing.standard}`)}; } :host(:state(-one-line)) { min-height: calc(var(--m3e-list-item-one-line-height, 3.5rem) + ${DesignToken$1.density.calc(-3)}); } :host(:state(-one-line)) .base { padding-block-start: var(--m3e-list-item-one-line-top-space, 0.5rem); padding-block-end: var(--m3e-list-item-one-line-bottom-space, 0.5rem); } :host(:state(-two-line)) { min-height: calc(var(--m3e-list-item-two-line-height, 4.5rem) + ${DesignToken$1.density.calc(-3)}); } :host(:state(-two-line)) .base { padding-block-start: var(--m3e-list-item-two-line-top-space, 0.5rem); padding-block-end: var(--m3e-list-item-two-line-bottom-space, 0.5rem); } :host(:state(-three-line)) { min-height: calc(var(--m3e-list-item-three-line-height, 5.5rem) + ${DesignToken$1.density.calc(-3)}); } :host(:state(-three-line)) .base { padding-block-start: var(--m3e-list-item-three-line-top-space, 0.75rem); padding-block-end: var(--m3e-list-item-three-line-bottom-space, 0.75rem); } :host(:not(:state(-three-line))) .base { align-items: center; } :host(:state(-three-line)) .base { align-items: flex-start; } :host(:not(:disabled):not([selected])) .base:not(.hover).focus-visible:not(.pressed) { border-top-left-radius: var( --_list-item-top-container-shape, var(--m3e-list-item-focus-container-shape, ${DesignToken$1.shape.corner.large}) ); border-top-right-radius: var( --_list-item-top-container-shape, var(--m3e-list-item-focus-container-shape, ${DesignToken$1.shape.corner.large}) ); border-bottom-left-radius: var( --_list-item-bottom-container-shape, var(--m3e-list-item-focus-container-shape, ${DesignToken$1.shape.corner.large}) ); border-bottom-right-radius: var( --_list-item-bottom-container-shape, var(--m3e-list-item-focus-container-shape, ${DesignToken$1.shape.corner.large}) ); } :host(:not(:disabled):not([selected])) .base.hover, :host(:not(:disabled):not([selected])) .base.pressed { border-top-left-radius: var( --_list-item-top-container-shape, var(--m3e-list-item-hover-container-shape, ${DesignToken$1.shape.corner.medium}) ); border-top-right-radius: var( --_list-item-top-container-shape, var(--m3e-list-item-hover-container-shape, ${DesignToken$1.shape.corner.medium}) ); border-bottom-left-radius: var( --_list-item-bottom-container-shape, var(--m3e-list-item-hover-container-shape, ${DesignToken$1.shape.corner.medium}) ); border-bottom-right-radius: var( --_list-item-bottom-container-shape, var(--m3e-list-item-hover-container-shape, ${DesignToken$1.shape.corner.medium}) ); } .content { flex: 1 1 auto; display: flex; flex-direction: column; align-items: unset; justify-content: unset; } ::slotted([slot="overline"]) { font-size: var(--m3e-list-item-overline-font-size, ${DesignToken$1.typescale.standard.label.small.fontSize}); font-weight: var(--m3e-list-item-overline-font-weight, ${DesignToken$1.typescale.standard.label.small.fontWeight}); line-height: var(--m3e-list-item-overline-line-height, ${DesignToken$1.typescale.standard.label.small.lineHeight}); letter-spacing: var(--m3e-list-item-overline-tracking, ${DesignToken$1.typescale.standard.label.small.tracking}); } ::slotted([slot="supporting-text"]) { font-size: var(--m3e-list-item-supporting-text-font-size, ${DesignToken$1.typescale.standard.body.medium.fontSize}); font-weight: var( --m3e-list-item-supporting-text-font-weight, ${DesignToken$1.typescale.standard.body.medium.fontWeight} ); line-height: var( --m3e-list-item-supporting-text-line-height, ${DesignToken$1.typescale.standard.body.medium.lineHeight} ); letter-spacing: var( --m3e-list-item-supporting-text-tracking, ${DesignToken$1.typescale.standard.body.medium.tracking} ); } ::slotted(:not([slot])) { font-size: var(--m3e-list-item-font-size, ${DesignToken$1.typescale.standard.body.large.fontSize}); font-weight: var(--m3e-list-item-font-weight, ${DesignToken$1.typescale.standard.body.large.fontWeight}); line-height: var(--m3e-list-item-line-height, ${DesignToken$1.typescale.standard.body.large.lineHeight}); letter-spacing: var(--m3e-list-item-tracking, ${DesignToken$1.typescale.standard.body.large.tracking}); } :host(:state(-has-leading)) slot[name="leading"], :host(:state(-has-trailing)) slot[name="trailing"] { display: flex; justify-content: center; } :host(:not(:state(-has-leading))) slot[name="leading"] { display: var(--_list-item-leading-reserved-display, contents); } :host(:not(:state(-has-trailing))) slot[name="trailing"] { display: var(--_list-item-trailing-reserved-display, contents); } slot[name="leading"] { min-width: var(--_list-item-leading-reserved-space, 0px); margin-inline-start: calc(0px - var(--_list-item-leading-reserved-outset, 0px)); } slot[name="trailing"] { min-width: var(--_list-item-trailing-reserved-space, 0px); margin-inline-end: calc(0px - var(--_list-item-trailing-reserved-outset, 0px)); } ::slotted(span[slot="trailing"]), ::slotted([slot="trailing-supporting-text"]) { white-space: nowrap; font-size: var(--m3e-list-item-trailing-text-font-size, ${DesignToken$1.typescale.standard.label.small.fontSize}); font-weight: var( --m3e-list-item-trailing-text-font-weight, ${DesignToken$1.typescale.standard.label.small.fontWeight} ); line-height: var( --m3e-list-item-trailing-text-line-height, ${DesignToken$1.typescale.standard.label.small.lineHeight} ); letter-spacing: var( --m3e-list-item-trailing-text-tracking, ${DesignToken$1.typescale.standard.label.small.tracking} ); } ::slotted(video[slot="leading"]), ::slotted(video[slot="trailing"]), ::slotted(img[slot="leading"]), ::slotted(img[slot="trailing"]) { display: block; margin: 0 auto; overflow: hidden; object-fit: cover; } ::slotted(video) { width: var(--m3e-list-item-video-width, 6.25rem); height: var(--m3e-list-item-video-height, 3.5rem); } ::slotted(video[slot="leading"]), ::slotted(video[slot="trailing"]) { border-radius: var(--m3e-list-item-video-shape, ${DesignToken$1.shape.corner.none}); } ::slotted(video[slot="leading"]) { margin-inline-start: calc(0px - var(--_list-item-leading-video-outset, 0px)); } ::slotted(video[slot="trailing"]) { margin-inline-end: calc(0px - var(--_list-item-trailing-video-outset, 0px)); } ::slotted(img) { user-drag: none; user-select: none; pointer-events: none; width: var(--m3e-list-item-image-width, 3.5rem); height: var(--m3e-list-item-image-height, 3.5rem); } ::slotted(img[slot="leading"]), ::slotted(img[slot="trailing"]) { border-radius: var(--m3e-list-item-image-shape, ${DesignToken$1.shape.corner.none}); } ::slotted(m3e-icon[slot="leading"]), ::slotted(m3e-icon[slot="leading-icon"]), ::slotted(m3e-icon[slot="trailing"]), ::slotted(m3e-icon[slot="trailing-icon"]) { --m3e-icon-size: var(--m3e-list-item-icon-size, 1.5rem); } :host(:not(:disabled)) ::slotted(m3e-icon[slot="leading"]), :host(:not(:disabled)) ::slotted(m3e-icon[slot="leading-icon"]) { color: var(--m3e-list-item-leading-color, ${DesignToken$1.color.onSurfaceVariant}); } :host(:not(:disabled)) .content { color: var(--m3e-list-item-label-text-color, ${DesignToken$1.color.onSurface}); } :host(:not(:disabled)) ::slotted([slot="overline"]) { color: var(--m3e-list-item-overline-color, ${DesignToken$1.color.onSurfaceVariant}); } :host(:not(:disabled)) ::slotted([slot="supporting-text"]) { color: var(--m3e-list-item-supporting-text-color, ${DesignToken$1.color.onSurfaceVariant}); } :host(:not(:disabled)) ::slotted([slot="trailing"]), :host(:not(:disabled)) ::slotted([slot="trailing-supporting-text"]), :host(:not(:disabled)) ::slotted([slot="trailing-icon"]) { color: var(--m3e-list-item-trailing-color, ${DesignToken$1.color.onSurfaceVariant}); } :host(:not(:disabled)) .base { background-color: var(--_list-item-container-color, var(--m3e-list-item-container-color, transparent)); } :host(:disabled) .base { background-color: var(--m3e-list-item-disabled-container-color, transparent); } :host(:disabled) ::slotted(video), :host(:disabled) ::slotted(img), :host(:disabled) ::slotted(m3e-avatar) { opacity: var(--m3e-list-item-disabled-media-opacity, 38%); } :host(:disabled) .content { color: color-mix( in srgb, var(--m3e-list-item-disabled-label-text-color, ${DesignToken$1.color.onSurface}) var(--m3e-list-item-disabled-label-text-opacity, 38%), transparent ); } :host(:disabled) ::slotted([slot="overline"]) { color: color-mix( in srgb, var(--m3e-list-item-disabled-overline-color, ${DesignToken$1.color.onSurface}) var(--m3e-list-item-disabled-overline-opacity, 38%), transparent ); } :host(:disabled) ::slotted([slot="supporting-text"]) { color: color-mix( in srgb, var(--m3e-list-item-disabled-supporting-text-color, ${DesignToken$1.color.onSurface}) var(--m3e-list-item-disabled-supporting-text-opacity, 38%), transparent ); } :host(:disabled) ::slotted([slot="leading"]), :host(:disabled) ::slotted([slot="leading-icon"]) { color: color-mix( in srgb, var(--m3e-list-item-disabled-leading-color, ${DesignToken$1.color.onSurface}) var(--m3e-list-item-disabled-leading-opacity, 38%), transparent ); } :host(:disabled) ::slotted([slot="trailing"]), :host(:disabled) ::slotted([slot="trailing-supporting-text"]), :host(:disabled) ::slotted([slot="trailing-icon"]) { color: color-mix( in srgb, var(--m3e-list-item-disabled-trailing-color, ${DesignToken$1.color.onSurface}) var(--m3e-list-item-disabled-trailing-opacity, 38%), transparent ); } :host(:not(:disabled)) .state-layer { --m3e-state-layer-hover-color: var(--m3e-list-item-hover-state-layer-color, ${DesignToken$1.color.onSurface}); --m3e-state-layer-hover-opacity: var( --m3e-list-item-hover-state-layer-opacity, ${DesignToken$1.state.hoverStateLayerOpacity} ); --m3e-state-layer-focus-color: var(--m3e-list-item-focus-state-layer-color, ${DesignToken$1.color.onSurface}); --m3e-state-layer-focus-opacity: var( --m3e-list-item-focus-state-layer-opacity, ${DesignToken$1.state.focusStateLayerOpacity} ); } :host(:not(:disabled)) .ripple { --m3e-ripple-color: var(--m3e-list-item-pressed-state-layer-color, ${DesignToken$1.color.onSurface}); --m3e-ripple-opacity: var( --m3e-list-item-pressed-state-layer-opacity, ${DesignToken$1.state.pressedStateLayerOpacity} ); } @media (forced-colors: active) { :host(:disabled) ::slotted([slot="leading"]), :host(:disabled) ::slotted([slot="leading-icon"]), :host(:disabled) .content, :host(:disabled) ::slotted([slot="overline"]), :host(:disabled) ::slotted([slot="supporting-text"]), :host(:disabled) ::slotted([slot="trailing"]), :host(:disabled) ::slotted([slot="trailing-supporting-text"]), :host(:disabled) ::slotted([slot="trailing-icon"]) { color: GrayText; } } @media (prefers-reduced-motion) { .base { transition: none; } }`;
-M3eListItemElement = __decorate([element$1("m3e-list-item")], M3eListItemElement);
+M3eListItemElement = __decorate([customElement$1("m3e-list-item")], M3eListItemElement);
 
 var _M3eListElement_instances, _M3eListElement_items, _M3eListElement_leadingContentTypes, _M3eListElement_trailingContentTypes, _M3eListElement_handleSlotChange;
 /**
@@ -15456,7 +15462,7 @@ M3eListElement.styles = css`:host { display: flex; flex-direction: column; overf
 __decorate([n$1({
   reflect: true
 })], M3eListElement.prototype, "variant", void 0);
-M3eListElement = __decorate([element$1("m3e-list")], M3eListElement);
+M3eListElement = __decorate([customElement$1("m3e-list")], M3eListElement);
 
 var _M3eExpandableListItemElement_instances, _M3eExpandableListItemElement_id, _M3eExpandableListItemElement_contentId, _M3eExpandableListItemElement_headerId, _M3eExpandableListItemElement_items, _M3eExpandableListItemElement_handleHeaderClick, _M3eExpandableListItemElement_handleCollapsibleEvent, _M3eExpandableListItemElement_handleSlotChange;
 var M3eExpandableListItemElement_1;
@@ -15683,7 +15689,7 @@ __decorate([n$1({
   reflect: true
 })], M3eExpandableListItemElement.prototype, "open", void 0);
 __decorate([e$4(".header")], M3eExpandableListItemElement.prototype, "button", void 0);
-M3eExpandableListItemElement = M3eExpandableListItemElement_1 = __decorate([element$1("m3e-expandable-list-item")], M3eExpandableListItemElement);
+M3eExpandableListItemElement = M3eExpandableListItemElement_1 = __decorate([customElement$1("m3e-expandable-list-item")], M3eExpandableListItemElement);
 
 var _M3eActionListElement_keyDownHandler, _a$8;
 /**
@@ -15768,7 +15774,7 @@ let M3eActionListElement = class M3eActionListElement extends M3eListElement {
 };
 _M3eActionListElement_keyDownHandler = new WeakMap();
 _a$8 = selectionManager;
-M3eActionListElement = __decorate([element$1("m3e-action-list")], M3eActionListElement);
+M3eActionListElement = __decorate([customElement$1("m3e-action-list")], M3eActionListElement);
 
 var _M3eListActionElement_instances, _M3eListActionElement_handleClick;
 /**
@@ -15891,7 +15897,7 @@ __decorate([n$1({
   type: Boolean,
   reflect: true
 })], M3eListActionElement.prototype, "disabled", void 0);
-M3eListActionElement = __decorate([element$1("m3e-list-action")], M3eListActionElement);
+M3eListActionElement = __decorate([customElement$1("m3e-list-action")], M3eListActionElement);
 
 /**
  * @internal
@@ -15925,7 +15931,7 @@ M3eListItemButtonElement.styles = [M3eListItemElement.styles, css`:host { outlin
 __decorate([e$4(".focus-ring")], M3eListItemButtonElement.prototype, "_focusRing", void 0);
 __decorate([e$4(".state-layer")], M3eListItemButtonElement.prototype, "_stateLayer", void 0);
 __decorate([e$4(".ripple")], M3eListItemButtonElement.prototype, "_ripple", void 0);
-M3eListItemButtonElement = __decorate([element$1("m3e-list-item-button")], M3eListItemButtonElement);
+M3eListItemButtonElement = __decorate([customElement$1("m3e-list-item-button")], M3eListItemButtonElement);
 
 var _M3eListOptionElement_instances, _M3eListOptionElement_value, _M3eListOptionElement_textContent, _M3eListOptionElement_clickHandler, _M3eListOptionElement_handleSlotChange, _M3eListOptionElement_handleClick;
 /**
@@ -16114,7 +16120,7 @@ __decorate([e$4(".focus-ring")], M3eListOptionElement.prototype, "_focusRing", v
 __decorate([e$4(".state-layer")], M3eListOptionElement.prototype, "_stateLayer", void 0);
 __decorate([e$4(".ripple")], M3eListOptionElement.prototype, "_ripple", void 0);
 __decorate([n$1()], M3eListOptionElement.prototype, "value", null);
-M3eListOptionElement = __decorate([element$1("m3e-list-option")], M3eListOptionElement);
+M3eListOptionElement = __decorate([customElement$1("m3e-list-option")], M3eListOptionElement);
 
 var _M3eSelectionListElement_instances, _M3eSelectionListElement_keyDownHandler, _M3eSelectionListElement_changeHandler, _M3eSelectionListElement_handleChange, _a$7;
 /**
@@ -16261,7 +16267,7 @@ __decorate([n$1({
   attribute: "hide-selection-indicator",
   type: Boolean
 })], M3eSelectionListElement.prototype, "hideSelectionIndicator", void 0);
-M3eSelectionListElement = __decorate([element$1("m3e-selection-list")], M3eSelectionListElement);
+M3eSelectionListElement = __decorate([customElement$1("m3e-selection-list")], M3eSelectionListElement);
 
 const LoadingIndicatorToken = {
   activeIndicatorSize: unsafeCSS(`var(--m3e-loading-indicator-size, 2.375rem)`),
@@ -16361,7 +16367,7 @@ __decorate([e$4(".active-indicator")], M3eLoadingIndicatorElement.prototype, "_a
 __decorate([n$1({
   reflect: true
 })], M3eLoadingIndicatorElement.prototype, "variant", void 0);
-M3eLoadingIndicatorElement = __decorate([element$1("m3e-loading-indicator")], M3eLoadingIndicatorElement);
+M3eLoadingIndicatorElement = __decorate([customElement$1("m3e-loading-indicator")], M3eLoadingIndicatorElement);
 
 /** A base implementation for an item of a menu. This class must be inherited. */
 class MenuItemElementBase extends KeyboardClick$1(Focusable$1(AttachInternals$1(Disabled$1(LitElement), true))) {
@@ -16498,7 +16504,7 @@ let M3eMenuTriggerElement = class M3eMenuTriggerElement extends HtmlFor$1(Action
     }
   }
 };
-M3eMenuTriggerElement = __decorate([element$1("m3e-menu-trigger")], M3eMenuTriggerElement);
+M3eMenuTriggerElement = __decorate([customElement$1("m3e-menu-trigger")], M3eMenuTriggerElement);
 
 var _M3eMenuItemElement_instances, _M3eMenuItemElement_clickHandler, _M3eMenuItemElement_keyDownHandler, _M3eMenuItemElement_mouseEnterHandler, _M3eMenuItemElement_submenuTrigger, _M3eMenuItemElement_defaultSlotChangeHandler, _M3eMenuItemElement_iconSlotChangeHandler, _M3eMenuItemElement_trailingIconSlotChangeHandler, _M3eMenuItemElement_handleClick, _M3eMenuItemElement_handleKeyDown, _M3eMenuItemElement_handleMouseEnter;
 var M3eMenuItemElement_1;
@@ -16705,7 +16711,7 @@ _M3eMenuItemElement_handleMouseEnter = function _M3eMenuItemElement_handleMouseE
   });
 };
 __decorate([r$1()], M3eMenuItemElement.prototype, "_hasSubmenu", void 0);
-M3eMenuItemElement = M3eMenuItemElement_1 = __decorate([element$1("m3e-menu-item")], M3eMenuItemElement);
+M3eMenuItemElement = M3eMenuItemElement_1 = __decorate([customElement$1("m3e-menu-item")], M3eMenuItemElement);
 
 var _M3eMenuElement_instances, _M3eMenuElement_trigger, _M3eMenuElement_anchorCleanup, _M3eMenuElement_listManager, _M3eMenuElement_keyDownHandler, _M3eMenuElement_mouseEnterHandler, _M3eMenuElement_documentClickHandler, _M3eMenuElement_scrollController, _M3eMenuElement_toggleHandler, _M3eMenuElement_handleSlotChange, _M3eMenuElement_handleKeyDown, _M3eMenuElement_handleMouseEnter, _M3eMenuElement_handleDocumentClick, _M3eMenuElement_getAbsolutePosition, _M3eMenuElement_deactivate;
 var M3eMenuElement_1;
@@ -17087,7 +17093,7 @@ __decorate([n$1({
   type: Boolean,
   reflect: true
 })], M3eMenuElement.prototype, "submenu", void 0);
-M3eMenuElement = M3eMenuElement_1 = __decorate([element$1("m3e-menu")], M3eMenuElement);
+M3eMenuElement = M3eMenuElement_1 = __decorate([customElement$1("m3e-menu")], M3eMenuElement);
 
 var _M3eMenuItemCheckboxElement_instances, _M3eMenuItemCheckboxElement_clickHandler, _M3eMenuItemCheckboxElement_keyDownHandler, _M3eMenuItemCheckboxElement_keyUpHandler, _M3eMenuItemCheckboxElement_mouseEnterHandler, _M3eMenuItemCheckboxElement_spacePressed, _M3eMenuItemCheckboxElement_handleIconSlotChange, _M3eMenuItemCheckboxElement_handleTrailingIconSlotChange, _M3eMenuItemCheckboxElement_handleClick, _M3eMenuItemCheckboxElement_handleKeyDown, _M3eMenuItemCheckboxElement_handleKeyUp, _M3eMenuItemCheckboxElement_handleMouseEnter;
 /**
@@ -17239,7 +17245,7 @@ _M3eMenuItemCheckboxElement_handleMouseEnter = function _M3eMenuItemCheckboxElem
 };
 /** The styles of the element. */
 M3eMenuItemCheckboxElement.styles = [MenuItemElementBase.styles, css`.icon { display: flex; align-items: center; justify-content: center; transition: margin-inline-start ${DesignToken$1.motion.spring.fastEffects}; } :host(:not(:state(-with-icon))) .icon { margin-inline-start: calc(0px - var(--m3e-menu-item-icon-label-space, 0.75rem)); } .check { width: 1em; font-size: var(--m3e-menu-item-icon-size, 1.25rem) !important; } :host(:not([checked])) .check { display: none; } :host([checked]) .icon { margin-inline-start: 0; } :host([checked]) ::slotted([slot="icon"]) { display: none !important; } @media (prefers-reduced-motion) { .icon { transition: none; } }`];
-M3eMenuItemCheckboxElement = __decorate([element$1("m3e-menu-item-checkbox")], M3eMenuItemCheckboxElement);
+M3eMenuItemCheckboxElement = __decorate([customElement$1("m3e-menu-item-checkbox")], M3eMenuItemCheckboxElement);
 
 /**
  * Groups related items (such a radios) in a menu.
@@ -17261,7 +17267,7 @@ let M3eMenuItemGroupElement = class M3eMenuItemGroupElement extends Role$1(LitEl
 };
 /** The styles of the element. */
 M3eMenuItemGroupElement.styles = css`:host { display: contents; }`;
-M3eMenuItemGroupElement = __decorate([element$1("m3e-menu-item-group")], M3eMenuItemGroupElement);
+M3eMenuItemGroupElement = __decorate([customElement$1("m3e-menu-item-group")], M3eMenuItemGroupElement);
 
 var _M3eMenuItemRadioElement_instances, _M3eMenuItemRadioElement_clickHandler, _M3eMenuItemRadioElement_keyDownHandler, _M3eMenuItemRadioElement_keyUpHandler, _M3eMenuItemRadioElement_mouseEnterHandler, _M3eMenuItemRadioElement_spacePressed, _M3eMenuItemRadioElement_handleIconSlotChange, _M3eMenuItemRadioElement_handleTrailingIconSlotChange, _M3eMenuItemRadioElement_handleClick, _M3eMenuItemRadioElement_handleKeyDown, _M3eMenuItemRadioElement_handleKeyUp, _M3eMenuItemRadioElement_handleMouseEnter;
 /**
@@ -17423,7 +17429,7 @@ _M3eMenuItemRadioElement_handleMouseEnter = function _M3eMenuItemRadioElement_ha
 };
 /** The styles of the element. */
 M3eMenuItemRadioElement.styles = M3eMenuItemCheckboxElement.styles;
-M3eMenuItemRadioElement = __decorate([element$1("m3e-menu-item-radio")], M3eMenuItemRadioElement);
+M3eMenuItemRadioElement = __decorate([customElement$1("m3e-menu-item-radio")], M3eMenuItemRadioElement);
 
 var _M3eNavBarElement_instances, _M3eNavBarElement_breakpointUnobserve, _M3eNavBarElement_handleSlotChange, _M3eNavBarElement_handleChange, _a$6;
 /**
@@ -17545,7 +17551,7 @@ __decorate([r$1()], M3eNavBarElement.prototype, "_mode", void 0);
 __decorate([n$1({
   reflect: true
 })], M3eNavBarElement.prototype, "mode", void 0);
-M3eNavBarElement = __decorate([element$1("m3e-nav-bar")], M3eNavBarElement);
+M3eNavBarElement = __decorate([customElement$1("m3e-nav-bar")], M3eNavBarElement);
 
 var _M3eNavItemElement_instances, _M3eNavItemElement_clickHandler, _M3eNavItemElement_handleClick;
 /**
@@ -17702,7 +17708,7 @@ __decorate([e$4(".ripple")], M3eNavItemElement.prototype, "_ripple", void 0);
 __decorate([n$1({
   reflect: true
 })], M3eNavItemElement.prototype, "orientation", void 0);
-M3eNavItemElement = __decorate([element$1("m3e-nav-item")], M3eNavItemElement);
+M3eNavItemElement = __decorate([customElement$1("m3e-nav-item")], M3eNavItemElement);
 
 var _M3eNavMenuItemElement_instances, _M3eNavMenuItemElement_items, _M3eNavMenuItemElement_menu, _M3eNavMenuItemElement_path, _M3eNavMenuItemElement_link, _M3eNavMenuItemElement_renderIcon, _M3eNavMenuItemElement_handleIconSlotChange, _M3eNavMenuItemElement_handleSlotChange, _M3eNavMenuItemElement_handleItemSlotChange, _M3eNavMenuItemElement_handleClick, _M3eNavMenuItemElement_handleCollapsibleEvent;
 var M3eNavMenuItemElement_1;
@@ -18031,7 +18037,7 @@ __decorate([n$1({
   type: Boolean,
   reflect: true
 })], M3eNavMenuItemElement.prototype, "open", void 0);
-M3eNavMenuItemElement = M3eNavMenuItemElement_1 = __decorate([element$1("m3e-nav-menu-item")], M3eNavMenuItemElement);
+M3eNavMenuItemElement = M3eNavMenuItemElement_1 = __decorate([customElement$1("m3e-nav-menu-item")], M3eNavMenuItemElement);
 
 var _M3eNavMenuElement_instances, _M3eNavMenuElement_ignoreFocusVisible, _M3eNavMenuElement_ignoreFocus, _M3eNavMenuElement_keyDownHandler, _M3eNavMenuElement_keyUpHandler, _M3eNavMenuElement_pointerDownHandler, _M3eNavMenuElement_handleSlotChange, _M3eNavMenuElement_handleKeyDown, _M3eNavMenuElement_handleKeyUp, _M3eNavMenuElement_handlePointerDown, _M3eNavMenuElement_activateItem, _M3eNavMenuElement_updateFocusVisible, _M3eNavMenuElement_updateItemFocusVisible, _b;
 var M3eNavMenuElement_1;
@@ -18349,7 +18355,7 @@ _M3eNavMenuElement_updateItemFocusVisible = function _M3eNavMenuElement_updateIt
 M3eNavMenuElement.styles = css`:host { display: block; outline: none; overflow-y: auto; overflow-x: hidden; min-height: 0; scrollbar-width: ${DesignToken$1.scrollbar.width}; scrollbar-color: ${DesignToken$1.scrollbar.color}; } .base { width: 100%; display: flex; flex-direction: column; position: relative; min-height: inherit; box-sizing: border-box; padding-block-start: var(--m3e-nav-menu-padding-top, 0.5rem); padding-block-end: var(--m3e-nav-menu-padding-bottom, 0.5rem); padding-inline-start: var(--m3e-nav-menu-padding-left, 0.75rem); padding-inline-end: var(--m3e-nav-menu-padding-right, 0.75rem); }`;
 /** @private */
 M3eNavMenuElement.__nextId = 0;
-M3eNavMenuElement = M3eNavMenuElement_1 = __decorate([element$1("m3e-nav-menu")], M3eNavMenuElement);
+M3eNavMenuElement = M3eNavMenuElement_1 = __decorate([customElement$1("m3e-nav-menu")], M3eNavMenuElement);
 
 var _M3eNavMenuItemGroupElement_instances, _M3eNavMenuItemGroupElement_labelId, _M3eNavMenuItemGroupElement_label, _M3eNavMenuItemGroupElement_handleLabelSlotChange;
 var M3eNavMenuItemGroupElement_1;
@@ -18446,7 +18452,7 @@ _M3eNavMenuItemGroupElement_handleLabelSlotChange = function _M3eNavMenuItemGrou
 M3eNavMenuItemGroupElement.styles = css`:host { display: contents; } :host(:not(:state(-with-label))) .label { display: none; } .label { margin-inline-start: var(--m3e-nav-menu-item-group-label-inset, 1rem); margin-block-end: var(--m3e-nav-menu-item-group-label-space, 1rem); flex: none; } :host(:state(-divided)) .label { margin-block-start: calc( var(--m3e-nav-menu-item-group-label-space, 1rem) - var(--m3e-nav-menu-divider-margin, 0.25rem) ); } :host(:not(:state(-divided))) .label { margin-block-start: var(--m3e-nav-menu-item-group-label-space, 1rem); }`;
 /** @private */
 M3eNavMenuItemGroupElement.__nextId = 0;
-M3eNavMenuItemGroupElement = M3eNavMenuItemGroupElement_1 = __decorate([element$1("m3e-nav-menu-item-group")], M3eNavMenuItemGroupElement);
+M3eNavMenuItemGroupElement = M3eNavMenuItemGroupElement_1 = __decorate([customElement$1("m3e-nav-menu-item-group")], M3eNavMenuItemGroupElement);
 
 var _M3eNavRailElement_instances, _M3eNavRailElement_focusKeyManager, _M3eNavRailElement_keyDownHandler, _M3eNavRailElement_handleKeyDown;
 /**
@@ -18553,7 +18559,7 @@ _M3eNavRailElement_handleKeyDown = function _M3eNavRailElement_handleKeyDown(e)
 })();
 /** The styles of the element. */
 M3eNavRailElement.styles = css`:host { display: block; overflow-x: hidden; overflow-y: auto; scrollbar-width: ${DesignToken$1.scrollbar.thinWidth}; scrollbar-color: ${DesignToken$1.scrollbar.color}; } .base { display: flex; width: 100%; min-width: inherit; max-width: inherit; flex-direction: column; padding-block-start: var(--m3e-nav-rail-top-space, 2.75rem); padding-block-end: var(--m3e-nav-rail-bottom-space, 0.5rem); } :host(:state(-compact)) { width: var(--m3e-nav-rail-compact-width, 6rem); } :host(:state(-compact)) ::slotted(m3e-fab) { align-self: center; } :host(:not(:state(-compact))) { min-width: var(--m3e-nav-rail-expanded-min-width, 13.75rem); max-width: var(--m3e-nav-rail-expanded-max-width, 22.5rem); } :host(:not(:state(-compact))) .base { padding-inline: var(--m3e-nav-rail-expanded-inline-padding, 1.25rem); align-items: flex-start; --m3e-horizontal-nav-item-active-indicator-height: var(--m3e-nav-rail-expanded-item-height, 3.5rem); --_nav-item-align-self: stretch; --_nav-item-justify-content: flex-start; } ::slotted(*) { flex: none; } :host(:state(-compact)) ::slotted(m3e-icon-button) { align-self: center; } ::slotted(m3e-fab) { --m3e-fab-container-elevation: ${DesignToken$1.elevation.level0}; --m3e-fab-disabled-container-elevation: ${DesignToken$1.elevation.level0}; --m3e-fab-focus-container-elevation: ${DesignToken$1.elevation.level0}; --m3e-fab-pressed-container-elevation: ${DesignToken$1.elevation.level0}; --m3e-fab-hover-container-elevation: ${DesignToken$1.elevation.level1}; --m3e-fab-lowered-container-elevation: ${DesignToken$1.elevation.level0}; --m3e-fab-lowered-disabled-container-elevation: ${DesignToken$1.elevation.level0}; --m3e-fab-lowered-focus-container-elevation: ${DesignToken$1.elevation.level0}; --m3e-fab-lowered-pressed-container-elevation: ${DesignToken$1.elevation.level0}; --m3e-fab-lowered-hover-container-elevation: ${DesignToken$1.elevation.level1}; }`;
-M3eNavRailElement = __decorate([element$1("m3e-nav-rail")], M3eNavRailElement);
+M3eNavRailElement = __decorate([customElement$1("m3e-nav-rail")], M3eNavRailElement);
 
 var _M3eNavRailToggleElement_instances, _M3eNavRailToggleElement_mutationController, _M3eNavRailToggleElement_updateToggle;
 /**
@@ -18644,7 +18650,7 @@ async function _M3eNavRailToggleElement_updateToggle() {
     this.parentElement.ariaPressed = null;
   }
 };
-M3eNavRailToggleElement = __decorate([element$1("m3e-nav-rail-toggle")], M3eNavRailToggleElement);
+M3eNavRailToggleElement = __decorate([customElement$1("m3e-nav-rail-toggle")], M3eNavRailToggleElement);
 
 var _M3eOptionElement_instances, _M3eOptionElement_value, _M3eOptionElement_textContent, _M3eOptionElement_handleSlotChange;
 /**
@@ -18754,7 +18760,7 @@ __decorate([e$4(".focus-ring")], M3eOptionElement.prototype, "focusRing", void 0
 __decorate([e$4(".state-layer")], M3eOptionElement.prototype, "stateLayer", void 0);
 __decorate([e$4(".ripple")], M3eOptionElement.prototype, "_ripple", void 0);
 __decorate([n$1()], M3eOptionElement.prototype, "value", null);
-M3eOptionElement = __decorate([element$1("m3e-option")], M3eOptionElement);
+M3eOptionElement = __decorate([customElement$1("m3e-option")], M3eOptionElement);
 
 var _M3eOptGroupElement_instances, _M3eOptGroupElement_labelId, _M3eOptGroupElement_label, _M3eOptGroupElement_handleLabelSlotChange;
 var M3eOptGroupElement_1;
@@ -18821,7 +18827,7 @@ _M3eOptGroupElement_handleLabelSlotChange = function _M3eOptGroupElement_handleL
 M3eOptGroupElement.styles = css`:host { display: block; --_option-padding-start: calc(var(--m3e-option-padding-start, 0.75rem) * 2); } .label { height: var(--m3e-option-height, 3rem); font-size: var(--m3e-option-font-size, ${DesignToken$1.typescale.standard.label.large.fontSize}); font-weight: var(--m3e-option-font-weight, ${DesignToken$1.typescale.standard.label.large.fontWeight}); line-height: var(--m3e-option-line-height, ${DesignToken$1.typescale.standard.label.large.lineHeight}); letter-spacing: var(--m3e-option-tracking, ${DesignToken$1.typescale.standard.label.large.tracking}); padding-inline-end: var(--m3e-option-padding-end, 0.75rem); padding-inline-start: var(--m3e-option-padding-start, 0.75rem); color: var(--m3e-option-color, ${DesignToken$1.color.onSurface}); flex: none; }`;
 /** @private */
 M3eOptGroupElement.__nextId = 0;
-M3eOptGroupElement = M3eOptGroupElement_1 = __decorate([element$1("m3e-optgroup")], M3eOptGroupElement);
+M3eOptGroupElement = M3eOptGroupElement_1 = __decorate([customElement$1("m3e-optgroup")], M3eOptGroupElement);
 
 var _M3eOptionPanelElement_instances, _M3eOptionPanelElement_trigger, _M3eOptionPanelElement_anchor, _M3eOptionPanelElement_anchorCleanup, _M3eOptionPanelElement_documentClickHandler, _M3eOptionPanelElement_scrollController, _M3eOptionPanelElement_toggleHandler, _M3eOptionPanelElement_handleSlotChange, _M3eOptionPanelElement_handleDocumentClick;
 var M3eOptionPanelElement_1;
@@ -18997,7 +19003,7 @@ M3eOptionPanelElement.styles = css`:host { position: absolute; flex-direction: c
         transform ${DesignToken$1.motion.duration.short2} ${DesignToken$1.motion.easing.standard},
         overlay ${DesignToken$1.motion.duration.short2} ${DesignToken$1.motion.easing.standard} allow-discrete,
         display ${DesignToken$1.motion.duration.short2} ${DesignToken$1.motion.easing.standard} allow-discrete`)}; } :host { transform: scaleY(0.8); } :host(:popover-open) { transform: scaleY(1); display: block; opacity: 1; } :host::backdrop { background-color: transparent; } :host(:state(-bottom)) { transform-origin: top; } :host(:state(-top)) { transform-origin: bottom; } @starting-style { :host(:popover-open) { transform: scaleY(0.8); } } @media (prefers-reduced-motion) { :host(:not(:state(-no-animate))) { transition: none; } } @media (forced-colors: active) { :host { background-color: Menu; color: MenuText; outline: 1px solid MenuText; } }`;
-M3eOptionPanelElement = M3eOptionPanelElement_1 = __decorate([element$1("m3e-option-panel")], M3eOptionPanelElement);
+M3eOptionPanelElement = M3eOptionPanelElement_1 = __decorate([customElement$1("m3e-option-panel")], M3eOptionPanelElement);
 
 /**
  * Adapted from Angular Material Paginator
@@ -19281,7 +19287,7 @@ __decorate([n$1({
 __decorate([n$1({
   attribute: "page-size-variant"
 })], M3ePaginatorElement.prototype, "pageSizeVariant", void 0);
-M3ePaginatorElement = M3ePaginatorElement_1 = __decorate([element$1("m3e-paginator")], M3ePaginatorElement);
+M3ePaginatorElement = M3ePaginatorElement_1 = __decorate([customElement$1("m3e-paginator")], M3ePaginatorElement);
 
 /**
  * @license
@@ -19744,7 +19750,7 @@ __decorate([n$1({
   type: Boolean,
   reflect: true
 })], M3eCircularProgressIndicatorElement.prototype, "indeterminate", void 0);
-M3eCircularProgressIndicatorElement = M3eCircularProgressIndicatorElement_1 = __decorate([element$1("m3e-circular-progress-indicator")], M3eCircularProgressIndicatorElement);
+M3eCircularProgressIndicatorElement = M3eCircularProgressIndicatorElement_1 = __decorate([customElement$1("m3e-circular-progress-indicator")], M3eCircularProgressIndicatorElement);
 
 var _M3eLinearProgressIndicatorElement_instances, _M3eLinearProgressIndicatorElement_maskId, _M3eLinearProgressIndicatorElement_strokeWidth, _M3eLinearProgressIndicatorElement_amplitude, _M3eLinearProgressIndicatorElement_wavelength, _M3eLinearProgressIndicatorElement_resizeController, _M3eLinearProgressIndicatorElement_renderWave, _M3eLinearProgressIndicatorElement_renderResizeObservedElements, _M3eLinearProgressIndicatorElement_updateStroke, _M3eLinearProgressIndicatorElement_updateAmplitudeAndWavelength, _M3eLinearProgressIndicatorElement_drawWavyPath;
 var M3eLinearProgressIndicatorElement_1;
@@ -19939,7 +19945,7 @@ __decorate([n$1({
   type: Number,
   reflect: true
 })], M3eLinearProgressIndicatorElement.prototype, "bufferValue", void 0);
-M3eLinearProgressIndicatorElement = M3eLinearProgressIndicatorElement_1 = __decorate([element$1("m3e-linear-progress-indicator")], M3eLinearProgressIndicatorElement);
+M3eLinearProgressIndicatorElement = M3eLinearProgressIndicatorElement_1 = __decorate([customElement$1("m3e-linear-progress-indicator")], M3eLinearProgressIndicatorElement);
 
 var _M3eRadioElement_instances, _M3eRadioElement_clickHandler, _M3eRadioElement_hoverController, _M3eRadioElement_pressedController, _M3eRadioElement_renderIcon, _M3eRadioElement_handleClick, _M3eRadioElement_notifySelectionChange;
 /**
@@ -20109,7 +20115,7 @@ __decorate([e$4(".focus-ring")], M3eRadioElement.prototype, "_focusRing", void 0
 __decorate([e$4(".state-layer")], M3eRadioElement.prototype, "_stateLayer", void 0);
 __decorate([e$4(".ripple")], M3eRadioElement.prototype, "_ripple", void 0);
 __decorate([n$1()], M3eRadioElement.prototype, "value", void 0);
-M3eRadioElement = __decorate([element$1("m3e-radio")], M3eRadioElement);
+M3eRadioElement = __decorate([customElement$1("m3e-radio")], M3eRadioElement);
 
 var _M3eRadioGroupElement_instances, _M3eRadioGroupElement_directionalitySubscription, _M3eRadioGroupElement_focusOutHandler, _M3eRadioGroupElement_handleSlotChange, _M3eRadioGroupElement_handleKeyDown, _M3eRadioGroupElement_handleChange, _a$5;
 /**
@@ -20254,7 +20260,7 @@ _M3eRadioGroupElement_handleChange = function _M3eRadioGroupElement_handleChange
 };
 /** The styles of the element. */
 M3eRadioGroupElement.styles = css`:host { display: inline-flex; }`;
-M3eRadioGroupElement = __decorate([element$1("m3e-radio-group")], M3eRadioGroupElement);
+M3eRadioGroupElement = __decorate([customElement$1("m3e-radio-group")], M3eRadioGroupElement);
 
 var _M3eButtonSegmentElement_instances, _M3eButtonSegmentElement_clickHandler, _M3eButtonSegmentElement_handleIconSlotChange, _M3eButtonSegmentElement_handleClick;
 var M3eButtonSegmentElement_1;
@@ -20425,7 +20431,7 @@ __decorate([e$4(".focus-ring")], M3eButtonSegmentElement.prototype, "_focusRing"
 __decorate([e$4(".state-layer")], M3eButtonSegmentElement.prototype, "_stateLayer", void 0);
 __decorate([e$4(".ripple")], M3eButtonSegmentElement.prototype, "_ripple", void 0);
 __decorate([n$1()], M3eButtonSegmentElement.prototype, "value", void 0);
-M3eButtonSegmentElement = M3eButtonSegmentElement_1 = __decorate([element$1("m3e-button-segment")], M3eButtonSegmentElement);
+M3eButtonSegmentElement = M3eButtonSegmentElement_1 = __decorate([customElement$1("m3e-button-segment")], M3eButtonSegmentElement);
 
 var _M3eSegmentedButtonElement_instances, _M3eSegmentedButtonElement_directionalitySubscription, _M3eSegmentedButtonElement_handleSlotChange, _M3eSegmentedButtonElement_handleKeyDown, _M3eSegmentedButtonElement_handleChange, _a$4;
 /**
@@ -20590,7 +20596,7 @@ __decorate([n$1({
   attribute: "hide-selection-indicator",
   type: Boolean
 })], M3eSegmentedButtonElement.prototype, "hideSelectionIndicator", void 0);
-M3eSegmentedButtonElement = __decorate([element$1("m3e-segmented-button")], M3eSegmentedButtonElement);
+M3eSegmentedButtonElement = __decorate([customElement$1("m3e-segmented-button")], M3eSegmentedButtonElement);
 
 /**
  * @license
@@ -21061,7 +21067,7 @@ __decorate([n$1({
 __decorate([n$1({
   type: Boolean
 })], M3eSelectElement.prototype, "multi", void 0);
-M3eSelectElement = M3eSelectElement_1 = __decorate([element$1("m3e-select")], M3eSelectElement);
+M3eSelectElement = M3eSelectElement_1 = __decorate([customElement$1("m3e-select")], M3eSelectElement);
 
 /**
  * Component design tokens that control the `M3eShapeElement` for all variants.
@@ -21194,7 +21200,7 @@ M3eShapeElement.styles = [ShapeStyle, ShapeNameStyle];
 __decorate([n$1({
   reflect: true
 })], M3eShapeElement.prototype, "name", void 0);
-M3eShapeElement = __decorate([element$1("m3e-shape")], M3eShapeElement);
+M3eShapeElement = __decorate([customElement$1("m3e-shape")], M3eShapeElement);
 
 var _M3eSlideGroupElement_instances, _M3eSlideGroupElement_directionalitySubscription, _M3eSlideGroupElement_resizeController, _M3eSlideGroupElement_pageStart, _M3eSlideGroupElement_pageEnd;
 /**
@@ -21391,7 +21397,7 @@ __decorate([n$1({
   attribute: "next-page-label"
 })], M3eSlideGroupElement.prototype, "nextPageLabel", void 0);
 __decorate([debounce$1(40)], M3eSlideGroupElement.prototype, "_updatePaging", null);
-M3eSlideGroupElement = __decorate([element$1("m3e-slide-group")], M3eSlideGroupElement);
+M3eSlideGroupElement = __decorate([customElement$1("m3e-slide-group")], M3eSlideGroupElement);
 
 var _M3eSliderThumbElement_instances, _M3eSliderThumbElement_labelText_get;
 /**
@@ -21498,7 +21504,7 @@ __decorate([n$1({
   type: Number,
   reflect: true
 })], M3eSliderThumbElement.prototype, "value", void 0);
-M3eSliderThumbElement = __decorate([element$1("m3e-slider-thumb")], M3eSliderThumbElement);
+M3eSliderThumbElement = __decorate([customElement$1("m3e-slider-thumb")], M3eSliderThumbElement);
 
 var _M3eSliderElement_instances, _M3eSliderElement_directionalitySubscription, _M3eSliderElement_thumbs, _M3eSliderElement_activeThumb, _M3eSliderElement_cachedWidth, _M3eSliderElement_cachedThumbWidth, _M3eSliderElement_cachedLeft, _M3eSliderElement_renderTick, _M3eSliderElement_handleSlotChange, _M3eSliderElement_updateThumbs, _M3eSliderElement_pointFromValue, _M3eSliderElement_valueFromPoint, _M3eSliderElement_updateCachedDimensions, _M3eSliderElement_updateDimensions, _M3eSliderElement_updateTicks, _M3eSliderElement_handlePointerDown, _M3eSliderElement_handlePointerMove, _M3eSliderElement_handlePointerUp, _M3eSliderElement_handleKeyDown, _M3eSliderElement_handleThumbChange, _M3eSliderElement_changeThumb;
 /**
@@ -21977,7 +21983,7 @@ __decorate([n$1({
 __decorate([n$1({
   attribute: false
 })], M3eSliderElement.prototype, "displayWith", void 0);
-M3eSliderElement = __decorate([element$1("m3e-slider")], M3eSliderElement);
+M3eSliderElement = __decorate([customElement$1("m3e-slider")], M3eSliderElement);
 
 /* eslint-disable @typescript-eslint/no-unsafe-declaration-merging */
 var _M3eSnackbarElement_instances, _M3eSnackbarElement_timeoutId, _M3eSnackbarElement_actionTaken, _M3eSnackbarElement_beforeToggleHandler, _M3eSnackbarElement_renderActionButton, _M3eSnackbarElement_renderCloseButton, _M3eSnackbarElement_handleActionClick, _M3eSnackbarElement_handleBeforeToggle;
@@ -22121,7 +22127,7 @@ __decorate([n$1({
 __decorate([n$1({
   attribute: "close-label"
 })], M3eSnackbarElement.prototype, "closeLabel", void 0);
-M3eSnackbarElement = M3eSnackbarElement_1 = __decorate([element$1("m3e-snackbar")], M3eSnackbarElement);
+M3eSnackbarElement = M3eSnackbarElement_1 = __decorate([customElement$1("m3e-snackbar")], M3eSnackbarElement);
 
 /**
  * Presents short updates about application processes at the bottom of the screen from anywhere in an application.
@@ -22404,7 +22410,7 @@ __decorate([n$1({
 __decorate([n$1({
   reflect: true
 })], M3eSplitButtonElement.prototype, "size", void 0);
-M3eSplitButtonElement = __decorate([element$1("m3e-split-button")], M3eSplitButtonElement);
+M3eSplitButtonElement = __decorate([customElement$1("m3e-split-button")], M3eSplitButtonElement);
 
 /**
  * A panel presented for a step in a wizard-like workflow.
@@ -22482,7 +22488,7 @@ let M3eStepPanelElement = class M3eStepPanelElement extends Role$1(LitElement, "
 /** The styles of the element. */
 M3eStepPanelElement.styles = css`:host { display: block; } .content { display: flex; flex-direction: column; padding: var(--m3e-step-panel-padding, 1rem 1.5rem 1.5rem 1.5rem); row-gap: var(--m3e-step-panel-spacing, 0.5rem); } ::slotted([slot="actions"]) { flex: none; display: flex; align-items: center; min-height: var(--m3e-step-panel-actions-height, 3rem); } ::slotted([slot="actions"][end]) { justify-content: flex-end; }`;
 __decorate([r$1()], M3eStepPanelElement.prototype, "active", void 0);
-M3eStepPanelElement = __decorate([element$1("m3e-step-panel")], M3eStepPanelElement);
+M3eStepPanelElement = __decorate([customElement$1("m3e-step-panel")], M3eStepPanelElement);
 
 var _M3eStepElement_instances, _M3eStepElement_clickHandler, _M3eStepElement_renderIcon, _M3eStepElement_handleClick;
 var M3eStepElement_1;
@@ -22736,7 +22742,7 @@ __decorate([n$1({
   reflect: true
 })], M3eStepElement.prototype, "invalid", void 0);
 __decorate([r$1()], M3eStepElement.prototype, "index", void 0);
-M3eStepElement = M3eStepElement_1 = __decorate([element$1("m3e-step")], M3eStepElement);
+M3eStepElement = M3eStepElement_1 = __decorate([customElement$1("m3e-step")], M3eStepElement);
 
 var _StepperButtonElementBase_action;
 /** A base implementation for a button used to move to a step in a stepper. This class must be inherited. */
@@ -23105,7 +23111,7 @@ __decorate([n$1({
 __decorate([n$1({
   reflect: true
 })], M3eStepperElement.prototype, "orientation", void 0);
-M3eStepperElement = __decorate([element$1("m3e-stepper")], M3eStepperElement);
+M3eStepperElement = __decorate([customElement$1("m3e-stepper")], M3eStepperElement);
 
 /**
  * An element, nested within a clickable element, used to move a stepper to the next step.
@@ -23118,7 +23124,7 @@ let M3eStepperNextElement = class M3eStepperNextElement extends StepperButtonEle
     super("next");
   }
 };
-M3eStepperNextElement = __decorate([element$1("m3e-stepper-next")], M3eStepperNextElement);
+M3eStepperNextElement = __decorate([customElement$1("m3e-stepper-next")], M3eStepperNextElement);
 
 /**
  * An element, nested within a clickable element, used to move a stepper to the previous step.
@@ -23131,7 +23137,7 @@ let M3eStepperPreviousElement = class M3eStepperPreviousElement extends StepperB
     super("previous");
   }
 };
-M3eStepperPreviousElement = __decorate([element$1("m3e-stepper-previous")], M3eStepperPreviousElement);
+M3eStepperPreviousElement = __decorate([customElement$1("m3e-stepper-previous")], M3eStepperPreviousElement);
 
 /**
  * An element, nested within a clickable element, used to reset a stepper to its initial state.
@@ -23144,7 +23150,7 @@ let M3eStepperResetElement = class M3eStepperResetElement extends StepperButtonE
     super("reset");
   }
 };
-M3eStepperResetElement = __decorate([element$1("m3e-stepper-reset")], M3eStepperResetElement);
+M3eStepperResetElement = __decorate([customElement$1("m3e-stepper-reset")], M3eStepperResetElement);
 
 /**
  * Component design tokens that control `M3eSwitchElement`.
@@ -23468,7 +23474,7 @@ __decorate([n$1({
   reflect: true
 })], M3eSwitchElement.prototype, "icons", void 0);
 __decorate([n$1()], M3eSwitchElement.prototype, "value", void 0);
-M3eSwitchElement = __decorate([element$1("m3e-switch")], M3eSwitchElement);
+M3eSwitchElement = __decorate([customElement$1("m3e-switch")], M3eSwitchElement);
 
 var _M3eTabElement_instances, _M3eTabElement_clickHandler, _M3eTabElement_handleClick;
 var M3eTabElement_1;
@@ -23605,7 +23611,7 @@ __decorate([e$4(".focus-ring")], M3eTabElement.prototype, "_focusRing", void 0);
 __decorate([e$4(".state-layer")], M3eTabElement.prototype, "_stateLayer", void 0);
 __decorate([e$4(".ripple")], M3eTabElement.prototype, "_ripple", void 0);
 __decorate([e$4(".label")], M3eTabElement.prototype, "label", void 0);
-M3eTabElement = M3eTabElement_1 = __decorate([element$1("m3e-tab")], M3eTabElement);
+M3eTabElement = M3eTabElement_1 = __decorate([customElement$1("m3e-tab")], M3eTabElement);
 
 /**
  * A panel presented for a tab.
@@ -23648,7 +23654,7 @@ let M3eTabPanelElement = class M3eTabPanelElement extends Role$1(LitElement, "ta
 };
 /** The styles of the element. */
 M3eTabPanelElement.styles = css`:host { display: block; overflow-y: auto; scrollbar-width: ${DesignToken$1.scrollbar.width}; scrollbar-color: ${DesignToken$1.scrollbar.color}; }`;
-M3eTabPanelElement = __decorate([element$1("m3e-tab-panel")], M3eTabPanelElement);
+M3eTabPanelElement = __decorate([customElement$1("m3e-tab-panel")], M3eTabPanelElement);
 
 var _M3eTabsElement_instances, _M3eTabsElement_directionalitySubscription, _M3eTabsElement_renderHeader, _M3eTabsElement_handleSlotChange, _M3eTabsElement_handleKeyDown, _M3eTabsElement_handleChange, _M3eTabsElement_handleSelectedChange, _M3eTabsElement_updateInkBar, _a$2;
 const MIN_PRIMARY_TAB_WIDTH = 24;
@@ -23883,7 +23889,7 @@ __decorate([n$1({
 __decorate([n$1({
   attribute: "next-page-label"
 })], M3eTabsElement.prototype, "nextPageLabel", void 0);
-M3eTabsElement = __decorate([element$1("m3e-tabs")], M3eTabsElement);
+M3eTabsElement = __decorate([customElement$1("m3e-tabs")], M3eTabsElement);
 
 /**
  * Adapted from Angular Material CDK Text Field
@@ -24150,7 +24156,7 @@ __decorate([n$1({
   reflect: true
 })], M3eTextareaAutosizeElement.prototype, "disabled", void 0);
 __decorate([debounce$1(16)], M3eTextareaAutosizeElement.prototype, "_handleWindowResize", null);
-M3eTextareaAutosizeElement = __decorate([element$1("m3e-textarea-autosize")], M3eTextareaAutosizeElement);
+M3eTextareaAutosizeElement = __decorate([customElement$1("m3e-textarea-autosize")], M3eTextareaAutosizeElement);
 
 /**
  * @license
@@ -27441,7 +27447,7 @@ __decorate([n$1({
   type: Number
 })], M3eThemeElement.prototype, "density", void 0);
 __decorate([n$1()], M3eThemeElement.prototype, "motion", void 0);
-M3eThemeElement = __decorate([element$1("m3e-theme")], M3eThemeElement);
+M3eThemeElement = __decorate([customElement$1("m3e-theme")], M3eThemeElement);
 
 /**
  * An item in a table of contents.
@@ -27500,7 +27506,7 @@ M3eTocItemElement.styles = css`:host { display: inline-block; position: relative
 __decorate([e$4(".base")], M3eTocItemElement.prototype, "_base", void 0);
 __decorate([e$4(".state-layer")], M3eTocItemElement.prototype, "_stateLayer", void 0);
 __decorate([r$1()], M3eTocItemElement.prototype, "node", void 0);
-M3eTocItemElement = __decorate([element$1("m3e-toc-item")], M3eTocItemElement);
+M3eTocItemElement = __decorate([customElement$1("m3e-toc-item")], M3eTocItemElement);
 
 var _a$1, _TocGenerator_getHeaderLevel;
 /** Provides functionality used to generate a table of contents used for in-page navigation. */
@@ -27778,7 +27784,7 @@ __decorate([n$1({
   type: Number
 })], M3eTocElement.prototype, "maxDepth", void 0);
 __decorate([debounce$1(40)], M3eTocElement.prototype, "_updateToc", null);
-M3eTocElement = __decorate([element$1("m3e-toc")], M3eTocElement);
+M3eTocElement = __decorate([customElement$1("m3e-toc")], M3eTocElement);
 
 var _M3eToolbarElement_instances, _M3eToolbarElement_directionalitySubscription, _M3eToolbarElement_focusKeyManager, _M3eToolbarElement_handleSlotChange, _M3eToolbarElement_handleKeyDown, _M3eToolbarElement_handleClick;
 /**
@@ -27912,7 +27918,7 @@ __decorate([n$1({
   type: Boolean,
   reflect: true
 })], M3eToolbarElement.prototype, "elevated", void 0);
-M3eToolbarElement = __decorate([element$1("m3e-toolbar")], M3eToolbarElement);
+M3eToolbarElement = __decorate([customElement$1("m3e-toolbar")], M3eToolbarElement);
 
 /**
  * An element, nested within a clickable element, used to dismiss a parenting rich tooltip.
@@ -27937,7 +27943,7 @@ __decorate([n$1({
   attribute: "disable-restore-focus",
   type: Boolean
 })], M3eRichTooltipActionElement.prototype, "disableRestoreFocus", void 0);
-M3eRichTooltipActionElement = __decorate([element$1("m3e-rich-tooltip-action")], M3eRichTooltipActionElement);
+M3eRichTooltipActionElement = __decorate([customElement$1("m3e-rich-tooltip-action")], M3eRichTooltipActionElement);
 
 var _TooltipElementBase_instances, _a, _TooltipElementBase_for, _TooltipElementBase_anchorCleanup, _TooltipElementBase_tooltipHovering, _TooltipElementBase_controlClickHandler, _TooltipElementBase_hoverController, _TooltipElementBase_longPressController, _TooltipElementBase_handleControlClick, _TooltipElementBase_disableNativeGesturesIfNecessary;
 /** The space, in pixels, between the tooltip and anchor. */
@@ -28407,7 +28413,7 @@ M3eRichTooltipElement.__nextId = 0;
 __decorate([r$1()], M3eRichTooltipElement.prototype, "_hasSubhead", void 0);
 __decorate([r$1()], M3eRichTooltipElement.prototype, "_interactive", void 0);
 __decorate([n$1()], M3eRichTooltipElement.prototype, "position", void 0);
-M3eRichTooltipElement = M3eRichTooltipElement_1 = __decorate([element$1("m3e-rich-tooltip")], M3eRichTooltipElement);
+M3eRichTooltipElement = M3eRichTooltipElement_1 = __decorate([customElement$1("m3e-rich-tooltip")], M3eRichTooltipElement);
 
 var _M3eTooltipElement_instances, _M3eTooltipElement_message, _M3eTooltipElement_handleSlotChange, _M3eTooltipElement_handleToggle;
 /**
@@ -28530,7 +28536,7 @@ M3eTooltipElement.styles = css`:host { display: contents; } .base { position: ab
         overlay ${DesignToken$1.motion.duration.short3} ${DesignToken$1.motion.easing.standard} allow-discrete,
         display ${DesignToken$1.motion.duration.short3} ${DesignToken$1.motion.easing.standard} allow-discrete`)}; } :host(:state(-multiline)) .base { text-align: start; } .base::backdrop { background-color: transparent; } .base:popover-open { display: block; opacity: 1; transform: scale(1); } @starting-style { .base:popover-open { opacity: 0; transform: scale(0.8); } } @media (prefers-reduced-motion) { .base { transition: none; } } @media (forced-colors: active) { .base { background-color: Canvas; color: CanvasText; box-sizing: border-box; border: 1px solid CanvasText; } }`;
 __decorate([n$1()], M3eTooltipElement.prototype, "position", void 0);
-M3eTooltipElement = __decorate([element$1("m3e-tooltip")], M3eTooltipElement);
+M3eTooltipElement = __decorate([customElement$1("m3e-tooltip")], M3eTooltipElement);
 
-export { ActionElementBase, AnimationLoopController, AttachInternals, Checked, CheckedIndeterminate, ConstraintValidation, DesignToken, Dirty, Disabled, DisabledInteractive, EventAttribute, FocusController, Focusable, FormAssociated, FormSubmitter, HoverController, HtmlFor, IntersectionController, KeyboardClick, Labelled, LinkButton, LongPressController, M3eAccordionElement, M3eActionListElement, M3eAppBarElement, M3eAssistChipElement, M3eAutocompleteElement, M3eAvatarElement, M3eBadgeElement, M3eBottomSheetActionElement, M3eBottomSheetElement, M3eBottomSheetTriggerElement, M3eButtonElement, M3eButtonGroupElement, M3eButtonSegmentElement, M3eCardElement, M3eCheckboxElement, M3eChipElement, M3eChipSetElement, M3eCircularProgressIndicatorElement, M3eCollapsibleElement, M3eDialogActionElement, M3eDialogElement, M3eDialogTriggerElement, M3eDividerElement, M3eDrawerContainerElement, M3eDrawerToggleElement, M3eElevationElement, M3eExpandableListItemElement, M3eExpansionHeaderElement, M3eExpansionPanelElement, M3eFabElement, M3eFabMenuElement, M3eFabMenuItemElement, M3eFabMenuTriggerElement, M3eFilterChipElement, M3eFilterChipSetElement, M3eFocusRingElement, M3eFormFieldElement, M3eHeadingElement, M3eIconButtonElement, M3eIconElement, M3eInputChipElement, M3eInputChipSetElement, M3eLinearProgressIndicatorElement, M3eListActionElement, M3eListElement, M3eListItemButtonElement, M3eListItemElement, M3eListOptionElement, M3eLoadingIndicatorElement, M3eMenuElement, M3eMenuItemCheckboxElement, M3eMenuItemElement, M3eMenuItemGroupElement, M3eMenuItemRadioElement, M3eMenuTriggerElement, M3eNavBarElement, M3eNavItemElement, M3eNavMenuElement, M3eNavMenuItemElement, M3eNavMenuItemGroupElement, M3eNavRailElement, M3eNavRailToggleElement, M3eOptGroupElement, M3eOptionElement, M3eOptionPanelElement, M3ePaginatorElement, M3ePseudoCheckboxElement, M3ePseudoRadioElement, M3eRadioElement, M3eRadioGroupElement, M3eRichTooltipActionElement, M3eRichTooltipElement, M3eRippleElement, M3eScrollContainerElement, M3eSegmentedButtonElement, M3eSelectElement, M3eSelectionListElement, M3eShapeElement, M3eSlideElement, M3eSlideGroupElement, M3eSliderElement, M3eSliderThumbElement, M3eSnackbar, M3eSnackbarElement, M3eSplitButtonElement, M3eStateLayerElement, M3eStepElement, M3eStepPanelElement, M3eStepperElement, M3eStepperNextElement, M3eStepperPreviousElement, M3eStepperResetElement, M3eSuggestionChipElement, M3eSwitchElement, M3eTabElement, M3eTabPanelElement, M3eTabsElement, M3eTextHighlightElement, M3eTextOverflowElement, M3eTextareaAutosizeElement, M3eThemeElement, M3eTocElement, M3eTocItemElement, M3eToolbarElement, M3eTooltipElement, MutationController, PressedController, ProgressElementIndicatorBase, ReadOnly, Required, RequiredConstraintValidation, ResizeController, Role, ScrollController, ScrollLockController, Selected, StepperButtonElementBase, TocGenerator, TooltipElementBase, Touched, VelocityTracker, Vertical, addCustomState, checkOrSelect, computeCssSize, computeLineCount, debounce, defaultValue, deleteCustomState, element, findFormFieldControl, focusWhenReady, forcedColorsActive, formValue, generateClipPaths, getTextContent, guid, hasAssignedNodes, hasCustomState, hasKeys, interceptProperty, internals, isAttachInternalsMixin, isCheckedIndeterminateMixin, isCheckedMixin, isCheckedOrSelected, isCheckedOrSelectedMixin, isConstraintValidationMixin, isDirtyMixin, isDisabledInteractiveMixin, isDisabledMixin, isFormAssociatedMixin, isFormFieldControl, isFormSubmitterMixin, isHtmlForMixin, isLabelledMixin, isLinkButtonMixin, isReadOnlyMixin, isRequiredConstraintValidationMixin, isRequiredMixin, isSelectedMixin, isTouchedMixin, isVerticalMixin, prefersReducedMotion, renderPseudoLink, resolveElementById, resolveFragmentUrl, safeStyleMap, scrollIntoViewIfNeeded, setCustomState, spaceSeparatedStringConverter, updateLabels, validate };
+export { ActionElementBase, AnimationLoopController, AttachInternals, Checked, CheckedIndeterminate, ConstraintValidation, DesignToken, Dirty, Disabled, DisabledInteractive, EventAttribute, FocusController, Focusable, FormAssociated, FormSubmitter, HoverController, HtmlFor, IntersectionController, KeyboardClick, Labelled, LinkButton, LongPressController, M3eAccordionElement, M3eActionListElement, M3eAppBarElement, M3eAssistChipElement, M3eAutocompleteElement, M3eAvatarElement, M3eBadgeElement, M3eBottomSheetActionElement, M3eBottomSheetElement, M3eBottomSheetTriggerElement, M3eButtonElement, M3eButtonGroupElement, M3eButtonSegmentElement, M3eCardElement, M3eCheckboxElement, M3eChipElement, M3eChipSetElement, M3eCircularProgressIndicatorElement, M3eCollapsibleElement, M3eDialogActionElement, M3eDialogElement, M3eDialogTriggerElement, M3eDividerElement, M3eDrawerContainerElement, M3eDrawerToggleElement, M3eElevationElement, M3eExpandableListItemElement, M3eExpansionHeaderElement, M3eExpansionPanelElement, M3eFabElement, M3eFabMenuElement, M3eFabMenuItemElement, M3eFabMenuTriggerElement, M3eFilterChipElement, M3eFilterChipSetElement, M3eFocusRingElement, M3eFormFieldElement, M3eHeadingElement, M3eIconButtonElement, M3eIconElement, M3eInputChipElement, M3eInputChipSetElement, M3eLinearProgressIndicatorElement, M3eListActionElement, M3eListElement, M3eListItemButtonElement, M3eListItemElement, M3eListOptionElement, M3eLoadingIndicatorElement, M3eMenuElement, M3eMenuItemCheckboxElement, M3eMenuItemElement, M3eMenuItemGroupElement, M3eMenuItemRadioElement, M3eMenuTriggerElement, M3eNavBarElement, M3eNavItemElement, M3eNavMenuElement, M3eNavMenuItemElement, M3eNavMenuItemGroupElement, M3eNavRailElement, M3eNavRailToggleElement, M3eOptGroupElement, M3eOptionElement, M3eOptionPanelElement, M3ePaginatorElement, M3ePseudoCheckboxElement, M3ePseudoRadioElement, M3eRadioElement, M3eRadioGroupElement, M3eRichTooltipActionElement, M3eRichTooltipElement, M3eRippleElement, M3eScrollContainerElement, M3eSegmentedButtonElement, M3eSelectElement, M3eSelectionListElement, M3eShapeElement, M3eSlideElement, M3eSlideGroupElement, M3eSliderElement, M3eSliderThumbElement, M3eSnackbar, M3eSnackbarElement, M3eSplitButtonElement, M3eStateLayerElement, M3eStepElement, M3eStepPanelElement, M3eStepperElement, M3eStepperNextElement, M3eStepperPreviousElement, M3eStepperResetElement, M3eSuggestionChipElement, M3eSwitchElement, M3eTabElement, M3eTabPanelElement, M3eTabsElement, M3eTextHighlightElement, M3eTextOverflowElement, M3eTextareaAutosizeElement, M3eThemeElement, M3eTocElement, M3eTocItemElement, M3eToolbarElement, M3eTooltipElement, MutationController, PressedController, ProgressElementIndicatorBase, ReadOnly, Required, RequiredConstraintValidation, ResizeController, Role, ScrollController, ScrollLockController, Selected, StepperButtonElementBase, TocGenerator, TooltipElementBase, Touched, VelocityTracker, Vertical, addCustomState, checkOrSelect, computeCssSize, computeLineCount, customElement, debounce, defaultValue, deleteCustomState, findFormFieldControl, focusWhenReady, forcedColorsActive, formValue, generateClipPaths, getTextContent, guid, hasAssignedNodes, hasCustomState, hasKeys, interceptProperty, internals, isAttachInternalsMixin, isCheckedIndeterminateMixin, isCheckedMixin, isCheckedOrSelected, isCheckedOrSelectedMixin, isConstraintValidationMixin, isDirtyMixin, isDisabledInteractiveMixin, isDisabledMixin, isFormAssociatedMixin, isFormFieldControl, isFormSubmitterMixin, isHtmlForMixin, isLabelledMixin, isLinkButtonMixin, isReadOnlyMixin, isRequiredConstraintValidationMixin, isRequiredMixin, isSelectedMixin, isTouchedMixin, isVerticalMixin, prefersReducedMotion, renderPseudoLink, resolveElementById, resolveFragmentUrl, safeStyleMap, scrollIntoViewIfNeeded, setCustomState, spaceSeparatedStringConverter, updateLabels, validate };
 //# sourceMappingURL=all.js.map