@m3e/web 2.4.1 → 2.5.0

package/dist/all.js

@@ -6,13 +6,13 @@
 import { __classPrivateFieldGet, __decorate, __classPrivateFieldSet } from 'tslib';
 import { unsafeCSS, css, LitElement, html, nothing, isServer, noChange, svg } from 'lit';
 import { query, property, queryAssignedElements, state } from 'lit/decorators.js';
-import { DesignToken as DesignToken$1, HtmlFor as HtmlFor$1, Role as Role$1, hasAssignedNodes as hasAssignedNodes$1, debounce as debounce$1, customElement as customElement$1, EventAttribute as EventAttribute$1, MutationController as MutationController$1, setCustomState as setCustomState$1, deleteCustomState as deleteCustomState$1, prefersReducedMotion as prefersReducedMotion$1, scrollIntoViewIfNeeded as scrollIntoViewIfNeeded$1, forcedColorsActive as forcedColorsActive$1, addCustomState as addCustomState$1, ActionElementBase as ActionElementBase$1, ReconnectedCallback as ReconnectedCallback$1, SuppressInitialAnimation as SuppressInitialAnimation$1, AttachInternals as AttachInternals$1, VelocityTracker as VelocityTracker$1, ScrollLockController as ScrollLockController$1, InertController as InertController$1, ResizeController as ResizeController$1, focusWhenReady as focusWhenReady$1, hasCustomState as hasCustomState$1, computeCssSize as computeCssSize$1, registerStyleSheet as registerStyleSheet$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, dateConverter as dateConverter$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, 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, waitForUpgrade as waitForUpgrade$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, hasAssignedNodes as hasAssignedNodes$1, debounce as debounce$1, customElement as customElement$1, EventAttribute as EventAttribute$1, MutationController as MutationController$1, setCustomState as setCustomState$1, deleteCustomState as deleteCustomState$1, prefersReducedMotion as prefersReducedMotion$1, scrollIntoViewIfNeeded as scrollIntoViewIfNeeded$1, forcedColorsActive as forcedColorsActive$1, addCustomState as addCustomState$1, ActionElementBase as ActionElementBase$1, ReconnectedCallback as ReconnectedCallback$1, SuppressInitialAnimation as SuppressInitialAnimation$1, AttachInternals as AttachInternals$1, VelocityTracker as VelocityTracker$1, ScrollLockController as ScrollLockController$1, InertController as InertController$1, ResizeController as ResizeController$1, focusWhenReady as focusWhenReady$1, hasCustomState as hasCustomState$1, computeCssSize as computeCssSize$1, registerStyleSheet as registerStyleSheet$1, spaceSeparatedStringConverter as spaceSeparatedStringConverter$1, KeyboardClick as KeyboardClick$1, LinkButton as LinkButton$1, Focusable as Focusable$1, Disabled as Disabled$1, renderPseudoLink as renderPseudoLink$1, FormSubmitter as FormSubmitter$1, DisabledInteractive as DisabledInteractive$1, FocusController as FocusController$1, PressedController as PressedController$1, isSelectedMixin as isSelectedMixin$1, dateConverter as dateConverter$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, getScrollbarWidth as getScrollbarWidth$1, ScrollController as ScrollController$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, waitForUpgrade as waitForUpgrade$1, guid as guid$1, IntersectionController as IntersectionController$1, LongPressController as LongPressController$1 } from '@m3e/web/core';
 import { ListKeyManager, M3eLiveAnnouncer, M3eInteractivityChecker, isModifierAllowed, addAriaReferencedId, removeAriaReferencedId, selectionManager, SelectionManager, ListManager, RovingTabIndexManager, M3eAriaDescriber, typeaheadLabel } from '@m3e/web/core/a11y';
 import { M3eOptGroupElement as M3eOptGroupElement$1 } from '@m3e/web/option';
 import { M3eDirectionality } from '@m3e/web/core/bidi';
 import { positionAnchor, M3eFloatingPanelElement } from '@m3e/web/core/anchoring';
-import { classMap } from 'lit/directives/class-map.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
+import { classMap } from 'lit/directives/class-map.js';
 import { M3eButtonElement as M3eButtonElement$1 } from '@m3e/web/button';
 import { M3eIconButtonElement as M3eIconButtonElement$1 } from '@m3e/web/icon-button';
 import '@m3e/web/tooltip';
@@ -1463,9 +1463,10 @@ var M3eBottomSheetElement_1;
  * @attr handle - Whether to display a drag handle and enable the top region of the sheet as a gesture surface for dragging between detents.
  * @attr handle-label - The accessible label given to the drag handle.
  * @attr hideable - Whether the bottom sheet can hide when its swiped down.
- * @attr hide-friction - The friction coefficient to hide the sheet, or set it to the next closest expanded detent.
+ * @attr hide-friction - The friction coefficient to hide the sheet.
  * @attr modal - Whether the bottom sheet behaves as modal.
  * @attr open - Whether the bottom sheet is open.
+ * @attr overshoot-limit - A fractional value, between 0 and 100, indicating the maximum visual overshoot allowed when dragging past the minimum or maximum size.
  *
  * @fires opening - Emitted when the sheet begins to open.
  * @fires opened - Emitted when the sheet has opened.
@@ -1581,10 +1582,15 @@ let M3eBottomSheetElement = M3eBottomSheetElement_1 = class M3eBottomSheetElemen
      */
     this.hideable = false;
     /**
-     * The friction coefficient to hide the sheet, or set it to the next closest expanded detent.
+     * The friction coefficient to hide the sheet.
      * @default 0.5
      */
     this.hideFriction = 0.5;
+    /**
+     * A fractional value, between 0 and 100, indicating the maximum visual overshoot allowed when dragging past the minimum or maximum size.
+     * @default 4
+     */
+    this.overshootLimit = 4;
   }
   /**
    * Shows the sheet.
@@ -1767,10 +1773,13 @@ _M3eBottomSheetElement_handleHeaderPointerDown = function _M3eBottomSheetElement
   e.target.style.cursor = "grabbing";
   __classPrivateFieldGet(this, _M3eBottomSheetElement_velocityTracker, "f").reset();
   __classPrivateFieldGet(this, _M3eBottomSheetElement_velocityTracker, "f").add(e.clientY);
+  const maxHeight = __classPrivateFieldGet(this, _M3eBottomSheetElement_instances, "m", _M3eBottomSheetElement_computeMaxHeight).call(this);
+  const effectiveMaxHeight = this.detents.length > 0 ? Math.max(...this.detents.map(x => __classPrivateFieldGet(this, _M3eBottomSheetElement_instances, "m", _M3eBottomSheetElement_computeDetentHeight).call(this, x))) : maxHeight;
   __classPrivateFieldSet(this, _M3eBottomSheetElement_dragState, {
     startY: e.clientY,
     startHeight: this.clientHeight,
-    maxHeight: __classPrivateFieldGet(this, _M3eBottomSheetElement_instances, "m", _M3eBottomSheetElement_computeMaxHeight).call(this),
+    effectiveMaxHeight,
+    maxHeight,
     minHeight: __classPrivateFieldGet(this, _M3eBottomSheetElement_instances, "m", _M3eBottomSheetElement_computeMinHeight).call(this)
   }, "f");
   __classPrivateFieldSet(this, _M3eBottomSheetElement_dragged, false, "f");
@@ -1787,10 +1796,22 @@ _M3eBottomSheetElement_handleHeaderPointerMove = function _M3eBottomSheetElement
   (e.getCoalescedEvents?.() ?? [e]).forEach(x => __classPrivateFieldGet(this, _M3eBottomSheetElement_velocityTracker, "f").add(x.clientY, e.timeStamp));
   let newHeight = __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").startHeight - (e.clientY - __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").startY);
   if (newHeight < __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").minHeight) {
-    const overshoot = (__classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").minHeight - newHeight) * this.hideFriction;
-    newHeight = __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").minHeight - overshoot;
-  }
-  __classPrivateFieldGet(this, _M3eBottomSheetElement_instances, "m", _M3eBottomSheetElement_updateHeight).call(this, Math.min(__classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").maxHeight, newHeight));
+    if (this.hideable) {
+      const overshoot = (__classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").minHeight - newHeight) * this.hideFriction;
+      newHeight = __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").minHeight - overshoot;
+    } else {
+      const overshoot = __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").minHeight - newHeight;
+      const overshootLimit = __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").maxHeight * (this.overshootLimit / 100);
+      const compressed = overshootLimit * overshoot / (overshoot + overshootLimit);
+      newHeight = __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").minHeight - compressed;
+    }
+  } else if (newHeight > __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").effectiveMaxHeight) {
+    const overshoot = newHeight - __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").effectiveMaxHeight;
+    const overshootLimit = __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").maxHeight * (this.overshootLimit / 100);
+    const compressed = overshootLimit * overshoot / (overshoot + overshootLimit);
+    newHeight = __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").effectiveMaxHeight + compressed;
+  }
+  __classPrivateFieldGet(this, _M3eBottomSheetElement_instances, "m", _M3eBottomSheetElement_updateHeight).call(this, newHeight);
   __classPrivateFieldSet(this, _M3eBottomSheetElement_dragged, true, "f");
 };
 _M3eBottomSheetElement_handleHeaderPointerUp = function _M3eBottomSheetElement_handleHeaderPointerUp(e) {
@@ -1830,6 +1851,8 @@ _M3eBottomSheetElement_handleHeaderPointerUp = function _M3eBottomSheetElement_h
         __classPrivateFieldGet(this, _M3eBottomSheetElement_instances, "m", _M3eBottomSheetElement_snapToDetent).call(this, __classPrivateFieldGet(this, _M3eBottomSheetElement_instances, "m", _M3eBottomSheetElement_getClosestDetent).call(this));
       } else if (this.clientHeight < __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").minHeight) {
         __classPrivateFieldGet(this, _M3eBottomSheetElement_instances, "m", _M3eBottomSheetElement_snapToHeight).call(this, __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").minHeight);
+      } else if (this.clientHeight > __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").effectiveMaxHeight) {
+        __classPrivateFieldGet(this, _M3eBottomSheetElement_instances, "m", _M3eBottomSheetElement_snapToHeight).call(this, __classPrivateFieldGet(this, _M3eBottomSheetElement_dragState, "f").effectiveMaxHeight);
       }
     }
   } finally {
@@ -2084,6 +2107,10 @@ __decorate([property({
   attribute: "hide-friction",
   type: Number
 })], M3eBottomSheetElement.prototype, "hideFriction", void 0);
+__decorate([property({
+  attribute: "overshoot-limit",
+  type: Number
+})], M3eBottomSheetElement.prototype, "overshootLimit", void 0);
 M3eBottomSheetElement = M3eBottomSheetElement_1 = __decorate([customElement$1("m3e-bottom-sheet")], M3eBottomSheetElement);
 
 /**
@@ -2152,6 +2179,296 @@ __decorate([property({
 })], M3eBottomSheetTriggerElement.prototype, "secondary", void 0);
 M3eBottomSheetTriggerElement = __decorate([customElement$1("m3e-bottom-sheet-trigger")], M3eBottomSheetTriggerElement);
 
+var _M3eBreadcrumbElement_instances, _M3eBreadcrumbElement_customSeparator, _M3eBreadcrumbElement_handleSlotChange, _M3eBreadcrumbElement_handleSeparatorSlotChange, _M3eBreadcrumbElement_setSeparator;
+/**
+ * Displays a hierarchical navigation path and identifies the user's
+ * current location within an application.
+ *
+ * @description
+ * The `m3e-breadcrumb` component arranges `m3e-breadcrumb-item` children into
+ * a trail of navigation steps. It tracks the last item as the current page and
+ * supports a custom separator slot for alternate divider content.
+ *
+ * @example
+ * The following example illustrates a simple breadcrumb with three items.
+ * ```html
+ * <m3e-breadcrumb>
+ *   <m3e-breadcrumb-item href="/dashboard">Dashboard</m3e-breadcrumb-item>
+ *   <m3e-breadcrumb-item href="/dashboard/reports">Reports</m3e-breadcrumb-item>
+ *   <m3e-breadcrumb-item href="/dashboard/reports/annual">Annual</m3e-breadcrumb-item>
+ * </m3e-breadcrumb>
+ * ```
+ *
+ * @tag m3e-breadcrumb
+ *
+ * @slot - Renders breadcrumb items.
+ * @slot separator - Renders a custom separator between breadcrumb items.
+ *
+ * @attr wrap - Whether breadcrumb items should wrap onto a new line.
+ */
+let M3eBreadcrumbElement = class M3eBreadcrumbElement extends Role$1(LitElement, "navigation") {
+  constructor() {
+    super(...arguments);
+    _M3eBreadcrumbElement_instances.add(this);
+    /** @private */
+    _M3eBreadcrumbElement_customSeparator.set(this, []);
+    /**
+     * Whether items wrap to a new line.
+     * @default false
+     */
+    this.wrap = false;
+  }
+  /** @inheritdoc */
+  render() {
+    return html`<div class="base" role="list"><slot @slotchange="${__classPrivateFieldGet(this, _M3eBreadcrumbElement_instances, "m", _M3eBreadcrumbElement_handleSlotChange)}"></slot><slot name="separator" @slotchange="${__classPrivateFieldGet(this, _M3eBreadcrumbElement_instances, "m", _M3eBreadcrumbElement_handleSeparatorSlotChange)}"></slot></div>`;
+  }
+};
+_M3eBreadcrumbElement_customSeparator = new WeakMap();
+_M3eBreadcrumbElement_instances = new WeakSet();
+_M3eBreadcrumbElement_handleSlotChange = function _M3eBreadcrumbElement_handleSlotChange() {
+  const items = this.querySelectorAll("m3e-breadcrumb-item");
+  for (let i = 0; i < items.length; i++) {
+    const item = items[i];
+    if (i < items.length - 1) {
+      item.removeAttribute("current");
+    } else if (!item.hasAttribute("current")) {
+      item.setAttribute("current", "page");
+    }
+    __classPrivateFieldGet(this, _M3eBreadcrumbElement_instances, "m", _M3eBreadcrumbElement_setSeparator).call(this, item);
+  }
+};
+_M3eBreadcrumbElement_handleSeparatorSlotChange = function _M3eBreadcrumbElement_handleSeparatorSlotChange(e) {
+  __classPrivateFieldSet(this, _M3eBreadcrumbElement_customSeparator, e.target.assignedElements({
+    flatten: true
+  }), "f");
+  this.querySelectorAll("m3e-breadcrumb-item").forEach(x => __classPrivateFieldGet(this, _M3eBreadcrumbElement_instances, "m", _M3eBreadcrumbElement_setSeparator).call(this, x));
+};
+_M3eBreadcrumbElement_setSeparator = function _M3eBreadcrumbElement_setSeparator(item) {
+  item._setSeparator(__classPrivateFieldGet(this, _M3eBreadcrumbElement_customSeparator, "f").map(x => {
+    const clone = x.cloneNode(true);
+    clone.part = "separator";
+    return clone;
+  }));
+};
+/** The styles of the element. */
+M3eBreadcrumbElement.styles = css`:host { display: block; } .base { display: flex; align-items: center; } :host([wrap]) .base { flex-wrap: wrap; } slot[name="separator"] { display: none; }`;
+__decorate([property({
+  type: Boolean,
+  reflect: true
+})], M3eBreadcrumbElement.prototype, "wrap", void 0);
+M3eBreadcrumbElement = __decorate([customElement$1("m3e-breadcrumb")], M3eBreadcrumbElement);
+
+/** @internal */
+function isIconOnly(slot) {
+  const elements = slot.assignedElements({
+    flatten: true
+  });
+  if (elements.length === 1) {
+    const rect = elements[0].getBoundingClientRect();
+    return rect.width <= 28 && rect.height <= 28;
+  }
+  return false;
+}
+
+var _M3eBreadcrumbItemButtonElement_instances, _M3eBreadcrumbItemButtonElement_clickHandler, _M3eBreadcrumbItemButtonElement_handleSlotChange, _M3eBreadcrumbItemButtonElement_handleClick;
+/**
+ * @internal
+ * An internal interactive element used to present the content of a breadcrumb item.
+ */
+let M3eBreadcrumbItemButtonElement = class M3eBreadcrumbItemButtonElement extends KeyboardClick$1(LinkButton$1(Focusable$1(Disabled$1(AttachInternals$1(Role$1(LitElement, "button"), true))))) {
+  constructor() {
+    super(...arguments);
+    _M3eBreadcrumbItemButtonElement_instances.add(this);
+    /** @private */
+    _M3eBreadcrumbItemButtonElement_clickHandler.set(this, e => __classPrivateFieldGet(this, _M3eBreadcrumbItemButtonElement_instances, "m", _M3eBreadcrumbItemButtonElement_handleClick).call(this, e));
+  }
+  /** @inheritdoc */
+  connectedCallback() {
+    this.addEventListener("click", __classPrivateFieldGet(this, _M3eBreadcrumbItemButtonElement_clickHandler, "f"));
+    super.connectedCallback();
+  }
+  /** @inheritdoc */
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", __classPrivateFieldGet(this, _M3eBreadcrumbItemButtonElement_clickHandler, "f"));
+  }
+  /** @inheritdoc */
+  firstUpdated(_changedProperties) {
+    super.firstUpdated(_changedProperties);
+    [this._focusRing, this._stateLayer, this._ripple].forEach(x => x?.attach(this));
+  }
+  /** @inheritdoc */
+  update(changedProperties) {
+    super.update(changedProperties);
+    if (changedProperties.has("disabled") || changedProperties.has("current")) {
+      this.ariaDisabled = this.disabled && !this.current ? "true" : null;
+    }
+    if (changedProperties.has("current")) {
+      if (this.current) {
+        this.role = null;
+      } else if (this.hasAttribute("href")) {
+        this.role = "link";
+      } else {
+        this.role = "button";
+      }
+    }
+  }
+  /** @inheritdoc */
+  render() {
+    return html`<div class="base" aria-current="${ifDefined(this.current)}">${this.current ? nothing : html`<m3e-state-layer class="state-layer" ?disabled="${this.disabled}"></m3e-state-layer><m3e-focus-ring class="focus-ring" ?disabled="${this.disabled}"></m3e-focus-ring><m3e-ripple class="ripple" ?disabled="${this.disabled}"></m3e-ripple>${this[renderPseudoLink$1]()}`}<slot class="icon" name="icon" aria-hidden="true"></slot><m3e-text-overflow class="overflow"><slot @slotchange="${__classPrivateFieldGet(this, _M3eBreadcrumbItemButtonElement_instances, "m", _M3eBreadcrumbItemButtonElement_handleSlotChange)}"></slot></m3e-text-overflow>${this.current ? nothing : html`<div class="touch" aria-hidden="true"></div>`}</div>`;
+  }
+};
+_M3eBreadcrumbItemButtonElement_clickHandler = new WeakMap();
+_M3eBreadcrumbItemButtonElement_instances = new WeakSet();
+_M3eBreadcrumbItemButtonElement_handleSlotChange = function _M3eBreadcrumbItemButtonElement_handleSlotChange(e) {
+  setCustomState$1(this, "-icon-only", isIconOnly(e.target));
+};
+_M3eBreadcrumbItemButtonElement_handleClick = function _M3eBreadcrumbItemButtonElement_handleClick(e) {
+  // If current and link, disable default link click handler behavior.
+  if (this.current && this.href) {
+    e.preventDefault();
+  }
+};
+/** The styles of the element. */
+M3eBreadcrumbItemButtonElement.styles = css`:host { display: block; outline: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .base { display: flex; align-items: center; justify-content: center; position: relative; border-radius: var(--m3e-breadcrumb-item-shape, ${DesignToken$1.shape.corner.full}); height: calc(var(--m3e-breadcrumb-item-container-height, 2.5rem) + ${DesignToken$1.density.calc(-1)}); column-gap: var(--m3e-breadcrumb-item-icon-label-space, 0.5rem); } .icon { font-size: var(--m3e-breadcrumb-item--icon-size, 1.25rem); --m3e-icon-size: var(--m3e-breadcrumb-item--icon-size, 1.25rem); } ::slotted([slot="icon"]) { font-size: inherit !important; flex: none; } ::slotted(svg[slot="icon"]) { width: 1em; height: 1em; } :host(:state(-icon-only)) .overflow { flex: none; } :host(:not(:state(-icon-only))), :host(:not(:state(-icon-only))) .base { min-width: 0; } :host(:state(-icon-only):not([current]):not(:disabled)) .base { color: var(--m3e-breadcrumb-item-icon-color, ${DesignToken$1.color.onSurfaceVariant}); } :host(:state(-icon-only)) .base { width: calc(var(--m3e-breadcrumb-item-container-height, 2.5rem) + ${DesignToken$1.density.calc(-1)}); padding-inline: var(--m3e-breadcrumb-item-icon-padding-inline, 0px); --m3e-state-layer-hover-color: var( --m3e-breadcrumb-item-icon-hover-state-layer-color, ${DesignToken$1.color.onSurface} ); --m3e-state-layer-focus-color: var( --m3e-breadcrumb-item-icon-focus-state-layer-color, ${DesignToken$1.color.onSurface} ); --m3e-ripple-color: var(--m3e-breadcrumb-item-icon-pressed-state-layer-color, ${DesignToken$1.color.onSurface}); } :host(:not(:state(-icon-only)):not([current]):not(:disabled)) .base { color: var(--m3e-breadcrumb-item-label-color, ${DesignToken$1.color.primary}); } :host(:not(:state(-icon-only))) .base { font-size: var(--m3e-breadcrumb-item-label-font-size, ${DesignToken$1.typescale.standard.label.large.fontSize}); font-weight: var( --m3e-breadcrumb-item-label-font-weight, ${DesignToken$1.typescale.standard.label.large.fontWeight} ); line-height: var( --m3e-breadcrumb-item-label-line-height, ${DesignToken$1.typescale.standard.label.large.lineHeight} ); letter-spacing: var(--m3e-breadcrumb-item-label-tracking, ${DesignToken$1.typescale.standard.label.large.tracking}); } :host(:not(:state(-icon-only))) .base { padding-inline: var(--m3e-breadcrumb-item-label-padding-inline, 0.75rem); --m3e-state-layer-hover-color: var( --m3e-breadcrumb-item-label-hover-state-layer-color, ${DesignToken$1.color.primary} ); --m3e-state-layer-focus-color: var( --m3e-breadcrumb-item-label-focus-state-layer-color, ${DesignToken$1.color.primary} ); --m3e-ripple-color: var(--m3e-breadcrumb-item-label-pressed-state-layer-color, ${DesignToken$1.color.primary}); } :host([current]) .base { color: var(--m3e-breadcrumb-item-last-color, ${DesignToken$1.color.onSurface}); } :host(:not(:disabled):not([current])) { cursor: pointer; user-select: none; } :host(:disabled:not([current])) .base { color: color-mix( in srgb, var(--m3e-breadcrumb-item-disabled-color, ${DesignToken$1.color.onSurface}) var(--m3e-breadcrumb-item-disabled-opacity, 38%), transparent ); } .touch { position: absolute; height: 3rem; width: max(3rem, 100%); margin: auto; } a { all: unset; display: block; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 1; } @media (forced-colors: active) { :host(:state(-icon-only):not([current]):not(:disabled)) .base, :host(:not(:state(-icon-only)):not([current]):not(:disabled)) .base { color: LinkText; outline: 1px solid LinkText; } :host(:disabled) .base { color: GrayText; } }`;
+__decorate([query(".focus-ring")], M3eBreadcrumbItemButtonElement.prototype, "_focusRing", void 0);
+__decorate([query(".state-layer")], M3eBreadcrumbItemButtonElement.prototype, "_stateLayer", void 0);
+__decorate([query(".ripple")], M3eBreadcrumbItemButtonElement.prototype, "_ripple", void 0);
+__decorate([property({
+  reflect: true
+})], M3eBreadcrumbItemButtonElement.prototype, "current", void 0);
+M3eBreadcrumbItemButtonElement = __decorate([customElement$1("m3e-breadcrumb-item-button")], M3eBreadcrumbItemButtonElement);
+
+var _M3eBreadcrumbItemElement_instances, _M3eBreadcrumbItemElement_defaultSeparator, _M3eBreadcrumbItemElement_renderSeparator, _M3eBreadcrumbItemElement_handleIconSlotChange, _M3eBreadcrumbItemElement_handleSlotChange, _M3eBreadcrumbItemElement_updateIconFilled;
+/**
+ * An item in a breadcrumb.
+ *
+ * @description
+ * The `m3e-breadcrumb-item` element represents a single item in a breadcrumb
+ * navigation trail. It renders an internal button and supports navigation
+ * attributes for link behavior.
+ *
+ * @tag m3e-breadcrumb-item
+ *
+ * @slot - Renders the content of the breadcrumb item.
+ *
+ * @attr item-label - The accessible label used by the internal breadcrumb button.
+ * @attr disabled - Whether the breadcrumb item is disabled.
+ * @attr current - Marks the breadcrumb item as the current location in the trail.
+ * @attr href - The URL to which the internal breadcrumb link button points.
+ * @attr target - The target of the internal breadcrumb link button.
+ * @attr download - A value indicating whether the internal link target will be downloaded, optionally specifying a file name.
+ * @attr rel - The relationship between the internal link target and the document.
+ *
+ * @fires click - Emitted when the element is clicked.
+ *
+ * @cssprop --m3e-breadcrumb-item-shape - Shape of the internal breadcrumb item button.
+ * @cssprop --m3e-breadcrumb-item-container-height - Height of the internal breadcrumb item button container.
+ * @cssprop --m3e-breadcrumb-item-icon-color - Color of breadcrumb item icon-only content.
+ * @cssprop --m3e-breadcrumb-item-icon-padding-inline - Horizontal padding for icon-only breadcrumb items.
+ * @cssprop --m3e-breadcrumb-item-icon-hover-state-layer-color - Hover state layer color for icon-only breadcrumb items.
+ * @cssprop --m3e-breadcrumb-item-icon-focus-state-layer-color - Focus state layer color for icon-only breadcrumb items.
+ * @cssprop --m3e-breadcrumb-item-icon-pressed-state-layer-color - Pressed state layer color for icon-only breadcrumb items.
+ * @cssprop --m3e-breadcrumb-item-label-color - Color of breadcrumb item label content.
+ * @cssprop --m3e-breadcrumb-item-label-font-size - Font size of breadcrumb item label content.
+ * @cssprop --m3e-breadcrumb-item-label-font-weight - Font weight of breadcrumb item label content.
+ * @cssprop --m3e-breadcrumb-item-label-line-height - Line height of breadcrumb item label content.
+ * @cssprop --m3e-breadcrumb-item-label-tracking - Letter spacing of breadcrumb item label content.
+ * @cssprop --m3e-breadcrumb-item-label-padding-inline - Horizontal padding for label breadcrumb items.
+ * @cssprop --m3e-breadcrumb-item-label-hover-state-layer-color - Hover state layer color for label breadcrumb items.
+ * @cssprop --m3e-breadcrumb-item-label-focus-state-layer-color - Focus state layer color for label breadcrumb items.
+ * @cssprop --m3e-breadcrumb-item-label-pressed-state-layer-color - Pressed state layer color for label breadcrumb items.
+ * @cssprop --m3e-breadcrumb-item-last-color - Color used for the current breadcrumb item.
+ * @cssprop --m3e-breadcrumb-item-icon-label-space - Space between icon and label.
+ * @cssprop --m3e-breadcrumb-item-icon-size - Size of the icon.
+ * @cssprop --m3e-breadcrumb-item-disabled-color - Disabled color used by the breadcrumb item button.
+ * @cssprop --m3e-breadcrumb-item-disabled-opacity - Disabled opacity used by the breadcrumb item button.
+ */
+let M3eBreadcrumbItemElement = class M3eBreadcrumbItemElement extends LinkButton$1(AttachInternals$1(Role$1(LitElement, "listitem")), true) {
+  constructor() {
+    super(...arguments);
+    _M3eBreadcrumbItemElement_instances.add(this);
+    /** @private */
+    _M3eBreadcrumbItemElement_defaultSeparator.set(this, void 0);
+    /**
+     * The accessible label given to the item's internal button.
+     * @default ""
+     */
+    this.itemLabel = "";
+    /**
+     * Whether the element is disabled.
+     * @default false
+     */
+    this.disabled = false;
+  }
+  /** @inheritdoc */
+  focus(options) {
+    this._button?.focus(options);
+  }
+  /** @inheritdoc */
+  blur() {
+    this._button?.blur();
+  }
+  /** @inheritdoc */
+  click() {
+    this._button?.click();
+  }
+  /** @inheritdoc */
+  updated(_changedProperties) {
+    super.updated(_changedProperties);
+    if (_changedProperties.has("current")) {
+      __classPrivateFieldGet(this, _M3eBreadcrumbItemElement_instances, "m", _M3eBreadcrumbItemElement_updateIconFilled).call(this);
+    }
+  }
+  /** @inheritdoc */
+  render() {
+    return html`<div class="base"><m3e-breadcrumb-item-button class="button" aria-label="${ifDefined(this.itemLabel || undefined)}" ?disabled="${this.disabled}" current="${ifDefined(this.current)}" href="${ifDefined(this.href || undefined)}" target="${ifDefined(this.target || undefined)}" download="${ifDefined(this.download || undefined)}" rel="${ifDefined(this.rel || undefined)}"><slot name="icon" slot="icon" @slotchange="${__classPrivateFieldGet(this, _M3eBreadcrumbItemElement_instances, "m", _M3eBreadcrumbItemElement_handleIconSlotChange)}"></slot><slot @slotchange="${__classPrivateFieldGet(this, _M3eBreadcrumbItemElement_instances, "m", _M3eBreadcrumbItemElement_handleSlotChange)}"></slot></m3e-breadcrumb-item-button>${__classPrivateFieldGet(this, _M3eBreadcrumbItemElement_instances, "m", _M3eBreadcrumbItemElement_renderSeparator).call(this)}</div>`;
+  }
+  /** @internal */
+  _setSeparator(nodes) {
+    const separator = this.shadowRoot?.querySelector(".separator");
+    if (!separator) return;
+    if (nodes.length > 0) {
+      if (!__classPrivateFieldGet(this, _M3eBreadcrumbItemElement_defaultSeparator, "f") && separator.firstElementChild) {
+        __classPrivateFieldSet(this, _M3eBreadcrumbItemElement_defaultSeparator, separator.firstElementChild, "f");
+      }
+      separator.replaceChildren(...nodes);
+    } else if (__classPrivateFieldGet(this, _M3eBreadcrumbItemElement_defaultSeparator, "f")) {
+      separator.replaceChildren(__classPrivateFieldGet(this, _M3eBreadcrumbItemElement_defaultSeparator, "f"));
+      __classPrivateFieldSet(this, _M3eBreadcrumbItemElement_defaultSeparator, undefined, "f");
+    }
+  }
+};
+_M3eBreadcrumbItemElement_defaultSeparator = new WeakMap();
+_M3eBreadcrumbItemElement_instances = new WeakSet();
+_M3eBreadcrumbItemElement_renderSeparator = function _M3eBreadcrumbItemElement_renderSeparator() {
+  return this.current ? nothing : html`<div class="separator" aria-hidden="true"><svg class="separator-icon" viewBox="0 -960 960 960" fill="currentColor"><path d="M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z"/></svg></div>`;
+};
+_M3eBreadcrumbItemElement_handleIconSlotChange = function _M3eBreadcrumbItemElement_handleIconSlotChange() {
+  __classPrivateFieldGet(this, _M3eBreadcrumbItemElement_instances, "m", _M3eBreadcrumbItemElement_updateIconFilled).call(this);
+};
+_M3eBreadcrumbItemElement_handleSlotChange = function _M3eBreadcrumbItemElement_handleSlotChange(e) {
+  setCustomState$1(this, "-icon-only", isIconOnly(e.target));
+  __classPrivateFieldGet(this, _M3eBreadcrumbItemElement_instances, "m", _M3eBreadcrumbItemElement_updateIconFilled).call(this);
+};
+_M3eBreadcrumbItemElement_updateIconFilled = function _M3eBreadcrumbItemElement_updateIconFilled() {
+  this.querySelectorAll("m3e-icon").forEach(x => x.filled = this.current !== undefined && this.current !== null);
+};
+/** The styles of the element. */
+M3eBreadcrumbItemElement.styles = css`:host { display: block; } .base { display: flex; align-items: center; height: 100%; } :host(:not(:state(-icon-only))[current]), :host(:not(:state(-icon-only))[current]) .base { min-width: 0; } .button { flex: 1 1 auto; } .separator { flex: none; display: flex; justify-content: center; align-items: center; min-width: 0.5rem; --m3e-icon-size: var(--m3e-breadcrumb-separator-icon-size, 1.5rem); } .separator-icon { width: 1em; height: 1em; font-size: var(--m3e-icon-size); vertical-align: middle; }`;
+__decorate([query(".button")], M3eBreadcrumbItemElement.prototype, "_button", void 0);
+__decorate([property({
+  attribute: "item-label"
+})], M3eBreadcrumbItemElement.prototype, "itemLabel", void 0);
+__decorate([property({
+  type: Boolean,
+  reflect: true
+})], M3eBreadcrumbItemElement.prototype, "disabled", void 0);
+__decorate([property({
+  reflect: true
+})], M3eBreadcrumbItemElement.prototype, "current", void 0);
+M3eBreadcrumbItemElement = __decorate([customElement$1("m3e-breadcrumb-item")], M3eBreadcrumbItemElement);
+
 /**
  * Component design tokens that control the `M3eButtonElement` for all size variants.
  * @internal
@@ -6323,6 +6640,64 @@ let M3eSuggestionChipElement = class M3eSuggestionChipElement extends FormSubmit
 M3eSuggestionChipElement.formAssociated = true;
 M3eSuggestionChipElement = __decorate([customElement$1("m3e-suggestion-chip")], M3eSuggestionChipElement);
 
+var _M3eContentPaneElement_instances, _M3eContentPaneElement_updateScrollbarWidth;
+/**
+ * A shaped surface for vertically scrollable content.
+ *
+ * @description
+ * The `m3e-content-pane` component renders a shaped surface with padding and vertical
+ * scrolling for document‑like content.
+ *
+ * @example
+ * The following example illustrates basic usage of the content pane.
+ * ```html
+ * <m3e-content-pane>
+ *   <p>This is some scrollable content.</p>
+ *   <p>More content here...</p>
+ * </m3e-content-pane>
+ * ```
+ *
+ * @tag m3e-content-pane
+ *
+ * @slot - Renders the content of the pane.
+ *
+ * @cssprop --m3e-content-pane-container-shape - Corner radius applied to the pane’s outer surface.
+ * @cssprop --m3e-content-pane-container-color - Background color of the pane’s surface.
+ * @cssprop --m3e-content-pane-container-padding - Internal padding applied to all sides of the scrollable content.
+ */
+let M3eContentPaneElement = class M3eContentPaneElement extends ReconnectedCallback$1(LitElement) {
+  constructor() {
+    super(...arguments);
+    _M3eContentPaneElement_instances.add(this);
+  }
+  /** @inheritdoc */
+  reconnectedCallback() {
+    super.reconnectedCallback();
+    __classPrivateFieldGet(this, _M3eContentPaneElement_instances, "m", _M3eContentPaneElement_updateScrollbarWidth).call(this);
+  }
+  /** @inheritdoc */
+  firstUpdated(_changedProperties) {
+    super.firstUpdated(_changedProperties);
+    __classPrivateFieldGet(this, _M3eContentPaneElement_instances, "m", _M3eContentPaneElement_updateScrollbarWidth).call(this);
+  }
+  /** @inheritdoc */
+  render() {
+    return html`<div class="base"><div class="scroll-container"><slot></slot></div></div>`;
+  }
+};
+_M3eContentPaneElement_instances = new WeakSet();
+_M3eContentPaneElement_updateScrollbarWidth = function _M3eContentPaneElement_updateScrollbarWidth() {
+  const base = this.shadowRoot?.querySelector(".base");
+  if (!base) return;
+  const style = getComputedStyle(base);
+  const scrollbarThinWidth = style.getPropertyValue("--m3e-scrollbar-thin-width");
+  const scrollbarWidth = scrollbarThinWidth.endsWith("px") ? parseFloat(scrollbarThinWidth) : getScrollbarWidth$1(!scrollbarThinWidth || scrollbarThinWidth === "thin");
+  base.style.setProperty("--_scrollbar-width", `${scrollbarWidth}px`);
+};
+/** The styles of the element. */
+M3eContentPaneElement.styles = css`:host { display: block; } .base { width: 100%; height: 100%; overflow: hidden; border-radius: var(--m3e-content-pane-container-shape, ${DesignToken$1.shape.corner.extraLarge}); background-color: var(--m3e-content-pane-container-color, ${DesignToken$1.color.surface}); } .scroll-container { width: inherit; height: inherit; border-radius: inherit; box-sizing: border-box; overflow-y: auto; outline: none; padding-block: var(--m3e-content-pane-container-padding, ${DesignToken$1.shape.corner.value.extraLarge}); padding-inline-start: var(--m3e-content-pane-container-padding, ${DesignToken$1.shape.corner.value.extraLarge}); padding-inline-end: calc( var(--m3e-content-pane-container-padding, ${DesignToken$1.shape.corner.value.extraLarge}) - var( --_scrollbar-width, 0px ) ); scrollbar-color: ${DesignToken$1.scrollbar.color}; scrollbar-width: ${DesignToken$1.scrollbar.thinWidth}; }`;
+M3eContentPaneElement = __decorate([customElement$1("m3e-content-pane")], M3eContentPaneElement);
+
 var _AnimationLoopController_frameId, _AnimationLoopController_lastTime, _AnimationLoopController_running, _AnimationLoopController_callback, _AnimationLoopController_loop;
 /** A `ReactiveController` used to execute a function in an animation loop. */
 class AnimationLoopController {
@@ -6788,6 +7163,45 @@ function generateClipPaths(paths, maxPoints) {
   return normalizePointSets(paths.map(x => samplePath(x, maxPoints))).map(x => pointsToPercentClipPath(x));
 }
 
+let _cachedScrollbarWidth = null;
+let _cachedThinScrollbarWidth = null;
+/**
+ * Computes the width of a scrollbar.
+ * @param {boolean} [thin=false] Whether to get the width of a thin scrollbar.
+ * @returns {number} The width of a scrollbar.
+ */
+function getScrollbarWidth(thin = false) {
+  if (thin) {
+    if (_cachedThinScrollbarWidth !== null) {
+      return _cachedThinScrollbarWidth;
+    }
+  }
+  if (_cachedScrollbarWidth !== null) {
+    return _cachedScrollbarWidth;
+  }
+  const outer = document.createElement("div");
+  outer.style.visibility = "hidden";
+  outer.style.overflow = "scroll";
+  if (thin) {
+    outer.style.scrollbarWidth = "thin";
+  }
+  outer.style.width = "100px";
+  outer.style.position = "absolute";
+  outer.style.top = "-9999px";
+  document.body.appendChild(outer);
+  const inner = document.createElement("div");
+  inner.style.width = "100%";
+  outer.appendChild(inner);
+  let scrollbarWidth;
+  if (thin) {
+    scrollbarWidth = _cachedThinScrollbarWidth = outer.offsetWidth - inner.offsetWidth;
+  } else {
+    scrollbarWidth = _cachedScrollbarWidth = outer.offsetWidth - inner.offsetWidth;
+  }
+  outer.remove();
+  return scrollbarWidth;
+}
+
 /**
  * Gets the text content of a given node, including slotted content.
  * @param {Node} node The node for which to get text content.
@@ -9733,9 +10147,10 @@ const _clickHandler = Symbol("_clickHandler");
  * Mixin to augment an element with behavior that supports functioning as a link.
  * @template T The type of the base class.
  * @param {T} base The base class.
+ * @param {boolean} [disableClick=false] Whether to disable the default click handler.
  * @returns {Constructor<LinkButtonMixin>} A constructor that implements `LinkButtonMixin`.
  */
-function LinkButton(base) {
+function LinkButton(base, disableClick = false) {
   var __LinkButtonMixin_instances, __LinkButtonMixin_handleLinkPointerDown, __LinkButtonMixin_handleLinkFocus, __LinkButtonMixin_handleLinkBlur, _a;
   class _LinkButtonMixin extends base {
     constructor() {
@@ -9806,7 +10221,9 @@ function LinkButton(base) {
     /** @inheritdoc */
     connectedCallback() {
       super.connectedCallback();
-      this.addEventListener("click", this[_clickHandler]);
+      if (!disableClick) {
+        this.addEventListener("click", this[_clickHandler]);
+      }
       if (this.hasAttribute("href") && this.role === "button") {
         this.role = "link";
       }
@@ -9814,7 +10231,9 @@ function LinkButton(base) {
     /** @inheritdoc */
     disconnectedCallback() {
       super.disconnectedCallback();
-      this.removeEventListener("click", this[_clickHandler]);
+      if (!disableClick) {
+        this.removeEventListener("click", this[_clickHandler]);
+      }
     }
     /** @internal */
     [(__LinkButtonMixin_instances = new WeakSet(), _a = _clickHandler, renderPseudoLink)]() {
@@ -17362,6 +17781,40 @@ _M3eActionListElement_keyDownHandler = new WeakMap();
 _a$8 = selectionManager;
 M3eActionListElement = __decorate([customElement$1("m3e-action-list")], M3eActionListElement);
 
+/**
+ * @internal
+ * An internal interactive element used to present the content of a list item.
+ */
+let M3eListItemButtonElement = class M3eListItemButtonElement extends KeyboardClick$1(LinkButton$1(Focusable$1(Disabled$1(AttachInternals$1(Role$1(M3eListItemElement, "button"), true))))) {
+  constructor() {
+    super();
+    new FocusController$1(this, {
+      callback: (_, focusVisible) => this.shadowRoot?.querySelector(".base")?.classList.toggle("focus-visible", focusVisible)
+    });
+    new PressedController$1(this, {
+      callback: pressed => this.shadowRoot?.querySelector(".base")?.classList.toggle("pressed", pressed)
+    });
+    new HoverController$1(this, {
+      callback: hovering => this.shadowRoot?.querySelector(".base")?.classList.toggle("hover", hovering)
+    });
+  }
+  /** @inheritdoc */
+  firstUpdated(_changedProperties) {
+    super.firstUpdated(_changedProperties);
+    [this._focusRing, this._stateLayer, this._ripple].forEach(x => x?.attach(this));
+  }
+  /** @inheritdoc */
+  render() {
+    return html`<div class="base"><m3e-state-layer class="state-layer" ?disabled="${this.disabled}"></m3e-state-layer><m3e-focus-ring class="focus-ring" inward ?disabled="${this.disabled}"></m3e-focus-ring><m3e-ripple class="ripple" ?disabled="${this.disabled}"></m3e-ripple>${this[renderPseudoLink$1]()} ${super._renderBase()}</div>`;
+  }
+};
+/** The styles of the element. */
+M3eListItemButtonElement.styles = [M3eListItemElement.styles, css`:host { outline: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .base { position: relative; } :host(:not(:disabled)) { cursor: pointer; } a { all: unset; display: block; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 1; } slot[name="trailing"] { align-self: var(--_list-item-button-trailing-align-self, auto); }`];
+__decorate([query(".focus-ring")], M3eListItemButtonElement.prototype, "_focusRing", void 0);
+__decorate([query(".state-layer")], M3eListItemButtonElement.prototype, "_stateLayer", void 0);
+__decorate([query(".ripple")], M3eListItemButtonElement.prototype, "_ripple", void 0);
+M3eListItemButtonElement = __decorate([customElement$1("m3e-list-item-button")], M3eListItemButtonElement);
+
 var _M3eListActionElement_instances, _M3eListActionElement_handleClick;
 /**
  * An item in a list that performs an action.
@@ -17443,7 +17896,7 @@ var _M3eListActionElement_instances, _M3eListActionElement_handleClick;
  * @cssprop --m3e-list-item-three-line-top-offset - Top offset for media in three line items.
  * @cssprop --m3e-list-item-disabled-media-opacity - Opacity for media when disabled.
  */
-let M3eListActionElement = class M3eListActionElement extends LinkButton$1(M3eListItemElement) {
+let M3eListActionElement = class M3eListActionElement extends LinkButton$1(M3eListItemElement, true) {
   constructor() {
     super(...arguments);
     _M3eListActionElement_instances.add(this);
@@ -17485,40 +17938,6 @@ __decorate([property({
 })], M3eListActionElement.prototype, "disabled", void 0);
 M3eListActionElement = __decorate([customElement$1("m3e-list-action")], M3eListActionElement);
 
-/**
- * @internal
- * An internal interactive element used to present the content of a list item.
- */
-let M3eListItemButtonElement = class M3eListItemButtonElement extends KeyboardClick$1(LinkButton$1(Focusable$1(Disabled$1(AttachInternals$1(Role$1(M3eListItemElement, "button"), true))))) {
-  constructor() {
-    super();
-    new FocusController$1(this, {
-      callback: (_, focusVisible) => this.shadowRoot?.querySelector(".base")?.classList.toggle("focus-visible", focusVisible)
-    });
-    new PressedController$1(this, {
-      callback: pressed => this.shadowRoot?.querySelector(".base")?.classList.toggle("pressed", pressed)
-    });
-    new HoverController$1(this, {
-      callback: hovering => this.shadowRoot?.querySelector(".base")?.classList.toggle("hover", hovering)
-    });
-  }
-  /** @inheritdoc */
-  firstUpdated(_changedProperties) {
-    super.firstUpdated(_changedProperties);
-    [this._focusRing, this._stateLayer, this._ripple].forEach(x => x?.attach(this));
-  }
-  /** @inheritdoc */
-  render() {
-    return html`<div class="base"><m3e-state-layer class="state-layer" ?disabled="${this.disabled}"></m3e-state-layer><m3e-focus-ring class="focus-ring" inward ?disabled="${this.disabled}"></m3e-focus-ring><m3e-ripple class="ripple" ?disabled="${this.disabled}"></m3e-ripple>${this[renderPseudoLink$1]()} ${super._renderBase()}</div>`;
-  }
-};
-/** The styles of the element. */
-M3eListItemButtonElement.styles = [M3eListItemElement.styles, css`:host { outline: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .base { position: relative; } :host(:not(:disabled)) { cursor: pointer; } a { all: unset; display: block; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 1; } slot[name="trailing"] { align-self: var(--_list-item-button-trailing-align-self, auto); }`];
-__decorate([query(".focus-ring")], M3eListItemButtonElement.prototype, "_focusRing", void 0);
-__decorate([query(".state-layer")], M3eListItemButtonElement.prototype, "_stateLayer", void 0);
-__decorate([query(".ripple")], M3eListItemButtonElement.prototype, "_ripple", void 0);
-M3eListItemButtonElement = __decorate([customElement$1("m3e-list-item-button")], M3eListItemButtonElement);
-
 var _M3eListOptionElement_instances, _M3eListOptionElement_value, _M3eListOptionElement_textContent, _M3eListOptionElement_clickHandler, _M3eListOptionElement_handleSlotChange, _M3eListOptionElement_handleClick;
 /**
  * A selectable option in a list.
@@ -24949,7 +25368,7 @@ __decorate([property({
 })], M3eSplitButtonElement.prototype, "size", void 0);
 M3eSplitButtonElement = __decorate([customElement$1("m3e-split-button")], M3eSplitButtonElement);
 
-var _M3eSplitPaneElement_instances, _M3eSplitPaneElement_breakpointUnobserve, _M3eSplitPaneElement_dragPos, _M3eSplitPaneElement_valueChanged, _M3eSplitPaneElement_cachedSize, _M3eSplitPaneElement_snapAnimation, _M3eSplitPaneElement_pressedController, _M3eSplitPaneElement_startMutationController, _M3eSplitPaneElement_endMutationController, _M3eSplitPaneElement_renderDragHandle, _M3eSplitPaneElement_handleStartSlotChange, _M3eSplitPaneElement_handleEndSlotChange, _M3eSplitPaneElement_handleSlotChange, _M3eSplitPaneElement_updatePaneVisibility, _M3eSplitPaneElement_hasVisibleElements, _M3eSplitPaneElement_initialize, _M3eSplitPaneElement_initBreakpointMonitoring, _M3eSplitPaneElement_updateOrientation, _M3eSplitPaneElement_clearOrientation, _M3eSplitPaneElement_handlePointerDown, _M3eSplitPaneElement_handlePointerMove, _M3eSplitPaneElement_handlePointerUp, _M3eSplitPaneElement_handleKeyDown, _M3eSplitPaneElement_changeValue, _M3eSplitPaneElement_getClosestDetent, _M3eSplitPaneElement_getNextHigherDetent, _M3eSplitPaneElement_getNextLowerDetent, _M3eSplitPaneElement_computeDetent, _M3eSplitPaneElement_clearSnapAnimation, _M3eSplitPaneElement_snapToValue, _M3eSplitPaneElement_cycleDetent;
+var _M3eSplitPaneElement_instances, _M3eSplitPaneElement_breakpointUnobserve, _M3eSplitPaneElement_dragState, _M3eSplitPaneElement_valueChanged, _M3eSplitPaneElement_snapAnimation, _M3eSplitPaneElement_pressedController, _M3eSplitPaneElement_startMutationController, _M3eSplitPaneElement_endMutationController, _M3eSplitPaneElement_renderDragHandle, _M3eSplitPaneElement_handleStartSlotChange, _M3eSplitPaneElement_handleEndSlotChange, _M3eSplitPaneElement_handleSlotChange, _M3eSplitPaneElement_updatePaneVisibility, _M3eSplitPaneElement_hasVisibleElements, _M3eSplitPaneElement_initialize, _M3eSplitPaneElement_initBreakpointMonitoring, _M3eSplitPaneElement_updateOrientation, _M3eSplitPaneElement_clearOrientation, _M3eSplitPaneElement_handlePointerDown, _M3eSplitPaneElement_handlePointerMove, _M3eSplitPaneElement_handlePointerUp, _M3eSplitPaneElement_handleKeyDown, _M3eSplitPaneElement_changeValue, _M3eSplitPaneElement_getClosestDetent, _M3eSplitPaneElement_getNextHigherDetent, _M3eSplitPaneElement_getNextLowerDetent, _M3eSplitPaneElement_computeDetent, _M3eSplitPaneElement_clearSnapAnimation, _M3eSplitPaneElement_snapToValue, _M3eSplitPaneElement_cycleDetent;
 /**
  * A dual-view layout that separates content with a movable drag handle.
  * @description
@@ -24998,6 +25417,7 @@ var _M3eSplitPaneElement_instances, _M3eSplitPaneElement_breakpointUnobserve, _M
  * @attr max - A fractional value, between 0 and 100, indicating the maximum size of the start pane.
  * @attr min - A fractional value, between 0 and 100, indicating the minimum size of the start pane.
  * @attr orientation - The orientation of the split.
+ * @attr overshoot-limit - A fractional value, between 0 and 100, indicating the maximum visual overshoot allowed when dragging past the minimum or maximum size.
  * @attr step - A fractional value, between 0 and 100, indicating the increment by which to adjust the value when resized via keyboard.
  * @attr value - A fractional value, between 0 and 100, indicating the size of the start pane.
  * @attr wrap-detents - Whether cycling through detents will wrap.
@@ -25026,12 +25446,10 @@ let M3eSplitPaneElement = class M3eSplitPaneElement extends FormAssociated$1(Dis
     /** @private */
     _M3eSplitPaneElement_breakpointUnobserve.set(this, void 0);
     /** @private */
-    _M3eSplitPaneElement_dragPos.set(this, 0);
+    _M3eSplitPaneElement_dragState.set(this, void 0);
     /** @private */
     _M3eSplitPaneElement_valueChanged.set(this, false);
     /** @private */
-    _M3eSplitPaneElement_cachedSize.set(this, 0);
-    /** @private */
     _M3eSplitPaneElement_snapAnimation.set(this, void 0);
     /** @private */
     _M3eSplitPaneElement_pressedController.set(this, new PressedController$1(this, {
@@ -25071,6 +25489,11 @@ let M3eSplitPaneElement = class M3eSplitPaneElement extends FormAssociated$1(Dis
      * @default 100
      */
     this.max = 100;
+    /**
+     * A fractional value, between 0 and 100, indicating the maximum visual overshoot allowed when dragging past the minimum or maximum size.
+     * @default 4
+     */
+    this.overshootLimit = 4;
     /**
      * A fractional value, between 0 and 100, indicating the increment by which to adjust the value when resized via keyboard.
      * @default 1
@@ -25117,7 +25540,7 @@ let M3eSplitPaneElement = class M3eSplitPaneElement extends FormAssociated$1(Dis
     return this._orientation ?? (this.orientation !== "vertical" ? "horizontal" : "vertical");
   }
   /** @inheritdoc */
-  get [(_M3eSplitPaneElement_breakpointUnobserve = new WeakMap(), _M3eSplitPaneElement_dragPos = new WeakMap(), _M3eSplitPaneElement_valueChanged = new WeakMap(), _M3eSplitPaneElement_cachedSize = new WeakMap(), _M3eSplitPaneElement_snapAnimation = new WeakMap(), _M3eSplitPaneElement_pressedController = new WeakMap(), _M3eSplitPaneElement_startMutationController = new WeakMap(), _M3eSplitPaneElement_endMutationController = new WeakMap(), _M3eSplitPaneElement_instances = new WeakSet(), formValue$1)]() {
+  get [(_M3eSplitPaneElement_breakpointUnobserve = new WeakMap(), _M3eSplitPaneElement_dragState = new WeakMap(), _M3eSplitPaneElement_valueChanged = new WeakMap(), _M3eSplitPaneElement_snapAnimation = new WeakMap(), _M3eSplitPaneElement_pressedController = new WeakMap(), _M3eSplitPaneElement_startMutationController = new WeakMap(), _M3eSplitPaneElement_endMutationController = new WeakMap(), _M3eSplitPaneElement_instances = new WeakSet(), formValue$1)]() {
     return this.value?.toString() ?? null;
   }
   /**
@@ -25246,18 +25669,46 @@ _M3eSplitPaneElement_handlePointerDown = function _M3eSplitPaneElement_handlePoi
   if (this.disabled) return;
   this._dragHandle.setPointerCapture(e.pointerId);
   __classPrivateFieldSet(this, _M3eSplitPaneElement_valueChanged, false, "f");
-  __classPrivateFieldSet(this, _M3eSplitPaneElement_dragPos, this.currentOrientation === "vertical" ? e.clientY : e.clientX, "f");
-  __classPrivateFieldSet(this, _M3eSplitPaneElement_cachedSize, this.currentOrientation === "vertical" ? this.clientHeight : this.clientWidth, "f");
+  let min = this.min;
+  if (min === 0 && this.detents.length > 0) {
+    const detent = __classPrivateFieldGet(this, _M3eSplitPaneElement_instances, "m", _M3eSplitPaneElement_getClosestDetent).call(this, 0);
+    if (detent > -1) {
+      min = __classPrivateFieldGet(this, _M3eSplitPaneElement_instances, "m", _M3eSplitPaneElement_computeDetent).call(this, this.detents[detent]) ?? this.min;
+    }
+  }
+  let max = this.max;
+  if (max === 100 && this.detents.length > 0) {
+    const detent = __classPrivateFieldGet(this, _M3eSplitPaneElement_instances, "m", _M3eSplitPaneElement_getClosestDetent).call(this, 100);
+    if (detent > -1) {
+      max = __classPrivateFieldGet(this, _M3eSplitPaneElement_instances, "m", _M3eSplitPaneElement_computeDetent).call(this, this.detents[detent]) ?? this.max;
+    }
+  }
+  __classPrivateFieldSet(this, _M3eSplitPaneElement_dragState, {
+    startPos: this.currentOrientation === "vertical" ? e.clientY : e.clientX,
+    startValue: this.value,
+    cachedSize: this.currentOrientation === "vertical" ? this.clientHeight : this.clientWidth,
+    min,
+    max
+  }, "f");
 };
 _M3eSplitPaneElement_handlePointerMove = function _M3eSplitPaneElement_handlePointerMove(e) {
-  if (!this._dragHandle.hasPointerCapture(e.pointerId)) return;
+  if (!this._dragHandle.hasPointerCapture(e.pointerId) || !__classPrivateFieldGet(this, _M3eSplitPaneElement_dragState, "f")) return;
   const pos = this.currentOrientation === "vertical" ? e.clientY : e.clientX;
-  let delta = __classPrivateFieldGet(this, _M3eSplitPaneElement_cachedSize, "f") > 0 ? (pos - __classPrivateFieldGet(this, _M3eSplitPaneElement_dragPos, "f")) / __classPrivateFieldGet(this, _M3eSplitPaneElement_cachedSize, "f") * 100 : 0;
+  let delta = __classPrivateFieldGet(this, _M3eSplitPaneElement_dragState, "f").cachedSize > 0 ? (pos - __classPrivateFieldGet(this, _M3eSplitPaneElement_dragState, "f").startPos) / __classPrivateFieldGet(this, _M3eSplitPaneElement_dragState, "f").cachedSize * 100 : 0;
   if (M3eDirectionality.current === "rtl" && this.currentOrientation !== "vertical") {
     delta = -delta;
   }
-  if (__classPrivateFieldGet(this, _M3eSplitPaneElement_instances, "m", _M3eSplitPaneElement_changeValue).call(this, this.value + delta, false)) {
-    __classPrivateFieldSet(this, _M3eSplitPaneElement_dragPos, pos, "f");
+  let value = __classPrivateFieldGet(this, _M3eSplitPaneElement_dragState, "f").startValue + delta;
+  if (value < __classPrivateFieldGet(this, _M3eSplitPaneElement_dragState, "f").min) {
+    const overshoot = __classPrivateFieldGet(this, _M3eSplitPaneElement_dragState, "f").min - value;
+    const compressed = this.overshootLimit * overshoot / (overshoot + this.overshootLimit);
+    value = __classPrivateFieldGet(this, _M3eSplitPaneElement_dragState, "f").min - compressed;
+  } else if (value > __classPrivateFieldGet(this, _M3eSplitPaneElement_dragState, "f").max) {
+    const overshoot = value - __classPrivateFieldGet(this, _M3eSplitPaneElement_dragState, "f").max;
+    const compressed = this.overshootLimit * overshoot / (overshoot + this.overshootLimit);
+    value = __classPrivateFieldGet(this, _M3eSplitPaneElement_dragState, "f").max + compressed;
+  }
+  if (__classPrivateFieldGet(this, _M3eSplitPaneElement_instances, "m", _M3eSplitPaneElement_changeValue).call(this, value, false, true)) {
     __classPrivateFieldSet(this, _M3eSplitPaneElement_valueChanged, true, "f");
   }
 };
@@ -25265,14 +25716,17 @@ _M3eSplitPaneElement_handlePointerUp = function _M3eSplitPaneElement_handlePoint
   if (e.pointerType === "mouse" && e.button > 1) return;
   if (this._dragHandle.hasPointerCapture(e.pointerId)) {
     this._dragHandle.releasePointerCapture(e.pointerId);
-    __classPrivateFieldSet(this, _M3eSplitPaneElement_dragPos, 0, "f");
-    __classPrivateFieldSet(this, _M3eSplitPaneElement_cachedSize, 0, "f");
+    __classPrivateFieldSet(this, _M3eSplitPaneElement_dragState, undefined, "f");
     const detent = __classPrivateFieldGet(this, _M3eSplitPaneElement_instances, "m", _M3eSplitPaneElement_getClosestDetent).call(this, this.value);
     if (detent >= 0) {
       const value = __classPrivateFieldGet(this, _M3eSplitPaneElement_instances, "m", _M3eSplitPaneElement_computeDetent).call(this, this.detents[detent]);
       if (value !== undefined) {
         __classPrivateFieldGet(this, _M3eSplitPaneElement_instances, "m", _M3eSplitPaneElement_snapToValue).call(this, value, false);
       }
+    } else if (this.value < this.min) {
+      __classPrivateFieldGet(this, _M3eSplitPaneElement_instances, "m", _M3eSplitPaneElement_snapToValue).call(this, this.min, false);
+    } else if (this.value > this.max) {
+      __classPrivateFieldGet(this, _M3eSplitPaneElement_instances, "m", _M3eSplitPaneElement_snapToValue).call(this, this.max, false);
     }
     if (__classPrivateFieldGet(this, _M3eSplitPaneElement_valueChanged, "f")) {
       this.dispatchEvent(new Event("change", {
@@ -25411,9 +25865,11 @@ _M3eSplitPaneElement_handleKeyDown = function _M3eSplitPaneElement_handleKeyDown
       break;
   }
 };
-_M3eSplitPaneElement_changeValue = function _M3eSplitPaneElement_changeValue(value, emitChange = true) {
+_M3eSplitPaneElement_changeValue = function _M3eSplitPaneElement_changeValue(value, emitChange = true, allowOvershoot = false) {
   __classPrivateFieldGet(this, _M3eSplitPaneElement_instances, "m", _M3eSplitPaneElement_clearSnapAnimation).call(this);
-  value = Math.max(this.min, Math.min(this.max, value));
+  if (!allowOvershoot) {
+    value = Math.max(this.min, Math.min(this.max, value));
+  }
   if (value != this.value) {
     const prev = this.value;
     this.value = value;
@@ -25545,6 +26001,10 @@ __decorate([property({
 __decorate([property({
   type: Number
 })], M3eSplitPaneElement.prototype, "max", void 0);
+__decorate([property({
+  attribute: "overshoot-limit",
+  type: Number
+})], M3eSplitPaneElement.prototype, "overshootLimit", void 0);
 __decorate([property({
   type: Number
 })], M3eSplitPaneElement.prototype, "step", void 0);
@@ -31541,13 +32001,13 @@ _M3eRichTooltipElement_handleSubheadSlotChange = function _M3eRichTooltipElement
   __classPrivateFieldGet(this, _M3eRichTooltipElement_instances, "m", _M3eRichTooltipElement_updateMessage).call(this);
 };
 _M3eRichTooltipElement_handleContentSlotChange = function _M3eRichTooltipElement_handleContentSlotChange(e) {
-  this._interactive = M3eInteractivityChecker.findInteractiveElements(this).length > 0;
+  this._interactive = M3eInteractivityChecker.findInteractiveElements(this, true).length > 0;
   __classPrivateFieldSet(this, _M3eRichTooltipElement_contentText, getTextContent$1(e.target, true), "f");
   __classPrivateFieldGet(this, _M3eRichTooltipElement_instances, "m", _M3eRichTooltipElement_updateMessage).call(this);
 };
 _M3eRichTooltipElement_handleActionsSlotChange = function _M3eRichTooltipElement_handleActionsSlotChange(e) {
   this.shadowRoot?.querySelector(".base")?.classList.toggle("has-actions", hasAssignedNodes$1(e.target));
-  this._interactive = M3eInteractivityChecker.findInteractiveElements(this).length > 0;
+  this._interactive = M3eInteractivityChecker.findInteractiveElements(this, true).length > 0;
   __classPrivateFieldGet(this, _M3eRichTooltipElement_instances, "m", _M3eRichTooltipElement_updateMessage).call(this);
 };
 _M3eRichTooltipElement_updateMessage = function _M3eRichTooltipElement_updateMessage() {
@@ -32420,5 +32880,5 @@ __decorate([property({
 })], M3eTreeElement.prototype, "cascade", void 0);
 M3eTreeElement = M3eTreeElement_1 = __decorate([customElement$1("m3e-tree")], M3eTreeElement);
 
-export { ActionElementBase, AnimationLoopController, AttachInternals, CalendarViewElementBase, Checked, CheckedIndeterminate, ConstraintValidation, DesignToken, Dirty, Disabled, DisabledInteractive, EventAttribute, FocusController, Focusable, FormAssociated, FormSubmitter, HoverController, HtmlFor, InertController, IntersectionController, KeyboardClick, Labelled, LinkButton, LongPressController, M3eAccordionElement, M3eActionListElement, M3eAppBarElement, M3eAssistChipElement, M3eAutocompleteElement, M3eAvatarElement, M3eBadgeElement, M3eBottomSheetActionElement, M3eBottomSheetElement, M3eBottomSheetTriggerElement, M3eButtonElement, M3eButtonGroupElement, M3eButtonSegmentElement, M3eCalendarElement, M3eCardElement, M3eCheckboxElement, M3eChipElement, M3eChipSetElement, M3eCircularProgressIndicatorElement, M3eCollapsibleElement, M3eDatepickerElement, M3eDatepickerToggleElement, 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, M3eMonthViewElement, M3eMultiYearViewElement, M3eNavBarElement, M3eNavItemElement, M3eNavMenuElement, M3eNavMenuItemElement, M3eNavMenuItemGroupElement, M3eNavRailElement, M3eNavRailToggleElement, M3eOptGroupElement, M3eOptionElement, M3eOptionPanelElement, M3ePaginatorElement, M3ePseudoCheckboxElement, M3ePseudoRadioElement, M3eRadioElement, M3eRadioGroupElement, M3eRichTooltipActionElement, M3eRichTooltipElement, M3eRippleElement, M3eScrollContainerElement, M3eSearchBarElement, M3eSearchViewElement, M3eSegmentedButtonElement, M3eSelectElement, M3eSelectionListElement, M3eShapeElement, M3eSkeletonElement, M3eSlideElement, M3eSlideGroupElement, M3eSliderElement, M3eSliderThumbElement, M3eSnackbar, M3eSnackbarElement, M3eSplitButtonElement, M3eSplitPaneElement, M3eStateLayerElement, M3eStepElement, M3eStepPanelElement, M3eStepperElement, M3eStepperNextElement, M3eStepperPreviousElement, M3eStepperResetElement, M3eSuggestionChipElement, M3eSwitchElement, M3eTabElement, M3eTabPanelElement, M3eTabsElement, M3eTextHighlightElement, M3eTextOverflowElement, M3eTextareaAutosizeElement, M3eThemeElement, M3eTocElement, M3eTocItemElement, M3eToolbarElement, M3eTooltipElement, M3eTreeElement, M3eTreeItemElement, M3eYearViewElement, MutationController, PressedController, ProgressElementIndicatorBase, ReadOnly, ReconnectedCallback, Required, RequiredConstraintValidation, ResizeController, Role, ScrollController, ScrollLockController, Selected, StepperButtonElementBase, SuppressInitialAnimation, TocGenerator, TooltipElementBase, Touched, VelocityTracker, Vertical, addCustomState, checkOrSelect, computeCssSize, computeLineCount, customElement, dateConverter, 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, registerIcon, registerStyleSheet, renderPseudoLink, resolveElementById, resolveFragmentUrl, safeStyleMap, scrollIntoViewIfNeeded, setCustomState, spaceSeparatedStringConverter, updateLabels, validate, waitForUpgrade };
+export { ActionElementBase, AnimationLoopController, AttachInternals, CalendarViewElementBase, Checked, CheckedIndeterminate, ConstraintValidation, DesignToken, Dirty, Disabled, DisabledInteractive, EventAttribute, FocusController, Focusable, FormAssociated, FormSubmitter, HoverController, HtmlFor, InertController, IntersectionController, KeyboardClick, Labelled, LinkButton, LongPressController, M3eAccordionElement, M3eActionListElement, M3eAppBarElement, M3eAssistChipElement, M3eAutocompleteElement, M3eAvatarElement, M3eBadgeElement, M3eBottomSheetActionElement, M3eBottomSheetElement, M3eBottomSheetTriggerElement, M3eBreadcrumbElement, M3eBreadcrumbItemElement, M3eButtonElement, M3eButtonGroupElement, M3eButtonSegmentElement, M3eCalendarElement, M3eCardElement, M3eCheckboxElement, M3eChipElement, M3eChipSetElement, M3eCircularProgressIndicatorElement, M3eCollapsibleElement, M3eContentPaneElement, M3eDatepickerElement, M3eDatepickerToggleElement, 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, M3eListItemElement, M3eListOptionElement, M3eLoadingIndicatorElement, M3eMenuElement, M3eMenuItemCheckboxElement, M3eMenuItemElement, M3eMenuItemGroupElement, M3eMenuItemRadioElement, M3eMenuTriggerElement, M3eMonthViewElement, M3eMultiYearViewElement, M3eNavBarElement, M3eNavItemElement, M3eNavMenuElement, M3eNavMenuItemElement, M3eNavMenuItemGroupElement, M3eNavRailElement, M3eNavRailToggleElement, M3eOptGroupElement, M3eOptionElement, M3eOptionPanelElement, M3ePaginatorElement, M3ePseudoCheckboxElement, M3ePseudoRadioElement, M3eRadioElement, M3eRadioGroupElement, M3eRichTooltipActionElement, M3eRichTooltipElement, M3eRippleElement, M3eScrollContainerElement, M3eSearchBarElement, M3eSearchViewElement, M3eSegmentedButtonElement, M3eSelectElement, M3eSelectionListElement, M3eShapeElement, M3eSkeletonElement, M3eSlideElement, M3eSlideGroupElement, M3eSliderElement, M3eSliderThumbElement, M3eSnackbar, M3eSnackbarElement, M3eSplitButtonElement, M3eSplitPaneElement, M3eStateLayerElement, M3eStepElement, M3eStepPanelElement, M3eStepperElement, M3eStepperNextElement, M3eStepperPreviousElement, M3eStepperResetElement, M3eSuggestionChipElement, M3eSwitchElement, M3eTabElement, M3eTabPanelElement, M3eTabsElement, M3eTextHighlightElement, M3eTextOverflowElement, M3eTextareaAutosizeElement, M3eThemeElement, M3eTocElement, M3eTocItemElement, M3eToolbarElement, M3eTooltipElement, M3eTreeElement, M3eTreeItemElement, M3eYearViewElement, MutationController, PressedController, ProgressElementIndicatorBase, ReadOnly, ReconnectedCallback, Required, RequiredConstraintValidation, ResizeController, Role, ScrollController, ScrollLockController, Selected, StepperButtonElementBase, SuppressInitialAnimation, TocGenerator, TooltipElementBase, Touched, VelocityTracker, Vertical, addCustomState, checkOrSelect, computeCssSize, computeLineCount, customElement, dateConverter, debounce, defaultValue, deleteCustomState, findFormFieldControl, focusWhenReady, forcedColorsActive, formValue, generateClipPaths, getScrollbarWidth, 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, registerIcon, registerStyleSheet, renderPseudoLink, resolveElementById, resolveFragmentUrl, safeStyleMap, scrollIntoViewIfNeeded, setCustomState, spaceSeparatedStringConverter, updateLabels, validate, waitForUpgrade };
 //# sourceMappingURL=all.js.map