@m3e/web 2.1.0 → 2.1.2

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 (263) hide show
  1. package/dist/all.js +636 -1299
  2. package/dist/all.js.map +1 -1
  3. package/dist/all.min.js +54 -114
  4. package/dist/all.min.js.map +1 -1
  5. package/dist/app-bar.js +2 -34
  6. package/dist/app-bar.js.map +1 -1
  7. package/dist/app-bar.min.js +1 -1
  8. package/dist/app-bar.min.js.map +1 -1
  9. package/dist/autocomplete.js +17 -40
  10. package/dist/autocomplete.js.map +1 -1
  11. package/dist/autocomplete.min.js +1 -1
  12. package/dist/autocomplete.min.js.map +1 -1
  13. package/dist/avatar.js +1 -28
  14. package/dist/avatar.js.map +1 -1
  15. package/dist/avatar.min.js +1 -1
  16. package/dist/avatar.min.js.map +1 -1
  17. package/dist/badge.js +1 -39
  18. package/dist/badge.js.map +1 -1
  19. package/dist/badge.min.js +1 -1
  20. package/dist/badge.min.js.map +1 -1
  21. package/dist/bottom-sheet.js +22 -58
  22. package/dist/bottom-sheet.js.map +1 -1
  23. package/dist/bottom-sheet.min.js +1 -1
  24. package/dist/bottom-sheet.min.js.map +1 -1
  25. package/dist/button-group.js +2 -34
  26. package/dist/button-group.js.map +1 -1
  27. package/dist/button-group.min.js +1 -1
  28. package/dist/button-group.min.js.map +1 -1
  29. package/dist/button.js +2 -34
  30. package/dist/button.js.map +1 -1
  31. package/dist/button.min.js +1 -1
  32. package/dist/button.min.js.map +1 -1
  33. package/dist/card.js +4 -34
  34. package/dist/card.js.map +1 -1
  35. package/dist/card.min.js +1 -1
  36. package/dist/card.min.js.map +1 -1
  37. package/dist/checkbox.js +2 -34
  38. package/dist/checkbox.js.map +1 -1
  39. package/dist/checkbox.min.js +1 -1
  40. package/dist/checkbox.min.js.map +1 -1
  41. package/dist/chips.js +2 -40
  42. package/dist/chips.js.map +1 -1
  43. package/dist/chips.min.js +1 -1
  44. package/dist/chips.min.js.map +1 -1
  45. package/dist/core-a11y.js +1 -39
  46. package/dist/core-a11y.js.map +1 -1
  47. package/dist/core-a11y.min.js +4 -4
  48. package/dist/core-a11y.min.js.map +1 -1
  49. package/dist/core-anchoring.js +164 -177
  50. package/dist/core-anchoring.js.map +1 -1
  51. package/dist/core-anchoring.min.js +1 -1
  52. package/dist/core-anchoring.min.js.map +1 -1
  53. package/dist/core-bidi.js +1 -31
  54. package/dist/core-bidi.js.map +1 -1
  55. package/dist/core-bidi.min.js +2 -3
  56. package/dist/core-bidi.min.js.map +1 -1
  57. package/dist/core.js +84 -43
  58. package/dist/core.js.map +1 -1
  59. package/dist/core.min.js +1 -1
  60. package/dist/core.min.js.map +1 -1
  61. package/dist/css-custom-data.json +492 -487
  62. package/dist/custom-elements.json +6233 -4722
  63. package/dist/dialog.js +3 -41
  64. package/dist/dialog.js.map +1 -1
  65. package/dist/dialog.min.js +1 -1
  66. package/dist/dialog.min.js.map +1 -1
  67. package/dist/divider.js +1 -28
  68. package/dist/divider.js.map +1 -1
  69. package/dist/divider.min.js +1 -1
  70. package/dist/divider.min.js.map +1 -1
  71. package/dist/drawer-container.js +18 -48
  72. package/dist/drawer-container.js.map +1 -1
  73. package/dist/drawer-container.min.js +1 -1
  74. package/dist/drawer-container.min.js.map +1 -1
  75. package/dist/expansion-panel.js +8 -41
  76. package/dist/expansion-panel.js.map +1 -1
  77. package/dist/expansion-panel.min.js +1 -1
  78. package/dist/expansion-panel.min.js.map +1 -1
  79. package/dist/fab-menu.js +3 -47
  80. package/dist/fab-menu.js.map +1 -1
  81. package/dist/fab-menu.min.js +1 -1
  82. package/dist/fab-menu.min.js.map +1 -1
  83. package/dist/fab.js +1 -33
  84. package/dist/fab.js.map +1 -1
  85. package/dist/fab.min.js +1 -1
  86. package/dist/fab.min.js.map +1 -1
  87. package/dist/form-field.js +19 -49
  88. package/dist/form-field.js.map +1 -1
  89. package/dist/form-field.min.js +3 -4
  90. package/dist/form-field.min.js.map +1 -1
  91. package/dist/heading.js +1 -28
  92. package/dist/heading.js.map +1 -1
  93. package/dist/heading.min.js +1 -1
  94. package/dist/heading.min.js.map +1 -1
  95. package/dist/html-custom-data.json +223 -202
  96. package/dist/icon-button.js +2 -34
  97. package/dist/icon-button.js.map +1 -1
  98. package/dist/icon-button.min.js +1 -1
  99. package/dist/icon-button.min.js.map +1 -1
  100. package/dist/icon.js +1 -28
  101. package/dist/icon.js.map +1 -1
  102. package/dist/icon.min.js +1 -1
  103. package/dist/icon.min.js.map +1 -1
  104. package/dist/index.js.map +1 -1
  105. package/dist/index.min.js +7 -0
  106. package/dist/index.min.js.map +1 -0
  107. package/dist/list.js +17 -46
  108. package/dist/list.js.map +1 -1
  109. package/dist/list.min.js +1 -1
  110. package/dist/list.min.js.map +1 -1
  111. package/dist/loading-indicator.js +8 -31
  112. package/dist/loading-indicator.js.map +1 -1
  113. package/dist/loading-indicator.min.js +1 -1
  114. package/dist/loading-indicator.min.js.map +1 -1
  115. package/dist/menu.js +3 -47
  116. package/dist/menu.js.map +1 -1
  117. package/dist/menu.min.js +1 -1
  118. package/dist/menu.min.js.map +1 -1
  119. package/dist/nav-bar.js +3 -41
  120. package/dist/nav-bar.js.map +1 -1
  121. package/dist/nav-bar.min.js +1 -1
  122. package/dist/nav-bar.min.js.map +1 -1
  123. package/dist/nav-menu.js +2 -40
  124. package/dist/nav-menu.js.map +1 -1
  125. package/dist/nav-menu.min.js +1 -1
  126. package/dist/nav-menu.min.js.map +1 -1
  127. package/dist/nav-rail.js +1 -33
  128. package/dist/nav-rail.js.map +1 -1
  129. package/dist/nav-rail.min.js +1 -1
  130. package/dist/nav-rail.min.js.map +1 -1
  131. package/dist/option.js +3 -59
  132. package/dist/option.js.map +1 -1
  133. package/dist/option.min.js +1 -1
  134. package/dist/option.min.js.map +1 -1
  135. package/dist/paginator.js +2 -34
  136. package/dist/paginator.js.map +1 -1
  137. package/dist/paginator.min.js +2 -3
  138. package/dist/paginator.min.js.map +1 -1
  139. package/dist/progress-indicator.js +41 -63
  140. package/dist/progress-indicator.js.map +1 -1
  141. package/dist/progress-indicator.min.js +32 -32
  142. package/dist/progress-indicator.min.js.map +1 -1
  143. package/dist/radio-group.js +1 -39
  144. package/dist/radio-group.js.map +1 -1
  145. package/dist/radio-group.min.js +1 -1
  146. package/dist/radio-group.min.js.map +1 -1
  147. package/dist/segmented-button.js +2 -40
  148. package/dist/segmented-button.js.map +1 -1
  149. package/dist/segmented-button.min.js +1 -1
  150. package/dist/segmented-button.min.js.map +1 -1
  151. package/dist/select.js +16 -40
  152. package/dist/select.js.map +1 -1
  153. package/dist/select.min.js +1 -1
  154. package/dist/select.min.js.map +1 -1
  155. package/dist/shape.js +1 -28
  156. package/dist/shape.js.map +1 -1
  157. package/dist/shape.min.js +1 -1
  158. package/dist/shape.min.js.map +1 -1
  159. package/dist/slide-group.js +9 -42
  160. package/dist/slide-group.js.map +1 -1
  161. package/dist/slide-group.min.js +1 -1
  162. package/dist/slide-group.min.js.map +1 -1
  163. package/dist/slider.js +1 -39
  164. package/dist/slider.js.map +1 -1
  165. package/dist/slider.min.js +1 -1
  166. package/dist/slider.min.js.map +1 -1
  167. package/dist/snackbar.js +2 -40
  168. package/dist/snackbar.js.map +1 -1
  169. package/dist/snackbar.min.js +1 -1
  170. package/dist/snackbar.min.js.map +1 -1
  171. package/dist/split-button.js +1 -39
  172. package/dist/split-button.js.map +1 -1
  173. package/dist/split-button.min.js +1 -1
  174. package/dist/split-button.min.js.map +1 -1
  175. package/dist/src/autocomplete/AutocompleteElement.d.ts +6 -0
  176. package/dist/src/autocomplete/AutocompleteElement.d.ts.map +1 -1
  177. package/dist/src/bottom-sheet/BottomSheetElement.d.ts +3 -3
  178. package/dist/src/bottom-sheet/BottomSheetElement.d.ts.map +1 -1
  179. package/dist/src/card/CardElement.d.ts +1 -0
  180. package/dist/src/card/CardElement.d.ts.map +1 -1
  181. package/dist/src/card/styles/CardVariantToken.d.ts +1 -1
  182. package/dist/src/card/styles/CardVariantToken.d.ts.map +1 -1
  183. package/dist/src/core/anchoring/FloatingPanelElement.d.ts +6 -3
  184. package/dist/src/core/anchoring/FloatingPanelElement.d.ts.map +1 -1
  185. package/dist/src/core/anchoring/FloatingPanelScrollStrategy.d.ts +3 -0
  186. package/dist/src/core/anchoring/FloatingPanelScrollStrategy.d.ts.map +1 -0
  187. package/dist/src/core/anchoring/index.d.ts +1 -0
  188. package/dist/src/core/anchoring/index.d.ts.map +1 -1
  189. package/dist/src/core/shared/mixins/AttachInternals.d.ts.map +1 -1
  190. package/dist/src/core/shared/mixins/ReconnectedCallback.d.ts +15 -0
  191. package/dist/src/core/shared/mixins/ReconnectedCallback.d.ts.map +1 -0
  192. package/dist/src/core/shared/mixins/SuppressInitialAnimation.d.ts +11 -0
  193. package/dist/src/core/shared/mixins/SuppressInitialAnimation.d.ts.map +1 -0
  194. package/dist/src/core/shared/mixins/index.d.ts +2 -0
  195. package/dist/src/core/shared/mixins/index.d.ts.map +1 -1
  196. package/dist/src/drawer-container/DrawerContainerElement.d.ts +4 -2
  197. package/dist/src/drawer-container/DrawerContainerElement.d.ts.map +1 -1
  198. package/dist/src/expansion-panel/ExpansionPanelElement.d.ts +3 -1
  199. package/dist/src/expansion-panel/ExpansionPanelElement.d.ts.map +1 -1
  200. package/dist/src/fab-menu/FabMenuElement.d.ts +1 -3
  201. package/dist/src/fab-menu/FabMenuElement.d.ts.map +1 -1
  202. package/dist/src/form-field/FormFieldElement.d.ts +4 -2
  203. package/dist/src/form-field/FormFieldElement.d.ts.map +1 -1
  204. package/dist/src/list/ActionListElement.d.ts.map +1 -1
  205. package/dist/src/list/ListItemElement.d.ts +3 -1
  206. package/dist/src/list/ListItemElement.d.ts.map +1 -1
  207. package/dist/src/loading-indicator/LoadingIndicatorElement.d.ts +3 -1
  208. package/dist/src/loading-indicator/LoadingIndicatorElement.d.ts.map +1 -1
  209. package/dist/src/menu/MenuElement.d.ts +1 -3
  210. package/dist/src/menu/MenuElement.d.ts.map +1 -1
  211. package/dist/src/nav-bar/NavBarElement.d.ts +1 -1
  212. package/dist/src/nav-bar/NavBarElement.d.ts.map +1 -1
  213. package/dist/src/option/OptionPanelElement.d.ts +0 -4
  214. package/dist/src/option/OptionPanelElement.d.ts.map +1 -1
  215. package/dist/src/progress-indicator/CircularProgressIndicatorElement.d.ts +2 -0
  216. package/dist/src/progress-indicator/CircularProgressIndicatorElement.d.ts.map +1 -1
  217. package/dist/src/progress-indicator/LinearProgressIndicatorElement.d.ts +2 -0
  218. package/dist/src/progress-indicator/LinearProgressIndicatorElement.d.ts.map +1 -1
  219. package/dist/src/progress-indicator/ProgressElementIndicatorBase.d.ts +1 -1
  220. package/dist/src/progress-indicator/ProgressElementIndicatorBase.d.ts.map +1 -1
  221. package/dist/src/select/SelectElement.d.ts +6 -0
  222. package/dist/src/select/SelectElement.d.ts.map +1 -1
  223. package/dist/src/slide-group/SlideGroupElement.d.ts +5 -1
  224. package/dist/src/slide-group/SlideGroupElement.d.ts.map +1 -1
  225. package/dist/src/stepper/StepperElement.d.ts +1 -1
  226. package/dist/src/stepper/StepperElement.d.ts.map +1 -1
  227. package/dist/src/toc/TocElement.d.ts +1 -1
  228. package/dist/src/toc/TocElement.d.ts.map +1 -1
  229. package/dist/src/tooltip/TooltipElementBase.d.ts +3 -1
  230. package/dist/src/tooltip/TooltipElementBase.d.ts.map +1 -1
  231. package/dist/stepper.js +3 -41
  232. package/dist/stepper.js.map +1 -1
  233. package/dist/stepper.min.js +1 -1
  234. package/dist/stepper.min.js.map +1 -1
  235. package/dist/switch.js +1 -33
  236. package/dist/switch.js.map +1 -1
  237. package/dist/switch.min.js +1 -1
  238. package/dist/switch.min.js.map +1 -1
  239. package/dist/tabs.js +1 -39
  240. package/dist/tabs.js.map +1 -1
  241. package/dist/tabs.min.js +1 -1
  242. package/dist/tabs.min.js.map +1 -1
  243. package/dist/textarea-autosize.js +1 -39
  244. package/dist/textarea-autosize.js.map +1 -1
  245. package/dist/textarea-autosize.min.js +2 -3
  246. package/dist/textarea-autosize.min.js.map +1 -1
  247. package/dist/theme.js +1 -39
  248. package/dist/theme.js.map +1 -1
  249. package/dist/theme.min.js +19 -19
  250. package/dist/theme.min.js.map +1 -1
  251. package/dist/toc.js +4 -42
  252. package/dist/toc.js.map +1 -1
  253. package/dist/toc.min.js +1 -1
  254. package/dist/toc.min.js.map +1 -1
  255. package/dist/toolbar.js +1 -39
  256. package/dist/toolbar.js.map +1 -1
  257. package/dist/toolbar.min.js +1 -1
  258. package/dist/toolbar.min.js.map +1 -1
  259. package/dist/tooltip.js +15 -46
  260. package/dist/tooltip.js.map +1 -1
  261. package/dist/tooltip.min.js +1 -1
  262. package/dist/tooltip.min.js.map +1 -1
  263. package/package.json +3 -2
@@ -3,5 +3,5 @@
3
3
  * Copyright (c) 2025 matraic
4
4
  * See LICENSE file in the project root for full license text.
5
5
  */
6
- import{LitElement as e,html as t,css as o,unsafeCSS as r,nothing as a,isServer as n}from"lit";import{Role as i,DesignToken as s,customElement as c,prefersReducedMotion as l}from"@m3e/web/core";import{property as d}from"lit/decorators.js";import"@m3e/web/button";import"@m3e/web/icon-button";function m(e,t,o,r){var a,n=arguments.length,i=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,o,r);else for(var s=e.length-1;s>=0;s--)(a=e[s])&&(i=(n<3?a(i):n>3?a(t,o,i):a(t,o))||i);return n>3&&i&&Object.defineProperty(t,o,i),i}function b(e,t,o,r){if("a"===o&&!r)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?e!==t||!r:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===o?r:"a"===o?r.call(e):r?r.value:t.get(e)}function p(e,t,o,r,a){if("m"===r)throw new TypeError("Private method is not writable");if("a"===r&&!a)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?e!==t||!a:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===r?a.call(e,o):a?a.value=o:t.set(e,o),o}var u,h,v,f,g,y,k,x,w;"function"==typeof SuppressedError&&SuppressedError;let $=w=class extends(i(e,"status")){constructor(){super(...arguments),u.add(this),h.set(this,-1),v.set(this,!1),f.set(this,e=>b(this,u,"m",x).call(this,e)),this.duration=3e3,this.action="",this.dismissible=!1,this.closeLabel="Close"}static get current(){return w.__current}get isActionTaken(){return b(this,v,"f")}connectedCallback(){super.connectedCallback(),this.addEventListener("beforetoggle",b(this,f,"f")),this.setAttribute("popover","manual"),this.ariaLive="polite"}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("beforetoggle",b(this,f,"f"))}render(){return t`<div class="base"><span class="supporting-text"><slot></slot></span>${b(this,u,"m",g).call(this)} ${b(this,u,"m",y).call(this)}</div>`}updated(e){super.updated(e),this.style.setProperty("--_snackbar-height",this.getBoundingClientRect().height/.8+"px")}};h=new WeakMap,v=new WeakMap,f=new WeakMap,u=new WeakSet,g=function(){return this.action?t`<m3e-button @click="${b(this,u,"m",k)}">${this.action}</m3e-button>`:a},y=function(){return this.dismissible?t`<m3e-icon-button aria-label="${this.closeLabel}" @click="${this.hidePopover}"><slot name="close-icon"><svg class="close-icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z"/></svg></slot></m3e-icon-button>`:a},k=function(){p(this,v,!0,"f"),this.hidePopover()},x=function(e){"open"==e.newState?(w.__current?.hidePopover(),w.__current=this,this.duration>0&&p(this,h,setTimeout(()=>this.hidePopover(),this.duration),"f")):(w.__current===this&&(w.__current=null),clearTimeout(b(this,h,"f")))},(()=>{if("undefined"!=typeof window){const e=new CSSStyleSheet;e.replaceSync(o`m3e-snackbar { margin-inline: auto; }`.toString()),document.adoptedStyleSheets=[...document.adoptedStyleSheets,e]}})(),$.styles=o`:host { position: fixed; top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem)); display: inline-flex; align-items: center; min-width: var(--m3e-snackbar-min-width, 21.5rem); max-width: var(--m3e-snackbar-max-width, 42rem); visibility: hidden; border: none; margin: 0; padding: 0; opacity: 0; transform: scale(0.8); transition: ${r(`opacity ${s.motion.duration.short3} ${s.motion.easing.standard}, \n transform ${s.motion.duration.short3} ${s.motion.easing.standard}, \n overlay ${s.motion.duration.short3} ${s.motion.easing.standard} allow-discrete,\n visibility ${s.motion.duration.short3} ${s.motion.easing.standard} allow-discrete`)}; } :host::backdrop { background-color: transparent; } :host(:popover-open) { visibility: visible; opacity: 1; transform: scale(1); } @starting-style { :host(:popover-open) { opacity: 0; transform: scale(0.8); } } .base { display: inline-flex; align-items: center; flex: 1 1 auto; box-sizing: border-box; padding: var(--m3e-snackbar-padding, 0 1rem 0 1rem); border-radius: var(--m3e-snackbar-container-shape, ${s.shape.corner.extraSmall}); background-color: var(--m3e-snackbar-container-color, ${s.color.inverseSurface}); font-size: var(--m3e-snackbar-supporting-text-font-size, ${s.typescale.standard.label.large.fontSize}); font-weight: var( --m3e-snackbar-supporting-text-font-weight, ${s.typescale.standard.label.large.fontWeight} ); line-height: var( --m3e-snackbar-supporting-text-line-height, ${s.typescale.standard.label.large.lineHeight} ); letter-spacing: var( --m3e-snackbar-supporting-text-tracking, ${s.typescale.standard.label.large.tracking} ); color: var(--m3e-snackbar-supporting-text-color, ${s.color.inverseOnSurface}); --m3e-text-button-label-text-color: var(--m3e-snackbar-action-text-color, ${s.color.inversePrimary}); --m3e-text-button-hover-label-text-color: var( --m3e-snackbar-action-text-color, ${s.color.inversePrimary} ); --m3e-text-button-hover-state-layer-color: var( --m3e-snackbar-action-text-color, ${s.color.inversePrimary} ); --m3e-text-button-focus-label-text-color: var( --m3e-snackbar-action-text-color, ${s.color.inversePrimary} ); --m3e-text-button-focus-state-layer-color: var( --m3e-snackbar-action-text-color, ${s.color.inversePrimary} ); --m3e-text-button-pressed-label-text-color: var( --m3e-snackbar-action-text-color, ${s.color.inversePrimary} ); --m3e-text-button-pressed-state-layer-color: var( --m3e-snackbar-action-text-color, ${s.color.inversePrimary} ); --m3e-standard-icon-button-icon-color: var( --m3e-snackbar-close-icon-color, ${s.color.inverseOnSurface} ); --m3e-standard-icon-button-hover-icon-color: var( --m3e-snackbar-close-icon-color, ${s.color.inverseOnSurface} ); --m3e-standard-icon-button-hover-state-layer-color: var( --m3e-snackbar-close-icon-color, ${s.color.inverseOnSurface} ); --m3e-standard-icon-button-focus-icon-color: var( --m3e-snackbar-close-icon-color, ${s.color.inverseOnSurface} ); --m3e-standard-icon-button-focus-state-layer-color: var( --m3e-snackbar-close-icon-color, ${s.color.inverseOnSurface} ); --m3e-standard-icon-button-pressed-icon-color: var( --m3e-snackbar-close-icon-color, ${s.color.inverseOnSurface} ); --m3e-standard-icon-button-pressed-state-layer-color: var( --m3e-snackbar-close-icon-color, ${s.color.inverseOnSurface} ); } :host([dismissible]) .base { padding-inline-end: 0.5rem; } .supporting-text { flex: 1 1 auto; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-clamp: 2; margin-block: var(--m3e-snackbar-supporting-text-margin-block, 0.875rem); } ::slotted([slot="close-icon"]), .close-icon { width: 1em; font-size: var(--m3e-icon-button-icon-size, 1.5rem) !important; } @media (forced-colors: active) { :host { background-color: Canvas; color: CanvasText; border-radius: ${s.shape.corner.small}; box-sizing: border-box; outline: 1px solid CanvasText; } }`,$.__current=null,m([d({type:Number})],$.prototype,"duration",void 0),m([d()],$.prototype,"action",void 0),m([d({type:Boolean,reflect:!0})],$.prototype,"dismissible",void 0),m([d({attribute:"close-label"})],$.prototype,"closeLabel",void 0),$=w=m([c("m3e-snackbar")],$);class S{static open(e,t,o,r){if(n)return;const a=document.createElement("m3e-snackbar");let i;a.append(document.createTextNode(e)),"string"==typeof t?a.action=t:"boolean"==typeof t?a.dismissible=t:i=t,"boolean"==typeof o?a.dismissible=o:i=o,r&&(i=r),void 0!==i?.duration&&(a.duration=i.duration),i?.closeLabel&&(a.closeLabel=i.closeLabel),a.addEventListener("toggle",e=>{"closed"===e.newState&&(l()?a.remove():a.addEventListener("transitionend",()=>a.remove(),{once:!0}),a.isActionTaken&&i?.actionCallback?.())}),(document.querySelector("m3e-theme")??document.body).append(a),a.showPopover()}static dismiss(){$.current?.hidePopover()}}globalThis.M3eSnackbar=S;export{S as M3eSnackbar,$ as M3eSnackbarElement};
6
+ import{LitElement as e,html as t,nothing as o,css as r,unsafeCSS as a,isServer as n}from"lit";import{Role as i,DesignToken as s,customElement as c,prefersReducedMotion as l}from"@m3e/web/core";import{__classPrivateFieldGet as d,__classPrivateFieldSet as m,__decorate as b}from"tslib";import{property as p}from"lit/decorators.js";import"@m3e/web/button";import"@m3e/web/icon-button";var u,h,v,g,f,k,x,y,$;let w=$=class extends(i(e,"status")){constructor(){super(...arguments),u.add(this),h.set(this,-1),v.set(this,!1),g.set(this,e=>d(this,u,"m",y).call(this,e)),this.duration=3e3,this.action="",this.dismissible=!1,this.closeLabel="Close"}static get current(){return $.__current}get isActionTaken(){return d(this,v,"f")}connectedCallback(){super.connectedCallback(),this.addEventListener("beforetoggle",d(this,g,"f")),this.setAttribute("popover","manual"),this.ariaLive="polite"}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("beforetoggle",d(this,g,"f"))}render(){return t`<div class="base"><span class="supporting-text"><slot></slot></span>${d(this,u,"m",f).call(this)} ${d(this,u,"m",k).call(this)}</div>`}updated(e){super.updated(e),this.style.setProperty("--_snackbar-height",this.getBoundingClientRect().height/.8+"px")}};h=new WeakMap,v=new WeakMap,g=new WeakMap,u=new WeakSet,f=function(){return this.action?t`<m3e-button @click="${d(this,u,"m",x)}">${this.action}</m3e-button>`:o},k=function(){return this.dismissible?t`<m3e-icon-button aria-label="${this.closeLabel}" @click="${this.hidePopover}"><slot name="close-icon"><svg class="close-icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z"/></svg></slot></m3e-icon-button>`:o},x=function(){m(this,v,!0,"f"),this.hidePopover()},y=function(e){"open"==e.newState?($.__current?.hidePopover(),$.__current=this,this.duration>0&&m(this,h,setTimeout(()=>this.hidePopover(),this.duration),"f")):($.__current===this&&($.__current=null),clearTimeout(d(this,h,"f")))},(()=>{if("undefined"!=typeof window){const e=new CSSStyleSheet;e.replaceSync(r`m3e-snackbar { margin-inline: auto; }`.toString()),document.adoptedStyleSheets=[...document.adoptedStyleSheets,e]}})(),w.styles=r`:host { position: fixed; top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem)); display: inline-flex; align-items: center; min-width: var(--m3e-snackbar-min-width, 21.5rem); max-width: var(--m3e-snackbar-max-width, 42rem); visibility: hidden; border: none; margin: 0; padding: 0; opacity: 0; transform: scale(0.8); transition: ${a(`opacity ${s.motion.duration.short3} ${s.motion.easing.standard}, \n transform ${s.motion.duration.short3} ${s.motion.easing.standard}, \n overlay ${s.motion.duration.short3} ${s.motion.easing.standard} allow-discrete,\n visibility ${s.motion.duration.short3} ${s.motion.easing.standard} allow-discrete`)}; } :host::backdrop { background-color: transparent; } :host(:popover-open) { visibility: visible; opacity: 1; transform: scale(1); } @starting-style { :host(:popover-open) { opacity: 0; transform: scale(0.8); } } .base { display: inline-flex; align-items: center; flex: 1 1 auto; box-sizing: border-box; padding: var(--m3e-snackbar-padding, 0 1rem 0 1rem); border-radius: var(--m3e-snackbar-container-shape, ${s.shape.corner.extraSmall}); background-color: var(--m3e-snackbar-container-color, ${s.color.inverseSurface}); font-size: var(--m3e-snackbar-supporting-text-font-size, ${s.typescale.standard.label.large.fontSize}); font-weight: var( --m3e-snackbar-supporting-text-font-weight, ${s.typescale.standard.label.large.fontWeight} ); line-height: var( --m3e-snackbar-supporting-text-line-height, ${s.typescale.standard.label.large.lineHeight} ); letter-spacing: var( --m3e-snackbar-supporting-text-tracking, ${s.typescale.standard.label.large.tracking} ); color: var(--m3e-snackbar-supporting-text-color, ${s.color.inverseOnSurface}); --m3e-text-button-label-text-color: var(--m3e-snackbar-action-text-color, ${s.color.inversePrimary}); --m3e-text-button-hover-label-text-color: var( --m3e-snackbar-action-text-color, ${s.color.inversePrimary} ); --m3e-text-button-hover-state-layer-color: var( --m3e-snackbar-action-text-color, ${s.color.inversePrimary} ); --m3e-text-button-focus-label-text-color: var( --m3e-snackbar-action-text-color, ${s.color.inversePrimary} ); --m3e-text-button-focus-state-layer-color: var( --m3e-snackbar-action-text-color, ${s.color.inversePrimary} ); --m3e-text-button-pressed-label-text-color: var( --m3e-snackbar-action-text-color, ${s.color.inversePrimary} ); --m3e-text-button-pressed-state-layer-color: var( --m3e-snackbar-action-text-color, ${s.color.inversePrimary} ); --m3e-standard-icon-button-icon-color: var( --m3e-snackbar-close-icon-color, ${s.color.inverseOnSurface} ); --m3e-standard-icon-button-hover-icon-color: var( --m3e-snackbar-close-icon-color, ${s.color.inverseOnSurface} ); --m3e-standard-icon-button-hover-state-layer-color: var( --m3e-snackbar-close-icon-color, ${s.color.inverseOnSurface} ); --m3e-standard-icon-button-focus-icon-color: var( --m3e-snackbar-close-icon-color, ${s.color.inverseOnSurface} ); --m3e-standard-icon-button-focus-state-layer-color: var( --m3e-snackbar-close-icon-color, ${s.color.inverseOnSurface} ); --m3e-standard-icon-button-pressed-icon-color: var( --m3e-snackbar-close-icon-color, ${s.color.inverseOnSurface} ); --m3e-standard-icon-button-pressed-state-layer-color: var( --m3e-snackbar-close-icon-color, ${s.color.inverseOnSurface} ); } :host([dismissible]) .base { padding-inline-end: 0.5rem; } .supporting-text { flex: 1 1 auto; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-clamp: 2; margin-block: var(--m3e-snackbar-supporting-text-margin-block, 0.875rem); } ::slotted([slot="close-icon"]), .close-icon { width: 1em; font-size: var(--m3e-icon-button-icon-size, 1.5rem) !important; } @media (forced-colors: active) { :host { background-color: Canvas; color: CanvasText; border-radius: ${s.shape.corner.small}; box-sizing: border-box; outline: 1px solid CanvasText; } }`,w.__current=null,b([p({type:Number})],w.prototype,"duration",void 0),b([p()],w.prototype,"action",void 0),b([p({type:Boolean,reflect:!0})],w.prototype,"dismissible",void 0),b([p({attribute:"close-label"})],w.prototype,"closeLabel",void 0),w=$=b([c("m3e-snackbar")],w);class S{static open(e,t,o,r){if(n)return;const a=document.createElement("m3e-snackbar");let i;a.append(document.createTextNode(e)),"string"==typeof t?a.action=t:"boolean"==typeof t?a.dismissible=t:i=t,"boolean"==typeof o?a.dismissible=o:i=o,r&&(i=r),void 0!==i?.duration&&(a.duration=i.duration),i?.closeLabel&&(a.closeLabel=i.closeLabel),a.addEventListener("toggle",e=>{"closed"===e.newState&&(l()?a.remove():a.addEventListener("transitionend",()=>a.remove(),{once:!0}),a.isActionTaken&&i?.actionCallback?.())}),(document.querySelector("m3e-theme")??document.body).append(a),a.showPopover()}static dismiss(){w.current?.hidePopover()}}globalThis.M3eSnackbar=S;export{S as M3eSnackbar,w as M3eSnackbarElement};
7
7
  //# sourceMappingURL=snackbar.min.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"snackbar.min.js","sources":["../../../node_modules/tslib/tslib.es6.js","../../src/snackbar/SnackbarElement.ts","../../src/snackbar/Snackbar.ts"],"sourcesContent":["/******************************************************************************\r\nCopyright (c) Microsoft Corporation.\r\n\r\nPermission to use, copy, modify, and/or distribute this software for any\r\npurpose with or without fee is hereby granted.\r\n\r\nTHE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\r\nREGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY\r\nAND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\r\nINDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM\r\nLOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR\r\nOTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR\r\nPERFORMANCE OF THIS SOFTWARE.\r\n***************************************************************************** */\r\n/* global Reflect, Promise, SuppressedError, Symbol, Iterator */\r\n\r\nvar extendStatics = function(d, b) {\r\n extendStatics = Object.setPrototypeOf ||\r\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\r\n return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n if (typeof b !== \"function\" && b !== null)\r\n throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\r\n extendStatics(d, b);\r\n function __() { this.constructor = d; }\r\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n __assign = Object.assign || function __assign(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n }\r\n return t;\r\n }\r\n return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n var t = {};\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n t[p] = s[p];\r\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\r\n if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\r\n t[p[i]] = s[p[i]];\r\n }\r\n return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __esDecorate(ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {\r\n function accept(f) { if (f !== void 0 && typeof f !== \"function\") throw new TypeError(\"Function expected\"); return f; }\r\n var kind = contextIn.kind, key = kind === \"getter\" ? \"get\" : kind === \"setter\" ? \"set\" : \"value\";\r\n var target = !descriptorIn && ctor ? contextIn[\"static\"] ? ctor : ctor.prototype : null;\r\n var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});\r\n var _, done = false;\r\n for (var i = decorators.length - 1; i >= 0; i--) {\r\n var context = {};\r\n for (var p in contextIn) context[p] = p === \"access\" ? {} : contextIn[p];\r\n for (var p in contextIn.access) context.access[p] = contextIn.access[p];\r\n context.addInitializer = function (f) { if (done) throw new TypeError(\"Cannot add initializers after decoration has completed\"); extraInitializers.push(accept(f || null)); };\r\n var result = (0, decorators[i])(kind === \"accessor\" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);\r\n if (kind === \"accessor\") {\r\n if (result === void 0) continue;\r\n if (result === null || typeof result !== \"object\") throw new TypeError(\"Object expected\");\r\n if (_ = accept(result.get)) descriptor.get = _;\r\n if (_ = accept(result.set)) descriptor.set = _;\r\n if (_ = accept(result.init)) initializers.unshift(_);\r\n }\r\n else if (_ = accept(result)) {\r\n if (kind === \"field\") initializers.unshift(_);\r\n else descriptor[key] = _;\r\n }\r\n }\r\n if (target) Object.defineProperty(target, contextIn.name, descriptor);\r\n done = true;\r\n};\r\n\r\nexport function __runInitializers(thisArg, initializers, value) {\r\n var useValue = arguments.length > 2;\r\n for (var i = 0; i < initializers.length; i++) {\r\n value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);\r\n }\r\n return useValue ? value : void 0;\r\n};\r\n\r\nexport function __propKey(x) {\r\n return typeof x === \"symbol\" ? x : \"\".concat(x);\r\n};\r\n\r\nexport function __setFunctionName(f, name, prefix) {\r\n if (typeof name === \"symbol\") name = name.description ? \"[\".concat(name.description, \"]\") : \"\";\r\n return Object.defineProperty(f, \"name\", { configurable: true, value: prefix ? \"\".concat(prefix, \" \", name) : name });\r\n};\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n return new (P || (P = Promise))(function (resolve, reject) {\r\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === \"function\" ? Iterator : Object).prototype);\r\n return g.next = verb(0), g[\"throw\"] = verb(1), g[\"return\"] = verb(2), typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n function verb(n) { return function (v) { return step([n, v]); }; }\r\n function step(op) {\r\n if (f) throw new TypeError(\"Generator is already executing.\");\r\n while (g && (g = 0, op[0] && (_ = 0)), _) try {\r\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n if (y = 0, t) op = [op[0] & 2, t.value];\r\n switch (op[0]) {\r\n case 0: case 1: t = op; break;\r\n case 4: _.label++; return { value: op[1], done: false };\r\n case 5: _.label++; y = op[1]; op = [0]; continue;\r\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n default:\r\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n if (t[2]) _.ops.pop();\r\n _.trys.pop(); continue;\r\n }\r\n op = body.call(thisArg, _);\r\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n }\r\n}\r\n\r\nexport var __createBinding = Object.create ? (function(o, m, k, k2) {\r\n if (k2 === undefined) k2 = k;\r\n var desc = Object.getOwnPropertyDescriptor(m, k);\r\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\r\n desc = { enumerable: true, get: function() { return m[k]; } };\r\n }\r\n Object.defineProperty(o, k2, desc);\r\n}) : (function(o, m, k, k2) {\r\n if (k2 === undefined) k2 = k;\r\n o[k2] = m[k];\r\n});\r\n\r\nexport function __exportStar(m, o) {\r\n for (var p in m) if (p !== \"default\" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p);\r\n}\r\n\r\nexport function __values(o) {\r\n var s = typeof Symbol === \"function\" && Symbol.iterator, m = s && o[s], i = 0;\r\n if (m) return m.call(o);\r\n if (o && typeof o.length === \"number\") return {\r\n next: function () {\r\n if (o && i >= o.length) o = void 0;\r\n return { value: o && o[i++], done: !o };\r\n }\r\n };\r\n throw new TypeError(s ? \"Object is not iterable.\" : \"Symbol.iterator is not defined.\");\r\n}\r\n\r\nexport function __read(o, n) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n if (!m) return o;\r\n var i = m.call(o), r, ar = [], e;\r\n try {\r\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n }\r\n catch (error) { e = { error: error }; }\r\n finally {\r\n try {\r\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n }\r\n finally { if (e) throw e.error; }\r\n }\r\n return ar;\r\n}\r\n\r\n/** @deprecated */\r\nexport function __spread() {\r\n for (var ar = [], i = 0; i < arguments.length; i++)\r\n ar = ar.concat(__read(arguments[i]));\r\n return ar;\r\n}\r\n\r\n/** @deprecated */\r\nexport function __spreadArrays() {\r\n for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;\r\n for (var r = Array(s), k = 0, i = 0; i < il; i++)\r\n for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)\r\n r[k] = a[j];\r\n return r;\r\n}\r\n\r\nexport function __spreadArray(to, from, pack) {\r\n if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\r\n if (ar || !(i in from)) {\r\n if (!ar) ar = Array.prototype.slice.call(from, 0, i);\r\n ar[i] = from[i];\r\n }\r\n }\r\n return to.concat(ar || Array.prototype.slice.call(from));\r\n}\r\n\r\nexport function __await(v) {\r\n return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n return i = Object.create((typeof AsyncIterator === \"function\" ? AsyncIterator : Object).prototype), verb(\"next\"), verb(\"throw\"), verb(\"return\", awaitReturn), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n function awaitReturn(f) { return function (v) { return Promise.resolve(v).then(f, reject); }; }\r\n function verb(n, f) { if (g[n]) { i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; if (f) i[n] = f(i[n]); } }\r\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n function fulfill(value) { resume(\"next\", value); }\r\n function reject(value) { resume(\"throw\", value); }\r\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n var i, p;\r\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: false } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var m = o[Symbol.asyncIterator], i;\r\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n return cooked;\r\n};\r\n\r\nvar __setModuleDefault = Object.create ? (function(o, v) {\r\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\r\n}) : function(o, v) {\r\n o[\"default\"] = v;\r\n};\r\n\r\nvar ownKeys = function(o) {\r\n ownKeys = Object.getOwnPropertyNames || function (o) {\r\n var ar = [];\r\n for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;\r\n return ar;\r\n };\r\n return ownKeys(o);\r\n};\r\n\r\nexport function __importStar(mod) {\r\n if (mod && mod.__esModule) return mod;\r\n var result = {};\r\n if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== \"default\") __createBinding(result, mod, k[i]);\r\n __setModuleDefault(result, mod);\r\n return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n\r\nexport function __classPrivateFieldGet(receiver, state, kind, f) {\r\n if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a getter\");\r\n if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot read private member from an object whose class did not declare it\");\r\n return kind === \"m\" ? f : kind === \"a\" ? f.call(receiver) : f ? f.value : state.get(receiver);\r\n}\r\n\r\nexport function __classPrivateFieldSet(receiver, state, value, kind, f) {\r\n if (kind === \"m\") throw new TypeError(\"Private method is not writable\");\r\n if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a setter\");\r\n if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot write private member to an object whose class did not declare it\");\r\n return (kind === \"a\" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;\r\n}\r\n\r\nexport function __classPrivateFieldIn(state, receiver) {\r\n if (receiver === null || (typeof receiver !== \"object\" && typeof receiver !== \"function\")) throw new TypeError(\"Cannot use 'in' operator on non-object\");\r\n return typeof state === \"function\" ? receiver === state : state.has(receiver);\r\n}\r\n\r\nexport function __addDisposableResource(env, value, async) {\r\n if (value !== null && value !== void 0) {\r\n if (typeof value !== \"object\" && typeof value !== \"function\") throw new TypeError(\"Object expected.\");\r\n var dispose, inner;\r\n if (async) {\r\n if (!Symbol.asyncDispose) throw new TypeError(\"Symbol.asyncDispose is not defined.\");\r\n dispose = value[Symbol.asyncDispose];\r\n }\r\n if (dispose === void 0) {\r\n if (!Symbol.dispose) throw new TypeError(\"Symbol.dispose is not defined.\");\r\n dispose = value[Symbol.dispose];\r\n if (async) inner = dispose;\r\n }\r\n if (typeof dispose !== \"function\") throw new TypeError(\"Object not disposable.\");\r\n if (inner) dispose = function() { try { inner.call(this); } catch (e) { return Promise.reject(e); } };\r\n env.stack.push({ value: value, dispose: dispose, async: async });\r\n }\r\n else if (async) {\r\n env.stack.push({ async: true });\r\n }\r\n return value;\r\n\r\n}\r\n\r\nvar _SuppressedError = typeof SuppressedError === \"function\" ? SuppressedError : function (error, suppressed, message) {\r\n var e = new Error(message);\r\n return e.name = \"SuppressedError\", e.error = error, e.suppressed = suppressed, e;\r\n};\r\n\r\nexport function __disposeResources(env) {\r\n function fail(e) {\r\n env.error = env.hasError ? new _SuppressedError(e, env.error, \"An error was suppressed during disposal.\") : e;\r\n env.hasError = true;\r\n }\r\n var r, s = 0;\r\n function next() {\r\n while (r = env.stack.pop()) {\r\n try {\r\n if (!r.async && s === 1) return s = 0, env.stack.push(r), Promise.resolve().then(next);\r\n if (r.dispose) {\r\n var result = r.dispose.call(r.value);\r\n if (r.async) return s |= 2, Promise.resolve(result).then(next, function(e) { fail(e); return next(); });\r\n }\r\n else s |= 1;\r\n }\r\n catch (e) {\r\n fail(e);\r\n }\r\n }\r\n if (s === 1) return env.hasError ? Promise.reject(env.error) : Promise.resolve();\r\n if (env.hasError) throw env.error;\r\n }\r\n return next();\r\n}\r\n\r\nexport function __rewriteRelativeImportExtension(path, preserveJsx) {\r\n if (typeof path === \"string\" && /^\\.\\.?\\//.test(path)) {\r\n return path.replace(/\\.(tsx)$|((?:\\.d)?)((?:\\.[^./]+?)?)\\.([cm]?)ts$/i, function (m, tsx, d, ext, cm) {\r\n return tsx ? preserveJsx ? \".jsx\" : \".js\" : d && (!ext || !cm) ? m : (d + ext + \".\" + cm.toLowerCase() + \"js\");\r\n });\r\n }\r\n return path;\r\n}\r\n\r\nexport default {\r\n __extends: __extends,\r\n __assign: __assign,\r\n __rest: __rest,\r\n __decorate: __decorate,\r\n __param: __param,\r\n __esDecorate: __esDecorate,\r\n __runInitializers: __runInitializers,\r\n __propKey: __propKey,\r\n __setFunctionName: __setFunctionName,\r\n __metadata: __metadata,\r\n __awaiter: __awaiter,\r\n __generator: __generator,\r\n __createBinding: __createBinding,\r\n __exportStar: __exportStar,\r\n __values: __values,\r\n __read: __read,\r\n __spread: __spread,\r\n __spreadArrays: __spreadArrays,\r\n __spreadArray: __spreadArray,\r\n __await: __await,\r\n __asyncGenerator: __asyncGenerator,\r\n __asyncDelegator: __asyncDelegator,\r\n __asyncValues: __asyncValues,\r\n __makeTemplateObject: __makeTemplateObject,\r\n __importStar: __importStar,\r\n __importDefault: __importDefault,\r\n __classPrivateFieldGet: __classPrivateFieldGet,\r\n __classPrivateFieldSet: __classPrivateFieldSet,\r\n __classPrivateFieldIn: __classPrivateFieldIn,\r\n __addDisposableResource: __addDisposableResource,\r\n __disposeResources: __disposeResources,\r\n __rewriteRelativeImportExtension: __rewriteRelativeImportExtension,\r\n};\r\n","/* eslint-disable @typescript-eslint/no-unsafe-declaration-merging */\r\n\r\nimport { css, CSSResultGroup, html, LitElement, nothing, PropertyValues, unsafeCSS } from \"lit\";\r\nimport { property } from \"lit/decorators.js\";\r\n\r\nimport { customElement, DesignToken, Role } from \"@m3e/web/core\";\r\n\r\nimport \"@m3e/web/button\";\r\nimport \"@m3e/web/icon-button\";\r\n\r\n/**\r\n * Presents short updates about application processes at the bottom of the screen.\r\n * @tag m3e-snackbar\r\n *\r\n * @slot - Renders the content of the snackbar.\r\n * @slot close-icon - Renders the icon of the button used to close the snackbar.\r\n *\r\n * @attr action - The label of the snackbar's action.\r\n * @attr close-label - The accessible label given to the button used to dismiss the snackbar.\r\n * @attr dismissible - Whether a button is presented that can be used to close the snackbar.\r\n * @attr duration - The length of time, in milliseconds, to wait before automatically dismissing the snackbar.\r\n *\r\n * @fires beforetoggle - Dispatched before the toggle state changes.\r\n * @fires toggle - Dispatched after the toggle state has changed.\r\n *\r\n * @cssprop --m3e-snackbar-margin - Vertical offset from the bottom of the viewport.\r\n * @cssprop --m3e-snackbar-container-shape - Border radius of the snackbar container.\r\n * @cssprop --m3e-snackbar-container-color - Background color of the snackbar.\r\n * @cssprop --m3e-snackbar-padding - Internal spacing of the snackbar container.\r\n * @cssprop --m3e-snackbar-min-width - Minimum width of the snackbar.\r\n * @cssprop --m3e-snackbar-max-width - Maximum width of the snackbar.\r\n */\r\n@customElement(\"m3e-snackbar\")\r\nexport class M3eSnackbarElement extends Role(LitElement, \"status\") {\r\n static {\r\n if (typeof window !== \"undefined\") {\r\n const lightDomStyle = new CSSStyleSheet();\r\n lightDomStyle.replaceSync(\r\n css`\r\n m3e-snackbar {\r\n margin-inline: auto;\r\n }\r\n `.toString(),\r\n );\r\n\r\n document.adoptedStyleSheets = [...document.adoptedStyleSheets, lightDomStyle];\r\n }\r\n }\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n position: fixed;\r\n top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem));\r\n display: inline-flex;\r\n align-items: center;\r\n min-width: var(--m3e-snackbar-min-width, 21.5rem);\r\n max-width: var(--m3e-snackbar-max-width, 42rem);\r\n visibility: hidden;\r\n border: none;\r\n margin: 0;\r\n padding: 0;\r\n opacity: 0;\r\n transform: scale(0.8);\r\n transition: ${unsafeCSS(\r\n `opacity ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard}, \r\n transform ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard}, \r\n overlay ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete,\r\n visibility ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete`,\r\n )};\r\n }\r\n :host::backdrop {\r\n background-color: transparent;\r\n }\r\n :host(:popover-open) {\r\n visibility: visible;\r\n opacity: 1;\r\n transform: scale(1);\r\n }\r\n @starting-style {\r\n :host(:popover-open) {\r\n opacity: 0;\r\n transform: scale(0.8);\r\n }\r\n }\r\n .base {\r\n display: inline-flex;\r\n align-items: center;\r\n flex: 1 1 auto;\r\n box-sizing: border-box;\r\n padding: var(--m3e-snackbar-padding, 0 1rem 0 1rem);\r\n border-radius: var(--m3e-snackbar-container-shape, ${DesignToken.shape.corner.extraSmall});\r\n background-color: var(--m3e-snackbar-container-color, ${DesignToken.color.inverseSurface});\r\n font-size: var(--m3e-snackbar-supporting-text-font-size, ${DesignToken.typescale.standard.label.large.fontSize});\r\n font-weight: var(\r\n --m3e-snackbar-supporting-text-font-weight,\r\n ${DesignToken.typescale.standard.label.large.fontWeight}\r\n );\r\n line-height: var(\r\n --m3e-snackbar-supporting-text-line-height,\r\n ${DesignToken.typescale.standard.label.large.lineHeight}\r\n );\r\n letter-spacing: var(\r\n --m3e-snackbar-supporting-text-tracking,\r\n ${DesignToken.typescale.standard.label.large.tracking}\r\n );\r\n color: var(--m3e-snackbar-supporting-text-color, ${DesignToken.color.inverseOnSurface});\r\n\r\n --m3e-text-button-label-text-color: var(--m3e-snackbar-action-text-color, ${DesignToken.color.inversePrimary});\r\n --m3e-text-button-hover-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-hover-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-focus-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-focus-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-pressed-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-pressed-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-standard-icon-button-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-hover-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-hover-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-focus-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-focus-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-pressed-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-pressed-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n }\r\n :host([dismissible]) .base {\r\n padding-inline-end: 0.5rem;\r\n }\r\n .supporting-text {\r\n flex: 1 1 auto;\r\n display: -webkit-box;\r\n -webkit-line-clamp: 2;\r\n -webkit-box-orient: vertical;\r\n overflow: hidden;\r\n line-clamp: 2;\r\n margin-block: var(--m3e-snackbar-supporting-text-margin-block, 0.875rem);\r\n }\r\n ::slotted([slot=\"close-icon\"]),\r\n .close-icon {\r\n width: 1em;\r\n font-size: var(--m3e-icon-button-icon-size, 1.5rem) !important;\r\n }\r\n @media (forced-colors: active) {\r\n :host {\r\n background-color: Canvas;\r\n color: CanvasText;\r\n border-radius: ${DesignToken.shape.corner.small};\r\n box-sizing: border-box;\r\n outline: 1px solid CanvasText;\r\n }\r\n }\r\n `;\r\n\r\n /** @private */ static __current: M3eSnackbarElement | null = null;\r\n\r\n /** @private */ #timeoutId = -1;\r\n /** @private */ #actionTaken = false;\r\n /** @private */ readonly #beforeToggleHandler = (e: ToggleEvent) => this.#handleBeforeToggle(e);\r\n\r\n /** The currently open snackbar. */\r\n static get current(): M3eSnackbarElement | null {\r\n return M3eSnackbarElement.__current;\r\n }\r\n\r\n /**\r\n * The length of time, in milliseconds, to wait before automatically dismissing the snackbar.\r\n * @default 3000\r\n */\r\n @property({ type: Number }) duration = 3000;\r\n\r\n /**\r\n * The label of the snackbar's action.\r\n * @default \"\"\r\n */\r\n @property() action = \"\";\r\n\r\n /**\r\n * Whether a button is presented that can be used to close the snackbar.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) dismissible = false;\r\n\r\n /**\r\n * The accessible label given to the button used to dismiss the snackbar.\r\n * @default \"Close\"\r\n */\r\n @property({ attribute: \"close-label\" }) closeLabel = \"Close\";\r\n\r\n /** Whether the user clicked the action. */\r\n get isActionTaken(): boolean {\r\n return this.#actionTaken;\r\n }\r\n\r\n /** @inheritdoc */\r\n override connectedCallback(): void {\r\n super.connectedCallback();\r\n\r\n this.addEventListener(\"beforetoggle\", this.#beforeToggleHandler);\r\n this.setAttribute(\"popover\", \"manual\");\r\n this.ariaLive = \"polite\";\r\n }\r\n\r\n /** @inheritdoc */\r\n override disconnectedCallback(): void {\r\n super.disconnectedCallback();\r\n\r\n this.removeEventListener(\"beforetoggle\", this.#beforeToggleHandler);\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render() {\r\n return html`<div class=\"base\">\r\n <span class=\"supporting-text\"><slot></slot></span>\r\n ${this.#renderActionButton()} ${this.#renderCloseButton()}\r\n </div>`;\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override updated(_changedProperties: PropertyValues): void {\r\n super.updated(_changedProperties);\r\n\r\n // After render, compute the (unscaled) height of the snackbar in order\r\n // to properly position it relative to the viewport.\r\n // top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem));\r\n\r\n this.style.setProperty(\"--_snackbar-height\", `${this.getBoundingClientRect().height / 0.8}px`);\r\n }\r\n\r\n /** @private */\r\n #renderActionButton(): unknown {\r\n return !this.action ? nothing : html`<m3e-button @click=\"${this.#handleActionClick}\">${this.action}</m3e-button>`;\r\n }\r\n\r\n /** @private */\r\n #renderCloseButton(): unknown {\r\n return !this.dismissible\r\n ? nothing\r\n : html`<m3e-icon-button aria-label=\"${this.closeLabel}\" @click=\"${this.hidePopover}\">\r\n <slot name=\"close-icon\">\r\n <svg class=\"close-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n <path\r\n d=\"m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z\"\r\n />\r\n </svg>\r\n </slot>\r\n </m3e-icon-button>`;\r\n }\r\n\r\n /** @private */\r\n #handleActionClick(): void {\r\n this.#actionTaken = true;\r\n this.hidePopover();\r\n }\r\n\r\n /** @private */\r\n #handleBeforeToggle(e: ToggleEvent): void {\r\n if (e.newState == \"open\") {\r\n M3eSnackbarElement.__current?.hidePopover();\r\n M3eSnackbarElement.__current = this;\r\n\r\n if (this.duration > 0) {\r\n this.#timeoutId = setTimeout(() => this.hidePopover(), this.duration);\r\n }\r\n } else {\r\n if (M3eSnackbarElement.__current === this) {\r\n M3eSnackbarElement.__current = null;\r\n }\r\n\r\n clearTimeout(this.#timeoutId);\r\n }\r\n }\r\n}\r\n\r\ninterface M3eSnackbarElementEventMap extends HTMLElementEventMap {\r\n beforetoggle: ToggleEvent;\r\n toggle: ToggleEvent;\r\n}\r\n\r\nexport interface M3eSnackbarElement {\r\n addEventListener<K extends keyof M3eSnackbarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSnackbarElement, ev: M3eSnackbarElementEventMap[K]) => void,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n addEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener<K extends keyof M3eSnackbarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSnackbarElement, ev: M3eSnackbarElementEventMap[K]) => void,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-snackbar\": M3eSnackbarElement;\r\n }\r\n}\r\n","import { isServer } from \"lit\";\r\n\r\nimport { prefersReducedMotion } from \"@m3e/web/core\";\r\n\r\nimport { M3eSnackbarElement } from \"./SnackbarElement\";\r\n\r\n/** Encapsulates options used to present a snackbar message. */\r\nexport interface SnackbarOptions {\r\n /** The length of time, in milliseconds, to wait before automatically dismissing the snackbar. */\r\n duration?: number;\r\n\r\n /** The accessible label given to the close button used to dismiss the snackbar. */\r\n closeLabel?: string;\r\n\r\n /** The callback function invoked when the action is clicked. */\r\n actionCallback?: () => void;\r\n}\r\n\r\n/**\r\n * Presents short updates about application processes at the bottom of the screen from anywhere in an application.\r\n * @example\r\n * The following example illustrates basic usage.\r\n * ```js\r\n * M3eSnackbar.open(\"File deleted\");\r\n * ```\r\n * @example\r\n * The next example illustrates presenting a snackbar with an action and callback.\r\n * ```js\r\n * M3eSnackbar.open(\"File deleted\", \"Undo\", {\r\n * actionCallback: () => {\r\n * // Undo logic here\r\n * },\r\n * });\r\n */\r\nexport class M3eSnackbar {\r\n /**\r\n * Opens a snackbar with a message.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message and action.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {string} action The label for the snackbar action.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, action: string, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message, action and optional close affordance.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {string} action The label for the snackbar action.\r\n * @param {boolean} dismissible Whether to present close affordance.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, action: string, dismissible: boolean, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message and optional close affordance.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {boolean} dismissible Whether to present close affordance.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, dismissible: boolean, options?: SnackbarOptions): void;\r\n\r\n static open(\r\n message: string,\r\n actionOrDismissibleOrOptions?: string | boolean | SnackbarOptions,\r\n dismissibleOrOptions?: boolean | SnackbarOptions,\r\n options?: SnackbarOptions,\r\n ): void {\r\n if (isServer) return;\r\n\r\n const snackbar = document.createElement(\"m3e-snackbar\");\r\n snackbar.append(document.createTextNode(message));\r\n\r\n let actualOptions: SnackbarOptions | undefined = undefined;\r\n\r\n if (typeof actionOrDismissibleOrOptions == \"string\") {\r\n snackbar.action = actionOrDismissibleOrOptions;\r\n } else if (typeof actionOrDismissibleOrOptions == \"boolean\") {\r\n snackbar.dismissible = actionOrDismissibleOrOptions;\r\n } else {\r\n actualOptions = actionOrDismissibleOrOptions;\r\n }\r\n\r\n if (typeof dismissibleOrOptions == \"boolean\") {\r\n snackbar.dismissible = dismissibleOrOptions;\r\n } else {\r\n actualOptions = dismissibleOrOptions;\r\n }\r\n\r\n if (options) {\r\n actualOptions = options;\r\n }\r\n\r\n if (actualOptions?.duration !== undefined) {\r\n snackbar.duration = actualOptions.duration;\r\n }\r\n if (actualOptions?.closeLabel) {\r\n snackbar.closeLabel = actualOptions.closeLabel;\r\n }\r\n\r\n snackbar.addEventListener(\"toggle\", (e) => {\r\n if (e.newState === \"closed\") {\r\n if (prefersReducedMotion()) {\r\n snackbar.remove();\r\n } else {\r\n snackbar.addEventListener(\"transitionend\", () => snackbar.remove(), { once: true });\r\n }\r\n\r\n if (snackbar.isActionTaken) {\r\n actualOptions?.actionCallback?.();\r\n }\r\n }\r\n });\r\n\r\n (document.querySelector(\"m3e-theme\") ?? document.body).append(snackbar);\r\n snackbar.showPopover();\r\n }\r\n\r\n /** Dismisses the currently visible snackbar. */\r\n static dismiss(): void {\r\n M3eSnackbarElement.current?.hidePopover();\r\n }\r\n}\r\n\r\n// This is the class type, as opposed to an instance of the class.\r\ntype M3eSnackbarClass = typeof M3eSnackbar;\r\n\r\ndeclare global {\r\n /** Presents short updates about application processes at the bottom of the screen from anywhere in an application. */\r\n var M3eSnackbar: M3eSnackbarClass;\r\n}\r\n\r\nglobalThis.M3eSnackbar = M3eSnackbar;\r\n"],"names":["__decorate","decorators","target","key","desc","d","c","arguments","length","r","Object","getOwnPropertyDescriptor","Reflect","decorate","i","defineProperty","__classPrivateFieldGet","receiver","state","kind","f","TypeError","has","call","value","get","__classPrivateFieldSet","set","SuppressedError","M3eSnackbarElement","M3eSnackbarElement_1","Role","LitElement","constructor","_M3eSnackbarElement_timeoutId","this","_M3eSnackbarElement_actionTaken","_M3eSnackbarElement_beforeToggleHandler","e","duration","action","dismissible","closeLabel","current","__current","isActionTaken","connectedCallback","super","addEventListener","setAttribute","ariaLive","disconnectedCallback","removeEventListener","render","html","_M3eSnackbarElement_instances","_M3eSnackbarElement_renderActionButton","_M3eSnackbarElement_renderCloseButton","updated","_changedProperties","style","setProperty","getBoundingClientRect","height","_M3eSnackbarElement_handleActionClick","nothing","hidePopover","newState","setTimeout","clearTimeout","window","lightDomStyle","CSSStyleSheet","replaceSync","css","toString","document","adoptedStyleSheets","styles","unsafeCSS","DesignToken","motion","short3","easing","standard","shape","corner","extraSmall","color","inverseSurface","typescale","label","large","fontSize","fontWeight","lineHeight","tracking","inverseOnSurface","inversePrimary","small","property","type","Number","prototype","Boolean","reflect","attribute","customElement","M3eSnackbar","open","message","actionOrDismissibleOrOptions","dismissibleOrOptions","options","isServer","snackbar","createElement","actualOptions","append","createTextNode","undefined","prefersReducedMotion","remove","once","actionCallback","querySelector","body","showPopover","dismiss","globalThis"],"mappings":";;;;;mSAsDO,SAASA,EAAWC,EAAYC,EAAQC,EAAKC,GAChD,IAA2HC,EAAvHC,EAAIC,UAAUC,OAAQC,EAAIH,EAAI,EAAIJ,EAAkB,OAATE,EAAgBA,EAAOM,OAAOC,yBAAyBT,EAAQC,GAAOC,EACrH,GAAuB,iBAAZQ,SAAoD,mBAArBA,QAAQC,SAAyBJ,EAAIG,QAAQC,SAASZ,EAAYC,EAAQC,EAAKC,QACpH,IAAK,IAAIU,EAAIb,EAAWO,OAAS,EAAGM,GAAK,EAAGA,KAAST,EAAIJ,EAAWa,MAAIL,GAAKH,EAAI,EAAID,EAAEI,GAAKH,EAAI,EAAID,EAAEH,EAAQC,EAAKM,GAAKJ,EAAEH,EAAQC,KAASM,GAChJ,OAAOH,EAAI,GAAKG,GAAKC,OAAOK,eAAeb,EAAQC,EAAKM,GAAIA,CAChE,CAmOO,SAASO,EAAuBC,EAAUC,EAAOC,EAAMC,GAC1D,GAAa,MAATD,IAAiBC,EAAG,MAAM,IAAIC,UAAU,iDAC5C,GAAqB,mBAAVH,EAAuBD,IAAaC,IAAUE,GAAKF,EAAMI,IAAIL,GAAW,MAAM,IAAII,UAAU,4EACvG,MAAgB,MAATF,EAAeC,EAAa,MAATD,EAAeC,EAAEG,KAAKN,GAAYG,EAAIA,EAAEI,MAAQN,EAAMO,IAAIR,EACxF,CAEO,SAASS,EAAuBT,EAAUC,EAAOM,EAAOL,EAAMC,GACjE,GAAa,MAATD,EAAc,MAAM,IAAIE,UAAU,kCACtC,GAAa,MAATF,IAAiBC,EAAG,MAAM,IAAIC,UAAU,iDAC5C,GAAqB,mBAAVH,EAAuBD,IAAaC,IAAUE,GAAKF,EAAMI,IAAIL,GAAW,MAAM,IAAII,UAAU,2EACvG,MAAiB,MAATF,EAAeC,EAAEG,KAAKN,EAAUO,GAASJ,EAAIA,EAAEI,MAAQA,EAAQN,EAAMS,IAAIV,EAAUO,GAASA,CACxG,uBA+BkD,mBAApBI,iBAAiCA,gBCvSxD,IAAMC,EAAkBC,EAAxB,cAAiCC,EAAKC,EAAY,WAAlDC,WAAAA,mCA8JWC,EAAAP,IAAAQ,SACAC,EAAAT,IAAAQ,MAAe,GACNE,EAAAV,IAAAQ,KAAwBG,GAAmBtB,EAAAmB,cAAwBZ,KAAxBY,KAAyBG,IAWjEH,KAAAI,SAAW,IAM3BJ,KAAAK,OAAS,GAMuBL,KAAAM,aAAc,EAMlBN,KAAAO,WAAa,OAqFvD,CA/GE,kBAAWC,GACT,OAAOb,EAAmBc,SAC5B,CA2BA,iBAAIC,GACF,OAAO7B,EAAAmB,KAAIC,EAAA,IACb,CAGSU,iBAAAA,GACPC,MAAMD,oBAENX,KAAKa,iBAAiB,eAAgBhC,EAAAmB,KAAIE,EAAA,MAC1CF,KAAKc,aAAa,UAAW,UAC7Bd,KAAKe,SAAW,QAClB,CAGSC,oBAAAA,GACPJ,MAAMI,uBAENhB,KAAKiB,oBAAoB,eAAgBpC,EAAAmB,KAAIE,EAAA,KAC/C,CAGmBgB,MAAAA,GACjB,OAAOC,CAAI,uEAEPtC,EAAAmB,KAAIoB,EAAA,IAAAC,GAAoBjC,KAAxBY,SAA8BnB,EAAAmB,KAAIoB,EAAA,IAAAE,GAAmBlC,KAAvBY,aAEpC,CAGmBuB,OAAAA,CAAQC,GACzBZ,MAAMW,QAAQC,GAMdxB,KAAKyB,MAAMC,YAAY,qBAAyB1B,KAAK2B,wBAAwBC,OAAS,GAAzC,KAC/C,wEAIE,OAAQ5B,KAAKK,OAAmBc,CAAI,uBAAuBtC,EAAAmB,KAAIoB,EAAA,IAAAS,OAAwB7B,KAAKK,sBAAtEyB,CACxB,eAIE,OAAQ9B,KAAKM,YAETa,CAAI,gCAAgCnB,KAAKO,uBAAuBP,KAAK+B,yPADrED,CAUN,eAIEvC,EAAAS,KAAIC,GAAgB,EAAI,KACxBD,KAAK+B,aACP,aAGoB5B,GACA,QAAdA,EAAE6B,UACJrC,EAAmBc,WAAWsB,cAC9BpC,EAAmBc,UAAYT,KAE3BA,KAAKI,SAAW,GAClBb,EAAAS,KAAID,EAAckC,WAAW,IAAMjC,KAAK+B,cAAe/B,KAAKI,iBAG1DT,EAAmBc,YAAcT,OACnCL,EAAmBc,UAAY,MAGjCyB,aAAarD,EAAAmB,KAAID,EAAA,MAErB,EAhRA,MACE,GAAsB,oBAAXoC,OAAwB,CACjC,MAAMC,EAAgB,IAAIC,cAC1BD,EAAcE,YACZC,CAAG,wCAIDC,YAGJC,SAASC,mBAAqB,IAAID,SAASC,mBAAoBN,EACjE,CACD,EAbD,GAegB1C,EAAAiD,OAAyBJ,CAAG,uWAc1BK,EACZ,WAAWC,EAAYC,OAAO1C,SAAS2C,UAAUF,EAAYC,OAAOE,OAAOC,iCAC/DJ,EAAYC,OAAO1C,SAAS2C,UAAUF,EAAYC,OAAOE,OAAOC,+BAClEJ,EAAYC,OAAO1C,SAAS2C,UAAUF,EAAYC,OAAOE,OAAOC,gDAC7DJ,EAAYC,OAAO1C,SAAS2C,UAAUF,EAAYC,OAAOE,OAAOC,sbAuB1BJ,EAAYK,MAAMC,OAAOC,sEACtBP,EAAYQ,MAAMC,6EACfT,EAAYU,UAAUN,SAASO,MAAMC,MAAMC,4EAGlGb,EAAYU,UAAUN,SAASO,MAAMC,MAAME,+EAI3Cd,EAAYU,UAAUN,SAASO,MAAMC,MAAMG,+EAI3Cf,EAAYU,UAAUN,SAASO,MAAMC,MAAMI,gEAEIhB,EAAYQ,MAAMS,gGAEOjB,EAAYQ,MAAMU,qGAG1FlB,EAAYQ,MAAMU,uGAIlBlB,EAAYQ,MAAMU,sGAIlBlB,EAAYQ,MAAMU,uGAIlBlB,EAAYQ,MAAMU,wGAIlBlB,EAAYQ,MAAMU,yGAIlBlB,EAAYQ,MAAMU,kGAIlBlB,EAAYQ,MAAMS,0GAIlBjB,EAAYQ,MAAMS,iHAIlBjB,EAAYQ,MAAMS,0GAIlBjB,EAAYQ,MAAMS,iHAIlBjB,EAAYQ,MAAMS,4GAIlBjB,EAAYQ,MAAMS,mHAIlBjB,EAAYQ,MAAMS,ghBAwBHjB,EAAYK,MAAMC,OAAOa,oEAOzBtE,EAAAe,UAAuC,KAelC5C,EAAA,CAA3BoG,EAAS,CAAEC,KAAMC,UAA0BzE,EAAA0E,UAAA,gBAAA,GAMhCvG,EAAA,CAAXoG,KAAuBvE,EAAA0E,UAAA,cAAA,GAMoBvG,EAAA,CAA3CoG,EAAS,CAAEC,KAAMG,QAASC,SAAS,KAA4B5E,EAAA0E,UAAA,mBAAA,GAMxBvG,EAAA,CAAvCoG,EAAS,CAAEM,UAAW,iBAAsC7E,EAAA0E,UAAA,kBAAA,GA7LlD1E,EAAkBC,EAAA9B,EAAA,CAD9B2G,EAAc,iBACF9E,SCCA+E,EAiCX,WAAOC,CACLC,EACAC,EACAC,EACAC,GAEA,GAAIC,EAAU,OAEd,MAAMC,EAAWvC,SAASwC,cAAc,gBAGxC,IAAIC,EAFJF,EAASG,OAAO1C,SAAS2C,eAAeT,IAIG,iBAAhCC,EACTI,EAAS3E,OAASuE,EAC8B,kBAAhCA,EAChBI,EAAS1E,YAAcsE,EAEvBM,EAAgBN,EAGiB,kBAAxBC,EACTG,EAAS1E,YAAcuE,EAEvBK,EAAgBL,EAGdC,IACFI,EAAgBJ,QAGcO,IAA5BH,GAAe9E,WACjB4E,EAAS5E,SAAW8E,EAAc9E,UAEhC8E,GAAe3E,aACjByE,EAASzE,WAAa2E,EAAc3E,YAGtCyE,EAASnE,iBAAiB,SAAWV,IAChB,WAAfA,EAAE6B,WACAsD,IACFN,EAASO,SAETP,EAASnE,iBAAiB,gBAAiB,IAAMmE,EAASO,SAAU,CAAEC,MAAM,IAG1ER,EAAStE,eACXwE,GAAeO,uBAKpBhD,SAASiD,cAAc,cAAgBjD,SAASkD,MAAMR,OAAOH,GAC9DA,EAASY,aACX,CAGA,cAAOC,GACLnG,EAAmBc,SAASuB,aAC9B,EAWF+D,WAAWrB,YAAcA","x_google_ignoreList":[0]}
1
+ {"version":3,"file":"snackbar.min.js","sources":["../../src/snackbar/SnackbarElement.ts","../../src/snackbar/Snackbar.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-declaration-merging */\r\n\r\nimport { css, CSSResultGroup, html, LitElement, nothing, PropertyValues, unsafeCSS } from \"lit\";\r\nimport { property } from \"lit/decorators.js\";\r\n\r\nimport { customElement, DesignToken, Role } from \"@m3e/web/core\";\r\n\r\nimport \"@m3e/web/button\";\r\nimport \"@m3e/web/icon-button\";\r\n\r\n/**\r\n * Presents short updates about application processes at the bottom of the screen.\r\n * @tag m3e-snackbar\r\n *\r\n * @slot - Renders the content of the snackbar.\r\n * @slot close-icon - Renders the icon of the button used to close the snackbar.\r\n *\r\n * @attr action - The label of the snackbar's action.\r\n * @attr close-label - The accessible label given to the button used to dismiss the snackbar.\r\n * @attr dismissible - Whether a button is presented that can be used to close the snackbar.\r\n * @attr duration - The length of time, in milliseconds, to wait before automatically dismissing the snackbar.\r\n *\r\n * @fires beforetoggle - Dispatched before the toggle state changes.\r\n * @fires toggle - Dispatched after the toggle state has changed.\r\n *\r\n * @cssprop --m3e-snackbar-margin - Vertical offset from the bottom of the viewport.\r\n * @cssprop --m3e-snackbar-container-shape - Border radius of the snackbar container.\r\n * @cssprop --m3e-snackbar-container-color - Background color of the snackbar.\r\n * @cssprop --m3e-snackbar-padding - Internal spacing of the snackbar container.\r\n * @cssprop --m3e-snackbar-min-width - Minimum width of the snackbar.\r\n * @cssprop --m3e-snackbar-max-width - Maximum width of the snackbar.\r\n */\r\n@customElement(\"m3e-snackbar\")\r\nexport class M3eSnackbarElement extends Role(LitElement, \"status\") {\r\n static {\r\n if (typeof window !== \"undefined\") {\r\n const lightDomStyle = new CSSStyleSheet();\r\n lightDomStyle.replaceSync(\r\n css`\r\n m3e-snackbar {\r\n margin-inline: auto;\r\n }\r\n `.toString(),\r\n );\r\n\r\n document.adoptedStyleSheets = [...document.adoptedStyleSheets, lightDomStyle];\r\n }\r\n }\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n position: fixed;\r\n top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem));\r\n display: inline-flex;\r\n align-items: center;\r\n min-width: var(--m3e-snackbar-min-width, 21.5rem);\r\n max-width: var(--m3e-snackbar-max-width, 42rem);\r\n visibility: hidden;\r\n border: none;\r\n margin: 0;\r\n padding: 0;\r\n opacity: 0;\r\n transform: scale(0.8);\r\n transition: ${unsafeCSS(\r\n `opacity ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard}, \r\n transform ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard}, \r\n overlay ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete,\r\n visibility ${DesignToken.motion.duration.short3} ${DesignToken.motion.easing.standard} allow-discrete`,\r\n )};\r\n }\r\n :host::backdrop {\r\n background-color: transparent;\r\n }\r\n :host(:popover-open) {\r\n visibility: visible;\r\n opacity: 1;\r\n transform: scale(1);\r\n }\r\n @starting-style {\r\n :host(:popover-open) {\r\n opacity: 0;\r\n transform: scale(0.8);\r\n }\r\n }\r\n .base {\r\n display: inline-flex;\r\n align-items: center;\r\n flex: 1 1 auto;\r\n box-sizing: border-box;\r\n padding: var(--m3e-snackbar-padding, 0 1rem 0 1rem);\r\n border-radius: var(--m3e-snackbar-container-shape, ${DesignToken.shape.corner.extraSmall});\r\n background-color: var(--m3e-snackbar-container-color, ${DesignToken.color.inverseSurface});\r\n font-size: var(--m3e-snackbar-supporting-text-font-size, ${DesignToken.typescale.standard.label.large.fontSize});\r\n font-weight: var(\r\n --m3e-snackbar-supporting-text-font-weight,\r\n ${DesignToken.typescale.standard.label.large.fontWeight}\r\n );\r\n line-height: var(\r\n --m3e-snackbar-supporting-text-line-height,\r\n ${DesignToken.typescale.standard.label.large.lineHeight}\r\n );\r\n letter-spacing: var(\r\n --m3e-snackbar-supporting-text-tracking,\r\n ${DesignToken.typescale.standard.label.large.tracking}\r\n );\r\n color: var(--m3e-snackbar-supporting-text-color, ${DesignToken.color.inverseOnSurface});\r\n\r\n --m3e-text-button-label-text-color: var(--m3e-snackbar-action-text-color, ${DesignToken.color.inversePrimary});\r\n --m3e-text-button-hover-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-hover-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-focus-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-focus-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-pressed-label-text-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-text-button-pressed-state-layer-color: var(\r\n --m3e-snackbar-action-text-color,\r\n ${DesignToken.color.inversePrimary}\r\n );\r\n --m3e-standard-icon-button-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-hover-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-hover-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-focus-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-focus-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-pressed-icon-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n --m3e-standard-icon-button-pressed-state-layer-color: var(\r\n --m3e-snackbar-close-icon-color,\r\n ${DesignToken.color.inverseOnSurface}\r\n );\r\n }\r\n :host([dismissible]) .base {\r\n padding-inline-end: 0.5rem;\r\n }\r\n .supporting-text {\r\n flex: 1 1 auto;\r\n display: -webkit-box;\r\n -webkit-line-clamp: 2;\r\n -webkit-box-orient: vertical;\r\n overflow: hidden;\r\n line-clamp: 2;\r\n margin-block: var(--m3e-snackbar-supporting-text-margin-block, 0.875rem);\r\n }\r\n ::slotted([slot=\"close-icon\"]),\r\n .close-icon {\r\n width: 1em;\r\n font-size: var(--m3e-icon-button-icon-size, 1.5rem) !important;\r\n }\r\n @media (forced-colors: active) {\r\n :host {\r\n background-color: Canvas;\r\n color: CanvasText;\r\n border-radius: ${DesignToken.shape.corner.small};\r\n box-sizing: border-box;\r\n outline: 1px solid CanvasText;\r\n }\r\n }\r\n `;\r\n\r\n /** @private */ static __current: M3eSnackbarElement | null = null;\r\n\r\n /** @private */ #timeoutId = -1;\r\n /** @private */ #actionTaken = false;\r\n /** @private */ readonly #beforeToggleHandler = (e: ToggleEvent) => this.#handleBeforeToggle(e);\r\n\r\n /** The currently open snackbar. */\r\n static get current(): M3eSnackbarElement | null {\r\n return M3eSnackbarElement.__current;\r\n }\r\n\r\n /**\r\n * The length of time, in milliseconds, to wait before automatically dismissing the snackbar.\r\n * @default 3000\r\n */\r\n @property({ type: Number }) duration = 3000;\r\n\r\n /**\r\n * The label of the snackbar's action.\r\n * @default \"\"\r\n */\r\n @property() action = \"\";\r\n\r\n /**\r\n * Whether a button is presented that can be used to close the snackbar.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) dismissible = false;\r\n\r\n /**\r\n * The accessible label given to the button used to dismiss the snackbar.\r\n * @default \"Close\"\r\n */\r\n @property({ attribute: \"close-label\" }) closeLabel = \"Close\";\r\n\r\n /** Whether the user clicked the action. */\r\n get isActionTaken(): boolean {\r\n return this.#actionTaken;\r\n }\r\n\r\n /** @inheritdoc */\r\n override connectedCallback(): void {\r\n super.connectedCallback();\r\n\r\n this.addEventListener(\"beforetoggle\", this.#beforeToggleHandler);\r\n this.setAttribute(\"popover\", \"manual\");\r\n this.ariaLive = \"polite\";\r\n }\r\n\r\n /** @inheritdoc */\r\n override disconnectedCallback(): void {\r\n super.disconnectedCallback();\r\n\r\n this.removeEventListener(\"beforetoggle\", this.#beforeToggleHandler);\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render() {\r\n return html`<div class=\"base\">\r\n <span class=\"supporting-text\"><slot></slot></span>\r\n ${this.#renderActionButton()} ${this.#renderCloseButton()}\r\n </div>`;\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override updated(_changedProperties: PropertyValues): void {\r\n super.updated(_changedProperties);\r\n\r\n // After render, compute the (unscaled) height of the snackbar in order\r\n // to properly position it relative to the viewport.\r\n // top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem));\r\n\r\n this.style.setProperty(\"--_snackbar-height\", `${this.getBoundingClientRect().height / 0.8}px`);\r\n }\r\n\r\n /** @private */\r\n #renderActionButton(): unknown {\r\n return !this.action ? nothing : html`<m3e-button @click=\"${this.#handleActionClick}\">${this.action}</m3e-button>`;\r\n }\r\n\r\n /** @private */\r\n #renderCloseButton(): unknown {\r\n return !this.dismissible\r\n ? nothing\r\n : html`<m3e-icon-button aria-label=\"${this.closeLabel}\" @click=\"${this.hidePopover}\">\r\n <slot name=\"close-icon\">\r\n <svg class=\"close-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n <path\r\n d=\"m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z\"\r\n />\r\n </svg>\r\n </slot>\r\n </m3e-icon-button>`;\r\n }\r\n\r\n /** @private */\r\n #handleActionClick(): void {\r\n this.#actionTaken = true;\r\n this.hidePopover();\r\n }\r\n\r\n /** @private */\r\n #handleBeforeToggle(e: ToggleEvent): void {\r\n if (e.newState == \"open\") {\r\n M3eSnackbarElement.__current?.hidePopover();\r\n M3eSnackbarElement.__current = this;\r\n\r\n if (this.duration > 0) {\r\n this.#timeoutId = setTimeout(() => this.hidePopover(), this.duration);\r\n }\r\n } else {\r\n if (M3eSnackbarElement.__current === this) {\r\n M3eSnackbarElement.__current = null;\r\n }\r\n\r\n clearTimeout(this.#timeoutId);\r\n }\r\n }\r\n}\r\n\r\ninterface M3eSnackbarElementEventMap extends HTMLElementEventMap {\r\n beforetoggle: ToggleEvent;\r\n toggle: ToggleEvent;\r\n}\r\n\r\nexport interface M3eSnackbarElement {\r\n addEventListener<K extends keyof M3eSnackbarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSnackbarElement, ev: M3eSnackbarElementEventMap[K]) => void,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n addEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener<K extends keyof M3eSnackbarElementEventMap>(\r\n type: K,\r\n listener: (this: M3eSnackbarElement, ev: M3eSnackbarElementEventMap[K]) => void,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-snackbar\": M3eSnackbarElement;\r\n }\r\n}\r\n","import { isServer } from \"lit\";\r\n\r\nimport { prefersReducedMotion } from \"@m3e/web/core\";\r\n\r\nimport { M3eSnackbarElement } from \"./SnackbarElement\";\r\n\r\n/** Encapsulates options used to present a snackbar message. */\r\nexport interface SnackbarOptions {\r\n /** The length of time, in milliseconds, to wait before automatically dismissing the snackbar. */\r\n duration?: number;\r\n\r\n /** The accessible label given to the close button used to dismiss the snackbar. */\r\n closeLabel?: string;\r\n\r\n /** The callback function invoked when the action is clicked. */\r\n actionCallback?: () => void;\r\n}\r\n\r\n/**\r\n * Presents short updates about application processes at the bottom of the screen from anywhere in an application.\r\n * @example\r\n * The following example illustrates basic usage.\r\n * ```js\r\n * M3eSnackbar.open(\"File deleted\");\r\n * ```\r\n * @example\r\n * The next example illustrates presenting a snackbar with an action and callback.\r\n * ```js\r\n * M3eSnackbar.open(\"File deleted\", \"Undo\", {\r\n * actionCallback: () => {\r\n * // Undo logic here\r\n * },\r\n * });\r\n */\r\nexport class M3eSnackbar {\r\n /**\r\n * Opens a snackbar with a message.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message and action.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {string} action The label for the snackbar action.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, action: string, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message, action and optional close affordance.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {string} action The label for the snackbar action.\r\n * @param {boolean} dismissible Whether to present close affordance.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, action: string, dismissible: boolean, options?: SnackbarOptions): void;\r\n\r\n /**\r\n * Opens a snackbar with a message and optional close affordance.\r\n * @param {string} message The message to show in the snackbar.\r\n * @param {boolean} dismissible Whether to present close affordance.\r\n * @param {SnackbarOptions | undefined} options Options that control the behavior of the snackbar.\r\n */\r\n static open(message: string, dismissible: boolean, options?: SnackbarOptions): void;\r\n\r\n static open(\r\n message: string,\r\n actionOrDismissibleOrOptions?: string | boolean | SnackbarOptions,\r\n dismissibleOrOptions?: boolean | SnackbarOptions,\r\n options?: SnackbarOptions,\r\n ): void {\r\n if (isServer) return;\r\n\r\n const snackbar = document.createElement(\"m3e-snackbar\");\r\n snackbar.append(document.createTextNode(message));\r\n\r\n let actualOptions: SnackbarOptions | undefined = undefined;\r\n\r\n if (typeof actionOrDismissibleOrOptions == \"string\") {\r\n snackbar.action = actionOrDismissibleOrOptions;\r\n } else if (typeof actionOrDismissibleOrOptions == \"boolean\") {\r\n snackbar.dismissible = actionOrDismissibleOrOptions;\r\n } else {\r\n actualOptions = actionOrDismissibleOrOptions;\r\n }\r\n\r\n if (typeof dismissibleOrOptions == \"boolean\") {\r\n snackbar.dismissible = dismissibleOrOptions;\r\n } else {\r\n actualOptions = dismissibleOrOptions;\r\n }\r\n\r\n if (options) {\r\n actualOptions = options;\r\n }\r\n\r\n if (actualOptions?.duration !== undefined) {\r\n snackbar.duration = actualOptions.duration;\r\n }\r\n if (actualOptions?.closeLabel) {\r\n snackbar.closeLabel = actualOptions.closeLabel;\r\n }\r\n\r\n snackbar.addEventListener(\"toggle\", (e) => {\r\n if (e.newState === \"closed\") {\r\n if (prefersReducedMotion()) {\r\n snackbar.remove();\r\n } else {\r\n snackbar.addEventListener(\"transitionend\", () => snackbar.remove(), { once: true });\r\n }\r\n\r\n if (snackbar.isActionTaken) {\r\n actualOptions?.actionCallback?.();\r\n }\r\n }\r\n });\r\n\r\n (document.querySelector(\"m3e-theme\") ?? document.body).append(snackbar);\r\n snackbar.showPopover();\r\n }\r\n\r\n /** Dismisses the currently visible snackbar. */\r\n static dismiss(): void {\r\n M3eSnackbarElement.current?.hidePopover();\r\n }\r\n}\r\n\r\n// This is the class type, as opposed to an instance of the class.\r\ntype M3eSnackbarClass = typeof M3eSnackbar;\r\n\r\ndeclare global {\r\n /** Presents short updates about application processes at the bottom of the screen from anywhere in an application. */\r\n var M3eSnackbar: M3eSnackbarClass;\r\n}\r\n\r\nglobalThis.M3eSnackbar = M3eSnackbar;\r\n"],"names":["M3eSnackbarElement","M3eSnackbarElement_1","Role","LitElement","constructor","_M3eSnackbarElement_timeoutId","set","this","_M3eSnackbarElement_actionTaken","_M3eSnackbarElement_beforeToggleHandler","e","__classPrivateFieldGet","call","duration","action","dismissible","closeLabel","current","__current","isActionTaken","connectedCallback","super","addEventListener","setAttribute","ariaLive","disconnectedCallback","removeEventListener","render","html","_M3eSnackbarElement_instances","_M3eSnackbarElement_renderActionButton","_M3eSnackbarElement_renderCloseButton","updated","_changedProperties","style","setProperty","getBoundingClientRect","height","_M3eSnackbarElement_handleActionClick","nothing","hidePopover","__classPrivateFieldSet","newState","setTimeout","clearTimeout","window","lightDomStyle","CSSStyleSheet","replaceSync","css","toString","document","adoptedStyleSheets","styles","unsafeCSS","DesignToken","motion","short3","easing","standard","shape","corner","extraSmall","color","inverseSurface","typescale","label","large","fontSize","fontWeight","lineHeight","tracking","inverseOnSurface","inversePrimary","small","__decorate","property","type","Number","prototype","Boolean","reflect","attribute","customElement","M3eSnackbar","open","message","actionOrDismissibleOrOptions","dismissibleOrOptions","options","isServer","snackbar","createElement","actualOptions","append","createTextNode","undefined","prefersReducedMotion","remove","once","actionCallback","querySelector","body","showPopover","dismiss","globalThis"],"mappings":"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"}
@@ -3,6 +3,7 @@
3
3
  * Copyright (c) 2025 matraic
4
4
  * See LICENSE file in the project root for full license text.
5
5
  */
6
+ import { __classPrivateFieldGet, __classPrivateFieldSet, __decorate } from 'tslib';
6
7
  import { LitElement, html, css } from 'lit';
7
8
  import { query, property } from 'lit/decorators.js';
8
9
  import { Role, PressedController, HoverController, DesignToken, customElement } from '@m3e/web/core';
@@ -10,45 +11,6 @@ import { M3eButtonElement } from '@m3e/web/button';
10
11
  import { M3eIconButtonElement } from '@m3e/web/icon-button';
11
12
  import '@m3e/web/button-group';
12
13
 
13
- /******************************************************************************
14
- Copyright (c) Microsoft Corporation.
15
-
16
- Permission to use, copy, modify, and/or distribute this software for any
17
- purpose with or without fee is hereby granted.
18
-
19
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
20
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
21
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
22
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
23
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
24
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
25
- PERFORMANCE OF THIS SOFTWARE.
26
- ***************************************************************************** */
27
- /* global Reflect, Promise, SuppressedError, Symbol, Iterator */
28
-
29
- function __decorate(decorators, target, key, desc) {
30
- var c = arguments.length,
31
- r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
32
- d;
33
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
34
- return c > 3 && r && Object.defineProperty(target, key, r), r;
35
- }
36
- function __classPrivateFieldGet(receiver, state, kind, f) {
37
- if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
38
- if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
39
- return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
40
- }
41
- function __classPrivateFieldSet(receiver, state, value, kind, f) {
42
- if (kind === "m") throw new TypeError("Private method is not writable");
43
- if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
44
- if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
45
- return kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value), value;
46
- }
47
- typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
48
- var e = new Error(message);
49
- return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
50
- };
51
-
52
14
  var _M3eSplitButtonElement_instances, _M3eSplitButtonElement_leadingButton, _M3eSplitButtonElement_trailingButton, _M3eSplitButtonElement_trailingButtonHover, _M3eSplitButtonElement_pressedController, _M3eSplitButtonElement_hoverController, _M3eSplitButtonElement_handleLeadingSlotChange, _M3eSplitButtonElement_handleTrailingSlotChange, _M3eSplitButtonElement_updateButtons, _M3eSplitButtonElement_updateLeadingButtonShape, _M3eSplitButtonElement_updateTrailingButtonShape, _M3eSplitButtonElement_updateButtonShape;
53
15
  /**
54
16
  * A button used to show an action with a menu of related actions.
@@ -1 +1 @@
1
- {"version":3,"file":"split-button.js","sources":["../../../node_modules/tslib/tslib.es6.js","../../src/split-button/SplitButtonElement.ts"],"sourcesContent":["/******************************************************************************\r\nCopyright (c) Microsoft Corporation.\r\n\r\nPermission to use, copy, modify, and/or distribute this software for any\r\npurpose with or without fee is hereby granted.\r\n\r\nTHE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\r\nREGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY\r\nAND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\r\nINDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM\r\nLOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR\r\nOTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR\r\nPERFORMANCE OF THIS SOFTWARE.\r\n***************************************************************************** */\r\n/* global Reflect, Promise, SuppressedError, Symbol, Iterator */\r\n\r\nvar extendStatics = function(d, b) {\r\n extendStatics = Object.setPrototypeOf ||\r\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\r\n return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n if (typeof b !== \"function\" && b !== null)\r\n throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\r\n extendStatics(d, b);\r\n function __() { this.constructor = d; }\r\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n __assign = Object.assign || function __assign(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n }\r\n return t;\r\n }\r\n return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n var t = {};\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n t[p] = s[p];\r\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\r\n if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\r\n t[p[i]] = s[p[i]];\r\n }\r\n return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __esDecorate(ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {\r\n function accept(f) { if (f !== void 0 && typeof f !== \"function\") throw new TypeError(\"Function expected\"); return f; }\r\n var kind = contextIn.kind, key = kind === \"getter\" ? \"get\" : kind === \"setter\" ? \"set\" : \"value\";\r\n var target = !descriptorIn && ctor ? contextIn[\"static\"] ? ctor : ctor.prototype : null;\r\n var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});\r\n var _, done = false;\r\n for (var i = decorators.length - 1; i >= 0; i--) {\r\n var context = {};\r\n for (var p in contextIn) context[p] = p === \"access\" ? {} : contextIn[p];\r\n for (var p in contextIn.access) context.access[p] = contextIn.access[p];\r\n context.addInitializer = function (f) { if (done) throw new TypeError(\"Cannot add initializers after decoration has completed\"); extraInitializers.push(accept(f || null)); };\r\n var result = (0, decorators[i])(kind === \"accessor\" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);\r\n if (kind === \"accessor\") {\r\n if (result === void 0) continue;\r\n if (result === null || typeof result !== \"object\") throw new TypeError(\"Object expected\");\r\n if (_ = accept(result.get)) descriptor.get = _;\r\n if (_ = accept(result.set)) descriptor.set = _;\r\n if (_ = accept(result.init)) initializers.unshift(_);\r\n }\r\n else if (_ = accept(result)) {\r\n if (kind === \"field\") initializers.unshift(_);\r\n else descriptor[key] = _;\r\n }\r\n }\r\n if (target) Object.defineProperty(target, contextIn.name, descriptor);\r\n done = true;\r\n};\r\n\r\nexport function __runInitializers(thisArg, initializers, value) {\r\n var useValue = arguments.length > 2;\r\n for (var i = 0; i < initializers.length; i++) {\r\n value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);\r\n }\r\n return useValue ? value : void 0;\r\n};\r\n\r\nexport function __propKey(x) {\r\n return typeof x === \"symbol\" ? x : \"\".concat(x);\r\n};\r\n\r\nexport function __setFunctionName(f, name, prefix) {\r\n if (typeof name === \"symbol\") name = name.description ? \"[\".concat(name.description, \"]\") : \"\";\r\n return Object.defineProperty(f, \"name\", { configurable: true, value: prefix ? \"\".concat(prefix, \" \", name) : name });\r\n};\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n return new (P || (P = Promise))(function (resolve, reject) {\r\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === \"function\" ? Iterator : Object).prototype);\r\n return g.next = verb(0), g[\"throw\"] = verb(1), g[\"return\"] = verb(2), typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n function verb(n) { return function (v) { return step([n, v]); }; }\r\n function step(op) {\r\n if (f) throw new TypeError(\"Generator is already executing.\");\r\n while (g && (g = 0, op[0] && (_ = 0)), _) try {\r\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n if (y = 0, t) op = [op[0] & 2, t.value];\r\n switch (op[0]) {\r\n case 0: case 1: t = op; break;\r\n case 4: _.label++; return { value: op[1], done: false };\r\n case 5: _.label++; y = op[1]; op = [0]; continue;\r\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n default:\r\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n if (t[2]) _.ops.pop();\r\n _.trys.pop(); continue;\r\n }\r\n op = body.call(thisArg, _);\r\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n }\r\n}\r\n\r\nexport var __createBinding = Object.create ? (function(o, m, k, k2) {\r\n if (k2 === undefined) k2 = k;\r\n var desc = Object.getOwnPropertyDescriptor(m, k);\r\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\r\n desc = { enumerable: true, get: function() { return m[k]; } };\r\n }\r\n Object.defineProperty(o, k2, desc);\r\n}) : (function(o, m, k, k2) {\r\n if (k2 === undefined) k2 = k;\r\n o[k2] = m[k];\r\n});\r\n\r\nexport function __exportStar(m, o) {\r\n for (var p in m) if (p !== \"default\" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p);\r\n}\r\n\r\nexport function __values(o) {\r\n var s = typeof Symbol === \"function\" && Symbol.iterator, m = s && o[s], i = 0;\r\n if (m) return m.call(o);\r\n if (o && typeof o.length === \"number\") return {\r\n next: function () {\r\n if (o && i >= o.length) o = void 0;\r\n return { value: o && o[i++], done: !o };\r\n }\r\n };\r\n throw new TypeError(s ? \"Object is not iterable.\" : \"Symbol.iterator is not defined.\");\r\n}\r\n\r\nexport function __read(o, n) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n if (!m) return o;\r\n var i = m.call(o), r, ar = [], e;\r\n try {\r\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n }\r\n catch (error) { e = { error: error }; }\r\n finally {\r\n try {\r\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n }\r\n finally { if (e) throw e.error; }\r\n }\r\n return ar;\r\n}\r\n\r\n/** @deprecated */\r\nexport function __spread() {\r\n for (var ar = [], i = 0; i < arguments.length; i++)\r\n ar = ar.concat(__read(arguments[i]));\r\n return ar;\r\n}\r\n\r\n/** @deprecated */\r\nexport function __spreadArrays() {\r\n for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;\r\n for (var r = Array(s), k = 0, i = 0; i < il; i++)\r\n for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)\r\n r[k] = a[j];\r\n return r;\r\n}\r\n\r\nexport function __spreadArray(to, from, pack) {\r\n if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\r\n if (ar || !(i in from)) {\r\n if (!ar) ar = Array.prototype.slice.call(from, 0, i);\r\n ar[i] = from[i];\r\n }\r\n }\r\n return to.concat(ar || Array.prototype.slice.call(from));\r\n}\r\n\r\nexport function __await(v) {\r\n return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n return i = Object.create((typeof AsyncIterator === \"function\" ? AsyncIterator : Object).prototype), verb(\"next\"), verb(\"throw\"), verb(\"return\", awaitReturn), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n function awaitReturn(f) { return function (v) { return Promise.resolve(v).then(f, reject); }; }\r\n function verb(n, f) { if (g[n]) { i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; if (f) i[n] = f(i[n]); } }\r\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n function fulfill(value) { resume(\"next\", value); }\r\n function reject(value) { resume(\"throw\", value); }\r\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n var i, p;\r\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: false } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var m = o[Symbol.asyncIterator], i;\r\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n return cooked;\r\n};\r\n\r\nvar __setModuleDefault = Object.create ? (function(o, v) {\r\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\r\n}) : function(o, v) {\r\n o[\"default\"] = v;\r\n};\r\n\r\nvar ownKeys = function(o) {\r\n ownKeys = Object.getOwnPropertyNames || function (o) {\r\n var ar = [];\r\n for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;\r\n return ar;\r\n };\r\n return ownKeys(o);\r\n};\r\n\r\nexport function __importStar(mod) {\r\n if (mod && mod.__esModule) return mod;\r\n var result = {};\r\n if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== \"default\") __createBinding(result, mod, k[i]);\r\n __setModuleDefault(result, mod);\r\n return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n\r\nexport function __classPrivateFieldGet(receiver, state, kind, f) {\r\n if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a getter\");\r\n if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot read private member from an object whose class did not declare it\");\r\n return kind === \"m\" ? f : kind === \"a\" ? f.call(receiver) : f ? f.value : state.get(receiver);\r\n}\r\n\r\nexport function __classPrivateFieldSet(receiver, state, value, kind, f) {\r\n if (kind === \"m\") throw new TypeError(\"Private method is not writable\");\r\n if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a setter\");\r\n if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot write private member to an object whose class did not declare it\");\r\n return (kind === \"a\" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;\r\n}\r\n\r\nexport function __classPrivateFieldIn(state, receiver) {\r\n if (receiver === null || (typeof receiver !== \"object\" && typeof receiver !== \"function\")) throw new TypeError(\"Cannot use 'in' operator on non-object\");\r\n return typeof state === \"function\" ? receiver === state : state.has(receiver);\r\n}\r\n\r\nexport function __addDisposableResource(env, value, async) {\r\n if (value !== null && value !== void 0) {\r\n if (typeof value !== \"object\" && typeof value !== \"function\") throw new TypeError(\"Object expected.\");\r\n var dispose, inner;\r\n if (async) {\r\n if (!Symbol.asyncDispose) throw new TypeError(\"Symbol.asyncDispose is not defined.\");\r\n dispose = value[Symbol.asyncDispose];\r\n }\r\n if (dispose === void 0) {\r\n if (!Symbol.dispose) throw new TypeError(\"Symbol.dispose is not defined.\");\r\n dispose = value[Symbol.dispose];\r\n if (async) inner = dispose;\r\n }\r\n if (typeof dispose !== \"function\") throw new TypeError(\"Object not disposable.\");\r\n if (inner) dispose = function() { try { inner.call(this); } catch (e) { return Promise.reject(e); } };\r\n env.stack.push({ value: value, dispose: dispose, async: async });\r\n }\r\n else if (async) {\r\n env.stack.push({ async: true });\r\n }\r\n return value;\r\n\r\n}\r\n\r\nvar _SuppressedError = typeof SuppressedError === \"function\" ? SuppressedError : function (error, suppressed, message) {\r\n var e = new Error(message);\r\n return e.name = \"SuppressedError\", e.error = error, e.suppressed = suppressed, e;\r\n};\r\n\r\nexport function __disposeResources(env) {\r\n function fail(e) {\r\n env.error = env.hasError ? new _SuppressedError(e, env.error, \"An error was suppressed during disposal.\") : e;\r\n env.hasError = true;\r\n }\r\n var r, s = 0;\r\n function next() {\r\n while (r = env.stack.pop()) {\r\n try {\r\n if (!r.async && s === 1) return s = 0, env.stack.push(r), Promise.resolve().then(next);\r\n if (r.dispose) {\r\n var result = r.dispose.call(r.value);\r\n if (r.async) return s |= 2, Promise.resolve(result).then(next, function(e) { fail(e); return next(); });\r\n }\r\n else s |= 1;\r\n }\r\n catch (e) {\r\n fail(e);\r\n }\r\n }\r\n if (s === 1) return env.hasError ? Promise.reject(env.error) : Promise.resolve();\r\n if (env.hasError) throw env.error;\r\n }\r\n return next();\r\n}\r\n\r\nexport function __rewriteRelativeImportExtension(path, preserveJsx) {\r\n if (typeof path === \"string\" && /^\\.\\.?\\//.test(path)) {\r\n return path.replace(/\\.(tsx)$|((?:\\.d)?)((?:\\.[^./]+?)?)\\.([cm]?)ts$/i, function (m, tsx, d, ext, cm) {\r\n return tsx ? preserveJsx ? \".jsx\" : \".js\" : d && (!ext || !cm) ? m : (d + ext + \".\" + cm.toLowerCase() + \"js\");\r\n });\r\n }\r\n return path;\r\n}\r\n\r\nexport default {\r\n __extends: __extends,\r\n __assign: __assign,\r\n __rest: __rest,\r\n __decorate: __decorate,\r\n __param: __param,\r\n __esDecorate: __esDecorate,\r\n __runInitializers: __runInitializers,\r\n __propKey: __propKey,\r\n __setFunctionName: __setFunctionName,\r\n __metadata: __metadata,\r\n __awaiter: __awaiter,\r\n __generator: __generator,\r\n __createBinding: __createBinding,\r\n __exportStar: __exportStar,\r\n __values: __values,\r\n __read: __read,\r\n __spread: __spread,\r\n __spreadArrays: __spreadArrays,\r\n __spreadArray: __spreadArray,\r\n __await: __await,\r\n __asyncGenerator: __asyncGenerator,\r\n __asyncDelegator: __asyncDelegator,\r\n __asyncValues: __asyncValues,\r\n __makeTemplateObject: __makeTemplateObject,\r\n __importStar: __importStar,\r\n __importDefault: __importDefault,\r\n __classPrivateFieldGet: __classPrivateFieldGet,\r\n __classPrivateFieldSet: __classPrivateFieldSet,\r\n __classPrivateFieldIn: __classPrivateFieldIn,\r\n __addDisposableResource: __addDisposableResource,\r\n __disposeResources: __disposeResources,\r\n __rewriteRelativeImportExtension: __rewriteRelativeImportExtension,\r\n};\r\n","import { css, CSSResultGroup, html, LitElement, PropertyValues } from \"lit\";\r\nimport { property, query } from \"lit/decorators.js\";\r\n\r\nimport { customElement, DesignToken, HoverController, PressedController, Role } from \"@m3e/web/core\";\r\nimport { M3eButtonElement, ButtonSize } from \"@m3e/web/button\";\r\nimport { M3eIconButtonElement } from \"@m3e/web/icon-button\";\r\n\r\nimport \"@m3e/web/button-group\";\r\n\r\nimport { SplitButtonVariant } from \"./SplitButtonVariant\";\r\n\r\n/**\r\n * A button used to show an action with a menu of related actions.\r\n *\r\n * @description\r\n * The `m3e-split-button` component presents a primary action alongside a menu of related actions,\r\n * uniting two buttons in a single expressive surface. Designed for Material 3, it supports `elevated`,\r\n * `filled`, `tonal`, and `outlined` variants, and adapts to all button sizes. The leading button triggers\r\n * the main action, while the trailing icon button reveals additional options, enabling efficient workflows\r\n * and clear visual hierarchy. The split button ensures accessible, adaptive, and visually harmonious\r\n * interactions, reflecting Material 3’s principles of clarity, flexibility, and expressive design.\r\n *\r\n * @example\r\n * The following example illustrates use of the `m3e-split-button` to combine the `m3e-button`,\r\n * `m3e-icon-button`, and `m3e-menu` components into a split button.\r\n *\r\n * ```html\r\n * <m3e-split-button>\r\n * <m3e-button slot=\"leading-button\">\r\n * <m3e-icon slot=\"icon\" name=\"edit\"></m3e-icon>Edit\r\n * </m3e-button>\r\n * <m3e-icon-button slot=\"trailing-button\">\r\n * <m3e-icon name=\"keyboard_arrow_down\"></m3e-icon>\r\n * <m3e-menu-trigger for=\"menu1\"></m3e-menu-trigger>\r\n * </m3e-icon-button>\r\n * ```\r\n *\r\n * @tag m3e-split-button\r\n *\r\n * @slot leading-button - The leading button used to perform the primary action.\r\n * @slot trailing-button - The trailing icon button used to open a menu of related actions.\r\n *\r\n * @attr variant - The appearance variant of the button.\r\n * @attr size - The size of the button.\r\n *\r\n * @cssprop --m3e-split-button-extra-small-trailing-button-unselected-leading-space - Leading space for the trailing button (extra-small, unselected).\r\n * @cssprop --m3e-split-button-extra-small-trailing-button-unselected-trailing-space - Trailing space for the trailing button (extra-small, unselected).\r\n * @cssprop --m3e-split-button-small-trailing-button-unselected-leading-space - Leading space for the trailing button (small, unselected).\r\n * @cssprop --m3e-split-button-small-trailing-button-unselected-trailing-space - Trailing space for the trailing button (small, unselected).\r\n * @cssprop --m3e-split-button-medium-trailing-button-unselected-leading-space - Leading space for the trailing button (medium, unselected).\r\n * @cssprop --m3e-split-button-medium-trailing-button-unselected-trailing-space - Trailing space for the trailing button (medium, unselected).\r\n * @cssprop --m3e-split-button-large-trailing-button-unselected-leading-space - Leading space for the trailing button (large, unselected).\r\n * @cssprop --m3e-split-button-large-trailing-button-unselected-trailing-space - Trailing space for the trailing button (large, unselected).\r\n * @cssprop --m3e-split-button-extra-large-trailing-button-unselected-leading-space - Leading space for the trailing button (extra-large, unselected).\r\n * @cssprop --m3e-split-button-extra-large-trailing-button-unselected-trailing-space - Trailing space for the trailing button (extra-large, unselected).\r\n * @cssprop --m3e-split-button-extra-small-trailing-button-selected-leading-space - Leading space for the trailing button (extra-small, selected).\r\n * @cssprop --m3e-split-button-extra-small-trailing-button-selected-trailing-space - Trailing space for the trailing button (extra-small, selected).\r\n * @cssprop --m3e-split-button-small-trailing-button-selected-leading-space - Leading space for the trailing button (small, selected).\r\n * @cssprop --m3e-split-button-small-trailing-button-selected-trailing-space - Trailing space for the trailing button (small, selected).\r\n * @cssprop --m3e-split-button-medium-trailing-button-selected-leading-space - Leading space for the trailing button (medium, selected).\r\n * @cssprop --m3e-split-button-medium-trailing-button-selected-trailing-space - Trailing space for the trailing button (medium, selected).\r\n * @cssprop --m3e-split-button-large-trailing-button-selected-leading-space - Leading space for the trailing button (large, selected).\r\n * @cssprop --m3e-split-button-large-trailing-button-selected-trailing-space - Trailing space for the trailing button (large, selected).\r\n * @cssprop --m3e-split-button-extra-large-trailing-button-selected-leading-space - Leading space for the trailing button (extra-large, selected).\r\n * @cssprop --m3e-split-button-extra-large-trailing-button-selected-trailing-space - Trailing space for the trailing button (extra-large, selected).\r\n * @cssprop --m3e-split-button-extra-small-inner-corner-size - Inner corner size for the leading/trailing button (extra-small).\r\n * @cssprop --m3e-split-button-small-inner-corner-size - Inner corner size for the leading/trailing button (small).\r\n * @cssprop --m3e-split-button-medium-inner-corner-size - Inner corner size for the leading/trailing button (medium).\r\n * @cssprop --m3e-split-button-large-inner-corner-size - Inner corner size for the leading/trailing button (large).\r\n * @cssprop --m3e-split-button-extra-large-inner-corner-size - Inner corner size for the leading/trailing button (extra-large).\r\n * @cssprop --m3e-split-button-extra-small-inner-corner-hover-size - Inner corner size on hover (extra-small).\r\n * @cssprop --m3e-split-button-small-inner-corner-hover-size - Inner corner size on hover (small).\r\n * @cssprop --m3e-split-button-medium-inner-corner-hover-size - Inner corner size on hover (medium).\r\n * @cssprop --m3e-split-button-large-inner-corner-hover-size - Inner corner size on hover (large).\r\n * @cssprop --m3e-split-button-extra-large-inner-corner-hover-size - Inner corner size on hover (extra-large).\r\n * @cssprop --m3e-split-button-extra-small-inner-corner-pressed-size - Inner corner size on press (extra-small).\r\n * @cssprop --m3e-split-button-small-inner-corner-pressed-size - Inner corner size on press (small).\r\n * @cssprop --m3e-split-button-medium-inner-corner-pressed-size - Inner corner size on press (medium).\r\n * @cssprop --m3e-split-button-large-inner-corner-pressed-size - Inner corner size on press (large).\r\n * @cssprop --m3e-split-button-extra-large-inner-corner-pressed-size - Inner corner size on press (extra-large).\r\n * @cssprop --m3e-split-button-extra-small-between-spacing - Spacing between leading and trailing buttons (extra-small).\r\n * @cssprop --m3e-split-button-small-between-spacing - Spacing between leading and trailing buttons (small).\r\n * @cssprop --m3e-split-button-medium-between-spacing - Spacing between leading and trailing buttons (medium).\r\n * @cssprop --m3e-split-button-large-between-spacing - Spacing between leading and trailing buttons (large).\r\n * @cssprop --m3e-split-button-extra-large-between-spacing - Spacing between leading and trailing buttons (extra-large).\r\n */\r\n@customElement(\"m3e-split-button\")\r\nexport class M3eSplitButtonElement extends Role(LitElement, \"group\") {\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n display: inline-flex;\r\n vertical-align: middle;\r\n }\r\n ::slotted([slot=\"leading-button\"]) {\r\n flex: 1 1 auto;\r\n min-width: 0;\r\n --_button-start-shape-pressed-morph: var(--_leading-button-shape, ${DesignToken.shape.corner.full});\r\n }\r\n\r\n ::slotted([slot=\"trailing-button\"]:not([aria-expanded=\"true\"])) {\r\n --m3e-icon-button-extra-small-default-leading-space: var(\r\n --m3e-split-button-extra-small-trailing-button-unselected-leading-space,\r\n 0.75rem\r\n );\r\n --m3e-icon-button-extra-small-default-trailing-space: var(\r\n --m3e-split-button-extra-small-trailing-button-unselected-trailing-space,\r\n 0.875rem\r\n );\r\n --m3e-icon-button-small-default-leading-space: var(\r\n --m3e-split-button-small-trailing-button-unselected-leading-space,\r\n 0.75rem\r\n );\r\n --m3e-icon-button-small-default-trailing-space: var(\r\n --m3e-split-button-small-trailing-button-unselected-trailing-space,\r\n 0.875rem\r\n );\r\n --m3e-icon-button-medium-default-leading-space: var(\r\n --m3e-split-button-medium-trailing-button-unselected-leading-space,\r\n 0.8125rem\r\n );\r\n --m3e-icon-button-medium-default-trailing-space: var(\r\n --m3e-split-button-medium-trailing-button-unselected-trailing-space,\r\n 1.0625rem\r\n );\r\n --m3e-icon-button-large-default-leading-space: var(\r\n --m3e-split-button-large-trailing-button-unselected-leading-space,\r\n 1.625rem\r\n );\r\n --m3e-icon-button-large-default-trailing-space: var(\r\n --m3e-split-button-large-trailing-button-unselected-trailing-space,\r\n 2rem\r\n );\r\n --m3e-icon-button-extra-large-default-leading-space: var(\r\n --m3e-split-button-extra-large-trailing-button-unselected-leading-space,\r\n 2.3125rem\r\n );\r\n --m3e-icon-button-extra-large-default-trailing-space: var(\r\n --m3e-split-button-extra-large-trailing-button-unselected-trailing-space,\r\n 3.0625rem\r\n );\r\n }\r\n\r\n ::slotted([slot=\"trailing-button\"][aria-expanded=\"true\"]) {\r\n --m3e-icon-button-extra-small-default-leading-space: var(\r\n --m3e-split-button-extra-small-trailing-button-selected-leading-space,\r\n 0.8125rem\r\n );\r\n --m3e-icon-button-extra-small-default-trailing-space: var(\r\n --m3e-split-button-extra-small-trailing-button-selected-trailing-space,\r\n 0.8125rem\r\n );\r\n --m3e-icon-button-small-default-leading-space: var(\r\n --m3e-split-button-small-trailing-button-selected-leading-space,\r\n 0.8125rem\r\n );\r\n --m3e-icon-button-small-default-trailing-space: var(\r\n --m3e-split-button-small-trailing-button-selected-trailing-space,\r\n 0.8125rem\r\n );\r\n --m3e-icon-button-medium-default-leading-space: var(\r\n --m3e-split-button-medium-trailing-button-selected-leading-space,\r\n 0.9375rem\r\n );\r\n --m3e-icon-button-medium-default-trailing-space: var(\r\n --m3e-split-button-medium-trailing-button-selected-trailing-space,\r\n 0.9375rem\r\n );\r\n --m3e-icon-button-large-default-leading-space: var(\r\n --m3e-split-button-large-trailing-button-selected-leading-space,\r\n 1.8125rem\r\n );\r\n --m3e-icon-button-large-default-trailing-space: var(\r\n --m3e-split-button-large-trailing-button-selected-trailing-space,\r\n 1.8125rem\r\n );\r\n --m3e-icon-button-extra-large-default-leading-space: var(\r\n --m3e-split-button-extra-large-trailing-button-selected-leading-space,\r\n 2.6875rem\r\n );\r\n --m3e-icon-button-extra-large-default-trailing-space: var(\r\n --m3e-split-button-extra-large-trailing-button-selected-trailing-space,\r\n 2.6875rem\r\n );\r\n }\r\n\r\n ::slotted([slot=\"leading-button\"]:not(:hover)),\r\n ::slotted([slot=\"leading-button\"]:disabled),\r\n ::slotted([slot=\"leading-button\"][disabled-interactive]) {\r\n --m3e-connected-button-group-extra-small-inner-shape: var(\r\n --m3e-split-button-extra-small-inner-corner-size,\r\n ${DesignToken.shape.corner.extraSmall}\r\n );\r\n --m3e-connected-button-group-small-inner-shape: var(\r\n --m3e-split-button-small-inner-corner-size,\r\n ${DesignToken.shape.corner.extraSmall}\r\n );\r\n --m3e-connected-button-group-medium-inner-shape: var(\r\n --m3e-split-button-medium-inner-corner-size,\r\n ${DesignToken.shape.corner.extraSmall}\r\n );\r\n --m3e-connected-button-group-large-inner-shape: var(\r\n --m3e-split-button-large-inner-corner-size,\r\n ${DesignToken.shape.corner.small}\r\n );\r\n --m3e-connected-button-group-extra-large-inner-shape: var(\r\n --m3e-split-button-extra-large-inner-corner-size,\r\n ${DesignToken.shape.corner.medium}\r\n );\r\n }\r\n ::slotted([slot=\"leading-button\"]:hover:not(:disabled):not([disabled-interactive])),\r\n ::slotted([slot=\"trailing-button\"]:not([aria-expanded=\"true\"]):hover:not(:disabled):not([disabled-interactive])) {\r\n --m3e-connected-button-group-extra-small-inner-shape: var(\r\n --m3e-split-button-extra-small-inner-corner-hover-size,\r\n ${DesignToken.shape.corner.small}\r\n );\r\n --m3e-connected-button-group-small-inner-shape: var(\r\n --m3e-split-button-small-inner-corner-hover-size,\r\n ${DesignToken.shape.corner.medium}\r\n );\r\n --m3e-connected-button-group-medium-inner-shape: var(\r\n --m3e-split-button-medium-inner-corner-hover-size,\r\n ${DesignToken.shape.corner.medium}\r\n );\r\n --m3e-connected-button-group-large-inner-shape: var(\r\n --m3e-split-button-large-inner-corner-hover-size,\r\n ${DesignToken.shape.corner.largeIncreased}\r\n );\r\n --m3e-connected-button-group-extra-large-inner-shape: var(\r\n --m3e-split-button-extra-large-inner-corner-hover-size,\r\n ${DesignToken.shape.corner.largeIncreased}\r\n );\r\n }\r\n\r\n ::slotted([slot=\"leading-button\"]),\r\n ::slotted([slot=\"trailing-button\"]) {\r\n --m3e-connected-button-group-extra-small-inner-pressed-shape: var(\r\n --m3e-split-button-extra-small-inner-corner-pressed-size,\r\n ${DesignToken.shape.corner.small}\r\n );\r\n --m3e-connected-button-group-small-inner-pressed-shape: var(\r\n --m3e-split-button-small-inner-corner-pressed-size,\r\n ${DesignToken.shape.corner.medium}\r\n );\r\n --m3e-connected-button-group-medium-inner-pressed-shape: var(\r\n --m3e-split-button-medium-inner-corner-pressed-size,\r\n ${DesignToken.shape.corner.medium}\r\n );\r\n --m3e-connected-button-group-large-inner-pressed-shape: var(\r\n --m3e-split-button-large-inner-corner-pressed-size,\r\n ${DesignToken.shape.corner.largeIncreased}\r\n );\r\n --m3e-connected-button-group-extra-large-inner-pressed-shape: var(\r\n --m3e-split-button-extra-large-inner-corner-pressed-size,\r\n ${DesignToken.shape.corner.largeIncreased}\r\n );\r\n }\r\n\r\n ::slotted([slot=\"trailing-button\"]:not([aria-expanded=\"true\"]):not(:hover)),\r\n ::slotted([slot=\"trailing-button\"]:disabled),\r\n ::slotted([slot=\"trailing-button\"][disabled-interactive]) {\r\n --m3e-connected-button-group-extra-small-inner-shape: var(\r\n --m3e-split-button-extra-small-inner-corner-size,\r\n ${DesignToken.shape.corner.extraSmall}\r\n );\r\n --m3e-connected-button-group-small-inner-shape: var(\r\n --m3e-split-button-small-inner-corner-size,\r\n ${DesignToken.shape.corner.extraSmall}\r\n );\r\n --m3e-connected-button-group-medium-inner-shape: var(\r\n --m3e-split-button-medium-inner-corner-size,\r\n ${DesignToken.shape.corner.extraSmall}\r\n );\r\n --m3e-connected-button-group-large-inner-shape: var(\r\n --m3e-split-button-large-inner-corner-size,\r\n ${DesignToken.shape.corner.small}\r\n );\r\n --m3e-connected-button-group-extra-large-inner-shape: var(\r\n --m3e-split-button-extra-large-inner-corner-size,\r\n ${DesignToken.shape.corner.medium}\r\n );\r\n }\r\n\r\n ::slotted([slot=\"trailing-button\"][aria-expanded=\"true\"]) {\r\n --_icon-button-icon-transform: rotate(180deg);\r\n --_button-rounded-start-shape: var(--_trailing-button-shape, ${DesignToken.shape.corner.full});\r\n --_button-rounded-end-shape: var(--_trailing-button-shape, ${DesignToken.shape.corner.full});\r\n }\r\n ::slotted([slot=\"trailing-button\"]) {\r\n --_button-end-shape-pressed-morph: var(--_trailing-button-shape, ${DesignToken.shape.corner.full});\r\n }\r\n .base {\r\n --m3e-icon-button-extra-small-icon-size: calc(\r\n var(--m3e-spit-button-extra-small-trailing-button-icon-size, 1.375rem) + ${DesignToken.density.calc(0)}\r\n );\r\n --m3e-button-extra-small-icon-size: calc(\r\n var(--m3e-spit-button-extra-small-trailing-button-icon-size, 1.375rem) + ${DesignToken.density.calc(0)}\r\n );\r\n --m3e-icon-button-small-icon-size: calc(\r\n var(--m3e-spit-button-small-trailing-button-icon-size, 1.375rem) + ${DesignToken.density.calc(-1)}\r\n );\r\n --m3e-button-small-icon-size: calc(\r\n var(--m3e-spit-button-small-trailing-button-icon-size, 1.375rem) + ${DesignToken.density.calc(-1)}\r\n );\r\n --m3e-icon-button-medium-icon-size: calc(\r\n var(--m3e-spit-button-medium-trailing-button-icon-size, 1.625rem) + ${DesignToken.density.calc(-2)}\r\n );\r\n --m3e-button-medium-icon-size: calc(\r\n var(--m3e-spit-button-medium-trailing-button-icon-size, 1.625rem) + ${DesignToken.density.calc(-2)}\r\n );\r\n --m3e-icon-button-large-icon-size: calc(\r\n var(--m3e-spit-button-large-trailing-button-icon-size, 2.375rem) + ${DesignToken.density.calc(-3)}\r\n );\r\n --m3e-button-large-icon-size: calc(\r\n var(--m3e-spit-button-large-trailing-button-icon-size, 2.375rem) + ${DesignToken.density.calc(-3)}\r\n );\r\n --m3e-icon-button-extra-large-icon-size: calc(\r\n var(--m3e-spit-button-extra-large-trailing-button-icon-size, 3.125rem) + ${DesignToken.density.calc(-3)}\r\n );\r\n --m3e-button-extra-large-icon-size: calc(\r\n var(--m3e-spit-button-extra-large-trailing-button-icon-size, 3.125rem) + ${DesignToken.density.calc(-3)}\r\n );\r\n }\r\n :host([size=\"extra-small\"]) .base {\r\n --m3e-connected-button-group-spacing: var(--m3e-split-button-extra-small-between-spacing, 0.125rem);\r\n }\r\n :host([size=\"small\"]) .base {\r\n --m3e-connected-button-group-spacing: var(--m3e-split-button-small-between-spacing, 0.125rem);\r\n }\r\n :host([size=\"medium\"]).base {\r\n --m3e-connected-button-group-spacing: var(--m3e-split-button-medium-between-spacing, 0.125rem);\r\n }\r\n :host([size=\"large\"]) .base {\r\n --m3e-connected-button-group-spacing: var(--m3e-split-button-large-between-spacing, 0.125rem);\r\n }\r\n :host([size=\"extra-large\"]) .base {\r\n --m3e-connected-button-group-spacing: var(--m3e-split-button-extra-large-between-spacing, 0.125rem);\r\n }\r\n `;\r\n\r\n @query(\".base\") private readonly _base?: HTMLElement;\r\n\r\n /** @private */ #leadingButton?: M3eButtonElement;\r\n /** @private */ #trailingButton?: M3eIconButtonElement;\r\n /** @private */ #trailingButtonHover = false;\r\n\r\n /** @private */ readonly #pressedController = new PressedController(this, {\r\n target: null,\r\n capture: true,\r\n minPressedDuration: 150,\r\n isPressedKey: (key) => key === \" \",\r\n callback: (pressed, _, target) => {\r\n switch (target) {\r\n case this.#leadingButton:\r\n this.#updateLeadingButtonShape(pressed);\r\n break;\r\n case this.#trailingButton:\r\n this.#updateTrailingButtonShape(pressed || this.#trailingButtonHover);\r\n break;\r\n }\r\n },\r\n });\r\n\r\n /** @private */ readonly #hoverController = new HoverController(this, {\r\n target: null,\r\n callback: (hovering, target) => {\r\n switch (target) {\r\n case this.#trailingButton:\r\n if (!this.#trailingButton?.disabled && !this.#trailingButton?.disabledInteractive) {\r\n this.#trailingButtonHover = hovering;\r\n this.#updateTrailingButtonShape(hovering);\r\n }\r\n break;\r\n }\r\n },\r\n });\r\n\r\n /**\r\n * The appearance variant of the button.\r\n * @default \"filled\"\r\n */\r\n @property({ reflect: true }) variant: SplitButtonVariant = \"filled\";\r\n\r\n /**\r\n * The size of the button.\r\n * @default \"small\"\r\n */\r\n @property({ reflect: true }) size: ButtonSize = \"small\";\r\n\r\n /** @inheritdoc */\r\n protected override update(changedProperties: PropertyValues<this>): void {\r\n super.update(changedProperties);\r\n\r\n if (changedProperties.has(\"variant\")) {\r\n this.#updateButtons();\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render(): unknown {\r\n return html`<m3e-button-group class=\"base\" disable-role variant=\"connected\" size=\"${this.size}\">\r\n <slot name=\"leading-button\" @slotchange=\"${this.#handleLeadingSlotChange}\"></slot>\r\n <slot name=\"trailing-button\" @slotchange=\"${this.#handleTrailingSlotChange}\"></slot>\r\n </m3e-button-group>`;\r\n }\r\n\r\n /** @private */\r\n #handleLeadingSlotChange(e: Event): void {\r\n if (this.#leadingButton) {\r\n this.#pressedController.unobserve(this.#leadingButton);\r\n }\r\n\r\n this.#leadingButton = (<HTMLSlotElement>e.target)\r\n .assignedElements({ flatten: true })\r\n .find((x) => x instanceof M3eButtonElement);\r\n\r\n if (this.#leadingButton) {\r\n this.#pressedController.observe(this.#leadingButton);\r\n }\r\n\r\n this.#updateButtons();\r\n }\r\n\r\n /** @private */\r\n #handleTrailingSlotChange(e: Event): void {\r\n if (this.#trailingButton) {\r\n this.#pressedController.unobserve(this.#trailingButton);\r\n this.#hoverController.unobserve(this.#trailingButton);\r\n }\r\n\r\n this.#trailingButton = (<HTMLSlotElement>e.target)\r\n .assignedElements({ flatten: true })\r\n .find((x) => x instanceof M3eIconButtonElement);\r\n\r\n if (this.#trailingButton) {\r\n this.#pressedController.observe(this.#trailingButton);\r\n this.#hoverController.observe(this.#trailingButton);\r\n }\r\n\r\n this.#updateButtons();\r\n }\r\n\r\n /** @private */\r\n #updateButtons(): void {\r\n if (this.#leadingButton) {\r\n this.#leadingButton.variant = this.variant;\r\n this.#leadingButton.size = this.size;\r\n this.#leadingButton.shape = \"rounded\";\r\n }\r\n\r\n if (this.#trailingButton) {\r\n this.#trailingButton.width = \"default\";\r\n this.#trailingButton.shape = \"rounded\";\r\n this.#trailingButton.setAttribute(\"variant\", this.variant);\r\n this.#trailingButton.size = this.size;\r\n }\r\n }\r\n\r\n /** @private */\r\n #updateLeadingButtonShape(update: boolean): void {\r\n if (update && this.#leadingButton) {\r\n this.#updateButtonShape(this.#leadingButton, \"--_leading-button-shape\");\r\n } else {\r\n this._base?.style.removeProperty(\"--_leading-button-shape\");\r\n }\r\n }\r\n\r\n /** @private */\r\n #updateTrailingButtonShape(update: boolean): void {\r\n if (update && this.#trailingButton) {\r\n this.#updateButtonShape(this.#trailingButton, \"--_trailing-button-shape\");\r\n } else {\r\n this._base?.style.removeProperty(\"--_trailing-button-shape\");\r\n }\r\n }\r\n\r\n /** @private */\r\n #updateButtonShape(button: HTMLElement, property: string): void {\r\n const adjustedShape = button.clientHeight / 2;\r\n if (adjustedShape) {\r\n this._base?.style.setProperty(property, `${adjustedShape}px`);\r\n }\r\n }\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-split-button\": M3eSplitButtonElement;\r\n }\r\n}\r\n"],"names":["__decorate","decorators","target","key","desc","c","arguments","length","r","Object","getOwnPropertyDescriptor","d","Reflect","decorate","i","defineProperty","__classPrivateFieldGet","receiver","state","kind","f","TypeError","has","call","value","get","__classPrivateFieldSet","set","SuppressedError","error","suppressed","message","e","Error","name","M3eSplitButtonElement","Role","LitElement","constructor","_M3eSplitButtonElement_leadingButton","_M3eSplitButtonElement_trailingButton","_M3eSplitButtonElement_trailingButtonHover","_M3eSplitButtonElement_pressedController","PressedController","capture","minPressedDuration","isPressedKey","callback","pressed","_","_M3eSplitButtonElement_instances","_M3eSplitButtonElement_updateLeadingButtonShape","_M3eSplitButtonElement_updateTrailingButtonShape","_M3eSplitButtonElement_hoverController","HoverController","hovering","disabled","disabledInteractive","variant","size","update","changedProperties","_M3eSplitButtonElement_updateButtons","render","html","_M3eSplitButtonElement_handleLeadingSlotChange","_M3eSplitButtonElement_handleTrailingSlotChange","unobserve","assignedElements","flatten","find","x","M3eButtonElement","observe","M3eIconButtonElement","shape","width","setAttribute","_M3eSplitButtonElement_updateButtonShape","_base","style","removeProperty","button","property","adjustedShape","clientHeight","setProperty","styles","css","DesignToken","corner","full","extraSmall","small","medium","largeIncreased","density","calc","query","prototype","reflect","customElement"],"mappings":"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","x_google_ignoreList":[0]}
1
+ {"version":3,"file":"split-button.js","sources":["../../src/split-button/SplitButtonElement.ts"],"sourcesContent":["import { css, CSSResultGroup, html, LitElement, PropertyValues } from \"lit\";\r\nimport { property, query } from \"lit/decorators.js\";\r\n\r\nimport { customElement, DesignToken, HoverController, PressedController, Role } from \"@m3e/web/core\";\r\nimport { M3eButtonElement, ButtonSize } from \"@m3e/web/button\";\r\nimport { M3eIconButtonElement } from \"@m3e/web/icon-button\";\r\n\r\nimport \"@m3e/web/button-group\";\r\n\r\nimport { SplitButtonVariant } from \"./SplitButtonVariant\";\r\n\r\n/**\r\n * A button used to show an action with a menu of related actions.\r\n *\r\n * @description\r\n * The `m3e-split-button` component presents a primary action alongside a menu of related actions,\r\n * uniting two buttons in a single expressive surface. Designed for Material 3, it supports `elevated`,\r\n * `filled`, `tonal`, and `outlined` variants, and adapts to all button sizes. The leading button triggers\r\n * the main action, while the trailing icon button reveals additional options, enabling efficient workflows\r\n * and clear visual hierarchy. The split button ensures accessible, adaptive, and visually harmonious\r\n * interactions, reflecting Material 3’s principles of clarity, flexibility, and expressive design.\r\n *\r\n * @example\r\n * The following example illustrates use of the `m3e-split-button` to combine the `m3e-button`,\r\n * `m3e-icon-button`, and `m3e-menu` components into a split button.\r\n *\r\n * ```html\r\n * <m3e-split-button>\r\n * <m3e-button slot=\"leading-button\">\r\n * <m3e-icon slot=\"icon\" name=\"edit\"></m3e-icon>Edit\r\n * </m3e-button>\r\n * <m3e-icon-button slot=\"trailing-button\">\r\n * <m3e-icon name=\"keyboard_arrow_down\"></m3e-icon>\r\n * <m3e-menu-trigger for=\"menu1\"></m3e-menu-trigger>\r\n * </m3e-icon-button>\r\n * ```\r\n *\r\n * @tag m3e-split-button\r\n *\r\n * @slot leading-button - The leading button used to perform the primary action.\r\n * @slot trailing-button - The trailing icon button used to open a menu of related actions.\r\n *\r\n * @attr variant - The appearance variant of the button.\r\n * @attr size - The size of the button.\r\n *\r\n * @cssprop --m3e-split-button-extra-small-trailing-button-unselected-leading-space - Leading space for the trailing button (extra-small, unselected).\r\n * @cssprop --m3e-split-button-extra-small-trailing-button-unselected-trailing-space - Trailing space for the trailing button (extra-small, unselected).\r\n * @cssprop --m3e-split-button-small-trailing-button-unselected-leading-space - Leading space for the trailing button (small, unselected).\r\n * @cssprop --m3e-split-button-small-trailing-button-unselected-trailing-space - Trailing space for the trailing button (small, unselected).\r\n * @cssprop --m3e-split-button-medium-trailing-button-unselected-leading-space - Leading space for the trailing button (medium, unselected).\r\n * @cssprop --m3e-split-button-medium-trailing-button-unselected-trailing-space - Trailing space for the trailing button (medium, unselected).\r\n * @cssprop --m3e-split-button-large-trailing-button-unselected-leading-space - Leading space for the trailing button (large, unselected).\r\n * @cssprop --m3e-split-button-large-trailing-button-unselected-trailing-space - Trailing space for the trailing button (large, unselected).\r\n * @cssprop --m3e-split-button-extra-large-trailing-button-unselected-leading-space - Leading space for the trailing button (extra-large, unselected).\r\n * @cssprop --m3e-split-button-extra-large-trailing-button-unselected-trailing-space - Trailing space for the trailing button (extra-large, unselected).\r\n * @cssprop --m3e-split-button-extra-small-trailing-button-selected-leading-space - Leading space for the trailing button (extra-small, selected).\r\n * @cssprop --m3e-split-button-extra-small-trailing-button-selected-trailing-space - Trailing space for the trailing button (extra-small, selected).\r\n * @cssprop --m3e-split-button-small-trailing-button-selected-leading-space - Leading space for the trailing button (small, selected).\r\n * @cssprop --m3e-split-button-small-trailing-button-selected-trailing-space - Trailing space for the trailing button (small, selected).\r\n * @cssprop --m3e-split-button-medium-trailing-button-selected-leading-space - Leading space for the trailing button (medium, selected).\r\n * @cssprop --m3e-split-button-medium-trailing-button-selected-trailing-space - Trailing space for the trailing button (medium, selected).\r\n * @cssprop --m3e-split-button-large-trailing-button-selected-leading-space - Leading space for the trailing button (large, selected).\r\n * @cssprop --m3e-split-button-large-trailing-button-selected-trailing-space - Trailing space for the trailing button (large, selected).\r\n * @cssprop --m3e-split-button-extra-large-trailing-button-selected-leading-space - Leading space for the trailing button (extra-large, selected).\r\n * @cssprop --m3e-split-button-extra-large-trailing-button-selected-trailing-space - Trailing space for the trailing button (extra-large, selected).\r\n * @cssprop --m3e-split-button-extra-small-inner-corner-size - Inner corner size for the leading/trailing button (extra-small).\r\n * @cssprop --m3e-split-button-small-inner-corner-size - Inner corner size for the leading/trailing button (small).\r\n * @cssprop --m3e-split-button-medium-inner-corner-size - Inner corner size for the leading/trailing button (medium).\r\n * @cssprop --m3e-split-button-large-inner-corner-size - Inner corner size for the leading/trailing button (large).\r\n * @cssprop --m3e-split-button-extra-large-inner-corner-size - Inner corner size for the leading/trailing button (extra-large).\r\n * @cssprop --m3e-split-button-extra-small-inner-corner-hover-size - Inner corner size on hover (extra-small).\r\n * @cssprop --m3e-split-button-small-inner-corner-hover-size - Inner corner size on hover (small).\r\n * @cssprop --m3e-split-button-medium-inner-corner-hover-size - Inner corner size on hover (medium).\r\n * @cssprop --m3e-split-button-large-inner-corner-hover-size - Inner corner size on hover (large).\r\n * @cssprop --m3e-split-button-extra-large-inner-corner-hover-size - Inner corner size on hover (extra-large).\r\n * @cssprop --m3e-split-button-extra-small-inner-corner-pressed-size - Inner corner size on press (extra-small).\r\n * @cssprop --m3e-split-button-small-inner-corner-pressed-size - Inner corner size on press (small).\r\n * @cssprop --m3e-split-button-medium-inner-corner-pressed-size - Inner corner size on press (medium).\r\n * @cssprop --m3e-split-button-large-inner-corner-pressed-size - Inner corner size on press (large).\r\n * @cssprop --m3e-split-button-extra-large-inner-corner-pressed-size - Inner corner size on press (extra-large).\r\n * @cssprop --m3e-split-button-extra-small-between-spacing - Spacing between leading and trailing buttons (extra-small).\r\n * @cssprop --m3e-split-button-small-between-spacing - Spacing between leading and trailing buttons (small).\r\n * @cssprop --m3e-split-button-medium-between-spacing - Spacing between leading and trailing buttons (medium).\r\n * @cssprop --m3e-split-button-large-between-spacing - Spacing between leading and trailing buttons (large).\r\n * @cssprop --m3e-split-button-extra-large-between-spacing - Spacing between leading and trailing buttons (extra-large).\r\n */\r\n@customElement(\"m3e-split-button\")\r\nexport class M3eSplitButtonElement extends Role(LitElement, \"group\") {\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n display: inline-flex;\r\n vertical-align: middle;\r\n }\r\n ::slotted([slot=\"leading-button\"]) {\r\n flex: 1 1 auto;\r\n min-width: 0;\r\n --_button-start-shape-pressed-morph: var(--_leading-button-shape, ${DesignToken.shape.corner.full});\r\n }\r\n\r\n ::slotted([slot=\"trailing-button\"]:not([aria-expanded=\"true\"])) {\r\n --m3e-icon-button-extra-small-default-leading-space: var(\r\n --m3e-split-button-extra-small-trailing-button-unselected-leading-space,\r\n 0.75rem\r\n );\r\n --m3e-icon-button-extra-small-default-trailing-space: var(\r\n --m3e-split-button-extra-small-trailing-button-unselected-trailing-space,\r\n 0.875rem\r\n );\r\n --m3e-icon-button-small-default-leading-space: var(\r\n --m3e-split-button-small-trailing-button-unselected-leading-space,\r\n 0.75rem\r\n );\r\n --m3e-icon-button-small-default-trailing-space: var(\r\n --m3e-split-button-small-trailing-button-unselected-trailing-space,\r\n 0.875rem\r\n );\r\n --m3e-icon-button-medium-default-leading-space: var(\r\n --m3e-split-button-medium-trailing-button-unselected-leading-space,\r\n 0.8125rem\r\n );\r\n --m3e-icon-button-medium-default-trailing-space: var(\r\n --m3e-split-button-medium-trailing-button-unselected-trailing-space,\r\n 1.0625rem\r\n );\r\n --m3e-icon-button-large-default-leading-space: var(\r\n --m3e-split-button-large-trailing-button-unselected-leading-space,\r\n 1.625rem\r\n );\r\n --m3e-icon-button-large-default-trailing-space: var(\r\n --m3e-split-button-large-trailing-button-unselected-trailing-space,\r\n 2rem\r\n );\r\n --m3e-icon-button-extra-large-default-leading-space: var(\r\n --m3e-split-button-extra-large-trailing-button-unselected-leading-space,\r\n 2.3125rem\r\n );\r\n --m3e-icon-button-extra-large-default-trailing-space: var(\r\n --m3e-split-button-extra-large-trailing-button-unselected-trailing-space,\r\n 3.0625rem\r\n );\r\n }\r\n\r\n ::slotted([slot=\"trailing-button\"][aria-expanded=\"true\"]) {\r\n --m3e-icon-button-extra-small-default-leading-space: var(\r\n --m3e-split-button-extra-small-trailing-button-selected-leading-space,\r\n 0.8125rem\r\n );\r\n --m3e-icon-button-extra-small-default-trailing-space: var(\r\n --m3e-split-button-extra-small-trailing-button-selected-trailing-space,\r\n 0.8125rem\r\n );\r\n --m3e-icon-button-small-default-leading-space: var(\r\n --m3e-split-button-small-trailing-button-selected-leading-space,\r\n 0.8125rem\r\n );\r\n --m3e-icon-button-small-default-trailing-space: var(\r\n --m3e-split-button-small-trailing-button-selected-trailing-space,\r\n 0.8125rem\r\n );\r\n --m3e-icon-button-medium-default-leading-space: var(\r\n --m3e-split-button-medium-trailing-button-selected-leading-space,\r\n 0.9375rem\r\n );\r\n --m3e-icon-button-medium-default-trailing-space: var(\r\n --m3e-split-button-medium-trailing-button-selected-trailing-space,\r\n 0.9375rem\r\n );\r\n --m3e-icon-button-large-default-leading-space: var(\r\n --m3e-split-button-large-trailing-button-selected-leading-space,\r\n 1.8125rem\r\n );\r\n --m3e-icon-button-large-default-trailing-space: var(\r\n --m3e-split-button-large-trailing-button-selected-trailing-space,\r\n 1.8125rem\r\n );\r\n --m3e-icon-button-extra-large-default-leading-space: var(\r\n --m3e-split-button-extra-large-trailing-button-selected-leading-space,\r\n 2.6875rem\r\n );\r\n --m3e-icon-button-extra-large-default-trailing-space: var(\r\n --m3e-split-button-extra-large-trailing-button-selected-trailing-space,\r\n 2.6875rem\r\n );\r\n }\r\n\r\n ::slotted([slot=\"leading-button\"]:not(:hover)),\r\n ::slotted([slot=\"leading-button\"]:disabled),\r\n ::slotted([slot=\"leading-button\"][disabled-interactive]) {\r\n --m3e-connected-button-group-extra-small-inner-shape: var(\r\n --m3e-split-button-extra-small-inner-corner-size,\r\n ${DesignToken.shape.corner.extraSmall}\r\n );\r\n --m3e-connected-button-group-small-inner-shape: var(\r\n --m3e-split-button-small-inner-corner-size,\r\n ${DesignToken.shape.corner.extraSmall}\r\n );\r\n --m3e-connected-button-group-medium-inner-shape: var(\r\n --m3e-split-button-medium-inner-corner-size,\r\n ${DesignToken.shape.corner.extraSmall}\r\n );\r\n --m3e-connected-button-group-large-inner-shape: var(\r\n --m3e-split-button-large-inner-corner-size,\r\n ${DesignToken.shape.corner.small}\r\n );\r\n --m3e-connected-button-group-extra-large-inner-shape: var(\r\n --m3e-split-button-extra-large-inner-corner-size,\r\n ${DesignToken.shape.corner.medium}\r\n );\r\n }\r\n ::slotted([slot=\"leading-button\"]:hover:not(:disabled):not([disabled-interactive])),\r\n ::slotted([slot=\"trailing-button\"]:not([aria-expanded=\"true\"]):hover:not(:disabled):not([disabled-interactive])) {\r\n --m3e-connected-button-group-extra-small-inner-shape: var(\r\n --m3e-split-button-extra-small-inner-corner-hover-size,\r\n ${DesignToken.shape.corner.small}\r\n );\r\n --m3e-connected-button-group-small-inner-shape: var(\r\n --m3e-split-button-small-inner-corner-hover-size,\r\n ${DesignToken.shape.corner.medium}\r\n );\r\n --m3e-connected-button-group-medium-inner-shape: var(\r\n --m3e-split-button-medium-inner-corner-hover-size,\r\n ${DesignToken.shape.corner.medium}\r\n );\r\n --m3e-connected-button-group-large-inner-shape: var(\r\n --m3e-split-button-large-inner-corner-hover-size,\r\n ${DesignToken.shape.corner.largeIncreased}\r\n );\r\n --m3e-connected-button-group-extra-large-inner-shape: var(\r\n --m3e-split-button-extra-large-inner-corner-hover-size,\r\n ${DesignToken.shape.corner.largeIncreased}\r\n );\r\n }\r\n\r\n ::slotted([slot=\"leading-button\"]),\r\n ::slotted([slot=\"trailing-button\"]) {\r\n --m3e-connected-button-group-extra-small-inner-pressed-shape: var(\r\n --m3e-split-button-extra-small-inner-corner-pressed-size,\r\n ${DesignToken.shape.corner.small}\r\n );\r\n --m3e-connected-button-group-small-inner-pressed-shape: var(\r\n --m3e-split-button-small-inner-corner-pressed-size,\r\n ${DesignToken.shape.corner.medium}\r\n );\r\n --m3e-connected-button-group-medium-inner-pressed-shape: var(\r\n --m3e-split-button-medium-inner-corner-pressed-size,\r\n ${DesignToken.shape.corner.medium}\r\n );\r\n --m3e-connected-button-group-large-inner-pressed-shape: var(\r\n --m3e-split-button-large-inner-corner-pressed-size,\r\n ${DesignToken.shape.corner.largeIncreased}\r\n );\r\n --m3e-connected-button-group-extra-large-inner-pressed-shape: var(\r\n --m3e-split-button-extra-large-inner-corner-pressed-size,\r\n ${DesignToken.shape.corner.largeIncreased}\r\n );\r\n }\r\n\r\n ::slotted([slot=\"trailing-button\"]:not([aria-expanded=\"true\"]):not(:hover)),\r\n ::slotted([slot=\"trailing-button\"]:disabled),\r\n ::slotted([slot=\"trailing-button\"][disabled-interactive]) {\r\n --m3e-connected-button-group-extra-small-inner-shape: var(\r\n --m3e-split-button-extra-small-inner-corner-size,\r\n ${DesignToken.shape.corner.extraSmall}\r\n );\r\n --m3e-connected-button-group-small-inner-shape: var(\r\n --m3e-split-button-small-inner-corner-size,\r\n ${DesignToken.shape.corner.extraSmall}\r\n );\r\n --m3e-connected-button-group-medium-inner-shape: var(\r\n --m3e-split-button-medium-inner-corner-size,\r\n ${DesignToken.shape.corner.extraSmall}\r\n );\r\n --m3e-connected-button-group-large-inner-shape: var(\r\n --m3e-split-button-large-inner-corner-size,\r\n ${DesignToken.shape.corner.small}\r\n );\r\n --m3e-connected-button-group-extra-large-inner-shape: var(\r\n --m3e-split-button-extra-large-inner-corner-size,\r\n ${DesignToken.shape.corner.medium}\r\n );\r\n }\r\n\r\n ::slotted([slot=\"trailing-button\"][aria-expanded=\"true\"]) {\r\n --_icon-button-icon-transform: rotate(180deg);\r\n --_button-rounded-start-shape: var(--_trailing-button-shape, ${DesignToken.shape.corner.full});\r\n --_button-rounded-end-shape: var(--_trailing-button-shape, ${DesignToken.shape.corner.full});\r\n }\r\n ::slotted([slot=\"trailing-button\"]) {\r\n --_button-end-shape-pressed-morph: var(--_trailing-button-shape, ${DesignToken.shape.corner.full});\r\n }\r\n .base {\r\n --m3e-icon-button-extra-small-icon-size: calc(\r\n var(--m3e-spit-button-extra-small-trailing-button-icon-size, 1.375rem) + ${DesignToken.density.calc(0)}\r\n );\r\n --m3e-button-extra-small-icon-size: calc(\r\n var(--m3e-spit-button-extra-small-trailing-button-icon-size, 1.375rem) + ${DesignToken.density.calc(0)}\r\n );\r\n --m3e-icon-button-small-icon-size: calc(\r\n var(--m3e-spit-button-small-trailing-button-icon-size, 1.375rem) + ${DesignToken.density.calc(-1)}\r\n );\r\n --m3e-button-small-icon-size: calc(\r\n var(--m3e-spit-button-small-trailing-button-icon-size, 1.375rem) + ${DesignToken.density.calc(-1)}\r\n );\r\n --m3e-icon-button-medium-icon-size: calc(\r\n var(--m3e-spit-button-medium-trailing-button-icon-size, 1.625rem) + ${DesignToken.density.calc(-2)}\r\n );\r\n --m3e-button-medium-icon-size: calc(\r\n var(--m3e-spit-button-medium-trailing-button-icon-size, 1.625rem) + ${DesignToken.density.calc(-2)}\r\n );\r\n --m3e-icon-button-large-icon-size: calc(\r\n var(--m3e-spit-button-large-trailing-button-icon-size, 2.375rem) + ${DesignToken.density.calc(-3)}\r\n );\r\n --m3e-button-large-icon-size: calc(\r\n var(--m3e-spit-button-large-trailing-button-icon-size, 2.375rem) + ${DesignToken.density.calc(-3)}\r\n );\r\n --m3e-icon-button-extra-large-icon-size: calc(\r\n var(--m3e-spit-button-extra-large-trailing-button-icon-size, 3.125rem) + ${DesignToken.density.calc(-3)}\r\n );\r\n --m3e-button-extra-large-icon-size: calc(\r\n var(--m3e-spit-button-extra-large-trailing-button-icon-size, 3.125rem) + ${DesignToken.density.calc(-3)}\r\n );\r\n }\r\n :host([size=\"extra-small\"]) .base {\r\n --m3e-connected-button-group-spacing: var(--m3e-split-button-extra-small-between-spacing, 0.125rem);\r\n }\r\n :host([size=\"small\"]) .base {\r\n --m3e-connected-button-group-spacing: var(--m3e-split-button-small-between-spacing, 0.125rem);\r\n }\r\n :host([size=\"medium\"]).base {\r\n --m3e-connected-button-group-spacing: var(--m3e-split-button-medium-between-spacing, 0.125rem);\r\n }\r\n :host([size=\"large\"]) .base {\r\n --m3e-connected-button-group-spacing: var(--m3e-split-button-large-between-spacing, 0.125rem);\r\n }\r\n :host([size=\"extra-large\"]) .base {\r\n --m3e-connected-button-group-spacing: var(--m3e-split-button-extra-large-between-spacing, 0.125rem);\r\n }\r\n `;\r\n\r\n @query(\".base\") private readonly _base?: HTMLElement;\r\n\r\n /** @private */ #leadingButton?: M3eButtonElement;\r\n /** @private */ #trailingButton?: M3eIconButtonElement;\r\n /** @private */ #trailingButtonHover = false;\r\n\r\n /** @private */ readonly #pressedController = new PressedController(this, {\r\n target: null,\r\n capture: true,\r\n minPressedDuration: 150,\r\n isPressedKey: (key) => key === \" \",\r\n callback: (pressed, _, target) => {\r\n switch (target) {\r\n case this.#leadingButton:\r\n this.#updateLeadingButtonShape(pressed);\r\n break;\r\n case this.#trailingButton:\r\n this.#updateTrailingButtonShape(pressed || this.#trailingButtonHover);\r\n break;\r\n }\r\n },\r\n });\r\n\r\n /** @private */ readonly #hoverController = new HoverController(this, {\r\n target: null,\r\n callback: (hovering, target) => {\r\n switch (target) {\r\n case this.#trailingButton:\r\n if (!this.#trailingButton?.disabled && !this.#trailingButton?.disabledInteractive) {\r\n this.#trailingButtonHover = hovering;\r\n this.#updateTrailingButtonShape(hovering);\r\n }\r\n break;\r\n }\r\n },\r\n });\r\n\r\n /**\r\n * The appearance variant of the button.\r\n * @default \"filled\"\r\n */\r\n @property({ reflect: true }) variant: SplitButtonVariant = \"filled\";\r\n\r\n /**\r\n * The size of the button.\r\n * @default \"small\"\r\n */\r\n @property({ reflect: true }) size: ButtonSize = \"small\";\r\n\r\n /** @inheritdoc */\r\n protected override update(changedProperties: PropertyValues<this>): void {\r\n super.update(changedProperties);\r\n\r\n if (changedProperties.has(\"variant\")) {\r\n this.#updateButtons();\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render(): unknown {\r\n return html`<m3e-button-group class=\"base\" disable-role variant=\"connected\" size=\"${this.size}\">\r\n <slot name=\"leading-button\" @slotchange=\"${this.#handleLeadingSlotChange}\"></slot>\r\n <slot name=\"trailing-button\" @slotchange=\"${this.#handleTrailingSlotChange}\"></slot>\r\n </m3e-button-group>`;\r\n }\r\n\r\n /** @private */\r\n #handleLeadingSlotChange(e: Event): void {\r\n if (this.#leadingButton) {\r\n this.#pressedController.unobserve(this.#leadingButton);\r\n }\r\n\r\n this.#leadingButton = (<HTMLSlotElement>e.target)\r\n .assignedElements({ flatten: true })\r\n .find((x) => x instanceof M3eButtonElement);\r\n\r\n if (this.#leadingButton) {\r\n this.#pressedController.observe(this.#leadingButton);\r\n }\r\n\r\n this.#updateButtons();\r\n }\r\n\r\n /** @private */\r\n #handleTrailingSlotChange(e: Event): void {\r\n if (this.#trailingButton) {\r\n this.#pressedController.unobserve(this.#trailingButton);\r\n this.#hoverController.unobserve(this.#trailingButton);\r\n }\r\n\r\n this.#trailingButton = (<HTMLSlotElement>e.target)\r\n .assignedElements({ flatten: true })\r\n .find((x) => x instanceof M3eIconButtonElement);\r\n\r\n if (this.#trailingButton) {\r\n this.#pressedController.observe(this.#trailingButton);\r\n this.#hoverController.observe(this.#trailingButton);\r\n }\r\n\r\n this.#updateButtons();\r\n }\r\n\r\n /** @private */\r\n #updateButtons(): void {\r\n if (this.#leadingButton) {\r\n this.#leadingButton.variant = this.variant;\r\n this.#leadingButton.size = this.size;\r\n this.#leadingButton.shape = \"rounded\";\r\n }\r\n\r\n if (this.#trailingButton) {\r\n this.#trailingButton.width = \"default\";\r\n this.#trailingButton.shape = \"rounded\";\r\n this.#trailingButton.setAttribute(\"variant\", this.variant);\r\n this.#trailingButton.size = this.size;\r\n }\r\n }\r\n\r\n /** @private */\r\n #updateLeadingButtonShape(update: boolean): void {\r\n if (update && this.#leadingButton) {\r\n this.#updateButtonShape(this.#leadingButton, \"--_leading-button-shape\");\r\n } else {\r\n this._base?.style.removeProperty(\"--_leading-button-shape\");\r\n }\r\n }\r\n\r\n /** @private */\r\n #updateTrailingButtonShape(update: boolean): void {\r\n if (update && this.#trailingButton) {\r\n this.#updateButtonShape(this.#trailingButton, \"--_trailing-button-shape\");\r\n } else {\r\n this._base?.style.removeProperty(\"--_trailing-button-shape\");\r\n }\r\n }\r\n\r\n /** @private */\r\n #updateButtonShape(button: HTMLElement, property: string): void {\r\n const adjustedShape = button.clientHeight / 2;\r\n if (adjustedShape) {\r\n this._base?.style.setProperty(property, `${adjustedShape}px`);\r\n }\r\n }\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-split-button\": M3eSplitButtonElement;\r\n }\r\n}\r\n"],"names":["M3eSplitButtonElement","Role","LitElement","constructor","_M3eSplitButtonElement_leadingButton","set","_M3eSplitButtonElement_trailingButton","_M3eSplitButtonElement_trailingButtonHover","_M3eSplitButtonElement_pressedController","PressedController","target","capture","minPressedDuration","isPressedKey","key","callback","pressed","_","__classPrivateFieldGet","_M3eSplitButtonElement_instances","_M3eSplitButtonElement_updateLeadingButtonShape","call","_M3eSplitButtonElement_updateTrailingButtonShape","_M3eSplitButtonElement_hoverController","HoverController","hovering","disabled","disabledInteractive","__classPrivateFieldSet","variant","size","update","changedProperties","has","_M3eSplitButtonElement_updateButtons","render","html","_M3eSplitButtonElement_handleLeadingSlotChange","_M3eSplitButtonElement_handleTrailingSlotChange","e","unobserve","assignedElements","flatten","find","x","M3eButtonElement","observe","M3eIconButtonElement","shape","width","setAttribute","_M3eSplitButtonElement_updateButtonShape","_base","style","removeProperty","button","property","adjustedShape","clientHeight","setProperty","styles","css","DesignToken","corner","full","extraSmall","small","medium","largeIncreased","density","calc","__decorate","query","prototype","reflect","customElement"],"mappings":"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"}
@@ -3,5 +3,5 @@
3
3
  * Copyright (c) 2025 matraic
4
4
  * See LICENSE file in the project root for full license text.
5
5
  */
6
- import{LitElement as e,html as t,css as n}from"lit";import{query as a,property as r}from"lit/decorators.js";import{Role as i,PressedController as s,HoverController as o,DesignToken as l,customElement as c}from"@m3e/web/core";import{M3eButtonElement as u}from"@m3e/web/button";import{M3eIconButtonElement as m}from"@m3e/web/icon-button";import"@m3e/web/button-group";function p(e,t,n,a){var r,i=arguments.length,s=i<3?t:null===a?a=Object.getOwnPropertyDescriptor(t,n):a;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,n,a);else for(var o=e.length-1;o>=0;o--)(r=e[o])&&(s=(i<3?r(s):i>3?r(t,n,s):r(t,n))||s);return i>3&&s&&Object.defineProperty(t,n,s),s}function d(e,t,n,a){if("a"===n&&!a)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?e!==t||!a:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===n?a:"a"===n?a.call(e):a?a.value:t.get(e)}function b(e,t,n,a,r){if("m"===a)throw new TypeError("Private method is not writable");if("a"===a&&!r)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?e!==t||!r:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===a?r.call(e,n):r?r.value=n:t.set(e,n),n}var g,h,f,v,x,z,w,$,y,_,P,k;"function"==typeof SuppressedError&&SuppressedError;let E=class extends(i(e,"group")){constructor(){super(...arguments),g.add(this),h.set(this,void 0),f.set(this,void 0),v.set(this,!1),x.set(this,new s(this,{target:null,capture:!0,minPressedDuration:150,isPressedKey:e=>" "===e,callback:(e,t,n)=>{switch(n){case d(this,h,"f"):d(this,g,"m",_).call(this,e);break;case d(this,f,"f"):d(this,g,"m",P).call(this,e||d(this,v,"f"))}}})),z.set(this,new o(this,{target:null,callback:(e,t)=>{if(t===d(this,f,"f"))d(this,f,"f")?.disabled||d(this,f,"f")?.disabledInteractive||(b(this,v,e,"f"),d(this,g,"m",P).call(this,e))}})),this.variant="filled",this.size="small"}update(e){super.update(e),e.has("variant")&&d(this,g,"m",y).call(this)}render(){return t`<m3e-button-group class="base" disable-role variant="connected" size="${this.size}"><slot name="leading-button" @slotchange="${d(this,g,"m",w)}"></slot><slot name="trailing-button" @slotchange="${d(this,g,"m",$)}"></slot></m3e-button-group>`}};h=new WeakMap,f=new WeakMap,v=new WeakMap,x=new WeakMap,z=new WeakMap,g=new WeakSet,w=function(e){d(this,h,"f")&&d(this,x,"f").unobserve(d(this,h,"f")),b(this,h,e.target.assignedElements({flatten:!0}).find(e=>e instanceof u),"f"),d(this,h,"f")&&d(this,x,"f").observe(d(this,h,"f")),d(this,g,"m",y).call(this)},$=function(e){d(this,f,"f")&&(d(this,x,"f").unobserve(d(this,f,"f")),d(this,z,"f").unobserve(d(this,f,"f"))),b(this,f,e.target.assignedElements({flatten:!0}).find(e=>e instanceof m),"f"),d(this,f,"f")&&(d(this,x,"f").observe(d(this,f,"f")),d(this,z,"f").observe(d(this,f,"f"))),d(this,g,"m",y).call(this)},y=function(){d(this,h,"f")&&(d(this,h,"f").variant=this.variant,d(this,h,"f").size=this.size,d(this,h,"f").shape="rounded"),d(this,f,"f")&&(d(this,f,"f").width="default",d(this,f,"f").shape="rounded",d(this,f,"f").setAttribute("variant",this.variant),d(this,f,"f").size=this.size)},_=function(e){e&&d(this,h,"f")?d(this,g,"m",k).call(this,d(this,h,"f"),"--_leading-button-shape"):this._base?.style.removeProperty("--_leading-button-shape")},P=function(e){e&&d(this,f,"f")?d(this,g,"m",k).call(this,d(this,f,"f"),"--_trailing-button-shape"):this._base?.style.removeProperty("--_trailing-button-shape")},k=function(e,t){const n=e.clientHeight/2;n&&this._base?.style.setProperty(t,`${n}px`)},E.styles=n`:host { display: inline-flex; vertical-align: middle; } ::slotted([slot="leading-button"]) { flex: 1 1 auto; min-width: 0; --_button-start-shape-pressed-morph: var(--_leading-button-shape, ${l.shape.corner.full}); } ::slotted([slot="trailing-button"]:not([aria-expanded="true"])) { --m3e-icon-button-extra-small-default-leading-space: var( --m3e-split-button-extra-small-trailing-button-unselected-leading-space, 0.75rem ); --m3e-icon-button-extra-small-default-trailing-space: var( --m3e-split-button-extra-small-trailing-button-unselected-trailing-space, 0.875rem ); --m3e-icon-button-small-default-leading-space: var( --m3e-split-button-small-trailing-button-unselected-leading-space, 0.75rem ); --m3e-icon-button-small-default-trailing-space: var( --m3e-split-button-small-trailing-button-unselected-trailing-space, 0.875rem ); --m3e-icon-button-medium-default-leading-space: var( --m3e-split-button-medium-trailing-button-unselected-leading-space, 0.8125rem ); --m3e-icon-button-medium-default-trailing-space: var( --m3e-split-button-medium-trailing-button-unselected-trailing-space, 1.0625rem ); --m3e-icon-button-large-default-leading-space: var( --m3e-split-button-large-trailing-button-unselected-leading-space, 1.625rem ); --m3e-icon-button-large-default-trailing-space: var( --m3e-split-button-large-trailing-button-unselected-trailing-space, 2rem ); --m3e-icon-button-extra-large-default-leading-space: var( --m3e-split-button-extra-large-trailing-button-unselected-leading-space, 2.3125rem ); --m3e-icon-button-extra-large-default-trailing-space: var( --m3e-split-button-extra-large-trailing-button-unselected-trailing-space, 3.0625rem ); } ::slotted([slot="trailing-button"][aria-expanded="true"]) { --m3e-icon-button-extra-small-default-leading-space: var( --m3e-split-button-extra-small-trailing-button-selected-leading-space, 0.8125rem ); --m3e-icon-button-extra-small-default-trailing-space: var( --m3e-split-button-extra-small-trailing-button-selected-trailing-space, 0.8125rem ); --m3e-icon-button-small-default-leading-space: var( --m3e-split-button-small-trailing-button-selected-leading-space, 0.8125rem ); --m3e-icon-button-small-default-trailing-space: var( --m3e-split-button-small-trailing-button-selected-trailing-space, 0.8125rem ); --m3e-icon-button-medium-default-leading-space: var( --m3e-split-button-medium-trailing-button-selected-leading-space, 0.9375rem ); --m3e-icon-button-medium-default-trailing-space: var( --m3e-split-button-medium-trailing-button-selected-trailing-space, 0.9375rem ); --m3e-icon-button-large-default-leading-space: var( --m3e-split-button-large-trailing-button-selected-leading-space, 1.8125rem ); --m3e-icon-button-large-default-trailing-space: var( --m3e-split-button-large-trailing-button-selected-trailing-space, 1.8125rem ); --m3e-icon-button-extra-large-default-leading-space: var( --m3e-split-button-extra-large-trailing-button-selected-leading-space, 2.6875rem ); --m3e-icon-button-extra-large-default-trailing-space: var( --m3e-split-button-extra-large-trailing-button-selected-trailing-space, 2.6875rem ); } ::slotted([slot="leading-button"]:not(:hover)), ::slotted([slot="leading-button"]:disabled), ::slotted([slot="leading-button"][disabled-interactive]) { --m3e-connected-button-group-extra-small-inner-shape: var( --m3e-split-button-extra-small-inner-corner-size, ${l.shape.corner.extraSmall} ); --m3e-connected-button-group-small-inner-shape: var( --m3e-split-button-small-inner-corner-size, ${l.shape.corner.extraSmall} ); --m3e-connected-button-group-medium-inner-shape: var( --m3e-split-button-medium-inner-corner-size, ${l.shape.corner.extraSmall} ); --m3e-connected-button-group-large-inner-shape: var( --m3e-split-button-large-inner-corner-size, ${l.shape.corner.small} ); --m3e-connected-button-group-extra-large-inner-shape: var( --m3e-split-button-extra-large-inner-corner-size, ${l.shape.corner.medium} ); } ::slotted([slot="leading-button"]:hover:not(:disabled):not([disabled-interactive])), ::slotted([slot="trailing-button"]:not([aria-expanded="true"]):hover:not(:disabled):not([disabled-interactive])) { --m3e-connected-button-group-extra-small-inner-shape: var( --m3e-split-button-extra-small-inner-corner-hover-size, ${l.shape.corner.small} ); --m3e-connected-button-group-small-inner-shape: var( --m3e-split-button-small-inner-corner-hover-size, ${l.shape.corner.medium} ); --m3e-connected-button-group-medium-inner-shape: var( --m3e-split-button-medium-inner-corner-hover-size, ${l.shape.corner.medium} ); --m3e-connected-button-group-large-inner-shape: var( --m3e-split-button-large-inner-corner-hover-size, ${l.shape.corner.largeIncreased} ); --m3e-connected-button-group-extra-large-inner-shape: var( --m3e-split-button-extra-large-inner-corner-hover-size, ${l.shape.corner.largeIncreased} ); } ::slotted([slot="leading-button"]), ::slotted([slot="trailing-button"]) { --m3e-connected-button-group-extra-small-inner-pressed-shape: var( --m3e-split-button-extra-small-inner-corner-pressed-size, ${l.shape.corner.small} ); --m3e-connected-button-group-small-inner-pressed-shape: var( --m3e-split-button-small-inner-corner-pressed-size, ${l.shape.corner.medium} ); --m3e-connected-button-group-medium-inner-pressed-shape: var( --m3e-split-button-medium-inner-corner-pressed-size, ${l.shape.corner.medium} ); --m3e-connected-button-group-large-inner-pressed-shape: var( --m3e-split-button-large-inner-corner-pressed-size, ${l.shape.corner.largeIncreased} ); --m3e-connected-button-group-extra-large-inner-pressed-shape: var( --m3e-split-button-extra-large-inner-corner-pressed-size, ${l.shape.corner.largeIncreased} ); } ::slotted([slot="trailing-button"]:not([aria-expanded="true"]):not(:hover)), ::slotted([slot="trailing-button"]:disabled), ::slotted([slot="trailing-button"][disabled-interactive]) { --m3e-connected-button-group-extra-small-inner-shape: var( --m3e-split-button-extra-small-inner-corner-size, ${l.shape.corner.extraSmall} ); --m3e-connected-button-group-small-inner-shape: var( --m3e-split-button-small-inner-corner-size, ${l.shape.corner.extraSmall} ); --m3e-connected-button-group-medium-inner-shape: var( --m3e-split-button-medium-inner-corner-size, ${l.shape.corner.extraSmall} ); --m3e-connected-button-group-large-inner-shape: var( --m3e-split-button-large-inner-corner-size, ${l.shape.corner.small} ); --m3e-connected-button-group-extra-large-inner-shape: var( --m3e-split-button-extra-large-inner-corner-size, ${l.shape.corner.medium} ); } ::slotted([slot="trailing-button"][aria-expanded="true"]) { --_icon-button-icon-transform: rotate(180deg); --_button-rounded-start-shape: var(--_trailing-button-shape, ${l.shape.corner.full}); --_button-rounded-end-shape: var(--_trailing-button-shape, ${l.shape.corner.full}); } ::slotted([slot="trailing-button"]) { --_button-end-shape-pressed-morph: var(--_trailing-button-shape, ${l.shape.corner.full}); } .base { --m3e-icon-button-extra-small-icon-size: calc( var(--m3e-spit-button-extra-small-trailing-button-icon-size, 1.375rem) + ${l.density.calc(0)} ); --m3e-button-extra-small-icon-size: calc( var(--m3e-spit-button-extra-small-trailing-button-icon-size, 1.375rem) + ${l.density.calc(0)} ); --m3e-icon-button-small-icon-size: calc( var(--m3e-spit-button-small-trailing-button-icon-size, 1.375rem) + ${l.density.calc(-1)} ); --m3e-button-small-icon-size: calc( var(--m3e-spit-button-small-trailing-button-icon-size, 1.375rem) + ${l.density.calc(-1)} ); --m3e-icon-button-medium-icon-size: calc( var(--m3e-spit-button-medium-trailing-button-icon-size, 1.625rem) + ${l.density.calc(-2)} ); --m3e-button-medium-icon-size: calc( var(--m3e-spit-button-medium-trailing-button-icon-size, 1.625rem) + ${l.density.calc(-2)} ); --m3e-icon-button-large-icon-size: calc( var(--m3e-spit-button-large-trailing-button-icon-size, 2.375rem) + ${l.density.calc(-3)} ); --m3e-button-large-icon-size: calc( var(--m3e-spit-button-large-trailing-button-icon-size, 2.375rem) + ${l.density.calc(-3)} ); --m3e-icon-button-extra-large-icon-size: calc( var(--m3e-spit-button-extra-large-trailing-button-icon-size, 3.125rem) + ${l.density.calc(-3)} ); --m3e-button-extra-large-icon-size: calc( var(--m3e-spit-button-extra-large-trailing-button-icon-size, 3.125rem) + ${l.density.calc(-3)} ); } :host([size="extra-small"]) .base { --m3e-connected-button-group-spacing: var(--m3e-split-button-extra-small-between-spacing, 0.125rem); } :host([size="small"]) .base { --m3e-connected-button-group-spacing: var(--m3e-split-button-small-between-spacing, 0.125rem); } :host([size="medium"]).base { --m3e-connected-button-group-spacing: var(--m3e-split-button-medium-between-spacing, 0.125rem); } :host([size="large"]) .base { --m3e-connected-button-group-spacing: var(--m3e-split-button-large-between-spacing, 0.125rem); } :host([size="extra-large"]) .base { --m3e-connected-button-group-spacing: var(--m3e-split-button-extra-large-between-spacing, 0.125rem); }`,p([a(".base")],E.prototype,"_base",void 0),p([r({reflect:!0})],E.prototype,"variant",void 0),p([r({reflect:!0})],E.prototype,"size",void 0),E=p([c("m3e-split-button")],E);export{E as M3eSplitButtonElement};
6
+ import{__classPrivateFieldGet as e,__classPrivateFieldSet as t,__decorate as n}from"tslib";import{LitElement as a,html as i,css as r}from"lit";import{query as s,property as l}from"lit/decorators.js";import{Role as o,PressedController as c,HoverController as m,DesignToken as u,customElement as p}from"@m3e/web/core";import{M3eButtonElement as d}from"@m3e/web/button";import{M3eIconButtonElement as b}from"@m3e/web/icon-button";import"@m3e/web/button-group";var g,h,v,f,x,z,$,y,w,_,k,S;let W=class extends(o(a,"group")){constructor(){super(...arguments),g.add(this),h.set(this,void 0),v.set(this,void 0),f.set(this,!1),x.set(this,new c(this,{target:null,capture:!0,minPressedDuration:150,isPressedKey:e=>" "===e,callback:(t,n,a)=>{switch(a){case e(this,h,"f"):e(this,g,"m",_).call(this,t);break;case e(this,v,"f"):e(this,g,"m",k).call(this,t||e(this,f,"f"))}}})),z.set(this,new m(this,{target:null,callback:(n,a)=>{if(a===e(this,v,"f"))e(this,v,"f")?.disabled||e(this,v,"f")?.disabledInteractive||(t(this,f,n,"f"),e(this,g,"m",k).call(this,n))}})),this.variant="filled",this.size="small"}update(t){super.update(t),t.has("variant")&&e(this,g,"m",w).call(this)}render(){return i`<m3e-button-group class="base" disable-role variant="connected" size="${this.size}"><slot name="leading-button" @slotchange="${e(this,g,"m",$)}"></slot><slot name="trailing-button" @slotchange="${e(this,g,"m",y)}"></slot></m3e-button-group>`}};h=new WeakMap,v=new WeakMap,f=new WeakMap,x=new WeakMap,z=new WeakMap,g=new WeakSet,$=function(n){e(this,h,"f")&&e(this,x,"f").unobserve(e(this,h,"f")),t(this,h,n.target.assignedElements({flatten:!0}).find(e=>e instanceof d),"f"),e(this,h,"f")&&e(this,x,"f").observe(e(this,h,"f")),e(this,g,"m",w).call(this)},y=function(n){e(this,v,"f")&&(e(this,x,"f").unobserve(e(this,v,"f")),e(this,z,"f").unobserve(e(this,v,"f"))),t(this,v,n.target.assignedElements({flatten:!0}).find(e=>e instanceof b),"f"),e(this,v,"f")&&(e(this,x,"f").observe(e(this,v,"f")),e(this,z,"f").observe(e(this,v,"f"))),e(this,g,"m",w).call(this)},w=function(){e(this,h,"f")&&(e(this,h,"f").variant=this.variant,e(this,h,"f").size=this.size,e(this,h,"f").shape="rounded"),e(this,v,"f")&&(e(this,v,"f").width="default",e(this,v,"f").shape="rounded",e(this,v,"f").setAttribute("variant",this.variant),e(this,v,"f").size=this.size)},_=function(t){t&&e(this,h,"f")?e(this,g,"m",S).call(this,e(this,h,"f"),"--_leading-button-shape"):this._base?.style.removeProperty("--_leading-button-shape")},k=function(t){t&&e(this,v,"f")?e(this,g,"m",S).call(this,e(this,v,"f"),"--_trailing-button-shape"):this._base?.style.removeProperty("--_trailing-button-shape")},S=function(e,t){const n=e.clientHeight/2;n&&this._base?.style.setProperty(t,`${n}px`)},W.styles=r`:host { display: inline-flex; vertical-align: middle; } ::slotted([slot="leading-button"]) { flex: 1 1 auto; min-width: 0; --_button-start-shape-pressed-morph: var(--_leading-button-shape, ${u.shape.corner.full}); } ::slotted([slot="trailing-button"]:not([aria-expanded="true"])) { --m3e-icon-button-extra-small-default-leading-space: var( --m3e-split-button-extra-small-trailing-button-unselected-leading-space, 0.75rem ); --m3e-icon-button-extra-small-default-trailing-space: var( --m3e-split-button-extra-small-trailing-button-unselected-trailing-space, 0.875rem ); --m3e-icon-button-small-default-leading-space: var( --m3e-split-button-small-trailing-button-unselected-leading-space, 0.75rem ); --m3e-icon-button-small-default-trailing-space: var( --m3e-split-button-small-trailing-button-unselected-trailing-space, 0.875rem ); --m3e-icon-button-medium-default-leading-space: var( --m3e-split-button-medium-trailing-button-unselected-leading-space, 0.8125rem ); --m3e-icon-button-medium-default-trailing-space: var( --m3e-split-button-medium-trailing-button-unselected-trailing-space, 1.0625rem ); --m3e-icon-button-large-default-leading-space: var( --m3e-split-button-large-trailing-button-unselected-leading-space, 1.625rem ); --m3e-icon-button-large-default-trailing-space: var( --m3e-split-button-large-trailing-button-unselected-trailing-space, 2rem ); --m3e-icon-button-extra-large-default-leading-space: var( --m3e-split-button-extra-large-trailing-button-unselected-leading-space, 2.3125rem ); --m3e-icon-button-extra-large-default-trailing-space: var( --m3e-split-button-extra-large-trailing-button-unselected-trailing-space, 3.0625rem ); } ::slotted([slot="trailing-button"][aria-expanded="true"]) { --m3e-icon-button-extra-small-default-leading-space: var( --m3e-split-button-extra-small-trailing-button-selected-leading-space, 0.8125rem ); --m3e-icon-button-extra-small-default-trailing-space: var( --m3e-split-button-extra-small-trailing-button-selected-trailing-space, 0.8125rem ); --m3e-icon-button-small-default-leading-space: var( --m3e-split-button-small-trailing-button-selected-leading-space, 0.8125rem ); --m3e-icon-button-small-default-trailing-space: var( --m3e-split-button-small-trailing-button-selected-trailing-space, 0.8125rem ); --m3e-icon-button-medium-default-leading-space: var( --m3e-split-button-medium-trailing-button-selected-leading-space, 0.9375rem ); --m3e-icon-button-medium-default-trailing-space: var( --m3e-split-button-medium-trailing-button-selected-trailing-space, 0.9375rem ); --m3e-icon-button-large-default-leading-space: var( --m3e-split-button-large-trailing-button-selected-leading-space, 1.8125rem ); --m3e-icon-button-large-default-trailing-space: var( --m3e-split-button-large-trailing-button-selected-trailing-space, 1.8125rem ); --m3e-icon-button-extra-large-default-leading-space: var( --m3e-split-button-extra-large-trailing-button-selected-leading-space, 2.6875rem ); --m3e-icon-button-extra-large-default-trailing-space: var( --m3e-split-button-extra-large-trailing-button-selected-trailing-space, 2.6875rem ); } ::slotted([slot="leading-button"]:not(:hover)), ::slotted([slot="leading-button"]:disabled), ::slotted([slot="leading-button"][disabled-interactive]) { --m3e-connected-button-group-extra-small-inner-shape: var( --m3e-split-button-extra-small-inner-corner-size, ${u.shape.corner.extraSmall} ); --m3e-connected-button-group-small-inner-shape: var( --m3e-split-button-small-inner-corner-size, ${u.shape.corner.extraSmall} ); --m3e-connected-button-group-medium-inner-shape: var( --m3e-split-button-medium-inner-corner-size, ${u.shape.corner.extraSmall} ); --m3e-connected-button-group-large-inner-shape: var( --m3e-split-button-large-inner-corner-size, ${u.shape.corner.small} ); --m3e-connected-button-group-extra-large-inner-shape: var( --m3e-split-button-extra-large-inner-corner-size, ${u.shape.corner.medium} ); } ::slotted([slot="leading-button"]:hover:not(:disabled):not([disabled-interactive])), ::slotted([slot="trailing-button"]:not([aria-expanded="true"]):hover:not(:disabled):not([disabled-interactive])) { --m3e-connected-button-group-extra-small-inner-shape: var( --m3e-split-button-extra-small-inner-corner-hover-size, ${u.shape.corner.small} ); --m3e-connected-button-group-small-inner-shape: var( --m3e-split-button-small-inner-corner-hover-size, ${u.shape.corner.medium} ); --m3e-connected-button-group-medium-inner-shape: var( --m3e-split-button-medium-inner-corner-hover-size, ${u.shape.corner.medium} ); --m3e-connected-button-group-large-inner-shape: var( --m3e-split-button-large-inner-corner-hover-size, ${u.shape.corner.largeIncreased} ); --m3e-connected-button-group-extra-large-inner-shape: var( --m3e-split-button-extra-large-inner-corner-hover-size, ${u.shape.corner.largeIncreased} ); } ::slotted([slot="leading-button"]), ::slotted([slot="trailing-button"]) { --m3e-connected-button-group-extra-small-inner-pressed-shape: var( --m3e-split-button-extra-small-inner-corner-pressed-size, ${u.shape.corner.small} ); --m3e-connected-button-group-small-inner-pressed-shape: var( --m3e-split-button-small-inner-corner-pressed-size, ${u.shape.corner.medium} ); --m3e-connected-button-group-medium-inner-pressed-shape: var( --m3e-split-button-medium-inner-corner-pressed-size, ${u.shape.corner.medium} ); --m3e-connected-button-group-large-inner-pressed-shape: var( --m3e-split-button-large-inner-corner-pressed-size, ${u.shape.corner.largeIncreased} ); --m3e-connected-button-group-extra-large-inner-pressed-shape: var( --m3e-split-button-extra-large-inner-corner-pressed-size, ${u.shape.corner.largeIncreased} ); } ::slotted([slot="trailing-button"]:not([aria-expanded="true"]):not(:hover)), ::slotted([slot="trailing-button"]:disabled), ::slotted([slot="trailing-button"][disabled-interactive]) { --m3e-connected-button-group-extra-small-inner-shape: var( --m3e-split-button-extra-small-inner-corner-size, ${u.shape.corner.extraSmall} ); --m3e-connected-button-group-small-inner-shape: var( --m3e-split-button-small-inner-corner-size, ${u.shape.corner.extraSmall} ); --m3e-connected-button-group-medium-inner-shape: var( --m3e-split-button-medium-inner-corner-size, ${u.shape.corner.extraSmall} ); --m3e-connected-button-group-large-inner-shape: var( --m3e-split-button-large-inner-corner-size, ${u.shape.corner.small} ); --m3e-connected-button-group-extra-large-inner-shape: var( --m3e-split-button-extra-large-inner-corner-size, ${u.shape.corner.medium} ); } ::slotted([slot="trailing-button"][aria-expanded="true"]) { --_icon-button-icon-transform: rotate(180deg); --_button-rounded-start-shape: var(--_trailing-button-shape, ${u.shape.corner.full}); --_button-rounded-end-shape: var(--_trailing-button-shape, ${u.shape.corner.full}); } ::slotted([slot="trailing-button"]) { --_button-end-shape-pressed-morph: var(--_trailing-button-shape, ${u.shape.corner.full}); } .base { --m3e-icon-button-extra-small-icon-size: calc( var(--m3e-spit-button-extra-small-trailing-button-icon-size, 1.375rem) + ${u.density.calc(0)} ); --m3e-button-extra-small-icon-size: calc( var(--m3e-spit-button-extra-small-trailing-button-icon-size, 1.375rem) + ${u.density.calc(0)} ); --m3e-icon-button-small-icon-size: calc( var(--m3e-spit-button-small-trailing-button-icon-size, 1.375rem) + ${u.density.calc(-1)} ); --m3e-button-small-icon-size: calc( var(--m3e-spit-button-small-trailing-button-icon-size, 1.375rem) + ${u.density.calc(-1)} ); --m3e-icon-button-medium-icon-size: calc( var(--m3e-spit-button-medium-trailing-button-icon-size, 1.625rem) + ${u.density.calc(-2)} ); --m3e-button-medium-icon-size: calc( var(--m3e-spit-button-medium-trailing-button-icon-size, 1.625rem) + ${u.density.calc(-2)} ); --m3e-icon-button-large-icon-size: calc( var(--m3e-spit-button-large-trailing-button-icon-size, 2.375rem) + ${u.density.calc(-3)} ); --m3e-button-large-icon-size: calc( var(--m3e-spit-button-large-trailing-button-icon-size, 2.375rem) + ${u.density.calc(-3)} ); --m3e-icon-button-extra-large-icon-size: calc( var(--m3e-spit-button-extra-large-trailing-button-icon-size, 3.125rem) + ${u.density.calc(-3)} ); --m3e-button-extra-large-icon-size: calc( var(--m3e-spit-button-extra-large-trailing-button-icon-size, 3.125rem) + ${u.density.calc(-3)} ); } :host([size="extra-small"]) .base { --m3e-connected-button-group-spacing: var(--m3e-split-button-extra-small-between-spacing, 0.125rem); } :host([size="small"]) .base { --m3e-connected-button-group-spacing: var(--m3e-split-button-small-between-spacing, 0.125rem); } :host([size="medium"]).base { --m3e-connected-button-group-spacing: var(--m3e-split-button-medium-between-spacing, 0.125rem); } :host([size="large"]) .base { --m3e-connected-button-group-spacing: var(--m3e-split-button-large-between-spacing, 0.125rem); } :host([size="extra-large"]) .base { --m3e-connected-button-group-spacing: var(--m3e-split-button-extra-large-between-spacing, 0.125rem); }`,n([s(".base")],W.prototype,"_base",void 0),n([l({reflect:!0})],W.prototype,"variant",void 0),n([l({reflect:!0})],W.prototype,"size",void 0),W=n([p("m3e-split-button")],W);export{W as M3eSplitButtonElement};
7
7
  //# sourceMappingURL=split-button.min.js.map