@ds-mo/ui 14.15.1 → 14.16.0

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 (243) hide show
  1. package/dist/.package-ready.json +1 -1
  2. package/dist/agent-patterns.json +3 -3
  3. package/dist/agent.json +159 -22
  4. package/dist/angular/ds-button-unfilled.d.ts +1 -1
  5. package/dist/angular/ds-button-unfilled.js +3 -3
  6. package/dist/angular/ds-filter-menu.d.ts +1 -1
  7. package/dist/angular/ds-filter-menu.js +3 -3
  8. package/dist/angular/ds-select.d.ts +1 -1
  9. package/dist/angular/ds-select.js +3 -3
  10. package/dist/angular/ds-table-sort.d.ts +16 -0
  11. package/dist/angular/ds-table-sort.js +43 -0
  12. package/dist/angular/index.d.ts +1 -1
  13. package/dist/angular/index.js +1 -0
  14. package/dist/angular/proxies.d.ts +1 -0
  15. package/dist/angular/proxies.js +1 -0
  16. package/dist/components/ds-agent-activity.js +1 -1
  17. package/dist/components/ds-agent-questionnaire.js +1 -1
  18. package/dist/components/ds-agent-response.js +1 -1
  19. package/dist/components/ds-agent-source-list.js +1 -1
  20. package/dist/components/ds-agent-tool-call.js +1 -1
  21. package/dist/components/ds-attachment-list.js +1 -1
  22. package/dist/components/ds-badge.js +1 -1
  23. package/dist/components/ds-banner.js +1 -1
  24. package/dist/components/ds-banner.js.map +1 -1
  25. package/dist/components/ds-bar-action.js +1 -1
  26. package/dist/components/ds-bar-action.js.map +1 -1
  27. package/dist/components/ds-bar-nav.js +1 -1
  28. package/dist/components/ds-bar-title.js +1 -1
  29. package/dist/components/ds-bar-workflow.js +1 -1
  30. package/dist/components/ds-bar-workflow.js.map +1 -1
  31. package/dist/components/ds-breadcrumb.js +1 -1
  32. package/dist/components/ds-button-filled.js +1 -1
  33. package/dist/components/ds-button-unfilled.js +1 -1
  34. package/dist/components/ds-card-chart.js +1 -1
  35. package/dist/components/ds-card-chart.js.map +1 -1
  36. package/dist/components/ds-card-overview.js +1 -1
  37. package/dist/components/ds-card-overview.js.map +1 -1
  38. package/dist/components/ds-card-setting.js +1 -1
  39. package/dist/components/ds-card-setting.js.map +1 -1
  40. package/dist/components/ds-chart-legend.js +1 -1
  41. package/dist/components/ds-chart-legend.js.map +1 -1
  42. package/dist/components/ds-chart.js +1 -1
  43. package/dist/components/ds-chart.js.map +1 -1
  44. package/dist/components/ds-checkbox.js +1 -1
  45. package/dist/components/ds-chip.js +1 -1
  46. package/dist/components/ds-chip.js.map +1 -1
  47. package/dist/components/ds-code-block.js +1 -1
  48. package/dist/components/ds-conversation-list-item.js +1 -1
  49. package/dist/components/ds-conversation-list-item.js.map +1 -1
  50. package/dist/components/ds-conversation-list-section.js +1 -1
  51. package/dist/components/ds-empty-state.js +1 -1
  52. package/dist/components/ds-field.js +1 -1
  53. package/dist/components/ds-filter-menu.js +1 -1
  54. package/dist/components/ds-filter-menu.js.map +1 -1
  55. package/dist/components/ds-input.js +1 -1
  56. package/dist/components/ds-loader.js +1 -1
  57. package/dist/components/ds-markdown.js +1 -1
  58. package/dist/components/ds-menu.js +1 -1
  59. package/dist/components/ds-message-actions.js +1 -1
  60. package/dist/components/ds-message-actions.js.map +1 -1
  61. package/dist/components/ds-message-composer.js +1 -1
  62. package/dist/components/ds-message-composer.js.map +1 -1
  63. package/dist/components/ds-message-scroller.js +1 -1
  64. package/dist/components/ds-message-scroller.js.map +1 -1
  65. package/dist/components/ds-message.js +1 -1
  66. package/dist/components/ds-mobile-bar-nav.js +1 -1
  67. package/dist/components/ds-mobile-header.js +1 -1
  68. package/dist/components/ds-mobile-section-switcher.js +1 -1
  69. package/dist/components/ds-mobile-sheet-nav.js +1 -1
  70. package/dist/components/ds-modal.js +1 -1
  71. package/dist/components/ds-pagination.js +1 -1
  72. package/dist/components/ds-panel-nav.js +1 -1
  73. package/dist/components/ds-panel-sub-nav.js +1 -1
  74. package/dist/components/ds-panel-sub-nav.js.map +1 -1
  75. package/dist/components/ds-panel-tool-header.js +1 -1
  76. package/dist/components/ds-panel-tool-search.js +1 -1
  77. package/dist/components/ds-panel-tool-search.js.map +1 -1
  78. package/dist/components/ds-panel-tools.js +1 -1
  79. package/dist/components/ds-paper-texture.js +1 -1
  80. package/dist/components/ds-radio.js +1 -1
  81. package/dist/components/ds-scroll-overlay.js +1 -1
  82. package/dist/components/ds-scroll-overlay.js.map +1 -1
  83. package/dist/components/ds-select.js +1 -1
  84. package/dist/components/ds-shell-app.js +1 -1
  85. package/dist/components/ds-shell-app.js.map +1 -1
  86. package/dist/components/ds-shell-page.js +1 -1
  87. package/dist/components/ds-shell-tools.js +1 -1
  88. package/dist/components/ds-skeleton.js +1 -1
  89. package/dist/components/ds-slider.js +1 -1
  90. package/dist/components/ds-slider.js.map +1 -1
  91. package/dist/components/ds-swatch-picker.js +1 -1
  92. package/dist/components/ds-switch.js +1 -1
  93. package/dist/components/ds-tab-group.js +1 -1
  94. package/dist/components/ds-table-saved-views.js +1 -1
  95. package/dist/components/ds-table-saved-views.js.map +1 -1
  96. package/dist/components/ds-table-sort.d.ts +11 -0
  97. package/dist/components/ds-table-sort.js +2 -0
  98. package/dist/components/ds-table-sort.js.map +1 -0
  99. package/dist/components/ds-table-toolbar.js +1 -1
  100. package/dist/components/ds-table-toolbar.js.map +1 -1
  101. package/dist/components/ds-table.js +1 -1
  102. package/dist/components/ds-table.js.map +1 -1
  103. package/dist/components/ds-tag.js +1 -1
  104. package/dist/components/ds-text.js +1 -1
  105. package/dist/components/ds-toast.js +1 -1
  106. package/dist/components/ds-toast.js.map +1 -1
  107. package/dist/components/ds-tooltip-chart.js +1 -1
  108. package/dist/components/ds-tooltip.js +1 -1
  109. package/dist/components/ds-typing-indicator.js +1 -1
  110. package/dist/components/index.js +1 -1
  111. package/dist/components/index.js.map +1 -1
  112. package/dist/components/{p-CjgnFGd6.js → p-0IbKxhqM.js} +2 -2
  113. package/dist/components/{p-CjgnFGd6.js.map → p-0IbKxhqM.js.map} +1 -1
  114. package/dist/components/p-23u3lIr1.js +2 -0
  115. package/dist/components/{p-DLkNcCY0.js.map → p-23u3lIr1.js.map} +1 -1
  116. package/dist/components/{p-DfyfrfHL.js → p-3dYwA4i_.js} +2 -2
  117. package/dist/components/{p-DfyfrfHL.js.map → p-3dYwA4i_.js.map} +1 -1
  118. package/dist/components/{p-C1q-tq3U.js → p-7tZx4ukz.js} +2 -2
  119. package/dist/components/{p-C5TrNd31.js → p-B0PEg5RF.js} +2 -2
  120. package/dist/components/{p-C5TrNd31.js.map → p-B0PEg5RF.js.map} +1 -1
  121. package/dist/components/{p-DZFilC--.js → p-BGXqFq2C.js} +2 -2
  122. package/dist/components/{p-Rfpd5mWO.js → p-BHDkJmrC.js} +2 -2
  123. package/dist/components/{p-Rfpd5mWO.js.map → p-BHDkJmrC.js.map} +1 -1
  124. package/dist/components/{p-BXPQmp7q.js → p-BK-JjdoN.js} +2 -2
  125. package/dist/components/p-BUhShHfb.js +2 -0
  126. package/dist/components/{p-URdgCwEs.js.map → p-BUhShHfb.js.map} +1 -1
  127. package/dist/components/{p-CKY989vF.js → p-BUrbVZJU.js} +2 -2
  128. package/dist/components/{p-CKY989vF.js.map → p-BUrbVZJU.js.map} +1 -1
  129. package/dist/components/{p-V2ywPfsR.js → p-BVlfQ8xZ.js} +2 -2
  130. package/dist/components/{p-V2ywPfsR.js.map → p-BVlfQ8xZ.js.map} +1 -1
  131. package/dist/components/p-BdnQv7Zl.js +2 -0
  132. package/dist/components/p-BdnQv7Zl.js.map +1 -0
  133. package/dist/components/{p-Btxwp4lJ.js → p-BhYWdbEp.js} +2 -2
  134. package/dist/components/{p-Btxwp4lJ.js.map → p-BhYWdbEp.js.map} +1 -1
  135. package/dist/components/{p-B80NfEqc.js → p-C0X2zKbB.js} +2 -2
  136. package/dist/components/{p-Cyw9odJX.js → p-C4p2i59V.js} +2 -2
  137. package/dist/components/{p-Cyw9odJX.js.map → p-C4p2i59V.js.map} +1 -1
  138. package/dist/components/p-C91izpHV.js +2 -0
  139. package/dist/components/{p-CnWC0QvG.js.map → p-C91izpHV.js.map} +1 -1
  140. package/dist/components/p-COVcyUAA.js +2 -0
  141. package/dist/components/p-COVcyUAA.js.map +1 -0
  142. package/dist/components/{p-D1Nqlrrl.js → p-C_TOgX82.js} +2 -2
  143. package/dist/components/{p-D1Nqlrrl.js.map → p-C_TOgX82.js.map} +1 -1
  144. package/dist/components/{p-Ct-m0I6U.js → p-CaAZ-D08.js} +2 -2
  145. package/dist/components/p-Cr2VT5zv.js +2 -0
  146. package/dist/components/{p-M9DPfXbP.js.map → p-Cr2VT5zv.js.map} +1 -1
  147. package/dist/components/{p-Dsn1RCS5.js → p-Ct2GVdSI.js} +2 -2
  148. package/dist/components/{p-Dsn1RCS5.js.map → p-Ct2GVdSI.js.map} +1 -1
  149. package/dist/components/p-CwkcFMMe.js +2 -0
  150. package/dist/components/{p-CWDmHPJC.js.map → p-CwkcFMMe.js.map} +1 -1
  151. package/dist/components/p-CxBE3l74.js +2 -0
  152. package/dist/components/{p-CKJzHclc.js.map → p-CxBE3l74.js.map} +1 -1
  153. package/dist/components/{p-PzI11fs8.js → p-CzcWZiH-.js} +2 -2
  154. package/dist/components/{p-PzI11fs8.js.map → p-CzcWZiH-.js.map} +1 -1
  155. package/dist/components/{p-BagXfn1G.js → p-D1YhYulL.js} +2 -2
  156. package/dist/components/{p-BzObtSlo.js → p-D2z2DgtX.js} +2 -2
  157. package/dist/components/{p-BzObtSlo.js.map → p-D2z2DgtX.js.map} +1 -1
  158. package/dist/components/{p-DcPVSNDr.js → p-D8Qd6gkf.js} +2 -2
  159. package/dist/components/{p-DcPVSNDr.js.map → p-D8Qd6gkf.js.map} +1 -1
  160. package/dist/components/p-DAV32g35.js +2 -0
  161. package/dist/components/p-DAV32g35.js.map +1 -0
  162. package/dist/components/{p-BHjw0x3L.js → p-DAqSoyd4.js} +2 -2
  163. package/dist/components/{p-BHjw0x3L.js.map → p-DAqSoyd4.js.map} +1 -1
  164. package/dist/components/{p-Bf_D3crn.js → p-DNJTN_s0.js} +2 -2
  165. package/dist/components/{p-DL_5VENG.js → p-DQqOzDEq.js} +2 -2
  166. package/dist/components/{p-C5eosu67.js → p-DRBTr6TS.js} +2 -2
  167. package/dist/components/{p-C5eosu67.js.map → p-DRBTr6TS.js.map} +1 -1
  168. package/dist/components/{p-D-kWb8cF.js → p-DSIOINBK.js} +2 -2
  169. package/dist/components/{p-QdI17bl-.js → p-Dg9qiMDa.js} +2 -2
  170. package/dist/components/{p-DTMxwYQj.js → p-EWI6ccs-.js} +2 -2
  171. package/dist/components/p-JPTkZ3Ji.js +2 -0
  172. package/dist/components/p-JPTkZ3Ji.js.map +1 -0
  173. package/dist/components/p-MxptXwlW.js +2 -0
  174. package/dist/components/{p-C2n8A8NA.js.map → p-MxptXwlW.js.map} +1 -1
  175. package/dist/components/{p-B7Hf86NF.js → p-PD1Vfg0t.js} +2 -2
  176. package/dist/components/{p-B7Hf86NF.js.map → p-PD1Vfg0t.js.map} +1 -1
  177. package/dist/components/{p-BxqBiVbH.js → p-U8JIZzI2.js} +2 -2
  178. package/dist/components/{p-BxqBiVbH.js.map → p-U8JIZzI2.js.map} +1 -1
  179. package/dist/components/{p-Ck_VRQYi.js → p-WGZWqh-B.js} +2 -2
  180. package/dist/components/{p-Ck_VRQYi.js.map → p-WGZWqh-B.js.map} +1 -1
  181. package/dist/components/{p-vWK5faWZ.js → p-a6qP60zb.js} +2 -2
  182. package/dist/components/p-vzxD117T.js +2 -0
  183. package/dist/components/{p-BzLnSwG9.js.map → p-vzxD117T.js.map} +1 -1
  184. package/dist/components/{p-jMCRaxQW.js → p-y4jhIkRc.js} +2 -2
  185. package/dist/components/{p-jMCRaxQW.js.map → p-y4jhIkRc.js.map} +1 -1
  186. package/dist/docs/components.json +318 -10
  187. package/dist/mcp-data/registry/button-unfilled.json +26 -7
  188. package/dist/mcp-data/registry/filter-menu.json +25 -6
  189. package/dist/mcp-data/registry/loader.json +1 -1
  190. package/dist/mcp-data/registry/registry.json +161 -21
  191. package/dist/mcp-data/registry/select.json +22 -3
  192. package/dist/mcp-data/registry/table-saved-views.json +4 -4
  193. package/dist/mcp-data/registry/table-sort.json +229 -0
  194. package/dist/mcp-data/registry/table-toolbar.json +19 -12
  195. package/dist/mcp-data/registry/table.json +10 -8
  196. package/dist/react/components.d.ts +1 -0
  197. package/dist/react/components.js +1 -0
  198. package/dist/react/ds-table-sort.d.ts +12 -0
  199. package/dist/react/ds-table-sort.js +12 -0
  200. package/dist/types/components/ButtonUnfilled/ButtonUnfilled.d.ts +16 -1
  201. package/dist/types/components/FilterMenu/FilterMenu.d.ts +11 -0
  202. package/dist/types/components/Select/Select.d.ts +11 -0
  203. package/dist/types/components/Table/Table.d.ts +4 -0
  204. package/dist/types/components/Table/table-column-customizer.d.ts +2 -0
  205. package/dist/types/components/TableSort/TableSort.d.ts +24 -0
  206. package/dist/types/components/TableSort/table-sort-menu.d.ts +15 -0
  207. package/dist/types/components/TableToolbar/TableToolbar.d.ts +6 -0
  208. package/dist/types/components.d.ts +102 -6
  209. package/dist/types/utils/table-caption-compact.d.ts +6 -0
  210. package/dist/vue/components.d.ts +1 -0
  211. package/dist/vue/components.js +1 -0
  212. package/dist/vue/ds-button-unfilled.js +1 -0
  213. package/dist/vue/ds-filter-menu.js +1 -0
  214. package/dist/vue/ds-select.js +1 -0
  215. package/dist/vue/ds-table-sort.d.ts +3 -0
  216. package/dist/vue/ds-table-sort.js +13 -0
  217. package/package.json +1 -1
  218. package/dist/components/p-BzLnSwG9.js +0 -2
  219. package/dist/components/p-C2n8A8NA.js +0 -2
  220. package/dist/components/p-C7rzVotG.js +0 -2
  221. package/dist/components/p-C7rzVotG.js.map +0 -1
  222. package/dist/components/p-CKJzHclc.js +0 -2
  223. package/dist/components/p-CWDmHPJC.js +0 -2
  224. package/dist/components/p-Ca-I2UnB.js +0 -2
  225. package/dist/components/p-Ca-I2UnB.js.map +0 -1
  226. package/dist/components/p-CnWC0QvG.js +0 -2
  227. package/dist/components/p-CooNucm0.js +0 -2
  228. package/dist/components/p-CooNucm0.js.map +0 -1
  229. package/dist/components/p-DLkNcCY0.js +0 -2
  230. package/dist/components/p-M9DPfXbP.js +0 -2
  231. package/dist/components/p-URdgCwEs.js +0 -2
  232. /package/dist/components/{p-C1q-tq3U.js.map → p-7tZx4ukz.js.map} +0 -0
  233. /package/dist/components/{p-DZFilC--.js.map → p-BGXqFq2C.js.map} +0 -0
  234. /package/dist/components/{p-BXPQmp7q.js.map → p-BK-JjdoN.js.map} +0 -0
  235. /package/dist/components/{p-B80NfEqc.js.map → p-C0X2zKbB.js.map} +0 -0
  236. /package/dist/components/{p-Ct-m0I6U.js.map → p-CaAZ-D08.js.map} +0 -0
  237. /package/dist/components/{p-BagXfn1G.js.map → p-D1YhYulL.js.map} +0 -0
  238. /package/dist/components/{p-Bf_D3crn.js.map → p-DNJTN_s0.js.map} +0 -0
  239. /package/dist/components/{p-DL_5VENG.js.map → p-DQqOzDEq.js.map} +0 -0
  240. /package/dist/components/{p-D-kWb8cF.js.map → p-DSIOINBK.js.map} +0 -0
  241. /package/dist/components/{p-QdI17bl-.js.map → p-Dg9qiMDa.js.map} +0 -0
  242. /package/dist/components/{p-DTMxwYQj.js.map → p-EWI6ccs-.js.map} +0 -0
  243. /package/dist/components/{p-vWK5faWZ.js.map → p-a6qP60zb.js.map} +0 -0
@@ -1,2 +1,2 @@
1
- import{p as i,H as e,c as n,h as r,a as o,t as s}from"./index.js";import{s as a}from"./p-BEvBJ65v.js";import{d as t}from"./p-vWK5faWZ.js";import{d}from"./p-BFfLvMZd.js";import{d as c}from"./p-DZFilC--.js";const l=()=>`.ds-chrome-space--sm.sc-ds-mobile-bar-nav-h,.ds-chrome-space--sm.sc-ds-mobile-bar-nav{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-mobile-bar-nav-h,.ds-chrome-space--md.sc-ds-mobile-bar-nav{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-mobile-bar-nav-h,.ds-chrome-space--lg.sc-ds-mobile-bar-nav{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-mobile-bar-nav-h,.ds-chrome-row.sc-ds-mobile-bar-nav,.ds-chrome-column.sc-ds-mobile-bar-nav-h,.ds-chrome-column.sc-ds-mobile-bar-nav,.ds-chrome-grid.sc-ds-mobile-bar-nav-h,.ds-chrome-grid.sc-ds-mobile-bar-nav{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-mobile-bar-nav-h,.ds-chrome-row.sc-ds-mobile-bar-nav{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-mobile-bar-nav-h,.ds-chrome-column.sc-ds-mobile-bar-nav{flex-direction:column}.ds-chrome-grid.sc-ds-mobile-bar-nav-h,.ds-chrome-grid.sc-ds-mobile-bar-nav{display:grid;align-items:center}@media (forced-colors: active){.sc-ds-mobile-bar-nav:root,.sc-ds-mobile-bar-nav-h,.ds-forced-colors-scope.sc-ds-mobile-bar-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-mobile-bar-nav-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-mobile-bar-nav-h,.ds-focus-ring.sc-ds-mobile-bar-nav,.ds-focus-ring-inset.sc-ds-mobile-bar-nav-h,.ds-focus-ring-inset.sc-ds-mobile-bar-nav{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-mobile-bar-nav-h:focus-visible,.ds-focus-ring.sc-ds-mobile-bar-nav:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-mobile-bar-nav-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-mobile-bar-nav{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-mobile-bar-nav-h:focus-visible,.ds-focus-ring-inset.sc-ds-mobile-bar-nav:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-mobile-bar-nav-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-mobile-bar-nav:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-mobile-bar-nav-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-mobile-bar-nav{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-mobile-bar-nav-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-mobile-bar-nav::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-mobile-bar-nav-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-mobile-bar-nav:root,.sc-ds-mobile-bar-nav-h,.ds-forced-colors-scope.sc-ds-mobile-bar-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-mobile-bar-nav-h,.ds-interaction-fill.sc-ds-mobile-bar-nav{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-mobile-bar-nav-h::before,.ds-interaction-fill.sc-ds-mobile-bar-nav::before,.ds-interaction-fill.sc-ds-mobile-bar-nav-h::after,.ds-interaction-fill.sc-ds-mobile-bar-nav::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-mobile-bar-nav-h::before,.ds-interaction-fill.sc-ds-mobile-bar-nav::before{z-index:1}.ds-interaction-fill.sc-ds-mobile-bar-nav-h::after,.ds-interaction-fill.sc-ds-mobile-bar-nav::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color), inset var(--ds-interaction-divider-inline-start-width) 0 0 var(--ds-interaction-divider-inline-start-color), inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0 var(--ds-interaction-divider-inline-end-color), inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--bordered.sc-ds-mobile-bar-nav{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-mobile-bar-nav-h::before,.ds-interaction-fill--selected.sc-ds-mobile-bar-nav::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--selected.sc-ds-mobile-bar-nav{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-mobile-bar-nav-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-mobile-bar-nav:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-mobile-bar-nav-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-mobile-bar-nav:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav-h::after,.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav::after,.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var( --ds-interaction-group-divider-inline-start-width, 0px );--ds-interaction-divider-inline-start-color:var( --ds-interaction-group-divider-inline-start-color, transparent );--ds-interaction-divider-inline-end-width:var( --ds-interaction-group-divider-inline-end-width, 0px );--ds-interaction-divider-inline-end-color:var( --ds-interaction-group-divider-inline-end-color, transparent )}.ds-interaction-fill.sc-ds-mobile-bar-nav-h>.ds-interaction-fill__content.sc-ds-mobile-bar-nav,.ds-interaction-fill.sc-ds-mobile-bar-nav>.ds-interaction-fill__content.sc-ds-mobile-bar-nav,.ds-interaction-fill__content.sc-ds-mobile-bar-nav{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-faint.sc-ds-mobile-bar-nav{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-medium.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-bold.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-strong.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-translucent.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-inverted.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-media.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-always-dark.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-navigation.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-mobile-bar-nav-h::after,.ds-interaction-fill.sc-ds-mobile-bar-nav::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-mobile-bar-nav-h::before,.ds-interaction-fill--selected.sc-ds-mobile-bar-nav::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-mobile-bar-nav-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-mobile-bar-nav:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}.sc-ds-mobile-bar-nav-h{display:block;min-width:0;background:var(--color-background-primary);color:var(--color-foreground-tertiary);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.mobile-bar-nav.sc-ds-mobile-bar-nav{justify-content:space-between;min-width:0;padding-block-end:max(var(--ds-chrome-padding), env(safe-area-inset-bottom));border-top:var(--dimension-stroke-width-012) solid var(--color-border-tertiary);background:var(--color-background-primary);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.mobile-bar-nav__group.sc-ds-mobile-bar-nav{display:flex;align-items:center;gap:var(--dimension-space-100)}.mobile-bar-nav__item.sc-ds-mobile-bar-nav{appearance:none;flex:0 0 var(--dimension-size-500);width:var(--dimension-size-500);height:var(--dimension-size-500);padding:var(--dimension-space-100);border:0;border-radius:var(--dimension-radius-025);background:transparent;color:inherit;display:inline-flex;align-items:center;justify-content:center;cursor:default}.mobile-bar-nav__item--selected.sc-ds-mobile-bar-nav{color:var(--color-foreground-primary)}@media (hover: none) and (pointer: coarse){.mobile-bar-nav__item.ds-interaction-fill.sc-ds-mobile-bar-nav:active:not(:disabled)::after{background:transparent}.mobile-bar-nav__item--pressed.ds-interaction-fill.sc-ds-mobile-bar-nav::after,.mobile-bar-nav__item--pressed.ds-interaction-fill.sc-ds-mobile-bar-nav:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}}.mobile-bar-nav__divider.sc-ds-mobile-bar-nav{flex:0 0 var(--dimension-stroke-width-012);width:var(--dimension-stroke-width-012);height:var(--dimension-iconography-lg);background:var(--color-border-tertiary);pointer-events:none;-webkit-user-select:none;user-select:none}.mobile-bar-nav__icon.sc-ds-mobile-bar-nav{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--dimension-iconography-lg);height:var(--dimension-iconography-lg)}.mobile-bar-nav__dot.sc-ds-mobile-bar-nav{position:absolute;inset-block-start:calc(var(--dimension-space-025) * -1);inset-inline-end:calc(var(--dimension-space-025) * -1)}`;const b=120;const v=i(class i extends e{constructor(i){super();if(i!==false){this.__registerHost()}this.dsSheetNavToggle=n(this,"dsSheetNavToggle");this.dsDestinationChange=n(this,"dsDestinationChange");this.activeDestination="area";this.currentArea={id:"tracking",icon:"MapPage",label:"Tracking"};this.sheetNavExpanded=false;this.menuLabel="Menu";this.searchLabel="Search";this.inboxLabel="Inbox";this.messagesLabel="Messages";this.agentsLabel="Agents";this.helpLabel="Help & Support";this.searchDot=false;this.inboxDot=false;this.messagesDot=false;this.agentsDot=false;this.pressedItemId=null;this.activePointerId=null;this.pressedAt=0;this.pressClearTimer=null}disconnectedCallback(){this.clearPressedItem()}clearPressTimer(){if(this.pressClearTimer===null)return;clearTimeout(this.pressClearTimer);this.pressClearTimer=null}clearPressedItem(){this.clearPressTimer();this.activePointerId=null;this.pressedItemId=null}beginDirectPress(i,e){if(!e.isPrimary||e.pointerType==="mouse"||e.button!==0)return;this.clearPressTimer();this.activePointerId=e.pointerId;this.pressedAt=performance.now();this.pressedItemId=i;const n=e.currentTarget;try{n.setPointerCapture(e.pointerId)}catch{}}finishDirectPress(i){if(i.pointerId!==this.activePointerId)return;this.activePointerId=null;const e=Math.max(0,b-(performance.now()-this.pressedAt));this.clearPressTimer();this.pressClearTimer=setTimeout((()=>{this.pressClearTimer=null;this.pressedItemId=null}),e)}cancelDirectPress(i){if(i.pointerId!==this.activePointerId)return;this.clearPressedItem()}pressHandlers(i){return{onPointerDown:e=>this.beginDirectPress(i,e),onPointerUp:i=>this.finishDirectPress(i),onPointerCancel:i=>this.cancelDirectPress(i),onLostPointerCapture:i=>this.finishDirectPress(i)}}destinationConfig(){const i=this.activeDestination==="help"?{id:"help",icon:"CircleQuestion",label:this.helpLabel,dot:false}:{id:"area",icon:this.currentArea.icon||"MapPage",label:this.currentArea.label||"Area",dot:false};return[i,{id:"search",icon:"MagnifyingGlass",label:this.searchLabel,dot:this.searchDot},{id:"inbox",icon:"Inbox",label:this.inboxLabel,dot:this.inboxDot},{id:"messages",icon:"MessageBubbleStack",label:this.messagesLabel,dot:this.messagesDot},{id:"agents",icon:"AI",label:this.agentsLabel,dot:this.agentsDot}]}selectDestination(i){if(!a(this.activeDestination,i,this.sheetNavExpanded)){return}this.dsDestinationChange.emit({destination:i});requestAnimationFrame((()=>{void this.focusDestination(i)}))}async focusDestination(i){const e=this.el.querySelector(`#${i==="sheet-nav"?"ds-mobile-sheet-nav-trigger":`ds-mobile-bar-${i}-trigger`}`);e?.focus({preventScroll:true})}renderDestination(i){const e=!this.sheetNavExpanded&&i.id===this.activeDestination;return r("button",{id:`ds-mobile-bar-${i.id}-trigger`,type:"button",class:{"mobile-bar-nav__item":true,"mobile-bar-nav__item--selected":e,"mobile-bar-nav__item--pressed":this.pressedItemId===i.id,"ds-focus-ring-inset":true,"ds-interaction-fill":true},"aria-label":i.label,"aria-current":e?"page":undefined,onClick:()=>this.selectDestination(i.id),...this.pressHandlers(i.id)},r("span",{class:"mobile-bar-nav__icon ds-interaction-fill__content"},r("ds-icon",{name:i.icon,size:"lg",color:"inherit"}),i.dot&&r("ds-badge",{class:"mobile-bar-nav__dot",variant:"dot",label:"","aria-hidden":"true"})))}render(){const[i,...e]=this.destinationConfig();return r(o,{key:"97beeb768ed2d08a595ac632628fb3595d078e49"},r("nav",{key:"5bced46bbcc6d55b71e7274f8ac293e6403e3977",class:"mobile-bar-nav ds-chrome-row ds-chrome-space--md","aria-label":"Primary"},r("div",{key:"c250f443af3bbd47f5e25d551be87a6a6d72a7a0",class:"mobile-bar-nav__group mobile-bar-nav__group--context"},r("button",{key:"c4e5741bf4fc1f2d0aeed3cefa60e387d200ff54",id:"ds-mobile-sheet-nav-trigger",type:"button",class:{"mobile-bar-nav__item":true,"mobile-bar-nav__item--selected":this.sheetNavExpanded,"mobile-bar-nav__item--pressed":this.pressedItemId==="sheet-nav","ds-focus-ring-inset":true,"ds-interaction-fill":true},"aria-label":this.menuLabel,"aria-expanded":String(this.sheetNavExpanded),"aria-controls":"ds-mobile-sheet-nav",onClick:()=>this.dsSheetNavToggle.emit(!this.sheetNavExpanded),...this.pressHandlers("sheet-nav")},r("span",{key:"98f73e90c3db0dc05caaa2d7941329e700dcf34d",class:"mobile-bar-nav__icon ds-interaction-fill__content"},r("ds-icon",{key:"ea33ea7a818be46cf669221d78b3935a210b9174",name:this.sheetNavExpanded?"Cross":"Hamburger",size:"lg",color:"inherit"}))),r("span",{key:"0817350458a30baa95351d52d59be19305d02a0f",class:"mobile-bar-nav__divider","aria-hidden":"true"}),this.renderDestination(i)),r("div",{key:"106c33ccc430d0b16fb1fc2957018d2a21255af8",class:"mobile-bar-nav__group mobile-bar-nav__group--tools"},e.map((i=>this.renderDestination(i))))))}get el(){return this}static get style(){return l()}},[2,"ds-mobile-bar-nav",{activeDestination:[1,"active-destination"],currentArea:[16],sheetNavExpanded:[4,"sheet-nav-expanded"],menuLabel:[1,"menu-label"],searchLabel:[1,"search-label"],inboxLabel:[1,"inbox-label"],messagesLabel:[1,"messages-label"],agentsLabel:[1,"agents-label"],helpLabel:[1,"help-label"],searchDot:[4,"search-dot"],inboxDot:[4,"inbox-dot"],messagesDot:[4,"messages-dot"],agentsDot:[4,"agents-dot"],pressedItemId:[32],focusDestination:[64]}]);function m(){if(typeof customElements==="undefined"){return}const i=["ds-mobile-bar-nav","ds-badge","ds-icon","ds-text"];i.forEach((i=>{switch(i){case"ds-mobile-bar-nav":if(!customElements.get(s(i))){customElements.define(s(i),v)}break;case"ds-badge":if(!customElements.get(s(i))){t()}break;case"ds-icon":if(!customElements.get(s(i))){d()}break;case"ds-text":if(!customElements.get(s(i))){c()}break}}))}m();export{v as M,m as d};
2
- //# sourceMappingURL=p-V2ywPfsR.js.map
1
+ import{p as i,H as e,c as n,h as r,a as o,t as s}from"./index.js";import{s as a}from"./p-BEvBJ65v.js";import{d as t}from"./p-a6qP60zb.js";import{d}from"./p-BFfLvMZd.js";import{d as c}from"./p-BGXqFq2C.js";const l=()=>`.ds-chrome-space--sm.sc-ds-mobile-bar-nav-h,.ds-chrome-space--sm.sc-ds-mobile-bar-nav{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-mobile-bar-nav-h,.ds-chrome-space--md.sc-ds-mobile-bar-nav{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-mobile-bar-nav-h,.ds-chrome-space--lg.sc-ds-mobile-bar-nav{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-mobile-bar-nav-h,.ds-chrome-row.sc-ds-mobile-bar-nav,.ds-chrome-column.sc-ds-mobile-bar-nav-h,.ds-chrome-column.sc-ds-mobile-bar-nav,.ds-chrome-grid.sc-ds-mobile-bar-nav-h,.ds-chrome-grid.sc-ds-mobile-bar-nav{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-mobile-bar-nav-h,.ds-chrome-row.sc-ds-mobile-bar-nav{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-mobile-bar-nav-h,.ds-chrome-column.sc-ds-mobile-bar-nav{flex-direction:column}.ds-chrome-grid.sc-ds-mobile-bar-nav-h,.ds-chrome-grid.sc-ds-mobile-bar-nav{display:grid;align-items:center}@media (forced-colors: active){.sc-ds-mobile-bar-nav:root,.sc-ds-mobile-bar-nav-h,.ds-forced-colors-scope.sc-ds-mobile-bar-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-mobile-bar-nav-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-mobile-bar-nav-h,.ds-focus-ring.sc-ds-mobile-bar-nav,.ds-focus-ring-inset.sc-ds-mobile-bar-nav-h,.ds-focus-ring-inset.sc-ds-mobile-bar-nav{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-mobile-bar-nav-h:focus-visible,.ds-focus-ring.sc-ds-mobile-bar-nav:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-mobile-bar-nav-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-mobile-bar-nav{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-mobile-bar-nav-h:focus-visible,.ds-focus-ring-inset.sc-ds-mobile-bar-nav:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-mobile-bar-nav-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-mobile-bar-nav:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-mobile-bar-nav-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-mobile-bar-nav{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-mobile-bar-nav-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-mobile-bar-nav::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-mobile-bar-nav-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-mobile-bar-nav:root,.sc-ds-mobile-bar-nav-h,.ds-forced-colors-scope.sc-ds-mobile-bar-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-mobile-bar-nav-h,.ds-interaction-fill.sc-ds-mobile-bar-nav{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-mobile-bar-nav-h::before,.ds-interaction-fill.sc-ds-mobile-bar-nav::before,.ds-interaction-fill.sc-ds-mobile-bar-nav-h::after,.ds-interaction-fill.sc-ds-mobile-bar-nav::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-mobile-bar-nav-h::before,.ds-interaction-fill.sc-ds-mobile-bar-nav::before{z-index:1}.ds-interaction-fill.sc-ds-mobile-bar-nav-h::after,.ds-interaction-fill.sc-ds-mobile-bar-nav::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color), inset var(--ds-interaction-divider-inline-start-width) 0 0 var(--ds-interaction-divider-inline-start-color), inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0 var(--ds-interaction-divider-inline-end-color), inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--bordered.sc-ds-mobile-bar-nav{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-mobile-bar-nav-h::before,.ds-interaction-fill--selected.sc-ds-mobile-bar-nav::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--selected.sc-ds-mobile-bar-nav{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-mobile-bar-nav-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-mobile-bar-nav:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-mobile-bar-nav-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-mobile-bar-nav:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav-h::after,.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav::after,.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--grouped.sc-ds-mobile-bar-nav{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var( --ds-interaction-group-divider-inline-start-width, 0px );--ds-interaction-divider-inline-start-color:var( --ds-interaction-group-divider-inline-start-color, transparent );--ds-interaction-divider-inline-end-width:var( --ds-interaction-group-divider-inline-end-width, 0px );--ds-interaction-divider-inline-end-color:var( --ds-interaction-group-divider-inline-end-color, transparent )}.ds-interaction-fill.sc-ds-mobile-bar-nav-h>.ds-interaction-fill__content.sc-ds-mobile-bar-nav,.ds-interaction-fill.sc-ds-mobile-bar-nav>.ds-interaction-fill__content.sc-ds-mobile-bar-nav,.ds-interaction-fill__content.sc-ds-mobile-bar-nav{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-faint.sc-ds-mobile-bar-nav{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-medium.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-bold.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-strong.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-translucent.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-inverted.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-media.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-always-dark.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-mobile-bar-nav-h,.ds-interaction-fill--on-navigation.sc-ds-mobile-bar-nav{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-mobile-bar-nav-h::after,.ds-interaction-fill.sc-ds-mobile-bar-nav::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-mobile-bar-nav-h::before,.ds-interaction-fill--selected.sc-ds-mobile-bar-nav::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-mobile-bar-nav-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-mobile-bar-nav:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}.sc-ds-mobile-bar-nav-h{display:block;min-width:0;background:var(--color-background-primary);color:var(--color-foreground-tertiary);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.mobile-bar-nav.sc-ds-mobile-bar-nav{justify-content:space-between;min-width:0;padding-block-end:max(var(--ds-chrome-padding), env(safe-area-inset-bottom));border-top:var(--dimension-stroke-width-012) solid var(--color-border-tertiary);background:var(--color-background-primary);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.mobile-bar-nav__group.sc-ds-mobile-bar-nav{display:flex;align-items:center;gap:var(--dimension-space-100)}.mobile-bar-nav__item.sc-ds-mobile-bar-nav{appearance:none;flex:0 0 var(--dimension-size-500);width:var(--dimension-size-500);height:var(--dimension-size-500);padding:var(--dimension-space-100);border:0;border-radius:var(--dimension-radius-025);background:transparent;color:inherit;display:inline-flex;align-items:center;justify-content:center;cursor:default}.mobile-bar-nav__item--selected.sc-ds-mobile-bar-nav{color:var(--color-foreground-primary)}@media (hover: none) and (pointer: coarse){.mobile-bar-nav__item.ds-interaction-fill.sc-ds-mobile-bar-nav:active:not(:disabled)::after{background:transparent}.mobile-bar-nav__item--pressed.ds-interaction-fill.sc-ds-mobile-bar-nav::after,.mobile-bar-nav__item--pressed.ds-interaction-fill.sc-ds-mobile-bar-nav:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}}.mobile-bar-nav__divider.sc-ds-mobile-bar-nav{flex:0 0 var(--dimension-stroke-width-012);width:var(--dimension-stroke-width-012);height:var(--dimension-iconography-lg);background:var(--color-border-tertiary);pointer-events:none;-webkit-user-select:none;user-select:none}.mobile-bar-nav__icon.sc-ds-mobile-bar-nav{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--dimension-iconography-lg);height:var(--dimension-iconography-lg)}.mobile-bar-nav__dot.sc-ds-mobile-bar-nav{position:absolute;inset-block-start:calc(var(--dimension-space-025) * -1);inset-inline-end:calc(var(--dimension-space-025) * -1)}`;const b=120;const v=i(class i extends e{constructor(i){super();if(i!==false){this.__registerHost()}this.dsSheetNavToggle=n(this,"dsSheetNavToggle",7);this.dsDestinationChange=n(this,"dsDestinationChange",7);this.activeDestination="area";this.currentArea={id:"tracking",icon:"MapPage",label:"Tracking"};this.sheetNavExpanded=false;this.menuLabel="Menu";this.searchLabel="Search";this.inboxLabel="Inbox";this.messagesLabel="Messages";this.agentsLabel="Agents";this.helpLabel="Help & Support";this.searchDot=false;this.inboxDot=false;this.messagesDot=false;this.agentsDot=false;this.pressedItemId=null;this.activePointerId=null;this.pressedAt=0;this.pressClearTimer=null}disconnectedCallback(){this.clearPressedItem()}clearPressTimer(){if(this.pressClearTimer===null)return;clearTimeout(this.pressClearTimer);this.pressClearTimer=null}clearPressedItem(){this.clearPressTimer();this.activePointerId=null;this.pressedItemId=null}beginDirectPress(i,e){if(!e.isPrimary||e.pointerType==="mouse"||e.button!==0)return;this.clearPressTimer();this.activePointerId=e.pointerId;this.pressedAt=performance.now();this.pressedItemId=i;const n=e.currentTarget;try{n.setPointerCapture(e.pointerId)}catch{}}finishDirectPress(i){if(i.pointerId!==this.activePointerId)return;this.activePointerId=null;const e=Math.max(0,b-(performance.now()-this.pressedAt));this.clearPressTimer();this.pressClearTimer=setTimeout((()=>{this.pressClearTimer=null;this.pressedItemId=null}),e)}cancelDirectPress(i){if(i.pointerId!==this.activePointerId)return;this.clearPressedItem()}pressHandlers(i){return{onPointerDown:e=>this.beginDirectPress(i,e),onPointerUp:i=>this.finishDirectPress(i),onPointerCancel:i=>this.cancelDirectPress(i),onLostPointerCapture:i=>this.finishDirectPress(i)}}destinationConfig(){const i=this.activeDestination==="help"?{id:"help",icon:"CircleQuestion",label:this.helpLabel,dot:false}:{id:"area",icon:this.currentArea.icon||"MapPage",label:this.currentArea.label||"Area",dot:false};return[i,{id:"search",icon:"MagnifyingGlass",label:this.searchLabel,dot:this.searchDot},{id:"inbox",icon:"Inbox",label:this.inboxLabel,dot:this.inboxDot},{id:"messages",icon:"MessageBubbleStack",label:this.messagesLabel,dot:this.messagesDot},{id:"agents",icon:"AI",label:this.agentsLabel,dot:this.agentsDot}]}selectDestination(i){if(!a(this.activeDestination,i,this.sheetNavExpanded)){return}this.dsDestinationChange.emit({destination:i});requestAnimationFrame((()=>{void this.focusDestination(i)}))}async focusDestination(i){const e=this.el.querySelector(`#${i==="sheet-nav"?"ds-mobile-sheet-nav-trigger":`ds-mobile-bar-${i}-trigger`}`);e?.focus({preventScroll:true})}renderDestination(i){const e=!this.sheetNavExpanded&&i.id===this.activeDestination;return r("button",{id:`ds-mobile-bar-${i.id}-trigger`,type:"button",class:{"mobile-bar-nav__item":true,"mobile-bar-nav__item--selected":e,"mobile-bar-nav__item--pressed":this.pressedItemId===i.id,"ds-focus-ring-inset":true,"ds-interaction-fill":true},"aria-label":i.label,"aria-current":e?"page":undefined,onClick:()=>this.selectDestination(i.id),...this.pressHandlers(i.id)},r("span",{class:"mobile-bar-nav__icon ds-interaction-fill__content"},r("ds-icon",{name:i.icon,size:"lg",color:"inherit"}),i.dot&&r("ds-badge",{class:"mobile-bar-nav__dot",variant:"dot",label:"","aria-hidden":"true"})))}render(){const[i,...e]=this.destinationConfig();return r(o,{key:"9b7691cc1318368dd703cead27a2ea1d7af783ec"},r("nav",{key:"cb82eef624f9a4d815afcf2a8ad13cd1894f7949",class:"mobile-bar-nav ds-chrome-row ds-chrome-space--md","aria-label":"Primary"},r("div",{key:"10783947002a370b9ba6ee6c203f4b71b3d7b868",class:"mobile-bar-nav__group mobile-bar-nav__group--context"},r("button",{key:"dd3d89ceb09eddd18df8067fc2a1146a9c851d95",id:"ds-mobile-sheet-nav-trigger",type:"button",class:{"mobile-bar-nav__item":true,"mobile-bar-nav__item--selected":this.sheetNavExpanded,"mobile-bar-nav__item--pressed":this.pressedItemId==="sheet-nav","ds-focus-ring-inset":true,"ds-interaction-fill":true},"aria-label":this.menuLabel,"aria-expanded":String(this.sheetNavExpanded),"aria-controls":"ds-mobile-sheet-nav",onClick:()=>this.dsSheetNavToggle.emit(!this.sheetNavExpanded),...this.pressHandlers("sheet-nav")},r("span",{key:"93654b8d38db91832591789ba097258bc114fde8",class:"mobile-bar-nav__icon ds-interaction-fill__content"},r("ds-icon",{key:"3b89608435cf70e8004f2d3e365ed0d1fadbe8ab",name:this.sheetNavExpanded?"Cross":"Hamburger",size:"lg",color:"inherit"}))),r("span",{key:"2f38e9111b07d863f8e8bc17ad8337e7fa5695bf",class:"mobile-bar-nav__divider","aria-hidden":"true"}),this.renderDestination(i)),r("div",{key:"c4cdbba15e508de19efb0e731374661880901591",class:"mobile-bar-nav__group mobile-bar-nav__group--tools"},e.map((i=>this.renderDestination(i))))))}get el(){return this}static get style(){return l()}},[2,"ds-mobile-bar-nav",{activeDestination:[1,"active-destination"],currentArea:[16],sheetNavExpanded:[4,"sheet-nav-expanded"],menuLabel:[1,"menu-label"],searchLabel:[1,"search-label"],inboxLabel:[1,"inbox-label"],messagesLabel:[1,"messages-label"],agentsLabel:[1,"agents-label"],helpLabel:[1,"help-label"],searchDot:[4,"search-dot"],inboxDot:[4,"inbox-dot"],messagesDot:[4,"messages-dot"],agentsDot:[4,"agents-dot"],pressedItemId:[32],focusDestination:[64]}]);function m(){if(typeof customElements==="undefined"){return}const i=["ds-mobile-bar-nav","ds-badge","ds-icon","ds-text"];i.forEach((i=>{switch(i){case"ds-mobile-bar-nav":if(!customElements.get(s(i))){customElements.define(s(i),v)}break;case"ds-badge":if(!customElements.get(s(i))){t()}break;case"ds-icon":if(!customElements.get(s(i))){d()}break;case"ds-text":if(!customElements.get(s(i))){c()}break}}))}m();export{v as M,m as d};
2
+ //# sourceMappingURL=p-BVlfQ8xZ.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["mobileBarNavCss","MINIMUM_DIRECT_PRESS_MS","MobileBarNav","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","activeDestination","currentArea","id","icon","label","sheetNavExpanded","menuLabel","searchLabel","inboxLabel","messagesLabel","agentsLabel","helpLabel","searchDot","inboxDot","messagesDot","agentsDot","pressedItemId","activePointerId","pressedAt","pressClearTimer","disconnectedCallback","clearPressedItem","clearPressTimer","clearTimeout","beginDirectPress","itemId","event","isPrimary","pointerType","button","pointerId","performance","now","target","currentTarget","setPointerCapture","finishDirectPress","remaining","Math","max","setTimeout","cancelDirectPress","pressHandlers","onPointerDown","onPointerUp","onPointerCancel","onLostPointerCapture","destinationConfig","dot","selectDestination","destination","shouldEmitMobileDestinationChange","dsDestinationChange","emit","requestAnimationFrame","focusDestination","el","querySelector","focus","preventScroll","renderDestination","item","selected","h","type","class","undefined","onClick","name","size","color","variant","render","tools","Host","key","String","dsSheetNavToggle","map"],"sources":["src/wc/components/MobileBarNav/MobileBarNav.css?tag=ds-mobile-bar-nav&encapsulation=scoped","src/wc/components/MobileBarNav/MobileBarNav.tsx"],"sourcesContent":["@import '../../utils/chrome-layout.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n\n:host {\n display: block;\n min-width: 0;\n background: var(--color-background-primary);\n color: var(--color-foreground-tertiary);\n -webkit-user-select: none;\n user-select: none;\n -webkit-touch-callout: none;\n}\n\n.mobile-bar-nav {\n justify-content: space-between;\n min-width: 0;\n padding-block-end: max(var(--ds-chrome-padding), env(safe-area-inset-bottom));\n border-top: var(--dimension-stroke-width-012) solid var(--color-border-tertiary);\n background: var(--color-background-primary);\n -webkit-user-select: none;\n user-select: none;\n -webkit-touch-callout: none;\n}\n\n.mobile-bar-nav__group {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-100);\n}\n\n.mobile-bar-nav__item {\n appearance: none;\n flex: 0 0 var(--dimension-size-500);\n width: var(--dimension-size-500);\n height: var(--dimension-size-500);\n padding: var(--dimension-space-100);\n border: 0;\n border-radius: var(--dimension-radius-025);\n background: transparent;\n color: inherit;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: default;\n}\n\n.mobile-bar-nav__item--selected {\n color: var(--color-foreground-primary);\n}\n\n/*\n * Safari can retain its native :active state after a direct touch. On coarse\n * touch-only pointers, the component-owned class provides one deterministic\n * press frame and clears it after release/cancel.\n */\n@media (hover: none) and (pointer: coarse) {\n .mobile-bar-nav__item.ds-interaction-fill:active:not(:disabled)::after {\n background: transparent;\n }\n\n .mobile-bar-nav__item--pressed.ds-interaction-fill::after,\n .mobile-bar-nav__item--pressed.ds-interaction-fill:active:not(:disabled)::after {\n background: var(--ds-interaction-pressed);\n }\n}\n\n.mobile-bar-nav__divider {\n flex: 0 0 var(--dimension-stroke-width-012);\n width: var(--dimension-stroke-width-012);\n height: var(--dimension-iconography-lg);\n background: var(--color-border-tertiary);\n pointer-events: none;\n -webkit-user-select: none;\n user-select: none;\n}\n\n.mobile-bar-nav__icon {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: var(--dimension-iconography-lg);\n height: var(--dimension-iconography-lg);\n}\n\n.mobile-bar-nav__dot {\n position: absolute;\n inset-block-start: calc(var(--dimension-space-025) * -1);\n inset-inline-end: calc(var(--dimension-space-025) * -1);\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport {\n shouldEmitMobileDestinationChange,\n type MobileDestination,\n} from '../../shell/shell-responsive';\nimport type { PanelNavItem } from '../PanelNav/panel-nav-types';\nimport type { MobileBarNavDestinationDetail } from './mobile-bar-nav-types';\n\ninterface DestinationConfig {\n id: MobileDestination;\n icon: string;\n label: string;\n dot: boolean;\n}\n\nconst MINIMUM_DIRECT_PRESS_MS = 120;\n\n@Component({\n tag: 'ds-mobile-bar-nav',\n styleUrl: 'MobileBarNav.css',\n scoped: true,\n})\nexport class MobileBarNav {\n @Element() el!: HTMLElement;\n\n @Prop() activeDestination: MobileDestination = 'area';\n @Prop() currentArea: PanelNavItem = {\n id: 'tracking',\n icon: 'MapPage',\n label: 'Tracking',\n };\n @Prop() sheetNavExpanded: boolean = false;\n @Prop() menuLabel: string = 'Menu';\n @Prop() searchLabel: string = 'Search';\n @Prop() inboxLabel: string = 'Inbox';\n @Prop() messagesLabel: string = 'Messages';\n @Prop() agentsLabel: string = 'Agents';\n @Prop() helpLabel: string = 'Help & Support';\n @Prop() searchDot: boolean = false;\n @Prop() inboxDot: boolean = false;\n @Prop() messagesDot: boolean = false;\n @Prop() agentsDot: boolean = false;\n\n @State() private pressedItemId: string | null = null;\n\n @Event() dsSheetNavToggle!: EventEmitter<boolean>;\n @Event() dsDestinationChange!: EventEmitter<MobileBarNavDestinationDetail>;\n\n private activePointerId: number | null = null;\n private pressedAt = 0;\n private pressClearTimer: ReturnType<typeof setTimeout> | null = null;\n\n disconnectedCallback() {\n this.clearPressedItem();\n }\n\n private clearPressTimer() {\n if (this.pressClearTimer === null) return;\n clearTimeout(this.pressClearTimer);\n this.pressClearTimer = null;\n }\n\n private clearPressedItem() {\n this.clearPressTimer();\n this.activePointerId = null;\n this.pressedItemId = null;\n }\n\n private beginDirectPress(itemId: string, event: PointerEvent) {\n if (!event.isPrimary || event.pointerType === 'mouse' || event.button !== 0) return;\n\n this.clearPressTimer();\n this.activePointerId = event.pointerId;\n this.pressedAt = performance.now();\n this.pressedItemId = itemId;\n\n const target = event.currentTarget as HTMLElement;\n try {\n target.setPointerCapture(event.pointerId);\n } catch {\n // Pointer capture can fail if Safari has already cancelled the stream.\n }\n }\n\n private finishDirectPress(event: PointerEvent) {\n if (event.pointerId !== this.activePointerId) return;\n\n this.activePointerId = null;\n const remaining = Math.max(\n 0,\n MINIMUM_DIRECT_PRESS_MS - (performance.now() - this.pressedAt)\n );\n\n this.clearPressTimer();\n this.pressClearTimer = setTimeout(() => {\n this.pressClearTimer = null;\n this.pressedItemId = null;\n }, remaining);\n }\n\n private cancelDirectPress(event: PointerEvent) {\n if (event.pointerId !== this.activePointerId) return;\n this.clearPressedItem();\n }\n\n private pressHandlers(itemId: string) {\n return {\n onPointerDown: (event: PointerEvent) => this.beginDirectPress(itemId, event),\n onPointerUp: (event: PointerEvent) => this.finishDirectPress(event),\n onPointerCancel: (event: PointerEvent) => this.cancelDirectPress(event),\n onLostPointerCapture: (event: PointerEvent) => this.finishDirectPress(event),\n };\n }\n\n private destinationConfig(): DestinationConfig[] {\n const currentArea =\n this.activeDestination === 'help'\n ? {\n id: 'help' as const,\n icon: 'CircleQuestion',\n label: this.helpLabel,\n dot: false,\n }\n : {\n id: 'area' as const,\n icon: this.currentArea.icon || 'MapPage',\n label: this.currentArea.label || 'Area',\n dot: false,\n };\n\n return [\n currentArea,\n { id: 'search', icon: 'MagnifyingGlass', label: this.searchLabel, dot: this.searchDot },\n { id: 'inbox', icon: 'Inbox', label: this.inboxLabel, dot: this.inboxDot },\n {\n id: 'messages',\n icon: 'MessageBubbleStack',\n label: this.messagesLabel,\n dot: this.messagesDot,\n },\n { id: 'agents', icon: 'AI', label: this.agentsLabel, dot: this.agentsDot },\n ];\n }\n\n private selectDestination(destination: MobileDestination) {\n if (\n !shouldEmitMobileDestinationChange(\n this.activeDestination,\n destination,\n this.sheetNavExpanded\n )\n ) {\n return;\n }\n this.dsDestinationChange.emit({ destination });\n // Owners may replace the visible mobile stage (and transiently drop focus\n // in WebKit) while handling the controlled destination change.\n requestAnimationFrame(() => {\n void this.focusDestination(destination);\n });\n }\n\n @Method()\n async focusDestination(destination: MobileDestination | 'sheet-nav') {\n const target = this.el.querySelector<HTMLElement>(\n `#${\n destination === 'sheet-nav'\n ? 'ds-mobile-sheet-nav-trigger'\n : `ds-mobile-bar-${destination}-trigger`\n }`\n );\n target?.focus({ preventScroll: true });\n }\n\n private renderDestination(item: DestinationConfig) {\n const selected = !this.sheetNavExpanded && item.id === this.activeDestination;\n return (\n <button\n id={`ds-mobile-bar-${item.id}-trigger`}\n type=\"button\"\n class={{\n 'mobile-bar-nav__item': true,\n 'mobile-bar-nav__item--selected': selected,\n 'mobile-bar-nav__item--pressed': this.pressedItemId === item.id,\n 'ds-focus-ring-inset': true,\n 'ds-interaction-fill': true,\n }}\n aria-label={item.label}\n aria-current={selected ? 'page' : undefined}\n onClick={() => this.selectDestination(item.id)}\n {...this.pressHandlers(item.id)}\n >\n <span class=\"mobile-bar-nav__icon ds-interaction-fill__content\">\n <ds-icon name={item.icon} size=\"lg\" color=\"inherit\" />\n {item.dot && (\n <ds-badge class=\"mobile-bar-nav__dot\" variant=\"dot\" label=\"\" aria-hidden=\"true\" />\n )}\n </span>\n </button>\n );\n }\n\n render() {\n const [currentArea, ...tools] = this.destinationConfig();\n\n return (\n <Host>\n <nav class=\"mobile-bar-nav ds-chrome-row ds-chrome-space--md\" aria-label=\"Primary\">\n <div class=\"mobile-bar-nav__group mobile-bar-nav__group--context\">\n <button\n id=\"ds-mobile-sheet-nav-trigger\"\n type=\"button\"\n class={{\n 'mobile-bar-nav__item': true,\n 'mobile-bar-nav__item--selected': this.sheetNavExpanded,\n 'mobile-bar-nav__item--pressed':\n this.pressedItemId === 'sheet-nav',\n 'ds-focus-ring-inset': true,\n 'ds-interaction-fill': true,\n }}\n aria-label={this.menuLabel}\n aria-expanded={String(this.sheetNavExpanded)}\n aria-controls=\"ds-mobile-sheet-nav\"\n onClick={() => this.dsSheetNavToggle.emit(!this.sheetNavExpanded)}\n {...this.pressHandlers('sheet-nav')}\n >\n <span class=\"mobile-bar-nav__icon ds-interaction-fill__content\">\n <ds-icon\n name={this.sheetNavExpanded ? 'Cross' : 'Hamburger'}\n size=\"lg\"\n color=\"inherit\"\n />\n </span>\n </button>\n <span class=\"mobile-bar-nav__divider\" aria-hidden=\"true\" />\n {this.renderDestination(currentArea)}\n </div>\n <div class=\"mobile-bar-nav__group mobile-bar-nav__group--tools\">\n {tools.map(item => this.renderDestination(item))}\n </div>\n </nav>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["mobileBarNavCss","MINIMUM_DIRECT_PRESS_MS","MobileBarNav","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","activeDestination","currentArea","id","icon","label","sheetNavExpanded","menuLabel","searchLabel","inboxLabel","messagesLabel","agentsLabel","helpLabel","searchDot","inboxDot","messagesDot","agentsDot","pressedItemId","activePointerId","pressedAt","pressClearTimer","disconnectedCallback","clearPressedItem","clearPressTimer","clearTimeout","beginDirectPress","itemId","event","isPrimary","pointerType","button","pointerId","performance","now","target","currentTarget","setPointerCapture","finishDirectPress","remaining","Math","max","setTimeout","cancelDirectPress","pressHandlers","onPointerDown","onPointerUp","onPointerCancel","onLostPointerCapture","destinationConfig","dot","selectDestination","destination","shouldEmitMobileDestinationChange","dsDestinationChange","emit","requestAnimationFrame","focusDestination","el","querySelector","focus","preventScroll","renderDestination","item","selected","h","type","class","undefined","onClick","name","size","color","variant","render","tools","Host","key","String","dsSheetNavToggle","map"],"sources":["src/wc/components/MobileBarNav/MobileBarNav.css?tag=ds-mobile-bar-nav&encapsulation=scoped","src/wc/components/MobileBarNav/MobileBarNav.tsx"],"sourcesContent":["@import '../../utils/chrome-layout.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n\n:host {\n display: block;\n min-width: 0;\n background: var(--color-background-primary);\n color: var(--color-foreground-tertiary);\n -webkit-user-select: none;\n user-select: none;\n -webkit-touch-callout: none;\n}\n\n.mobile-bar-nav {\n justify-content: space-between;\n min-width: 0;\n padding-block-end: max(var(--ds-chrome-padding), env(safe-area-inset-bottom));\n border-top: var(--dimension-stroke-width-012) solid var(--color-border-tertiary);\n background: var(--color-background-primary);\n -webkit-user-select: none;\n user-select: none;\n -webkit-touch-callout: none;\n}\n\n.mobile-bar-nav__group {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-100);\n}\n\n.mobile-bar-nav__item {\n appearance: none;\n flex: 0 0 var(--dimension-size-500);\n width: var(--dimension-size-500);\n height: var(--dimension-size-500);\n padding: var(--dimension-space-100);\n border: 0;\n border-radius: var(--dimension-radius-025);\n background: transparent;\n color: inherit;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: default;\n}\n\n.mobile-bar-nav__item--selected {\n color: var(--color-foreground-primary);\n}\n\n/*\n * Safari can retain its native :active state after a direct touch. On coarse\n * touch-only pointers, the component-owned class provides one deterministic\n * press frame and clears it after release/cancel.\n */\n@media (hover: none) and (pointer: coarse) {\n .mobile-bar-nav__item.ds-interaction-fill:active:not(:disabled)::after {\n background: transparent;\n }\n\n .mobile-bar-nav__item--pressed.ds-interaction-fill::after,\n .mobile-bar-nav__item--pressed.ds-interaction-fill:active:not(:disabled)::after {\n background: var(--ds-interaction-pressed);\n }\n}\n\n.mobile-bar-nav__divider {\n flex: 0 0 var(--dimension-stroke-width-012);\n width: var(--dimension-stroke-width-012);\n height: var(--dimension-iconography-lg);\n background: var(--color-border-tertiary);\n pointer-events: none;\n -webkit-user-select: none;\n user-select: none;\n}\n\n.mobile-bar-nav__icon {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: var(--dimension-iconography-lg);\n height: var(--dimension-iconography-lg);\n}\n\n.mobile-bar-nav__dot {\n position: absolute;\n inset-block-start: calc(var(--dimension-space-025) * -1);\n inset-inline-end: calc(var(--dimension-space-025) * -1);\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport {\n shouldEmitMobileDestinationChange,\n type MobileDestination,\n} from '../../shell/shell-responsive';\nimport type { PanelNavItem } from '../PanelNav/panel-nav-types';\nimport type { MobileBarNavDestinationDetail } from './mobile-bar-nav-types';\n\ninterface DestinationConfig {\n id: MobileDestination;\n icon: string;\n label: string;\n dot: boolean;\n}\n\nconst MINIMUM_DIRECT_PRESS_MS = 120;\n\n@Component({\n tag: 'ds-mobile-bar-nav',\n styleUrl: 'MobileBarNav.css',\n scoped: true,\n})\nexport class MobileBarNav {\n @Element() el!: HTMLElement;\n\n @Prop() activeDestination: MobileDestination = 'area';\n @Prop() currentArea: PanelNavItem = {\n id: 'tracking',\n icon: 'MapPage',\n label: 'Tracking',\n };\n @Prop() sheetNavExpanded: boolean = false;\n @Prop() menuLabel: string = 'Menu';\n @Prop() searchLabel: string = 'Search';\n @Prop() inboxLabel: string = 'Inbox';\n @Prop() messagesLabel: string = 'Messages';\n @Prop() agentsLabel: string = 'Agents';\n @Prop() helpLabel: string = 'Help & Support';\n @Prop() searchDot: boolean = false;\n @Prop() inboxDot: boolean = false;\n @Prop() messagesDot: boolean = false;\n @Prop() agentsDot: boolean = false;\n\n @State() private pressedItemId: string | null = null;\n\n @Event() dsSheetNavToggle!: EventEmitter<boolean>;\n @Event() dsDestinationChange!: EventEmitter<MobileBarNavDestinationDetail>;\n\n private activePointerId: number | null = null;\n private pressedAt = 0;\n private pressClearTimer: ReturnType<typeof setTimeout> | null = null;\n\n disconnectedCallback() {\n this.clearPressedItem();\n }\n\n private clearPressTimer() {\n if (this.pressClearTimer === null) return;\n clearTimeout(this.pressClearTimer);\n this.pressClearTimer = null;\n }\n\n private clearPressedItem() {\n this.clearPressTimer();\n this.activePointerId = null;\n this.pressedItemId = null;\n }\n\n private beginDirectPress(itemId: string, event: PointerEvent) {\n if (!event.isPrimary || event.pointerType === 'mouse' || event.button !== 0) return;\n\n this.clearPressTimer();\n this.activePointerId = event.pointerId;\n this.pressedAt = performance.now();\n this.pressedItemId = itemId;\n\n const target = event.currentTarget as HTMLElement;\n try {\n target.setPointerCapture(event.pointerId);\n } catch {\n // Pointer capture can fail if Safari has already cancelled the stream.\n }\n }\n\n private finishDirectPress(event: PointerEvent) {\n if (event.pointerId !== this.activePointerId) return;\n\n this.activePointerId = null;\n const remaining = Math.max(\n 0,\n MINIMUM_DIRECT_PRESS_MS - (performance.now() - this.pressedAt)\n );\n\n this.clearPressTimer();\n this.pressClearTimer = setTimeout(() => {\n this.pressClearTimer = null;\n this.pressedItemId = null;\n }, remaining);\n }\n\n private cancelDirectPress(event: PointerEvent) {\n if (event.pointerId !== this.activePointerId) return;\n this.clearPressedItem();\n }\n\n private pressHandlers(itemId: string) {\n return {\n onPointerDown: (event: PointerEvent) => this.beginDirectPress(itemId, event),\n onPointerUp: (event: PointerEvent) => this.finishDirectPress(event),\n onPointerCancel: (event: PointerEvent) => this.cancelDirectPress(event),\n onLostPointerCapture: (event: PointerEvent) => this.finishDirectPress(event),\n };\n }\n\n private destinationConfig(): DestinationConfig[] {\n const currentArea =\n this.activeDestination === 'help'\n ? {\n id: 'help' as const,\n icon: 'CircleQuestion',\n label: this.helpLabel,\n dot: false,\n }\n : {\n id: 'area' as const,\n icon: this.currentArea.icon || 'MapPage',\n label: this.currentArea.label || 'Area',\n dot: false,\n };\n\n return [\n currentArea,\n { id: 'search', icon: 'MagnifyingGlass', label: this.searchLabel, dot: this.searchDot },\n { id: 'inbox', icon: 'Inbox', label: this.inboxLabel, dot: this.inboxDot },\n {\n id: 'messages',\n icon: 'MessageBubbleStack',\n label: this.messagesLabel,\n dot: this.messagesDot,\n },\n { id: 'agents', icon: 'AI', label: this.agentsLabel, dot: this.agentsDot },\n ];\n }\n\n private selectDestination(destination: MobileDestination) {\n if (\n !shouldEmitMobileDestinationChange(\n this.activeDestination,\n destination,\n this.sheetNavExpanded\n )\n ) {\n return;\n }\n this.dsDestinationChange.emit({ destination });\n // Owners may replace the visible mobile stage (and transiently drop focus\n // in WebKit) while handling the controlled destination change.\n requestAnimationFrame(() => {\n void this.focusDestination(destination);\n });\n }\n\n @Method()\n async focusDestination(destination: MobileDestination | 'sheet-nav') {\n const target = this.el.querySelector<HTMLElement>(\n `#${\n destination === 'sheet-nav'\n ? 'ds-mobile-sheet-nav-trigger'\n : `ds-mobile-bar-${destination}-trigger`\n }`\n );\n target?.focus({ preventScroll: true });\n }\n\n private renderDestination(item: DestinationConfig) {\n const selected = !this.sheetNavExpanded && item.id === this.activeDestination;\n return (\n <button\n id={`ds-mobile-bar-${item.id}-trigger`}\n type=\"button\"\n class={{\n 'mobile-bar-nav__item': true,\n 'mobile-bar-nav__item--selected': selected,\n 'mobile-bar-nav__item--pressed': this.pressedItemId === item.id,\n 'ds-focus-ring-inset': true,\n 'ds-interaction-fill': true,\n }}\n aria-label={item.label}\n aria-current={selected ? 'page' : undefined}\n onClick={() => this.selectDestination(item.id)}\n {...this.pressHandlers(item.id)}\n >\n <span class=\"mobile-bar-nav__icon ds-interaction-fill__content\">\n <ds-icon name={item.icon} size=\"lg\" color=\"inherit\" />\n {item.dot && (\n <ds-badge class=\"mobile-bar-nav__dot\" variant=\"dot\" label=\"\" aria-hidden=\"true\" />\n )}\n </span>\n </button>\n );\n }\n\n render() {\n const [currentArea, ...tools] = this.destinationConfig();\n\n return (\n <Host>\n <nav class=\"mobile-bar-nav ds-chrome-row ds-chrome-space--md\" aria-label=\"Primary\">\n <div class=\"mobile-bar-nav__group mobile-bar-nav__group--context\">\n <button\n id=\"ds-mobile-sheet-nav-trigger\"\n type=\"button\"\n class={{\n 'mobile-bar-nav__item': true,\n 'mobile-bar-nav__item--selected': this.sheetNavExpanded,\n 'mobile-bar-nav__item--pressed':\n this.pressedItemId === 'sheet-nav',\n 'ds-focus-ring-inset': true,\n 'ds-interaction-fill': true,\n }}\n aria-label={this.menuLabel}\n aria-expanded={String(this.sheetNavExpanded)}\n aria-controls=\"ds-mobile-sheet-nav\"\n onClick={() => this.dsSheetNavToggle.emit(!this.sheetNavExpanded)}\n {...this.pressHandlers('sheet-nav')}\n >\n <span class=\"mobile-bar-nav__icon ds-interaction-fill__content\">\n <ds-icon\n name={this.sheetNavExpanded ? 'Cross' : 'Hamburger'}\n size=\"lg\"\n color=\"inherit\"\n />\n </span>\n </button>\n <span class=\"mobile-bar-nav__divider\" aria-hidden=\"true\" />\n {this.renderDestination(currentArea)}\n </div>\n <div class=\"mobile-bar-nav__group mobile-bar-nav__group--tools\">\n {tools.map(item => this.renderDestination(item))}\n </div>\n </nav>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ let n=0;function t(){n+=1;return`ds-table-column-customizer-${n}`}function e(n){return n.kind==="action"}function r(n){return n.header.trim()||n.headerLabel?.trim()||n.id}function o(n){return n.filter((n=>!e(n)))}function c(n,t){const e=o(n).map((n=>n.id));const r=new Set(e);const c=new Set;const u=[];for(const n of t??[]){if(!r.has(n)||c.has(n))continue;c.add(n);u.push(n)}for(const n of e){if(c.has(n))continue;u.push(n)}return u}function u(n,t){const e=o(n).map((n=>n.id));const r=new Set(e);const c=[...new Set((t??[]).filter((n=>r.has(n))))];if(e.length===0||c.length<e.length)return c;const u=e[0];return c.filter((n=>n!==u))}function s(n,t,e){if(u(n,t).length>0)return true;const r=o(n).map((n=>n.id));const s=c(n,e);return s.length!==r.length||s.some(((n,t)=>n!==r[t]))}function i(n,t={}){if(!t.columnCustomizer)return n;const r=new Map(n.map((n=>[n.id,n])));const o=new Set(u(n,t.hiddenColumnIds));const s=c(n,t.columnOrder).map((n=>r.get(n))).filter((n=>!!n&&!o.has(n.id)));return[...s,...n.filter(e)]}function f(n,t,r){const c=n.find((n=>n.id===r));if(!c||e(c))return false;const s=new Set(u(n,t));if(s.has(r))return true;const i=o(n).filter((n=>!s.has(n.id)));return i.length>1}function a(n,t,e){const r=u(n,t);if(!f(n,r,e))return r;const o=new Set(r);if(o.has(e))o.delete(e);else o.add(e);return u(n,[...o])}function l(n,t,e){const o=new Map(n.map((n=>[n.id,n])));const s=u(n,t);const i=new Set(s);const a=c(n,e).flatMap((t=>{const e=o.get(t);if(!e)return[];return[{column:e,label:r(e),visible:!i.has(t),hideable:f(n,s,t),reorderable:true}]}));return a}function w(n,t,e){return l(n,t,e).map((n=>({label:n.label,value:n.column.id,showSwitch:true,switchValue:n.visible,isInactive:!n.hideable,reorderable:n.reorderable})))}export{s as a,c as b,u as c,a as d,e as i,t as n,i as r,w as t};
2
+ //# sourceMappingURL=p-BdnQv7Zl.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["columnCustomizerSeq","nextTableColumnCustomizerElementId","isTableActionColumn","column","kind","tableColumnCustomizerLabel","header","trim","headerLabel","id","tableDataColumns","columns","filter","resolveTableColumnOrder","columnOrder","catalogIds","map","catalog","Set","seen","ordered","has","add","push","resolveTableHiddenColumnIds","hiddenColumnIds","dataIds","data","hidden","length","keep","isTableColumnsCustomized","order","some","index","resolveTableVisibleColumns","options","columnCustomizer","byId","Map","visibleData","get","canToggleTableColumnHidden","columnId","find","candidate","toggleTableColumnHidden","resolved","delete","tableColumnCustomizerItems","resolvedHidden","dataItems","flatMap","label","visible","hideable","reorderable","tableColumnCustomizerMenuItems","item","value","showSwitch","switchValue","isInactive"],"sources":["src/wc/components/Table/table-column-customizer.ts"],"sourcesContent":["import type { MenuItemData } from '../Menu/menu-types';\nimport type { TableColumn } from './table-types';\n\nlet columnCustomizerSeq = 0;\n\nexport function nextTableColumnCustomizerElementId(): string {\n columnCustomizerSeq += 1;\n return `ds-table-column-customizer-${columnCustomizerSeq}`;\n}\n\nexport function isTableActionColumn(column: TableColumn): boolean {\n return column.kind === 'action';\n}\n\nexport function tableColumnCustomizerLabel(column: TableColumn): string {\n return column.header.trim() || column.headerLabel?.trim() || column.id;\n}\n\nexport function tableDataColumns(columns: TableColumn[]): TableColumn[] {\n return columns.filter(column => !isTableActionColumn(column));\n}\n\n/** Data-column ids in display order. Unknown, duplicate, and action ids are ignored. */\nexport function resolveTableColumnOrder(\n columns: TableColumn[],\n columnOrder: string[] | undefined\n): string[] {\n const catalogIds = tableDataColumns(columns).map(column => column.id);\n const catalog = new Set(catalogIds);\n const seen = new Set<string>();\n const ordered: string[] = [];\n\n for (const id of columnOrder ?? []) {\n if (!catalog.has(id) || seen.has(id)) continue;\n seen.add(id);\n ordered.push(id);\n }\n\n for (const id of catalogIds) {\n if (seen.has(id)) continue;\n ordered.push(id);\n }\n\n return ordered;\n}\n\n/**\n * Hidden data-column ids. Action and unknown ids are dropped. At least one data\n * column remains visible when the catalog has any data columns.\n */\nexport function resolveTableHiddenColumnIds(\n columns: TableColumn[],\n hiddenColumnIds: string[] | undefined\n): string[] {\n const dataIds = tableDataColumns(columns).map(column => column.id);\n const data = new Set(dataIds);\n const hidden = [...new Set((hiddenColumnIds ?? []).filter(id => data.has(id)))];\n if (dataIds.length === 0 || hidden.length < dataIds.length) return hidden;\n\n const keep = dataIds[0];\n return hidden.filter(id => id !== keep);\n}\n\n/** True when hidden ids or data-column order differ from the catalog default. */\nexport function isTableColumnsCustomized(\n columns: TableColumn[],\n hiddenColumnIds: string[] | undefined,\n columnOrder: string[] | undefined\n): boolean {\n if (resolveTableHiddenColumnIds(columns, hiddenColumnIds).length > 0) return true;\n const catalog = tableDataColumns(columns).map(column => column.id);\n const order = resolveTableColumnOrder(columns, columnOrder);\n return order.length !== catalog.length || order.some((id, index) => id !== catalog[index]);\n}\n\nexport function resolveTableVisibleColumns(\n columns: TableColumn[],\n options: {\n columnCustomizer?: boolean;\n hiddenColumnIds?: string[];\n columnOrder?: string[];\n } = {}\n): TableColumn[] {\n if (!options.columnCustomizer) return columns;\n\n const byId = new Map(columns.map(column => [column.id, column]));\n const hidden = new Set(resolveTableHiddenColumnIds(columns, options.hiddenColumnIds));\n const visibleData = resolveTableColumnOrder(columns, options.columnOrder)\n .map(id => byId.get(id))\n .filter((column): column is TableColumn => !!column && !hidden.has(column.id));\n\n return [...visibleData, ...columns.filter(isTableActionColumn)];\n}\n\nexport function canToggleTableColumnHidden(\n columns: TableColumn[],\n hiddenColumnIds: string[] | undefined,\n columnId: string\n): boolean {\n const column = columns.find(candidate => candidate.id === columnId);\n if (!column || isTableActionColumn(column)) return false;\n\n const hidden = new Set(resolveTableHiddenColumnIds(columns, hiddenColumnIds));\n if (hidden.has(columnId)) return true;\n\n const visibleData = tableDataColumns(columns).filter(candidate => !hidden.has(candidate.id));\n return visibleData.length > 1;\n}\n\nexport function toggleTableColumnHidden(\n columns: TableColumn[],\n hiddenColumnIds: string[] | undefined,\n columnId: string\n): string[] {\n const resolved = resolveTableHiddenColumnIds(columns, hiddenColumnIds);\n if (!canToggleTableColumnHidden(columns, resolved, columnId)) return resolved;\n\n const hidden = new Set(resolved);\n if (hidden.has(columnId)) hidden.delete(columnId);\n else hidden.add(columnId);\n return resolveTableHiddenColumnIds(columns, [...hidden]);\n}\n\nexport function moveTableColumnOrder(order: string[], fromId: string, toId: string): string[] {\n const from = order.indexOf(fromId);\n const to = order.indexOf(toId);\n if (from < 0 || to < 0 || from === to) return order;\n\n const next = [...order];\n next.splice(from, 1);\n next.splice(to, 0, fromId);\n return next;\n}\n\nexport function moveTableColumnInOrder(\n order: string[],\n columnId: string,\n offset: number\n): string[] {\n const from = order.indexOf(columnId);\n if (from < 0 || offset === 0) return order;\n return moveTableColumnOrder(order, columnId, order[from + offset] ?? columnId);\n}\n\nexport interface TableColumnCustomizerItem {\n column: TableColumn;\n label: string;\n visible: boolean;\n hideable: boolean;\n reorderable: boolean;\n}\n\nexport function tableColumnCustomizerItems(\n columns: TableColumn[],\n hiddenColumnIds: string[] | undefined,\n columnOrder: string[] | undefined\n): TableColumnCustomizerItem[] {\n const byId = new Map(columns.map(column => [column.id, column]));\n const resolvedHidden = resolveTableHiddenColumnIds(columns, hiddenColumnIds);\n const hidden = new Set(resolvedHidden);\n const dataItems = resolveTableColumnOrder(columns, columnOrder).flatMap(id => {\n const column = byId.get(id);\n if (!column) return [];\n return [\n {\n column,\n label: tableColumnCustomizerLabel(column),\n visible: !hidden.has(id),\n hideable: canToggleTableColumnHidden(columns, resolvedHidden, id),\n reorderable: true,\n },\n ];\n });\n return dataItems;\n}\n\n/** Menu switch rows for the table-owned column customizer. */\nexport function tableColumnCustomizerMenuItems(\n columns: TableColumn[],\n hiddenColumnIds: string[] | undefined,\n columnOrder: string[] | undefined\n): MenuItemData[] {\n return tableColumnCustomizerItems(columns, hiddenColumnIds, columnOrder).map(item => ({\n label: item.label,\n value: item.column.id,\n showSwitch: true,\n switchValue: item.visible,\n isInactive: !item.hideable,\n reorderable: item.reorderable,\n }));\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,2 +1,2 @@
1
- import{p as s,H as e,c as t,h as i,a as o,t as r}from"./index.js";import{D as n,s as d}from"./p-DOUk4KoT.js";import{s as c}from"./p-B8q-6a03.js";const a=()=>`@media (forced-colors: active){:root,:host,.ds-forced-colors-scope{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}:host{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}:host(.ds-focus-ring),.ds-focus-ring,:host(.ds-focus-ring-inset),.ds-focus-ring-inset{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}:host(.ds-focus-ring:focus-visible),.ds-focus-ring:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}:host(.ds-focus-ring.ds-focus-ring--visible),.ds-focus-ring.ds-focus-ring--visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}:host(.ds-focus-ring-inset:focus-visible),.ds-focus-ring-inset:focus-visible{outline:none}:host(.ds-focus-ring-inset:focus-visible)::after,.ds-focus-ring-inset:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}:host(.ds-focus-ring-inset.ds-focus-ring--visible),.ds-focus-ring-inset.ds-focus-ring--visible{outline:none}:host(.ds-focus-ring-inset.ds-focus-ring--visible)::after,.ds-focus-ring-inset.ds-focus-ring--visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){:host{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){:root,:host,.ds-forced-colors-scope{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}:host(.ds-control-inactive),.ds-control-inactive{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){:host(.ds-control-inactive),.ds-control-inactive{color:var(--ds-forced-color-disabled);opacity:1}}@media (forced-colors: active){:root,:host,.ds-forced-colors-scope{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}:host{--ds-switch-width:var(--dimension-size-400);--ds-switch-height:var(--dimension-size-250);--ds-switch-thumb-size:var(--dimension-size-150);--ds-switch-gap:var(--dimension-space-050);--ds-switch-stroke:var(--dimension-stroke-width-012);--ds-switch-inset:var(--ds-switch-gap);--ds-switch-thumb-hover:var(--color-interaction-hover);--ds-switch-thumb-pressed:var(--color-interaction-pressed);--ds-switch-travel:calc( var(--ds-switch-width) - var(--ds-switch-thumb-size) - var(--ds-switch-inset) - var(--ds-switch-inset) );position:relative;display:inline-flex;width:var(--ds-switch-width);height:var(--ds-switch-height);padding:0;border:none;border-radius:var(--dimension-radius-half);box-sizing:border-box;flex-shrink:0;overflow:visible;cursor:default;user-select:none;outline:none;background-color:transparent;box-shadow:inset 0 0 0 var(--ds-switch-stroke) var(--color-border-secondary);transition:background-color var(--effect-motion-short-3), box-shadow var(--effect-motion-short-3)}:host(.switch--lg){--ds-switch-width:var(--dimension-size-500);--ds-switch-height:var(--dimension-size-300);--ds-switch-thumb-size:var(--dimension-iconography-sm);--ds-switch-gap:var(--dimension-space-050)}:host(.switch--sm){--ds-switch-width:var(--dimension-size-300);--ds-switch-height:var(--dimension-size-200);--ds-switch-thumb-size:calc(var(--dimension-size-base) * 5 / 4);--ds-switch-gap:calc(var(--dimension-space-025) + var(--dimension-space-012))}:host(.switch--xs){--ds-switch-width:var(--dimension-size-250);--ds-switch-height:var(--dimension-size-150);--ds-switch-thumb-size:var(--dimension-size-100);--ds-switch-gap:var(--dimension-space-025)}:host(.checked){background-color:var(--color-background-bold-brand);box-shadow:none}:host(.switch--readonly),:host(.switch--presentation){cursor:default}:host(.switch--presentation){pointer-events:none}.thumb{position:absolute;top:50%;left:var(--ds-switch-inset);width:var(--ds-switch-thumb-size);height:var(--ds-switch-thumb-size);border-radius:var(--dimension-radius-half);background-color:var(--color-foreground-tertiary);box-shadow:none;transform:translateY(-50%);transition:background-color var(--effect-motion-short-3), transform var(--effect-motion-short-3);pointer-events:none}.thumb::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none}@media (hover: hover) and (pointer: fine){:host(:hover:not(:disabled):not(.ds-control-inactive):not(.switch--readonly):not(.switch--presentation)) .thumb::after{background:var(--ds-switch-thumb-hover)}}:host(:active:not(:disabled):not(.ds-control-inactive):not(.switch--readonly):not(.switch--presentation)) .thumb::after{background:var(--ds-switch-thumb-pressed)}:host(.checked) .thumb{background-color:var(--color-background-primary);box-shadow:none;transform:translate3d(var(--ds-switch-travel), -50%, 0)}@media (prefers-reduced-motion: reduce){:host{transition:none}.thumb{transition:none}}@media (forced-colors: active){:host{border:var(--ds-switch-stroke) solid var(--ds-forced-color-content);box-shadow:none}:host(.checked){background-color:var(--ds-forced-color-selected);border-color:var(--ds-forced-color-selected)}.thumb{background-color:var(--ds-forced-color-content)}:host(.checked) .thumb{background-color:var(--ds-forced-color-on-selected)}}`;let h=0;const l=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.__attachShadow();this.dsChange=t(this,"dsChange");this.internals=this.attachInternals();this.checked=false;this.value="on";this.disabled=false;this.readOnly=false;this.required=false;this.requiredMessage=n;this.isInactive=false;this.size="md";this.presentation=false;this.initialChecked=false;this.formDisabled=false;this.focused=false;this.touched=false;this.handleClick=()=>{if(this.presentation||this.readOnly||this.isInactive||this.disabled||this.formDisabled)return;this.checked=!this.checked;this.dsChange.emit(this.checked)};this.handleKeyDown=s=>{if(this.presentation||this.readOnly||this.isInactive||this.disabled||this.formDisabled)return;if(s.key===" "||s.key==="Enter"){s.preventDefault();this.handleClick()}};this.handleFocus=()=>{if(!this.presentation)this.focused=true};this.handleBlur=()=>{if(this.presentation)return;this.focused=false;this.touched=true}}componentWillLoad(){this.initialChecked=this.checked;this.syncFormValue()}componentDidLoad(){this.syncNativeLabels()}syncFormValue(){const s=this.presentation||this.isInactive||this.disabled||this.formDisabled;const e=this.checked?this.value:this.uncheckedValue??null;const t=this.checked?"checked":"unchecked";c(this.internals,e,{inactive:s,state:t});const i=this.required&&!s&&!this.checked;d(this.internals,i,this.requiredMessage)}formDisabledCallback(s){this.formDisabled=s;this.syncFormValue()}formResetCallback(){this.checked=this.initialChecked;this.focused=false;this.touched=false}formStateRestoreCallback(s){this.checked=s==="checked"}syncNativeLabels(){if(this.presentation)return;if(this.el.hasAttribute("aria-label")||this.el.hasAttribute("aria-labelledby"))return;const s=Array.from(this.internals.labels).map((s=>{if(!s.id)s.id=`ds-switch-label-${++h}`;return s.id}));if(s.length)this.el.setAttribute("aria-labelledby",s.join(" "))}render(){const s=this.isInactive||this.disabled||this.formDisabled;const e=this.required&&!s&&!this.checked;const t=this.checked!==this.initialChecked;return i(o,{key:"0dc0dfd7b95d1611a79acc61df0bd85bc64a868a",role:this.presentation?undefined:"switch","aria-checked":this.presentation?undefined:String(this.checked),"aria-disabled":!this.presentation&&s?"true":undefined,"aria-readonly":!this.presentation&&this.readOnly?"true":undefined,"aria-required":!this.presentation&&this.required?"true":undefined,"aria-invalid":!this.presentation&&e?"true":undefined,"aria-hidden":this.presentation?"true":undefined,"data-checked":this.checked?"":undefined,"data-unchecked":!this.checked?"":undefined,"data-disabled":s?"":undefined,"data-readonly":this.readOnly?"":undefined,"data-required":this.required?"":undefined,"data-focused":!this.presentation&&this.focused?"":undefined,"data-filled":!this.presentation&&this.checked?"":undefined,"data-dirty":!this.presentation&&t?"":undefined,"data-touched":!this.presentation&&this.touched?"":undefined,"data-valid":!this.presentation&&!s&&!e?"":undefined,"data-invalid":!this.presentation&&e?"":undefined,tabIndex:this.presentation||s?-1:0,class:{switch:true,checked:this.checked,"switch--lg":this.size==="lg","switch--md":this.size==="md","switch--sm":this.size==="sm","switch--xs":this.size==="xs","switch--readonly":this.readOnly,"switch--presentation":this.presentation,"ds-focus-ring":true,"ds-control-inactive":s},onClick:this.handleClick,onKeyDown:this.handleKeyDown,onFocus:this.handleFocus,onBlur:this.handleBlur},i("span",{key:"dba3ababfdc4c9d81478d5e442cd88bf0f2325a9",class:"thumb"}))}static get formAssociated(){return true}get el(){return this}static get watchers(){return{checked:[{syncFormValue:0}],value:[{syncFormValue:0}],uncheckedValue:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],presentation:[{syncFormValue:0}],required:[{syncFormValue:0}]}}static get style(){return a()}},[65,"ds-switch",{checked:[1028],name:[513],value:[1],uncheckedValue:[1,"unchecked-value"],form:[513],disabled:[516],readOnly:[516,"read-only"],required:[516],requiredMessage:[1,"required-message"],isInactive:[4,"is-inactive"],size:[1],presentation:[4],formDisabled:[32],focused:[32],touched:[32]},undefined,{checked:[{syncFormValue:0}],value:[{syncFormValue:0}],uncheckedValue:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],presentation:[{syncFormValue:0}],required:[{syncFormValue:0}]}]);function u(){if(typeof customElements==="undefined"){return}const s=["ds-switch"];s.forEach((s=>{switch(s){case"ds-switch":if(!customElements.get(r(s))){customElements.define(r(s),l)}break}}))}u();export{l as S,u as d};
2
- //# sourceMappingURL=p-Btxwp4lJ.js.map
1
+ import{p as s,H as e,c as t,h as i,a as o,t as r}from"./index.js";import{D as n,s as d}from"./p-DOUk4KoT.js";import{s as c}from"./p-B8q-6a03.js";const a=()=>`@media (forced-colors: active){:root,:host,.ds-forced-colors-scope{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}:host{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}:host(.ds-focus-ring),.ds-focus-ring,:host(.ds-focus-ring-inset),.ds-focus-ring-inset{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}:host(.ds-focus-ring:focus-visible),.ds-focus-ring:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}:host(.ds-focus-ring.ds-focus-ring--visible),.ds-focus-ring.ds-focus-ring--visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}:host(.ds-focus-ring-inset:focus-visible),.ds-focus-ring-inset:focus-visible{outline:none}:host(.ds-focus-ring-inset:focus-visible)::after,.ds-focus-ring-inset:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}:host(.ds-focus-ring-inset.ds-focus-ring--visible),.ds-focus-ring-inset.ds-focus-ring--visible{outline:none}:host(.ds-focus-ring-inset.ds-focus-ring--visible)::after,.ds-focus-ring-inset.ds-focus-ring--visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){:host{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){:root,:host,.ds-forced-colors-scope{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}:host(.ds-control-inactive),.ds-control-inactive{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){:host(.ds-control-inactive),.ds-control-inactive{color:var(--ds-forced-color-disabled);opacity:1}}@media (forced-colors: active){:root,:host,.ds-forced-colors-scope{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}:host{--ds-switch-width:var(--dimension-size-400);--ds-switch-height:var(--dimension-size-250);--ds-switch-thumb-size:var(--dimension-size-150);--ds-switch-gap:var(--dimension-space-050);--ds-switch-stroke:var(--dimension-stroke-width-012);--ds-switch-inset:var(--ds-switch-gap);--ds-switch-thumb-hover:var(--color-interaction-hover);--ds-switch-thumb-pressed:var(--color-interaction-pressed);--ds-switch-travel:calc( var(--ds-switch-width) - var(--ds-switch-thumb-size) - var(--ds-switch-inset) - var(--ds-switch-inset) );position:relative;display:inline-flex;width:var(--ds-switch-width);height:var(--ds-switch-height);padding:0;border:none;border-radius:var(--dimension-radius-half);box-sizing:border-box;flex-shrink:0;overflow:visible;cursor:default;user-select:none;outline:none;background-color:transparent;box-shadow:inset 0 0 0 var(--ds-switch-stroke) var(--color-border-secondary);transition:background-color var(--effect-motion-short-3), box-shadow var(--effect-motion-short-3)}:host(.switch--lg){--ds-switch-width:var(--dimension-size-500);--ds-switch-height:var(--dimension-size-300);--ds-switch-thumb-size:var(--dimension-iconography-sm);--ds-switch-gap:var(--dimension-space-050)}:host(.switch--sm){--ds-switch-width:var(--dimension-size-300);--ds-switch-height:var(--dimension-size-200);--ds-switch-thumb-size:calc(var(--dimension-size-base) * 5 / 4);--ds-switch-gap:calc(var(--dimension-space-025) + var(--dimension-space-012))}:host(.switch--xs){--ds-switch-width:var(--dimension-size-250);--ds-switch-height:var(--dimension-size-150);--ds-switch-thumb-size:var(--dimension-size-100);--ds-switch-gap:var(--dimension-space-025)}:host(.checked){background-color:var(--color-background-bold-brand);box-shadow:none}:host(.switch--readonly),:host(.switch--presentation){cursor:default}:host(.switch--presentation){pointer-events:none}.thumb{position:absolute;top:50%;left:var(--ds-switch-inset);width:var(--ds-switch-thumb-size);height:var(--ds-switch-thumb-size);border-radius:var(--dimension-radius-half);background-color:var(--color-foreground-tertiary);box-shadow:none;transform:translateY(-50%);transition:background-color var(--effect-motion-short-3), transform var(--effect-motion-short-3);pointer-events:none}.thumb::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none}@media (hover: hover) and (pointer: fine){:host(:hover:not(:disabled):not(.ds-control-inactive):not(.switch--readonly):not(.switch--presentation)) .thumb::after{background:var(--ds-switch-thumb-hover)}}:host(:active:not(:disabled):not(.ds-control-inactive):not(.switch--readonly):not(.switch--presentation)) .thumb::after{background:var(--ds-switch-thumb-pressed)}:host(.checked) .thumb{background-color:var(--color-background-primary);box-shadow:none;transform:translate3d(var(--ds-switch-travel), -50%, 0)}@media (prefers-reduced-motion: reduce){:host{transition:none}.thumb{transition:none}}@media (forced-colors: active){:host{border:var(--ds-switch-stroke) solid var(--ds-forced-color-content);box-shadow:none}:host(.checked){background-color:var(--ds-forced-color-selected);border-color:var(--ds-forced-color-selected)}.thumb{background-color:var(--ds-forced-color-content)}:host(.checked) .thumb{background-color:var(--ds-forced-color-on-selected)}}`;let h=0;const l=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.__attachShadow();this.dsChange=t(this,"dsChange",7);this.internals=this.attachInternals();this.checked=false;this.value="on";this.disabled=false;this.readOnly=false;this.required=false;this.requiredMessage=n;this.isInactive=false;this.size="md";this.presentation=false;this.initialChecked=false;this.formDisabled=false;this.focused=false;this.touched=false;this.handleClick=()=>{if(this.presentation||this.readOnly||this.isInactive||this.disabled||this.formDisabled)return;this.checked=!this.checked;this.dsChange.emit(this.checked)};this.handleKeyDown=s=>{if(this.presentation||this.readOnly||this.isInactive||this.disabled||this.formDisabled)return;if(s.key===" "||s.key==="Enter"){s.preventDefault();this.handleClick()}};this.handleFocus=()=>{if(!this.presentation)this.focused=true};this.handleBlur=()=>{if(this.presentation)return;this.focused=false;this.touched=true}}componentWillLoad(){this.initialChecked=this.checked;this.syncFormValue()}componentDidLoad(){this.syncNativeLabels()}syncFormValue(){const s=this.presentation||this.isInactive||this.disabled||this.formDisabled;const e=this.checked?this.value:this.uncheckedValue??null;const t=this.checked?"checked":"unchecked";c(this.internals,e,{inactive:s,state:t});const i=this.required&&!s&&!this.checked;d(this.internals,i,this.requiredMessage)}formDisabledCallback(s){this.formDisabled=s;this.syncFormValue()}formResetCallback(){this.checked=this.initialChecked;this.focused=false;this.touched=false}formStateRestoreCallback(s){this.checked=s==="checked"}syncNativeLabels(){if(this.presentation)return;if(this.el.hasAttribute("aria-label")||this.el.hasAttribute("aria-labelledby"))return;const s=Array.from(this.internals.labels).map((s=>{if(!s.id)s.id=`ds-switch-label-${++h}`;return s.id}));if(s.length)this.el.setAttribute("aria-labelledby",s.join(" "))}render(){const s=this.isInactive||this.disabled||this.formDisabled;const e=this.required&&!s&&!this.checked;const t=this.checked!==this.initialChecked;return i(o,{key:"3976d93cf8015587ead07db6409febc55e2aa260",role:this.presentation?undefined:"switch","aria-checked":this.presentation?undefined:String(this.checked),"aria-disabled":!this.presentation&&s?"true":undefined,"aria-readonly":!this.presentation&&this.readOnly?"true":undefined,"aria-required":!this.presentation&&this.required?"true":undefined,"aria-invalid":!this.presentation&&e?"true":undefined,"aria-hidden":this.presentation?"true":undefined,"data-checked":this.checked?"":undefined,"data-unchecked":!this.checked?"":undefined,"data-disabled":s?"":undefined,"data-readonly":this.readOnly?"":undefined,"data-required":this.required?"":undefined,"data-focused":!this.presentation&&this.focused?"":undefined,"data-filled":!this.presentation&&this.checked?"":undefined,"data-dirty":!this.presentation&&t?"":undefined,"data-touched":!this.presentation&&this.touched?"":undefined,"data-valid":!this.presentation&&!s&&!e?"":undefined,"data-invalid":!this.presentation&&e?"":undefined,tabIndex:this.presentation||s?-1:0,class:{switch:true,checked:this.checked,"switch--lg":this.size==="lg","switch--md":this.size==="md","switch--sm":this.size==="sm","switch--xs":this.size==="xs","switch--readonly":this.readOnly,"switch--presentation":this.presentation,"ds-focus-ring":true,"ds-control-inactive":s},onClick:this.handleClick,onKeyDown:this.handleKeyDown,onFocus:this.handleFocus,onBlur:this.handleBlur},i("span",{key:"de6e6b4767b6915d3df5f3235a778f41e9b0b79b",class:"thumb"}))}static get formAssociated(){return true}get el(){return this}static get watchers(){return{checked:[{syncFormValue:0}],value:[{syncFormValue:0}],uncheckedValue:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],presentation:[{syncFormValue:0}],required:[{syncFormValue:0}]}}static get style(){return a()}},[65,"ds-switch",{checked:[1028],name:[513],value:[1],uncheckedValue:[1,"unchecked-value"],form:[513],disabled:[516],readOnly:[516,"read-only"],required:[516],requiredMessage:[1,"required-message"],isInactive:[4,"is-inactive"],size:[1],presentation:[4],formDisabled:[32],focused:[32],touched:[32]},undefined,{checked:[{syncFormValue:0}],value:[{syncFormValue:0}],uncheckedValue:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],presentation:[{syncFormValue:0}],required:[{syncFormValue:0}]}]);function u(){if(typeof customElements==="undefined"){return}const s=["ds-switch"];s.forEach((s=>{switch(s){case"ds-switch":if(!customElements.get(r(s))){customElements.define(r(s),l)}break}}))}u();export{l as S,u as d};
2
+ //# sourceMappingURL=p-BhYWdbEp.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["switchCss","generatedLabelId","Switch","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","checked","value","disabled","readOnly","required","requiredMessage","DEFAULT_REQUIRED_MESSAGE","isInactive","size","presentation","initialChecked","formDisabled","focused","touched","handleClick","dsChange","emit","handleKeyDown","event","key","preventDefault","handleFocus","handleBlur","componentWillLoad","syncFormValue","componentDidLoad","syncNativeLabels","inactive","submissionValue","uncheckedValue","state","setFormControlValue","internals","missing","setRequiredValidity","formDisabledCallback","formResetCallback","formStateRestoreCallback","el","hasAttribute","labelIds","Array","from","labels","map","label","id","length","setAttribute","join","render","invalid","dirty","h","Host","role","undefined","String","tabIndex","class","switch","onClick","onKeyDown","onFocus","onBlur"],"sources":["src/wc/components/Switch/Switch.css?tag=ds-switch&encapsulation=shadow","src/wc/components/Switch/Switch.tsx"],"sourcesContent":["@import '../../utils/focus-ring.css';\n@import '../../utils/control-inactive.css';\n@import '../../utils/forced-colors.css';\n\n:host {\n --ds-switch-width: var(--dimension-size-400);\n --ds-switch-height: var(--dimension-size-250);\n --ds-switch-thumb-size: var(--dimension-size-150);\n --ds-switch-gap: var(--dimension-space-050);\n --ds-switch-stroke: var(--dimension-stroke-width-012);\n --ds-switch-inset: var(--ds-switch-gap);\n --ds-switch-thumb-hover: var(--color-interaction-hover);\n --ds-switch-thumb-pressed: var(--color-interaction-pressed);\n --ds-switch-travel: calc(\n var(--ds-switch-width) - var(--ds-switch-thumb-size) - var(--ds-switch-inset) -\n var(--ds-switch-inset)\n );\n position: relative;\n display: inline-flex;\n width: var(--ds-switch-width);\n height: var(--ds-switch-height);\n padding: 0;\n border: none;\n border-radius: var(--dimension-radius-half);\n box-sizing: border-box;\n flex-shrink: 0;\n overflow: visible;\n cursor: default;\n user-select: none;\n outline: none;\n background-color: transparent;\n box-shadow: inset 0 0 0 var(--ds-switch-stroke) var(--color-border-secondary);\n transition:\n background-color var(--effect-motion-short-3),\n box-shadow var(--effect-motion-short-3);\n}\n\n:host(.switch--lg) {\n --ds-switch-width: var(--dimension-size-500);\n --ds-switch-height: var(--dimension-size-300);\n --ds-switch-thumb-size: var(--dimension-iconography-sm);\n --ds-switch-gap: var(--dimension-space-050);\n}\n\n:host(.switch--sm) {\n --ds-switch-width: var(--dimension-size-300);\n --ds-switch-height: var(--dimension-size-200);\n --ds-switch-thumb-size: calc(var(--dimension-size-base) * 5 / 4);\n --ds-switch-gap: calc(var(--dimension-space-025) + var(--dimension-space-012));\n}\n\n:host(.switch--xs) {\n --ds-switch-width: var(--dimension-size-250);\n --ds-switch-height: var(--dimension-size-150);\n --ds-switch-thumb-size: var(--dimension-size-100);\n --ds-switch-gap: var(--dimension-space-025);\n}\n\n:host(.checked) {\n background-color: var(--color-background-bold-brand);\n box-shadow: none;\n}\n\n:host(.switch--readonly),\n:host(.switch--presentation) {\n cursor: default;\n}\n\n:host(.switch--presentation) {\n pointer-events: none;\n}\n\n/* Inactive: `.ds-control-inactive` (50% opacity). */\n\n.thumb {\n position: absolute;\n top: 50%;\n left: var(--ds-switch-inset);\n width: var(--ds-switch-thumb-size);\n height: var(--ds-switch-thumb-size);\n border-radius: var(--dimension-radius-half);\n background-color: var(--color-foreground-tertiary);\n box-shadow: none;\n transform: translateY(-50%);\n transition:\n background-color var(--effect-motion-short-3),\n transform var(--effect-motion-short-3);\n pointer-events: none;\n}\n\n.thumb::after {\n content: '';\n position: absolute;\n inset: 0;\n border-radius: inherit;\n background: transparent;\n pointer-events: none;\n}\n\n@media (hover: hover) and (pointer: fine) {\n :host(:hover:not(:disabled):not(.ds-control-inactive):not(.switch--readonly):not(.switch--presentation))\n .thumb::after {\n background: var(--ds-switch-thumb-hover);\n }\n}\n\n:host(:active:not(:disabled):not(.ds-control-inactive):not(.switch--readonly):not(.switch--presentation))\n .thumb::after {\n background: var(--ds-switch-thumb-pressed);\n}\n\n:host(.checked) .thumb {\n background-color: var(--color-background-primary);\n box-shadow: none;\n transform: translate3d(var(--ds-switch-travel), -50%, 0);\n}\n\n@media (prefers-reduced-motion: reduce) {\n :host {\n transition: none;\n }\n\n .thumb {\n transition: none;\n }\n}\n\n@media (forced-colors: active) {\n :host {\n border: var(--ds-switch-stroke) solid var(--ds-forced-color-content);\n box-shadow: none;\n }\n\n :host(.checked) {\n background-color: var(--ds-forced-color-selected);\n border-color: var(--ds-forced-color-selected);\n }\n\n .thumb {\n background-color: var(--ds-forced-color-content);\n }\n\n :host(.checked) .thumb {\n background-color: var(--ds-forced-color-on-selected);\n }\n}\n","import { AttachInternals, Component, Element, Prop, State, Event, EventEmitter, Watch, h, Host } from '@stencil/core';\nimport { DEFAULT_REQUIRED_MESSAGE, setFormControlValue, setRequiredValidity } from '../../utils';\n\nexport type SwitchSize = 'lg' | 'md' | 'sm' | 'xs';\n\nlet generatedLabelId = 0;\n\n@Component({\n tag: 'ds-switch',\n styleUrl: 'Switch.css',\n shadow: true,\n formAssociated: true,\n})\nexport class Switch {\n @Element() el!: HTMLElement;\n @AttachInternals() internals!: ElementInternals;\n\n /** Current on/off state. The initial value is restored when the owning form resets. */\n @Prop({ mutable: true }) checked: boolean = false;\n\n @Prop({ reflect: true }) name: string | undefined;\n @Prop() value: string = 'on';\n\n /** Optional value submitted when unchecked; omitted by default like a native checkbox. */\n @Prop() uncheckedValue: string | undefined;\n\n /** Associates the switch with a form by id when it is rendered outside that form. */\n @Prop({ reflect: true }) form: string | undefined;\n\n @Prop({ reflect: true }) disabled: boolean = false;\n @Prop({ reflect: true }) readOnly: boolean = false;\n @Prop({ reflect: true }) required: boolean = false;\n @Prop() requiredMessage: string = DEFAULT_REQUIRED_MESSAGE;\n @Prop() isInactive: boolean = false;\n\n /** Compact track size for placement inside controls, menus, and form rows. */\n @Prop() size: SwitchSize = 'md';\n\n /**\n * Removes standalone control semantics so a composite owner such as a\n * `menuitemcheckbox` can use the switch as an aria-hidden visual indicator.\n */\n @Prop() presentation: boolean = false;\n\n @Event() dsChange!: EventEmitter<boolean>;\n\n private initialChecked = false;\n @State() private formDisabled = false;\n @State() private focused = false;\n @State() private touched = false;\n\n componentWillLoad() {\n this.initialChecked = this.checked;\n this.syncFormValue();\n }\n\n componentDidLoad() {\n this.syncNativeLabels();\n }\n\n @Watch('checked')\n @Watch('value')\n @Watch('uncheckedValue')\n @Watch('disabled')\n @Watch('isInactive')\n @Watch('presentation')\n @Watch('required')\n syncFormValue() {\n const inactive = this.presentation || this.isInactive || this.disabled || this.formDisabled;\n const submissionValue = this.checked ? this.value : this.uncheckedValue ?? null;\n const state = this.checked ? 'checked' : 'unchecked';\n setFormControlValue(this.internals, submissionValue, { inactive, state });\n\n const missing = this.required && !inactive && !this.checked;\n setRequiredValidity(this.internals, missing, this.requiredMessage);\n }\n\n formDisabledCallback(disabled: boolean) {\n this.formDisabled = disabled;\n this.syncFormValue();\n }\n\n formResetCallback() {\n this.checked = this.initialChecked;\n this.focused = false;\n this.touched = false;\n }\n\n formStateRestoreCallback(state: string | File | FormData | null) {\n this.checked = state === 'checked';\n }\n\n private syncNativeLabels() {\n if (this.presentation) return;\n if (this.el.hasAttribute('aria-label') || this.el.hasAttribute('aria-labelledby')) return;\n\n const labelIds = (Array.from(this.internals.labels) as HTMLLabelElement[]).map(label => {\n if (!label.id) label.id = `ds-switch-label-${++generatedLabelId}`;\n return label.id;\n });\n if (labelIds.length) this.el.setAttribute('aria-labelledby', labelIds.join(' '));\n }\n\n private handleClick = () => {\n if (this.presentation || this.readOnly || this.isInactive || this.disabled || this.formDisabled) return;\n this.checked = !this.checked;\n this.dsChange.emit(this.checked);\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (this.presentation || this.readOnly || this.isInactive || this.disabled || this.formDisabled) return;\n if (event.key === ' ' || event.key === 'Enter') {\n event.preventDefault();\n this.handleClick();\n }\n };\n\n private handleFocus = () => {\n if (!this.presentation) this.focused = true;\n };\n\n private handleBlur = () => {\n if (this.presentation) return;\n this.focused = false;\n this.touched = true;\n };\n\n render() {\n const inactive = this.isInactive || this.disabled || this.formDisabled;\n const invalid = this.required && !inactive && !this.checked;\n const dirty = this.checked !== this.initialChecked;\n // Switch owns its structural track and thumb strokes so nested interaction layers cannot cover them.\n return (\n <Host\n role={this.presentation ? undefined : 'switch'}\n aria-checked={this.presentation ? undefined : String(this.checked)}\n aria-disabled={!this.presentation && inactive ? 'true' : undefined}\n aria-readonly={!this.presentation && this.readOnly ? 'true' : undefined}\n aria-required={!this.presentation && this.required ? 'true' : undefined}\n aria-invalid={!this.presentation && invalid ? 'true' : undefined}\n aria-hidden={this.presentation ? 'true' : undefined}\n data-checked={this.checked ? '' : undefined}\n data-unchecked={!this.checked ? '' : undefined}\n data-disabled={inactive ? '' : undefined}\n data-readonly={this.readOnly ? '' : undefined}\n data-required={this.required ? '' : undefined}\n data-focused={!this.presentation && this.focused ? '' : undefined}\n data-filled={!this.presentation && this.checked ? '' : undefined}\n data-dirty={!this.presentation && dirty ? '' : undefined}\n data-touched={!this.presentation && this.touched ? '' : undefined}\n data-valid={!this.presentation && !inactive && !invalid ? '' : undefined}\n data-invalid={!this.presentation && invalid ? '' : undefined}\n tabIndex={this.presentation || inactive ? -1 : 0}\n class={{\n switch: true,\n checked: this.checked,\n 'switch--lg': this.size === 'lg',\n 'switch--md': this.size === 'md',\n 'switch--sm': this.size === 'sm',\n 'switch--xs': this.size === 'xs',\n 'switch--readonly': this.readOnly,\n 'switch--presentation': this.presentation,\n 'ds-focus-ring': true,\n 'ds-control-inactive': inactive,\n }}\n onClick={this.handleClick}\n onKeyDown={this.handleKeyDown}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n >\n <span class=\"thumb\" />\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["switchCss","generatedLabelId","Switch","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","checked","value","disabled","readOnly","required","requiredMessage","DEFAULT_REQUIRED_MESSAGE","isInactive","size","presentation","initialChecked","formDisabled","focused","touched","handleClick","dsChange","emit","handleKeyDown","event","key","preventDefault","handleFocus","handleBlur","componentWillLoad","syncFormValue","componentDidLoad","syncNativeLabels","inactive","submissionValue","uncheckedValue","state","setFormControlValue","internals","missing","setRequiredValidity","formDisabledCallback","formResetCallback","formStateRestoreCallback","el","hasAttribute","labelIds","Array","from","labels","map","label","id","length","setAttribute","join","render","invalid","dirty","h","Host","role","undefined","String","tabIndex","class","switch","onClick","onKeyDown","onFocus","onBlur"],"sources":["src/wc/components/Switch/Switch.css?tag=ds-switch&encapsulation=shadow","src/wc/components/Switch/Switch.tsx"],"sourcesContent":["@import '../../utils/focus-ring.css';\n@import '../../utils/control-inactive.css';\n@import '../../utils/forced-colors.css';\n\n:host {\n --ds-switch-width: var(--dimension-size-400);\n --ds-switch-height: var(--dimension-size-250);\n --ds-switch-thumb-size: var(--dimension-size-150);\n --ds-switch-gap: var(--dimension-space-050);\n --ds-switch-stroke: var(--dimension-stroke-width-012);\n --ds-switch-inset: var(--ds-switch-gap);\n --ds-switch-thumb-hover: var(--color-interaction-hover);\n --ds-switch-thumb-pressed: var(--color-interaction-pressed);\n --ds-switch-travel: calc(\n var(--ds-switch-width) - var(--ds-switch-thumb-size) - var(--ds-switch-inset) -\n var(--ds-switch-inset)\n );\n position: relative;\n display: inline-flex;\n width: var(--ds-switch-width);\n height: var(--ds-switch-height);\n padding: 0;\n border: none;\n border-radius: var(--dimension-radius-half);\n box-sizing: border-box;\n flex-shrink: 0;\n overflow: visible;\n cursor: default;\n user-select: none;\n outline: none;\n background-color: transparent;\n box-shadow: inset 0 0 0 var(--ds-switch-stroke) var(--color-border-secondary);\n transition:\n background-color var(--effect-motion-short-3),\n box-shadow var(--effect-motion-short-3);\n}\n\n:host(.switch--lg) {\n --ds-switch-width: var(--dimension-size-500);\n --ds-switch-height: var(--dimension-size-300);\n --ds-switch-thumb-size: var(--dimension-iconography-sm);\n --ds-switch-gap: var(--dimension-space-050);\n}\n\n:host(.switch--sm) {\n --ds-switch-width: var(--dimension-size-300);\n --ds-switch-height: var(--dimension-size-200);\n --ds-switch-thumb-size: calc(var(--dimension-size-base) * 5 / 4);\n --ds-switch-gap: calc(var(--dimension-space-025) + var(--dimension-space-012));\n}\n\n:host(.switch--xs) {\n --ds-switch-width: var(--dimension-size-250);\n --ds-switch-height: var(--dimension-size-150);\n --ds-switch-thumb-size: var(--dimension-size-100);\n --ds-switch-gap: var(--dimension-space-025);\n}\n\n:host(.checked) {\n background-color: var(--color-background-bold-brand);\n box-shadow: none;\n}\n\n:host(.switch--readonly),\n:host(.switch--presentation) {\n cursor: default;\n}\n\n:host(.switch--presentation) {\n pointer-events: none;\n}\n\n/* Inactive: `.ds-control-inactive` (50% opacity). */\n\n.thumb {\n position: absolute;\n top: 50%;\n left: var(--ds-switch-inset);\n width: var(--ds-switch-thumb-size);\n height: var(--ds-switch-thumb-size);\n border-radius: var(--dimension-radius-half);\n background-color: var(--color-foreground-tertiary);\n box-shadow: none;\n transform: translateY(-50%);\n transition:\n background-color var(--effect-motion-short-3),\n transform var(--effect-motion-short-3);\n pointer-events: none;\n}\n\n.thumb::after {\n content: '';\n position: absolute;\n inset: 0;\n border-radius: inherit;\n background: transparent;\n pointer-events: none;\n}\n\n@media (hover: hover) and (pointer: fine) {\n :host(:hover:not(:disabled):not(.ds-control-inactive):not(.switch--readonly):not(.switch--presentation))\n .thumb::after {\n background: var(--ds-switch-thumb-hover);\n }\n}\n\n:host(:active:not(:disabled):not(.ds-control-inactive):not(.switch--readonly):not(.switch--presentation))\n .thumb::after {\n background: var(--ds-switch-thumb-pressed);\n}\n\n:host(.checked) .thumb {\n background-color: var(--color-background-primary);\n box-shadow: none;\n transform: translate3d(var(--ds-switch-travel), -50%, 0);\n}\n\n@media (prefers-reduced-motion: reduce) {\n :host {\n transition: none;\n }\n\n .thumb {\n transition: none;\n }\n}\n\n@media (forced-colors: active) {\n :host {\n border: var(--ds-switch-stroke) solid var(--ds-forced-color-content);\n box-shadow: none;\n }\n\n :host(.checked) {\n background-color: var(--ds-forced-color-selected);\n border-color: var(--ds-forced-color-selected);\n }\n\n .thumb {\n background-color: var(--ds-forced-color-content);\n }\n\n :host(.checked) .thumb {\n background-color: var(--ds-forced-color-on-selected);\n }\n}\n","import { AttachInternals, Component, Element, Prop, State, Event, EventEmitter, Watch, h, Host } from '@stencil/core';\nimport { DEFAULT_REQUIRED_MESSAGE, setFormControlValue, setRequiredValidity } from '../../utils';\n\nexport type SwitchSize = 'lg' | 'md' | 'sm' | 'xs';\n\nlet generatedLabelId = 0;\n\n@Component({\n tag: 'ds-switch',\n styleUrl: 'Switch.css',\n shadow: true,\n formAssociated: true,\n})\nexport class Switch {\n @Element() el!: HTMLElement;\n @AttachInternals() internals!: ElementInternals;\n\n /** Current on/off state. The initial value is restored when the owning form resets. */\n @Prop({ mutable: true }) checked: boolean = false;\n\n @Prop({ reflect: true }) name: string | undefined;\n @Prop() value: string = 'on';\n\n /** Optional value submitted when unchecked; omitted by default like a native checkbox. */\n @Prop() uncheckedValue: string | undefined;\n\n /** Associates the switch with a form by id when it is rendered outside that form. */\n @Prop({ reflect: true }) form: string | undefined;\n\n @Prop({ reflect: true }) disabled: boolean = false;\n @Prop({ reflect: true }) readOnly: boolean = false;\n @Prop({ reflect: true }) required: boolean = false;\n @Prop() requiredMessage: string = DEFAULT_REQUIRED_MESSAGE;\n @Prop() isInactive: boolean = false;\n\n /** Compact track size for placement inside controls, menus, and form rows. */\n @Prop() size: SwitchSize = 'md';\n\n /**\n * Removes standalone control semantics so a composite owner such as a\n * `menuitemcheckbox` can use the switch as an aria-hidden visual indicator.\n */\n @Prop() presentation: boolean = false;\n\n @Event() dsChange!: EventEmitter<boolean>;\n\n private initialChecked = false;\n @State() private formDisabled = false;\n @State() private focused = false;\n @State() private touched = false;\n\n componentWillLoad() {\n this.initialChecked = this.checked;\n this.syncFormValue();\n }\n\n componentDidLoad() {\n this.syncNativeLabels();\n }\n\n @Watch('checked')\n @Watch('value')\n @Watch('uncheckedValue')\n @Watch('disabled')\n @Watch('isInactive')\n @Watch('presentation')\n @Watch('required')\n syncFormValue() {\n const inactive = this.presentation || this.isInactive || this.disabled || this.formDisabled;\n const submissionValue = this.checked ? this.value : this.uncheckedValue ?? null;\n const state = this.checked ? 'checked' : 'unchecked';\n setFormControlValue(this.internals, submissionValue, { inactive, state });\n\n const missing = this.required && !inactive && !this.checked;\n setRequiredValidity(this.internals, missing, this.requiredMessage);\n }\n\n formDisabledCallback(disabled: boolean) {\n this.formDisabled = disabled;\n this.syncFormValue();\n }\n\n formResetCallback() {\n this.checked = this.initialChecked;\n this.focused = false;\n this.touched = false;\n }\n\n formStateRestoreCallback(state: string | File | FormData | null) {\n this.checked = state === 'checked';\n }\n\n private syncNativeLabels() {\n if (this.presentation) return;\n if (this.el.hasAttribute('aria-label') || this.el.hasAttribute('aria-labelledby')) return;\n\n const labelIds = (Array.from(this.internals.labels) as HTMLLabelElement[]).map(label => {\n if (!label.id) label.id = `ds-switch-label-${++generatedLabelId}`;\n return label.id;\n });\n if (labelIds.length) this.el.setAttribute('aria-labelledby', labelIds.join(' '));\n }\n\n private handleClick = () => {\n if (this.presentation || this.readOnly || this.isInactive || this.disabled || this.formDisabled) return;\n this.checked = !this.checked;\n this.dsChange.emit(this.checked);\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (this.presentation || this.readOnly || this.isInactive || this.disabled || this.formDisabled) return;\n if (event.key === ' ' || event.key === 'Enter') {\n event.preventDefault();\n this.handleClick();\n }\n };\n\n private handleFocus = () => {\n if (!this.presentation) this.focused = true;\n };\n\n private handleBlur = () => {\n if (this.presentation) return;\n this.focused = false;\n this.touched = true;\n };\n\n render() {\n const inactive = this.isInactive || this.disabled || this.formDisabled;\n const invalid = this.required && !inactive && !this.checked;\n const dirty = this.checked !== this.initialChecked;\n // Switch owns its structural track and thumb strokes so nested interaction layers cannot cover them.\n return (\n <Host\n role={this.presentation ? undefined : 'switch'}\n aria-checked={this.presentation ? undefined : String(this.checked)}\n aria-disabled={!this.presentation && inactive ? 'true' : undefined}\n aria-readonly={!this.presentation && this.readOnly ? 'true' : undefined}\n aria-required={!this.presentation && this.required ? 'true' : undefined}\n aria-invalid={!this.presentation && invalid ? 'true' : undefined}\n aria-hidden={this.presentation ? 'true' : undefined}\n data-checked={this.checked ? '' : undefined}\n data-unchecked={!this.checked ? '' : undefined}\n data-disabled={inactive ? '' : undefined}\n data-readonly={this.readOnly ? '' : undefined}\n data-required={this.required ? '' : undefined}\n data-focused={!this.presentation && this.focused ? '' : undefined}\n data-filled={!this.presentation && this.checked ? '' : undefined}\n data-dirty={!this.presentation && dirty ? '' : undefined}\n data-touched={!this.presentation && this.touched ? '' : undefined}\n data-valid={!this.presentation && !inactive && !invalid ? '' : undefined}\n data-invalid={!this.presentation && invalid ? '' : undefined}\n tabIndex={this.presentation || inactive ? -1 : 0}\n class={{\n switch: true,\n checked: this.checked,\n 'switch--lg': this.size === 'lg',\n 'switch--md': this.size === 'md',\n 'switch--sm': this.size === 'sm',\n 'switch--xs': this.size === 'xs',\n 'switch--readonly': this.readOnly,\n 'switch--presentation': this.presentation,\n 'ds-focus-ring': true,\n 'ds-control-inactive': inactive,\n }}\n onClick={this.handleClick}\n onKeyDown={this.handleKeyDown}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n >\n <span class=\"thumb\" />\n </Host>\n );\n }\n}\n"],"mappings":"iJAAA,MAAMA,EAAY,IAAM,myLCKxB,IAAIC,EAAmB,E,MAQVC,EAAMC,EAAA,MAAAD,UAAAE,EANnB,WAAAC,CAAAC,G,2IAW2BC,KAAAC,QAAmB,MAGpCD,KAAAE,MAAgB,KAQCF,KAAAG,SAAoB,MACpBH,KAAAI,SAAoB,MACpBJ,KAAAK,SAAoB,MACrCL,KAAAM,gBAA0BC,EAC1BP,KAAAQ,WAAsB,MAGtBR,KAAAS,KAAmB,KAMnBT,KAAAU,aAAwB,MAIxBV,KAAAW,eAAiB,MACRX,KAAAY,aAAe,MACfZ,KAAAa,QAAU,MACVb,KAAAc,QAAU,MAsDnBd,KAAAe,YAAc,KACpB,GAAIf,KAAKU,cAAgBV,KAAKI,UAAYJ,KAAKQ,YAAcR,KAAKG,UAAYH,KAAKY,aAAc,OACjGZ,KAAKC,SAAWD,KAAKC,QACrBD,KAAKgB,SAASC,KAAKjB,KAAKC,QAAQ,EAG1BD,KAAAkB,cAAiBC,IACvB,GAAInB,KAAKU,cAAgBV,KAAKI,UAAYJ,KAAKQ,YAAcR,KAAKG,UAAYH,KAAKY,aAAc,OACjG,GAAIO,EAAMC,MAAQ,KAAOD,EAAMC,MAAQ,QAAS,CAC9CD,EAAME,iBACNrB,KAAKe,a,GAIDf,KAAAsB,YAAc,KACpB,IAAKtB,KAAKU,aAAcV,KAAKa,QAAU,IAAI,EAGrCb,KAAAuB,WAAa,KACnB,GAAIvB,KAAKU,aAAc,OACvBV,KAAKa,QAAU,MACfb,KAAKc,QAAU,IAAI,CAkDtB,CA3HC,iBAAAU,GACExB,KAAKW,eAAiBX,KAAKC,QAC3BD,KAAKyB,e,CAGP,gBAAAC,GACE1B,KAAK2B,kB,CAUP,aAAAF,GACE,MAAMG,EAAW5B,KAAKU,cAAgBV,KAAKQ,YAAcR,KAAKG,UAAYH,KAAKY,aAC/E,MAAMiB,EAAkB7B,KAAKC,QAAUD,KAAKE,MAAQF,KAAK8B,gBAAkB,KAC3E,MAAMC,EAAQ/B,KAAKC,QAAU,UAAY,YACzC+B,EAAoBhC,KAAKiC,UAAWJ,EAAiB,CAAED,WAAUG,UAEjE,MAAMG,EAAUlC,KAAKK,WAAauB,IAAa5B,KAAKC,QACpDkC,EAAoBnC,KAAKiC,UAAWC,EAASlC,KAAKM,gB,CAGpD,oBAAA8B,CAAqBjC,GACnBH,KAAKY,aAAeT,EACpBH,KAAKyB,e,CAGP,iBAAAY,GACErC,KAAKC,QAAUD,KAAKW,eACpBX,KAAKa,QAAU,MACfb,KAAKc,QAAU,K,CAGjB,wBAAAwB,CAAyBP,GACvB/B,KAAKC,QAAU8B,IAAU,S,CAGnB,gBAAAJ,GACN,GAAI3B,KAAKU,aAAc,OACvB,GAAIV,KAAKuC,GAAGC,aAAa,eAAiBxC,KAAKuC,GAAGC,aAAa,mBAAoB,OAEnF,MAAMC,EAAYC,MAAMC,KAAK3C,KAAKiC,UAAUW,QAA+BC,KAAIC,IAC7E,IAAKA,EAAMC,GAAID,EAAMC,GAAK,qBAAqBrD,IAC/C,OAAOoD,EAAMC,EAAE,IAEjB,GAAIN,EAASO,OAAQhD,KAAKuC,GAAGU,aAAa,kBAAmBR,EAASS,KAAK,K,CA2B7E,MAAAC,GACE,MAAMvB,EAAW5B,KAAKQ,YAAcR,KAAKG,UAAYH,KAAKY,aAC1D,MAAMwC,EAAUpD,KAAKK,WAAauB,IAAa5B,KAAKC,QACpD,MAAMoD,EAAQrD,KAAKC,UAAYD,KAAKW,eAEpC,OACE2C,EAACC,EAAI,CAAAnC,IAAA,2CACHoC,KAAMxD,KAAKU,aAAe+C,UAAY,SAAQ,eAChCzD,KAAKU,aAAe+C,UAAYC,OAAO1D,KAAKC,SAAQ,iBAClDD,KAAKU,cAAgBkB,EAAW,OAAS6B,UAAS,iBAClDzD,KAAKU,cAAgBV,KAAKI,SAAW,OAASqD,UAAS,iBACvDzD,KAAKU,cAAgBV,KAAKK,SAAW,OAASoD,UAAS,gBACxDzD,KAAKU,cAAgB0C,EAAU,OAASK,UAAS,cACnDzD,KAAKU,aAAe,OAAS+C,UAAS,eACrCzD,KAAKC,QAAU,GAAKwD,UAAS,kBAC1BzD,KAAKC,QAAU,GAAKwD,UAAS,gBAC/B7B,EAAW,GAAK6B,UAAS,gBACzBzD,KAAKI,SAAW,GAAKqD,UAAS,gBAC9BzD,KAAKK,SAAW,GAAKoD,UAAS,gBAC9BzD,KAAKU,cAAgBV,KAAKa,QAAU,GAAK4C,UAAS,eACnDzD,KAAKU,cAAgBV,KAAKC,QAAU,GAAKwD,UAAS,cACnDzD,KAAKU,cAAgB2C,EAAQ,GAAKI,UAAS,gBACzCzD,KAAKU,cAAgBV,KAAKc,QAAU,GAAK2C,UAAS,cACpDzD,KAAKU,eAAiBkB,IAAawB,EAAU,GAAKK,UAAS,gBACzDzD,KAAKU,cAAgB0C,EAAU,GAAKK,UACnDE,SAAU3D,KAAKU,cAAgBkB,GAAW,EAAK,EAC/CgC,MAAO,CACLC,OAAQ,KACR5D,QAASD,KAAKC,QACd,aAAcD,KAAKS,OAAS,KAC5B,aAAcT,KAAKS,OAAS,KAC5B,aAAcT,KAAKS,OAAS,KAC5B,aAAcT,KAAKS,OAAS,KAC5B,mBAAoBT,KAAKI,SACzB,uBAAwBJ,KAAKU,aAC7B,gBAAiB,KACjB,sBAAuBkB,GAEzBkC,QAAS9D,KAAKe,YACdgD,UAAW/D,KAAKkB,cAChB8C,QAAShE,KAAKsB,YACd2C,OAAQjE,KAAKuB,YAEb+B,EAAA,QAAAlC,IAAA,2CAAMwC,MAAM,U","ignoreList":[]}