@m3e/web 2.5.3 → 2.5.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (210) hide show
  1. package/dist/all.js +394 -348
  2. package/dist/all.js.map +1 -1
  3. package/dist/all.min.js +56 -56
  4. package/dist/all.min.js.map +1 -1
  5. package/dist/autocomplete.js +14 -14
  6. package/dist/autocomplete.js.map +1 -1
  7. package/dist/autocomplete.min.js +1 -1
  8. package/dist/autocomplete.min.js.map +1 -1
  9. package/dist/bottom-sheet.js +11 -14
  10. package/dist/bottom-sheet.js.map +1 -1
  11. package/dist/bottom-sheet.min.js +1 -1
  12. package/dist/bottom-sheet.min.js.map +1 -1
  13. package/dist/breadcrumb.js +4 -4
  14. package/dist/breadcrumb.js.map +1 -1
  15. package/dist/breadcrumb.min.js +1 -1
  16. package/dist/breadcrumb.min.js.map +1 -1
  17. package/dist/button-group.js +5 -5
  18. package/dist/button-group.js.map +1 -1
  19. package/dist/button-group.min.js +1 -1
  20. package/dist/button-group.min.js.map +1 -1
  21. package/dist/button.js +15 -15
  22. package/dist/button.js.map +1 -1
  23. package/dist/button.min.js +1 -1
  24. package/dist/button.min.js.map +1 -1
  25. package/dist/checkbox.js +1 -1
  26. package/dist/checkbox.js.map +1 -1
  27. package/dist/checkbox.min.js +1 -1
  28. package/dist/checkbox.min.js.map +1 -1
  29. package/dist/chips.js +11 -11
  30. package/dist/chips.js.map +1 -1
  31. package/dist/chips.min.js +1 -1
  32. package/dist/chips.min.js.map +1 -1
  33. package/dist/core-a11y.js +5 -3
  34. package/dist/core-a11y.js.map +1 -1
  35. package/dist/core-a11y.min.js +4 -4
  36. package/dist/core-a11y.min.js.map +1 -1
  37. package/dist/core-anchoring.js +4 -4
  38. package/dist/core-anchoring.js.map +1 -1
  39. package/dist/core-anchoring.min.js +1 -1
  40. package/dist/core-anchoring.min.js.map +1 -1
  41. package/dist/core.js +78 -64
  42. package/dist/core.js.map +1 -1
  43. package/dist/core.min.js +1 -1
  44. package/dist/core.min.js.map +1 -1
  45. package/dist/css-custom-data.json +200 -185
  46. package/dist/custom-elements.json +1598 -1524
  47. package/dist/datepicker.js +12 -12
  48. package/dist/datepicker.js.map +1 -1
  49. package/dist/datepicker.min.js +1 -1
  50. package/dist/datepicker.min.js.map +1 -1
  51. package/dist/dialog.js +4 -4
  52. package/dist/dialog.js.map +1 -1
  53. package/dist/dialog.min.js +1 -1
  54. package/dist/dialog.min.js.map +1 -1
  55. package/dist/drawer-container.js +14 -14
  56. package/dist/drawer-container.js.map +1 -1
  57. package/dist/drawer-container.min.js +1 -1
  58. package/dist/drawer-container.min.js.map +1 -1
  59. package/dist/expansion-panel.js +4 -4
  60. package/dist/expansion-panel.js.map +1 -1
  61. package/dist/expansion-panel.min.js +1 -1
  62. package/dist/expansion-panel.min.js.map +1 -1
  63. package/dist/fab-menu.js +4 -4
  64. package/dist/fab-menu.js.map +1 -1
  65. package/dist/fab-menu.min.js +1 -1
  66. package/dist/fab-menu.min.js.map +1 -1
  67. package/dist/fab.js +2 -2
  68. package/dist/fab.js.map +1 -1
  69. package/dist/fab.min.js +1 -1
  70. package/dist/fab.min.js.map +1 -1
  71. package/dist/form-field.js +19 -19
  72. package/dist/form-field.js.map +1 -1
  73. package/dist/form-field.min.js +2 -2
  74. package/dist/form-field.min.js.map +1 -1
  75. package/dist/html-custom-data.json +54 -44
  76. package/dist/icon-button.js +15 -15
  77. package/dist/icon-button.js.map +1 -1
  78. package/dist/icon-button.min.js +1 -1
  79. package/dist/icon-button.min.js.map +1 -1
  80. package/dist/icon.js +1 -1
  81. package/dist/icon.js.map +1 -1
  82. package/dist/icon.min.js +1 -1
  83. package/dist/icon.min.js.map +1 -1
  84. package/dist/list.js +16 -16
  85. package/dist/list.js.map +1 -1
  86. package/dist/list.min.js +1 -1
  87. package/dist/list.min.js.map +1 -1
  88. package/dist/menu.js +20 -20
  89. package/dist/menu.js.map +1 -1
  90. package/dist/menu.min.js +1 -1
  91. package/dist/menu.min.js.map +1 -1
  92. package/dist/nav-bar.js +40 -10
  93. package/dist/nav-bar.js.map +1 -1
  94. package/dist/nav-bar.min.js +1 -1
  95. package/dist/nav-bar.min.js.map +1 -1
  96. package/dist/nav-menu.js +10 -10
  97. package/dist/nav-menu.js.map +1 -1
  98. package/dist/nav-menu.min.js +1 -1
  99. package/dist/nav-menu.min.js.map +1 -1
  100. package/dist/nav-rail.js +15 -11
  101. package/dist/nav-rail.js.map +1 -1
  102. package/dist/nav-rail.min.js +1 -1
  103. package/dist/nav-rail.min.js.map +1 -1
  104. package/dist/option.js +13 -13
  105. package/dist/option.js.map +1 -1
  106. package/dist/option.min.js +1 -1
  107. package/dist/option.min.js.map +1 -1
  108. package/dist/paginator.js +2 -2
  109. package/dist/paginator.js.map +1 -1
  110. package/dist/paginator.min.js +2 -2
  111. package/dist/paginator.min.js.map +1 -1
  112. package/dist/radio-group.js +2 -2
  113. package/dist/radio-group.js.map +1 -1
  114. package/dist/radio-group.min.js +1 -1
  115. package/dist/radio-group.min.js.map +1 -1
  116. package/dist/search.js +15 -15
  117. package/dist/search.js.map +1 -1
  118. package/dist/search.min.js +1 -1
  119. package/dist/search.min.js.map +1 -1
  120. package/dist/segmented-button.js +7 -7
  121. package/dist/segmented-button.js.map +1 -1
  122. package/dist/segmented-button.min.js +1 -1
  123. package/dist/segmented-button.min.js.map +1 -1
  124. package/dist/select.js +6 -6
  125. package/dist/select.js.map +1 -1
  126. package/dist/select.min.js +1 -1
  127. package/dist/select.min.js.map +1 -1
  128. package/dist/slider.js +5 -5
  129. package/dist/slider.js.map +1 -1
  130. package/dist/slider.min.js +1 -1
  131. package/dist/slider.min.js.map +1 -1
  132. package/dist/split-pane.js +10 -10
  133. package/dist/split-pane.js.map +1 -1
  134. package/dist/split-pane.min.js +1 -1
  135. package/dist/split-pane.min.js.map +1 -1
  136. package/dist/src/autocomplete/AutocompleteElement.d.ts.map +1 -1
  137. package/dist/src/bottom-sheet/BottomSheetElement.d.ts +1 -1
  138. package/dist/src/bottom-sheet/BottomSheetElement.d.ts.map +1 -1
  139. package/dist/src/button/styles/ButtonSizeStyle.d.ts.map +1 -1
  140. package/dist/src/button/styles/ButtonStyle.d.ts.map +1 -1
  141. package/dist/src/button/styles/ButtonVariantStyle.d.ts.map +1 -1
  142. package/dist/src/button-group/ButtonGroupElement.d.ts.map +1 -1
  143. package/dist/src/checkbox/CheckboxElement.d.ts.map +1 -1
  144. package/dist/src/chips/InputChipElement.d.ts.map +1 -1
  145. package/dist/src/core/a11y/InteractivityChecker.d.ts +2 -1
  146. package/dist/src/core/a11y/InteractivityChecker.d.ts.map +1 -1
  147. package/dist/src/core/anchoring/FloatingPanelElement.d.ts +1 -1
  148. package/dist/src/core/shared/mixins/SuppressInitialAnimation.d.ts +9 -2
  149. package/dist/src/core/shared/mixins/SuppressInitialAnimation.d.ts.map +1 -1
  150. package/dist/src/core/shared/mixins/index.d.ts +0 -1
  151. package/dist/src/core/shared/mixins/index.d.ts.map +1 -1
  152. package/dist/src/core/shared/primitives/CollapsibleElement.d.ts +13 -0
  153. package/dist/src/core/shared/primitives/CollapsibleElement.d.ts.map +1 -1
  154. package/dist/src/core/shared/primitives/CollapsibleOrientation.d.ts +3 -0
  155. package/dist/src/core/shared/primitives/CollapsibleOrientation.d.ts.map +1 -0
  156. package/dist/src/core/shared/primitives/index.d.ts +1 -0
  157. package/dist/src/core/shared/primitives/index.d.ts.map +1 -1
  158. package/dist/src/datepicker/DatepickerElement.d.ts +1 -1
  159. package/dist/src/dialog/DialogElement.d.ts.map +1 -1
  160. package/dist/src/drawer-container/styles/DrawerContainerStyle.d.ts.map +1 -1
  161. package/dist/src/expansion-panel/ExpansionPanelElement.d.ts.map +1 -1
  162. package/dist/src/fab/FabElement.d.ts.map +1 -1
  163. package/dist/src/fab/styles/FabStyle.d.ts.map +1 -1
  164. package/dist/src/fab-menu/FabMenuElement.d.ts +1 -1
  165. package/dist/src/form-field/FormFieldElement.d.ts.map +1 -1
  166. package/dist/src/icon/IconElement.d.ts.map +1 -1
  167. package/dist/src/icon-button/styles/IconButtonSizeStyle.d.ts.map +1 -1
  168. package/dist/src/icon-button/styles/IconButtonStyle.d.ts.map +1 -1
  169. package/dist/src/icon-button/styles/IconButtonVariantStyle.d.ts.map +1 -1
  170. package/dist/src/menu/MenuElement.d.ts +1 -1
  171. package/dist/src/nav-bar/NavItemElement.d.ts +7 -1
  172. package/dist/src/nav-bar/NavItemElement.d.ts.map +1 -1
  173. package/dist/src/nav-menu/NavMenuItemElement.d.ts.map +1 -1
  174. package/dist/src/nav-rail/NavRailElement.d.ts +10 -5
  175. package/dist/src/nav-rail/NavRailElement.d.ts.map +1 -1
  176. package/dist/src/paginator/PaginatorElement.d.ts.map +1 -1
  177. package/dist/src/search/SearchBarElement.d.ts.map +1 -1
  178. package/dist/src/search/SearchViewElement.d.ts.map +1 -1
  179. package/dist/src/search/styles/SearchBarStyle.d.ts.map +1 -1
  180. package/dist/src/split-pane/SplitPaneElement.d.ts.map +1 -1
  181. package/dist/src/stepper/StepperElement.d.ts.map +1 -1
  182. package/dist/src/toolbar/ToolbarElement.d.ts.map +1 -1
  183. package/dist/src/tree/TreeItemElement.d.ts.map +1 -1
  184. package/dist/stepper.js +6 -6
  185. package/dist/stepper.js.map +1 -1
  186. package/dist/stepper.min.js +1 -1
  187. package/dist/stepper.min.js.map +1 -1
  188. package/dist/tabs.js +5 -5
  189. package/dist/tabs.js.map +1 -1
  190. package/dist/tabs.min.js +1 -1
  191. package/dist/tabs.min.js.map +1 -1
  192. package/dist/toc.js +7 -7
  193. package/dist/toc.js.map +1 -1
  194. package/dist/toc.min.js +1 -1
  195. package/dist/toc.min.js.map +1 -1
  196. package/dist/toolbar.js +2 -1
  197. package/dist/toolbar.js.map +1 -1
  198. package/dist/toolbar.min.js +1 -1
  199. package/dist/toolbar.min.js.map +1 -1
  200. package/dist/tooltip.js +3 -3
  201. package/dist/tooltip.js.map +1 -1
  202. package/dist/tooltip.min.js +1 -1
  203. package/dist/tooltip.min.js.map +1 -1
  204. package/dist/tree.js +9 -9
  205. package/dist/tree.js.map +1 -1
  206. package/dist/tree.min.js +1 -1
  207. package/dist/tree.min.js.map +1 -1
  208. package/package.json +1 -1
  209. package/dist/src/core/shared/mixins/EventAttribute.d.ts +0 -11
  210. package/dist/src/core/shared/mixins/EventAttribute.d.ts.map +0 -1
package/dist/core.js CHANGED
@@ -2018,7 +2018,7 @@ function Dirty(base) {
2018
2018
  }
2019
2019
  /** Whether the user has modified the value of the element. */
2020
2020
  get dirty() {
2021
- return hasCustomState(this, "-dirty");
2021
+ return hasCustomState(this, "--dirty");
2022
2022
  }
2023
2023
  /** Whether the user has not modified the value of the element. */
2024
2024
  get pristine() {
@@ -2037,11 +2037,11 @@ function Dirty(base) {
2037
2037
  }
2038
2038
  /** Marks the element as pristine. */
2039
2039
  markAsPristine() {
2040
- deleteCustomState(this, "-dirty");
2040
+ deleteCustomState(this, "--dirty");
2041
2041
  }
2042
2042
  /** Marks the element as dirty. */
2043
2043
  markAsDirty() {
2044
- addCustomState(this, "-dirty");
2044
+ addCustomState(this, "--dirty");
2045
2045
  }
2046
2046
  }
2047
2047
  _a = _eventHandler$2;
@@ -2073,7 +2073,7 @@ function Touched(base) {
2073
2073
  }
2074
2074
  /** Whether the user has interacted when the element. */
2075
2075
  get touched() {
2076
- return hasCustomState(this, "-touched");
2076
+ return hasCustomState(this, "--touched");
2077
2077
  }
2078
2078
  /** Whether the user has not interacted when the element. */
2079
2079
  get untouched() {
@@ -2096,11 +2096,11 @@ function Touched(base) {
2096
2096
  }
2097
2097
  /** Marks the element as touched. */
2098
2098
  markAsTouched() {
2099
- addCustomState(this, "-touched");
2099
+ addCustomState(this, "--touched");
2100
2100
  }
2101
2101
  /** Marks the element as untouched. */
2102
2102
  markAsUntouched() {
2103
- deleteCustomState(this, "-touched");
2103
+ deleteCustomState(this, "--touched");
2104
2104
  }
2105
2105
  }
2106
2106
  _a = _eventHandler$1;
@@ -2819,7 +2819,7 @@ function Labelled(base) {
2819
2819
  [(_a = _eventHandler, updateLabels)]() {
2820
2820
  const focusable = this.hasAttribute("tabindex");
2821
2821
  const disabled = isDisabledMixin(this) && this.disabled || isDisabledInteractiveMixin(this) && this.disabledInteractive;
2822
- const invalid = isTouchedMixin(this) && this.touched && (this.ariaInvalid || hasCustomState(this, "-invalid"));
2822
+ const invalid = isTouchedMixin(this) && this.touched && (this.ariaInvalid || hasCustomState(this, "--invalid"));
2823
2823
  for (const label of this.labels ?? []) {
2824
2824
  label.style.userSelect = focusable ? "none" : "";
2825
2825
  label.style.cursor = !disabled && focusable ? "pointer" : "";
@@ -3059,7 +3059,7 @@ function ConstraintValidation(base) {
3059
3059
  }
3060
3060
  this[internals].setValidity(validity, validityMessage);
3061
3061
  this.ariaInvalid = invalid ? "true" : null;
3062
- setCustomState(this, "-invalid", invalid === true);
3062
+ setCustomState(this, "--invalid", invalid === true);
3063
3063
  if (isLabelledMixin(this)) {
3064
3064
  this[updateLabels]?.();
3065
3065
  }
@@ -3116,29 +3116,6 @@ function ConstraintValidation(base) {
3116
3116
  return _ConstraintValidation;
3117
3117
  }
3118
3118
 
3119
- /**
3120
- * Mixin that adds support for custom event attributes.
3121
- * @template T The type of base class from which to inherit.
3122
- * @param {T} base The base class from which to inherit.
3123
- * @param {string[]} types The types of event attributes.
3124
- * @returns {T} A class extending `base` that supports custom event attributes.
3125
- */
3126
- function EventAttribute(base, ...types) {
3127
- class _EventAttribute extends base {
3128
- /** @internal */
3129
- dispatchEvent(event) {
3130
- if (types.includes(event.type)) {
3131
- const eventAttribute = this.getAttribute(`on${event.type}`);
3132
- if (eventAttribute) {
3133
- new Function("e", `${eventAttribute};`).call(this, event);
3134
- }
3135
- }
3136
- return super.dispatchEvent(event);
3137
- }
3138
- }
3139
- return _EventAttribute;
3140
- }
3141
-
3142
3119
  const _tabindex = Symbol("_tabindex");
3143
3120
  /**
3144
3121
  * Mixin to augment an element with behavior that supports a focused state.
@@ -3754,18 +3731,24 @@ function Role(base, role) {
3754
3731
  return _RoleMixin;
3755
3732
  }
3756
3733
 
3734
+ /** A symbol used to define the function called to resume animation. */
3735
+ const resumeAnimation = Symbol("resumeAnimation");
3757
3736
  /**
3758
3737
  * Mixin to augment an element with behavior that suppresses initial animations.
3759
3738
  * @template T The type of the base class.
3760
3739
  * @param {T} base The base class.
3761
- * @returns {T} A constructor that implements initial animation suppression.
3740
+ * @returns {Constructor<SuppressInitialAnimationMixin> & T} A constructor that implements initial animation suppression.
3762
3741
  */
3763
3742
  function SuppressInitialAnimation(base) {
3764
3743
  class _SuppressInitialAnimation extends base {
3765
3744
  connectedCallback() {
3766
3745
  super.connectedCallback();
3767
- addCustomState(this, "-no-animate");
3768
- requestAnimationFrame(() => deleteCustomState(this, "-no-animate"));
3746
+ addCustomState(this, "--no-animate");
3747
+ this[resumeAnimation]();
3748
+ }
3749
+ /** @internal */
3750
+ [resumeAnimation]() {
3751
+ requestAnimationFrame(() => deleteCustomState(this, "--no-animate"));
3769
3752
  }
3770
3753
  }
3771
3754
  return _SuppressInitialAnimation;
@@ -3861,6 +3844,8 @@ var _M3eCollapsibleElement_instances, _M3eCollapsibleElement_slotChanged, _M3eCo
3861
3844
  * @slot - Renders the collapsible content.
3862
3845
  *
3863
3846
  * @attr open - Whether content is visible.
3847
+ * @attr orientation - Orientation of collapsible content.
3848
+ * @attr no-animate - Whether to disable animation.
3864
3849
  *
3865
3850
  * @fires opening - Emitted when the collapsible begins to open.
3866
3851
  * @fires opened - Emitted when the collapsible has opened.
@@ -3869,7 +3854,7 @@ var _M3eCollapsibleElement_instances, _M3eCollapsibleElement_slotChanged, _M3eCo
3869
3854
  *
3870
3855
  * @cssprop --m3e-collapsible-animation-duration - The duration of the expand / collapse animation.
3871
3856
  */
3872
- let M3eCollapsibleElement = class M3eCollapsibleElement extends EventAttribute(AttachInternals(LitElement), "opening", "opened", "closing", "closed") {
3857
+ let M3eCollapsibleElement = class M3eCollapsibleElement extends AttachInternals(LitElement) {
3873
3858
  constructor() {
3874
3859
  super(...arguments);
3875
3860
  _M3eCollapsibleElement_instances.add(this);
@@ -3882,11 +3867,21 @@ let M3eCollapsibleElement = class M3eCollapsibleElement extends EventAttribute(A
3882
3867
  * @default false
3883
3868
  */
3884
3869
  this.open = false;
3870
+ /**
3871
+ * Orientation of collapsible content.
3872
+ * @default "vertical"
3873
+ */
3874
+ this.orientation = "vertical";
3875
+ /**
3876
+ * Whether to disable animation.
3877
+ * @default false
3878
+ */
3879
+ this.noAnimate = false;
3885
3880
  }
3886
3881
  /** @inheritdoc */
3887
3882
  update(changedProperties) {
3888
3883
  super.update(changedProperties);
3889
- addCustomState(this, "-no-animate");
3884
+ addCustomState(this, "--no-animate");
3890
3885
  if (!__classPrivateFieldGet(this, _M3eCollapsibleElement_slotChanged, "f")) {
3891
3886
  if (this.open) {
3892
3887
  __classPrivateFieldSet(this, _M3eCollapsibleElement_hasOpened, true, "f");
@@ -3898,26 +3893,26 @@ let M3eCollapsibleElement = class M3eCollapsibleElement extends EventAttribute(A
3898
3893
  this.toggleAttribute("inert", !this.open);
3899
3894
  if (this.open) {
3900
3895
  __classPrivateFieldSet(this, _M3eCollapsibleElement_hasOpened, true, "f");
3901
- if (!prefersReducedMotion()) {
3896
+ if (!(prefersReducedMotion() || this.noAnimate)) {
3902
3897
  __classPrivateFieldGet(this, _M3eCollapsibleElement_instances, "m", _M3eCollapsibleElement_autoSize).call(this);
3903
- setCustomState(this, "-overflows", this.clientHeight < this.scrollHeight);
3898
+ setCustomState(this, "--overflows", this.orientation === "vertical" ? this.clientHeight < this.scrollHeight : this.clientWidth < this.scrollWidth);
3904
3899
  __classPrivateFieldGet(this, _M3eCollapsibleElement_instances, "m", _M3eCollapsibleElement_clearSize).call(this);
3905
3900
  }
3906
- deleteCustomState(this, "-closing");
3907
- addCustomState(this, "-opening");
3901
+ deleteCustomState(this, "--closing");
3902
+ addCustomState(this, "--opening");
3908
3903
  this.dispatchEvent(new Event("opening"));
3909
3904
  __classPrivateFieldGet(this, _M3eCollapsibleElement_instances, "m", _M3eCollapsibleElement_clearSize).call(this);
3910
- deleteCustomState(this, "-no-animate");
3905
+ deleteCustomState(this, "--no-animate");
3911
3906
  __classPrivateFieldGet(this, _M3eCollapsibleElement_instances, "m", _M3eCollapsibleElement_actualSize).call(this);
3912
- if (prefersReducedMotion()) {
3907
+ if (prefersReducedMotion() || this.noAnimate) {
3913
3908
  __classPrivateFieldGet(this, _M3eCollapsibleElement_instances, "m", _M3eCollapsibleElement_autoSize).call(this);
3914
- deleteCustomState(this, "-opening");
3909
+ deleteCustomState(this, "--opening");
3915
3910
  this.dispatchEvent(new Event("opened"));
3916
3911
  } else {
3917
3912
  this.addEventListener("transitionend", () => {
3918
3913
  if (this.open) {
3919
3914
  __classPrivateFieldGet(this, _M3eCollapsibleElement_instances, "m", _M3eCollapsibleElement_autoSize).call(this);
3920
- deleteCustomState(this, "-opening");
3915
+ deleteCustomState(this, "--opening");
3921
3916
  this.dispatchEvent(new Event("opened"));
3922
3917
  }
3923
3918
  }, {
@@ -3925,23 +3920,23 @@ let M3eCollapsibleElement = class M3eCollapsibleElement extends EventAttribute(A
3925
3920
  });
3926
3921
  }
3927
3922
  } else {
3928
- deleteCustomState(this, "-opening");
3929
- addCustomState(this, "-closing");
3923
+ deleteCustomState(this, "--opening");
3924
+ addCustomState(this, "--closing");
3930
3925
  this.dispatchEvent(new Event("closing"));
3931
3926
  __classPrivateFieldGet(this, _M3eCollapsibleElement_instances, "m", _M3eCollapsibleElement_actualSize).call(this);
3932
3927
  if (__classPrivateFieldGet(this, _M3eCollapsibleElement_hasOpened, "f")) {
3933
- deleteCustomState(this, "-no-animate");
3928
+ deleteCustomState(this, "--no-animate");
3934
3929
  }
3935
- if (prefersReducedMotion()) {
3930
+ if (prefersReducedMotion() || this.noAnimate) {
3936
3931
  __classPrivateFieldGet(this, _M3eCollapsibleElement_instances, "m", _M3eCollapsibleElement_clearSize).call(this);
3937
- deleteCustomState(this, "-closing");
3932
+ deleteCustomState(this, "--closing");
3938
3933
  this.dispatchEvent(new Event("closed"));
3939
3934
  } else {
3940
3935
  requestAnimationFrame(() => {
3941
3936
  __classPrivateFieldGet(this, _M3eCollapsibleElement_instances, "m", _M3eCollapsibleElement_clearSize).call(this);
3942
3937
  this.addEventListener("transitionend", () => {
3943
3938
  if (!this.open) {
3944
- deleteCustomState(this, "-closing");
3939
+ deleteCustomState(this, "--closing");
3945
3940
  this.dispatchEvent(new Event("closed"));
3946
3941
  }
3947
3942
  }, {
@@ -3963,27 +3958,46 @@ _M3eCollapsibleElement_handleSlotChange = function _M3eCollapsibleElement_handle
3963
3958
  __classPrivateFieldSet(this, _M3eCollapsibleElement_slotChanged, true, "f");
3964
3959
  };
3965
3960
  _M3eCollapsibleElement_autoSize = function _M3eCollapsibleElement_autoSize() {
3966
- this.style.height = "auto";
3961
+ this.style[this.orientation === "vertical" ? "height" : "width"] = "auto";
3967
3962
  };
3968
3963
  _M3eCollapsibleElement_clearSize = function _M3eCollapsibleElement_clearSize() {
3969
- this.style.height = "";
3964
+ this.style[this.orientation === "vertical" ? "height" : "width"] = "";
3970
3965
  };
3971
3966
  _M3eCollapsibleElement_actualSize = function _M3eCollapsibleElement_actualSize() {
3972
- this.style.height = `${this.scrollHeight}px`;
3967
+ if (this.orientation === "vertical") {
3968
+ this.style.height = `${this.scrollHeight}px`;
3969
+ } else {
3970
+ this.style.width = `${this.scrollWidth}px`;
3971
+ }
3973
3972
  };
3974
3973
  /** The styles of the element. */
3975
- M3eCollapsibleElement.styles = css`:host { display: block; height: 0px; overflow: hidden; transition: ${unsafeCSS(`visibility var(--m3e-collapsible-animation-duration, ${DesignToken.motion.duration.medium1})
3974
+ M3eCollapsibleElement.styles = css`:host { display: block; overflow: hidden; } :host([orientation="vertical"]) { height: 0px; transition: ${unsafeCSS(`visibility var(--m3e-collapsible-animation-duration, ${DesignToken.motion.duration.medium1})
3976
3975
  ${DesignToken.motion.easing.standard},
3977
3976
  height var(--m3e-collapsible-animation-duration, ${DesignToken.motion.duration.medium1})
3978
3977
  ${DesignToken.motion.easing.standard},
3979
3978
  padding-top var(--m3e-collapsible-animation-duration, ${DesignToken.motion.duration.medium1})
3980
3979
  ${DesignToken.motion.easing.standard},
3981
3980
  padding-bottom var(--m3e-collapsible-animation-duration, ${DesignToken.motion.duration.medium1})
3982
- ${DesignToken.motion.easing.standard}`)}; } :host(:not(:state(-closing)):not([open])) { visibility: hidden; } :host(:not([open])) { min-height: unset !important; padding-top: 0px !important; padding-bottom: 0px !important; } :host(:state(-no-animate)) { transition-duration: 0ms; } :host(:state(-opening)), :host(:state(-closing)) { overflow-y: hidden !important; } :host(:state(-overflows)) { scrollbar-gutter: stable; } ::slotted(*) { --m3e-collapsible-animation-duration: initial; } @media (prefers-reduced-motion) { :host { transition: none; } }`;
3981
+ ${DesignToken.motion.easing.standard}`)}; } :host([orientation="horizontal"]) { width: 0px; transition: ${unsafeCSS(`visibility var(--m3e-collapsible-animation-duration, ${DesignToken.motion.duration.medium1})
3982
+ ${DesignToken.motion.easing.standard},
3983
+ width var(--m3e-collapsible-animation-duration, ${DesignToken.motion.duration.medium1})
3984
+ ${DesignToken.motion.easing.standard},
3985
+ padding-left var(--m3e-collapsible-animation-duration, ${DesignToken.motion.duration.medium1})
3986
+ ${DesignToken.motion.easing.standard},
3987
+ padding-right var(--m3e-collapsible-animation-duration, ${DesignToken.motion.duration.medium1})
3988
+ ${DesignToken.motion.easing.standard}`)}; } :host(:not(:is(:state(--closing), :--closing)):not([open])) { visibility: hidden; } :host([orientation="vertical"]:not([open])) { min-height: unset !important; padding-top: 0px !important; padding-bottom: 0px !important; } :host([orientation="horizontal"]:not([open])) { min-width: unset !important; padding-left: 0px !important; padding-right: 0px !important; } :host([no-animate]), :host(:is(:state(--no-animate), :--no-animate)) { transition-duration: 0ms; } :host([orientation="vertical"]:is(:state(--opening), :--opening)), :host([orientation="vertical"]:is(:state(--closing), :--closing)) { overflow-y: hidden !important; } :host([orientation="horizontal"]:is(:state(--opening), :--opening)), :host([orientation="horizontal"]:is(:state(--closing), :--closing)) { overflow-x: hidden !important; } :host(:is(:state(--overflows), :--overflows)) { scrollbar-gutter: stable; } ::slotted(*) { --m3e-collapsible-animation-duration: initial; } @media (prefers-reduced-motion) { :host { transition: none; } }`;
3983
3989
  __decorate([property({
3984
3990
  type: Boolean,
3985
3991
  reflect: true
3986
3992
  })], M3eCollapsibleElement.prototype, "open", void 0);
3993
+ __decorate([property({
3994
+ reflect: true
3995
+ })], M3eCollapsibleElement.prototype, "orientation", void 0);
3996
+ __decorate([property({
3997
+ attribute: "no-animate",
3998
+ type: Boolean,
3999
+ reflect: true
4000
+ })], M3eCollapsibleElement.prototype, "noAnimate", void 0);
3987
4001
  M3eCollapsibleElement = __decorate([customElement("m3e-collapsible")], M3eCollapsibleElement);
3988
4002
 
3989
4003
  /**
@@ -4677,13 +4691,13 @@ let M3eScrollContainerElement = class M3eScrollContainerElement extends AttachIn
4677
4691
  _updateScroll() {
4678
4692
  const before = (this.dividers === "above" || this.dividers === "above-below") && this.scrollTop > 0;
4679
4693
  const after = (this.dividers === "below" || this.dividers === "above-below") && this.scrollHeight - this.scrollTop - this.clientHeight > 1;
4680
- setCustomState(this, "-above", before);
4681
- setCustomState(this, "-below", after);
4694
+ setCustomState(this, "--above", before);
4695
+ setCustomState(this, "--below", after);
4682
4696
  }
4683
4697
  };
4684
4698
  _M3eScrollContainerElement_scrollHandler = new WeakMap();
4685
4699
  /** The styles of the element. */
4686
- M3eScrollContainerElement.styles = css`:host { display: block; overflow-y: auto; position: relative; box-sizing: border-box; scrollbar-color: ${DesignToken.scrollbar.color}; border-top: var(--m3e-divider-thickness, 1px) solid transparent; border-bottom: var(--m3e-divider-thickness, 1px) solid transparent; outline-color: ${FocusRingToken.color}; outline-width: ${FocusRingToken.thickness}; outline-offset: ${FocusRingToken.outwardOffset}; } :host([thin]) { scrollbar-width: ${DesignToken.scrollbar.thinWidth}; } :host(:not([thin])) { scrollbar-width: ${DesignToken.scrollbar.width}; } :host(:not(:focus-visible):state(-above)) { border-top-color: var(--m3e-divider-color, ${DesignToken.color.outlineVariant}); } :host(:not(:focus-visible):state(-below)) { border-bottom-color: var(--m3e-divider-color, ${DesignToken.color.outlineVariant}); } :host(:focus-visible) { outline-style: solid; animation: grow-shrink ${FocusRingToken.duration}; } @keyframes grow-shrink { 50% { outline-width: calc(${FocusRingToken.thickness} * ${FocusRingToken.growthFactor}); } } @media (forced-colors: active) { :host { border-top: var(--m3e-divider-thickness, 1px) solid Canvas; border-bottom: var(--m3e-divider-thickness, 1px) solid Canvas; } :host(:not(:focus-visible):state(-above)) { border-top-color: GrayText; } :host(:not(:focus-visible):state(-below)) { border-bottom-color: GrayText; } } @media (prefers-reduced-motion) { :host(:focus-visible) { animation: none; } }`;
4700
+ M3eScrollContainerElement.styles = css`:host { display: block; overflow-y: auto; position: relative; box-sizing: border-box; scrollbar-color: ${DesignToken.scrollbar.color}; border-top: var(--m3e-divider-thickness, 1px) solid transparent; border-bottom: var(--m3e-divider-thickness, 1px) solid transparent; outline-color: ${FocusRingToken.color}; outline-width: ${FocusRingToken.thickness}; outline-offset: ${FocusRingToken.outwardOffset}; } :host([thin]) { scrollbar-width: ${DesignToken.scrollbar.thinWidth}; } :host(:not([thin])) { scrollbar-width: ${DesignToken.scrollbar.width}; } :host(:not(:focus-visible):is(:state(--above), :--above)) { border-top-color: var(--m3e-divider-color, ${DesignToken.color.outlineVariant}); } :host(:not(:focus-visible):is(:state(--below), :--below)) { border-bottom-color: var(--m3e-divider-color, ${DesignToken.color.outlineVariant}); } :host(:focus-visible) { outline-style: solid; animation: grow-shrink ${FocusRingToken.duration}; } @keyframes grow-shrink { 50% { outline-width: calc(${FocusRingToken.thickness} * ${FocusRingToken.growthFactor}); } } @media (forced-colors: active) { :host { border-top: var(--m3e-divider-thickness, 1px) solid Canvas; border-bottom: var(--m3e-divider-thickness, 1px) solid Canvas; } :host(:not(:focus-visible):is(:state(--above), :--above)) { border-top-color: GrayText; } :host(:not(:focus-visible):is(:state(--below), :--below)) { border-bottom-color: GrayText; } } @media (prefers-reduced-motion) { :host(:focus-visible) { animation: none; } }`;
4687
4701
  __decorate([property()], M3eScrollContainerElement.prototype, "dividers", void 0);
4688
4702
  __decorate([property({
4689
4703
  type: Boolean,
@@ -4732,20 +4746,20 @@ let M3eSlideElement = class M3eSlideElement extends AttachInternals(LitElement)
4732
4746
  /** @inheritdoc */
4733
4747
  connectedCallback() {
4734
4748
  super.connectedCallback();
4735
- addCustomState(this, "-no-animate");
4749
+ addCustomState(this, "--no-animate");
4736
4750
  }
4737
4751
  /** @inheritdoc */
4738
4752
  update(changedProperties) {
4739
4753
  super.update(changedProperties);
4740
4754
  if (changedProperties.has("selectedIndex")) {
4741
4755
  if (this.selectedIndex === null) {
4742
- addCustomState(this, "-no-animate");
4756
+ addCustomState(this, "--no-animate");
4743
4757
  }
4744
4758
  __classPrivateFieldGet(this, _M3eSlideElement_instances, "m", _M3eSlideElement_updateItems).call(this);
4745
- if (this.selectedIndex !== null && hasCustomState(this, "-no-animate")) {
4759
+ if (this.selectedIndex !== null && hasCustomState(this, "--no-animate")) {
4746
4760
  requestAnimationFrame(() => {
4747
4761
  if (this.selectedIndex !== null) {
4748
- deleteCustomState(this, "-no-animate");
4762
+ deleteCustomState(this, "--no-animate");
4749
4763
  }
4750
4764
  });
4751
4765
  }
@@ -4781,7 +4795,7 @@ _M3eSlideElement_updateItems = function _M3eSlideElement_updateItems() {
4781
4795
  };
4782
4796
  /** The styles of the element. */
4783
4797
  M3eSlideElement.styles = css`:host { display: flex; position: relative; overflow: hidden; } ::slotted(*) { width: 100%; top: 0; transition: ${unsafeCSS(`inset-inline-start var(--m3e-slide-animation-duration, ${DesignToken.motion.duration.long2}) ${DesignToken.motion.easing.standard},
4784
- visibility var(--m3e-slide-animation-duration, ${DesignToken.motion.duration.long2}) ${DesignToken.motion.easing.standard} allow-discrete`)}; } ::slotted(.-before), ::slotted(.-after) { visibility: hidden; position: absolute; } ::slotted(.-before) { inset-inline-start: -100%; } ::slotted(.-after) { inset-inline-start: 100%; } ::slotted(:not(.-before):not(.-after)) { position: relative; inset-inline-start: 0; } :host(:state(-no-animate)) ::slotted(*) { transition: none; } @media (prefers-reduced-motion) { ::slotted(*) { transition: none; } }`;
4798
+ visibility var(--m3e-slide-animation-duration, ${DesignToken.motion.duration.long2}) ${DesignToken.motion.easing.standard} allow-discrete`)}; } ::slotted(.-before), ::slotted(.-after) { visibility: hidden; position: absolute; } ::slotted(.-before) { inset-inline-start: -100%; } ::slotted(.-after) { inset-inline-start: 100%; } ::slotted(:not(.-before):not(.-after)) { position: relative; inset-inline-start: 0; } :host(:is(:state(--no-animate), :--no-animate)) ::slotted(*) { transition: none; } @media (prefers-reduced-motion) { ::slotted(*) { transition: none; } }`;
4785
4799
  __decorate([property({
4786
4800
  attribute: "selected-index",
4787
4801
  type: Number,
@@ -5221,5 +5235,5 @@ let M3eTextOverflowElement = class M3eTextOverflowElement extends LitElement {
5221
5235
  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; }`;
5222
5236
  M3eTextOverflowElement = __decorate([customElement("m3e-text-overflow")], M3eTextOverflowElement);
5223
5237
 
5224
- export { ActionElementBase, AnimationLoopController, AttachInternals, Checked, CheckedIndeterminate, ConstraintValidation, DesignToken, Dirty, Disabled, DisabledInteractive, EventAttribute, FocusController, Focusable, FormAssociated, FormSubmitter, HoverController, HtmlFor, InertController, IntersectionController, KeyboardClick, Labelled, LinkButton, LongPressController, M3eCollapsibleElement, M3eElevationElement, M3eFocusRingElement, M3ePseudoCheckboxElement, M3ePseudoRadioElement, M3eRippleElement, M3eScrollContainerElement, M3eSlideElement, M3eStateLayerElement, M3eTextHighlightElement, M3eTextOverflowElement, MutationController, PressedController, ReadOnly, ReconnectedCallback, Required, RequiredConstraintValidation, ResizeController, Role, ScrollController, ScrollLockController, Selected, SuppressInitialAnimation, Touched, VelocityTracker, Vertical, addCustomState, checkOrSelect, computeCssSize, computeLineCount, customElement, dateConverter, debounce, defaultValue, deleteCustomState, focusWhenReady, forcedColorsActive, formValue, generateClipPaths, getScrollbarWidth, getTextContent, guid, hasAssignedNodes, hasCustomState, hasKeys, interceptProperty, internals, isAttachInternalsMixin, isCheckedIndeterminateMixin, isCheckedMixin, isCheckedOrSelected, isCheckedOrSelectedMixin, isConstraintValidationMixin, isDirtyMixin, isDisabledInteractiveMixin, isDisabledMixin, isFormAssociatedMixin, isFormSubmitterMixin, isHtmlForMixin, isLabelledMixin, isLinkButtonMixin, isReadOnlyMixin, isRequiredConstraintValidationMixin, isRequiredMixin, isSelectedMixin, isTouchedMixin, isVerticalMixin, prefersReducedMotion, registerStyleSheet, renderPseudoLink, resolveElementById, resolveFragmentUrl, safeStyleMap, scrollIntoViewIfNeeded, setCustomState, spaceSeparatedStringConverter, updateLabels, validate, waitForUpgrade };
5238
+ export { ActionElementBase, AnimationLoopController, AttachInternals, Checked, CheckedIndeterminate, ConstraintValidation, DesignToken, Dirty, Disabled, DisabledInteractive, FocusController, Focusable, FormAssociated, FormSubmitter, HoverController, HtmlFor, InertController, IntersectionController, KeyboardClick, Labelled, LinkButton, LongPressController, M3eCollapsibleElement, M3eElevationElement, M3eFocusRingElement, M3ePseudoCheckboxElement, M3ePseudoRadioElement, M3eRippleElement, M3eScrollContainerElement, M3eSlideElement, M3eStateLayerElement, M3eTextHighlightElement, M3eTextOverflowElement, MutationController, PressedController, ReadOnly, ReconnectedCallback, Required, RequiredConstraintValidation, ResizeController, Role, ScrollController, ScrollLockController, Selected, SuppressInitialAnimation, Touched, VelocityTracker, Vertical, addCustomState, checkOrSelect, computeCssSize, computeLineCount, customElement, dateConverter, debounce, defaultValue, deleteCustomState, focusWhenReady, forcedColorsActive, formValue, generateClipPaths, getScrollbarWidth, getTextContent, guid, hasAssignedNodes, hasCustomState, hasKeys, interceptProperty, internals, isAttachInternalsMixin, isCheckedIndeterminateMixin, isCheckedMixin, isCheckedOrSelected, isCheckedOrSelectedMixin, isConstraintValidationMixin, isDirtyMixin, isDisabledInteractiveMixin, isDisabledMixin, isFormAssociatedMixin, isFormSubmitterMixin, isHtmlForMixin, isLabelledMixin, isLinkButtonMixin, isReadOnlyMixin, isRequiredConstraintValidationMixin, isRequiredMixin, isSelectedMixin, isTouchedMixin, isVerticalMixin, prefersReducedMotion, registerStyleSheet, renderPseudoLink, resolveElementById, resolveFragmentUrl, resumeAnimation, safeStyleMap, scrollIntoViewIfNeeded, setCustomState, spaceSeparatedStringConverter, updateLabels, validate, waitForUpgrade };
5225
5239
  //# sourceMappingURL=core.js.map