@ds-mo/ui 14.19.0 → 14.19.1

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 (348) hide show
  1. package/dist/.package-ready.json +1 -1
  2. package/dist/agent-patterns.json +1 -1
  3. package/dist/agent.json +1 -1
  4. package/dist/components/ds-agent-activity.js +1 -1
  5. package/dist/components/ds-agent-questionnaire.js +1 -1
  6. package/dist/components/ds-agent-response.js +1 -1
  7. package/dist/components/ds-agent-source-list.js +1 -1
  8. package/dist/components/ds-agent-tool-call.js +1 -1
  9. package/dist/components/ds-attachment-list.js +1 -1
  10. package/dist/components/ds-avatar.js +1 -1
  11. package/dist/components/ds-badge.js +1 -1
  12. package/dist/components/ds-banner.js +1 -1
  13. package/dist/components/ds-banner.js.map +1 -1
  14. package/dist/components/ds-bar-action.js +1 -1
  15. package/dist/components/ds-bar-action.js.map +1 -1
  16. package/dist/components/ds-bar-nav.js +1 -1
  17. package/dist/components/ds-bar-title.js +1 -1
  18. package/dist/components/ds-bar-workflow.js +1 -1
  19. package/dist/components/ds-bar-workflow.js.map +1 -1
  20. package/dist/components/ds-breadcrumb.js +1 -1
  21. package/dist/components/ds-button-filled.js +1 -1
  22. package/dist/components/ds-button-unfilled.js +1 -1
  23. package/dist/components/ds-card-chart.js +1 -1
  24. package/dist/components/ds-card-chart.js.map +1 -1
  25. package/dist/components/ds-card-overview.js +1 -1
  26. package/dist/components/ds-card-overview.js.map +1 -1
  27. package/dist/components/ds-card-setting.js +1 -1
  28. package/dist/components/ds-card-setting.js.map +1 -1
  29. package/dist/components/ds-chart-legend.js +1 -1
  30. package/dist/components/ds-chart-legend.js.map +1 -1
  31. package/dist/components/ds-chart.js +1 -1
  32. package/dist/components/ds-chart.js.map +1 -1
  33. package/dist/components/ds-checkbox.js +1 -1
  34. package/dist/components/ds-chip.js +1 -1
  35. package/dist/components/ds-chip.js.map +1 -1
  36. package/dist/components/ds-code-block.js +1 -1
  37. package/dist/components/ds-conversation-list-item.js +1 -1
  38. package/dist/components/ds-conversation-list-item.js.map +1 -1
  39. package/dist/components/ds-conversation-list-section.js +1 -1
  40. package/dist/components/ds-conversation-list.js +1 -1
  41. package/dist/components/ds-conversation-list.js.map +1 -1
  42. package/dist/components/ds-divider.js +1 -1
  43. package/dist/components/ds-empty-state.js +1 -1
  44. package/dist/components/ds-field.js +1 -1
  45. package/dist/components/ds-filter-menu.js +1 -1
  46. package/dist/components/ds-icon.js +1 -1
  47. package/dist/components/ds-input.js +1 -1
  48. package/dist/components/ds-loader.js +1 -1
  49. package/dist/components/ds-markdown.js +1 -1
  50. package/dist/components/ds-menu.js +1 -1
  51. package/dist/components/ds-message-actions.js +1 -1
  52. package/dist/components/ds-message-bubble.js +1 -1
  53. package/dist/components/ds-message-bubble.js.map +1 -1
  54. package/dist/components/ds-message-composer.js +1 -1
  55. package/dist/components/ds-message-composer.js.map +1 -1
  56. package/dist/components/ds-message-scroller.js +1 -1
  57. package/dist/components/ds-message-scroller.js.map +1 -1
  58. package/dist/components/ds-message.js +1 -1
  59. package/dist/components/ds-mobile-bar-nav.js +1 -1
  60. package/dist/components/ds-mobile-header.js +1 -1
  61. package/dist/components/ds-mobile-section-switcher.js +1 -1
  62. package/dist/components/ds-mobile-sheet-nav.js +1 -1
  63. package/dist/components/ds-modal.js +1 -1
  64. package/dist/components/ds-pagination.js +1 -1
  65. package/dist/components/ds-panel-nav.js +1 -1
  66. package/dist/components/ds-panel-sub-nav.js +1 -1
  67. package/dist/components/ds-panel-sub-nav.js.map +1 -1
  68. package/dist/components/ds-panel-tool-header.js +1 -1
  69. package/dist/components/ds-panel-tool-search.js +1 -1
  70. package/dist/components/ds-panel-tool-search.js.map +1 -1
  71. package/dist/components/ds-panel-tools.js +1 -1
  72. package/dist/components/ds-radio.js +1 -1
  73. package/dist/components/ds-scroll-overlay.js +1 -1
  74. package/dist/components/ds-scroll-overlay.js.map +1 -1
  75. package/dist/components/ds-select.js +1 -1
  76. package/dist/components/ds-shell-app.js +1 -1
  77. package/dist/components/ds-shell-app.js.map +1 -1
  78. package/dist/components/ds-shell-page.js +1 -1
  79. package/dist/components/ds-shell-tools.js +1 -1
  80. package/dist/components/ds-skeleton.js +1 -1
  81. package/dist/components/ds-slider.js +1 -1
  82. package/dist/components/ds-slider.js.map +1 -1
  83. package/dist/components/ds-swatch-picker.js +1 -1
  84. package/dist/components/ds-switch.js +1 -1
  85. package/dist/components/ds-tab-group.js +1 -1
  86. package/dist/components/ds-table-filter.js +1 -1
  87. package/dist/components/ds-table-saved-views.js +1 -1
  88. package/dist/components/ds-table-sort.js +1 -1
  89. package/dist/components/ds-table-sort.js.map +1 -1
  90. package/dist/components/ds-table-toolbar.js +1 -1
  91. package/dist/components/ds-table.js +1 -1
  92. package/dist/components/ds-table.js.map +1 -1
  93. package/dist/components/ds-tag.js +1 -1
  94. package/dist/components/ds-text.js +1 -1
  95. package/dist/components/ds-toast.js +1 -1
  96. package/dist/components/ds-toast.js.map +1 -1
  97. package/dist/components/ds-tooltip-chart.js +1 -1
  98. package/dist/components/ds-tooltip.js +1 -1
  99. package/dist/components/ds-typing-indicator.js +1 -1
  100. package/dist/components/p-0XTyQNRG.js +2 -0
  101. package/dist/components/{p-JPTkZ3Ji.js.map → p-0XTyQNRG.js.map} +1 -1
  102. package/dist/components/{p-DFQ9mcbK.js → p-1YHFQeI7.js} +1 -1
  103. package/dist/components/p-1YHFQeI7.js.map +1 -0
  104. package/dist/components/p-B-HsfQOK.js +2 -0
  105. package/dist/components/p-B-HsfQOK.js.map +1 -0
  106. package/dist/components/p-B4wTnsUL.js +2 -0
  107. package/dist/components/p-B4wTnsUL.js.map +1 -0
  108. package/dist/components/p-B6WQre5D.js +2 -0
  109. package/dist/components/p-B6WQre5D.js.map +1 -0
  110. package/dist/components/{p-B1JRCDHS.js → p-BHhmB9-4.js} +2 -2
  111. package/dist/components/{p-B1JRCDHS.js.map → p-BHhmB9-4.js.map} +1 -1
  112. package/dist/components/{p-DaAXY-XS.js → p-BNq9fr9S.js} +2 -2
  113. package/dist/components/p-BNq9fr9S.js.map +1 -0
  114. package/dist/components/{p-BKp__CQX.js → p-BWwiCvep.js} +2 -2
  115. package/dist/components/p-BWwiCvep.js.map +1 -0
  116. package/dist/components/{p-BBG6Sswb.js → p-BYFS2qWb.js} +2 -2
  117. package/dist/components/{p-BBG6Sswb.js.map → p-BYFS2qWb.js.map} +1 -1
  118. package/dist/components/{p-uI6z53BE.js → p-Bb4KnRy0.js} +2 -2
  119. package/dist/components/{p-HB_cf_aR.js → p-BeA6Jv-3.js} +2 -2
  120. package/dist/components/{p-HB_cf_aR.js.map → p-BeA6Jv-3.js.map} +1 -1
  121. package/dist/components/{p-Bbb9A3NV.js → p-BjRD57w3.js} +2 -2
  122. package/dist/components/p-BjRD57w3.js.map +1 -0
  123. package/dist/components/{p-BS0AbMNK.js → p-BmlGeaY8.js} +2 -2
  124. package/dist/components/p-BmlGeaY8.js.map +1 -0
  125. package/dist/components/{p-r8PMqlqm.js → p-BubgDQlb.js} +2 -2
  126. package/dist/components/p-BubgDQlb.js.map +1 -0
  127. package/dist/components/{p-BNkU9dcc.js → p-Bv6FSDPR.js} +2 -2
  128. package/dist/components/{p-BNkU9dcc.js.map → p-Bv6FSDPR.js.map} +1 -1
  129. package/dist/components/p-Bx1IHqJb.js +2 -0
  130. package/dist/components/p-Bx1IHqJb.js.map +1 -0
  131. package/dist/components/{p-D3fMaUJ3.js → p-Bx5BSd6F.js} +2 -2
  132. package/dist/components/p-Bx5BSd6F.js.map +1 -0
  133. package/dist/components/{p-B8q-6a03.js → p-C0qN3PSb.js} +1 -1
  134. package/dist/components/{p-B8q-6a03.js.map → p-C0qN3PSb.js.map} +1 -1
  135. package/dist/components/{p-ZpQBAwZC.js → p-CFsLF-ts.js} +2 -2
  136. package/dist/components/p-CFsLF-ts.js.map +1 -0
  137. package/dist/components/p-CKtJ6FHM.js +2 -0
  138. package/dist/components/p-CKtJ6FHM.js.map +1 -0
  139. package/dist/components/p-CRSwNbPk.js +2 -0
  140. package/dist/components/p-CRSwNbPk.js.map +1 -0
  141. package/dist/components/{p-BFfLvMZd.js → p-Cea7rROU.js} +2 -2
  142. package/dist/components/{p-BFfLvMZd.js.map → p-Cea7rROU.js.map} +1 -1
  143. package/dist/components/{p-B0Byw6OX.js → p-CgGcgMjs.js} +1 -1
  144. package/dist/components/{p-B0Byw6OX.js.map → p-CgGcgMjs.js.map} +1 -1
  145. package/dist/components/{p-C-Y7gYgz.js → p-ChfVRPHw.js} +2 -2
  146. package/dist/components/p-ChfVRPHw.js.map +1 -0
  147. package/dist/components/{p-CJq3n5kA.js → p-Ck1hgD6g.js} +2 -2
  148. package/dist/components/p-Ck1hgD6g.js.map +1 -0
  149. package/dist/components/{p-BMc0DE59.js → p-CochmPyg.js} +1 -1
  150. package/dist/components/p-CochmPyg.js.map +1 -0
  151. package/dist/components/{p-iMuFgSoM.js → p-Cp5Hr7Vz.js} +2 -2
  152. package/dist/components/p-Cp5Hr7Vz.js.map +1 -0
  153. package/dist/components/p-CpUXubax.js +2 -0
  154. package/dist/components/{p-DtndC9f1.js.map → p-CpUXubax.js.map} +1 -1
  155. package/dist/components/{p-BNiuAMeh.js → p-Crz606uD.js} +2 -2
  156. package/dist/components/p-Crz606uD.js.map +1 -0
  157. package/dist/components/p-Cxr0IQjC.js.map +1 -1
  158. package/dist/components/p-D-MWvpg6.js +2 -0
  159. package/dist/components/p-D-MWvpg6.js.map +1 -0
  160. package/dist/components/{p-Bu3dOjpW.js → p-D7v6Na7U.js} +2 -2
  161. package/dist/components/{p-Bu3dOjpW.js.map → p-D7v6Na7U.js.map} +1 -1
  162. package/dist/components/{p-C6DNhlES.js → p-DA5H_Iq_.js} +1 -1
  163. package/dist/components/p-DA5H_Iq_.js.map +1 -0
  164. package/dist/components/p-DBYCwq9L.js +2 -0
  165. package/dist/components/{p-DOUDRJbE.js.map → p-DBYCwq9L.js.map} +1 -1
  166. package/dist/components/{p-CY4YFAT3.js → p-DCbKsABt.js} +1 -1
  167. package/dist/components/p-DCbKsABt.js.map +1 -0
  168. package/dist/components/{p-C6R5Lft0.js → p-DFC0sRM-.js} +2 -2
  169. package/dist/components/p-DFC0sRM-.js.map +1 -0
  170. package/dist/components/{p-CsBICYmt.js → p-DGkn8FwV.js} +2 -2
  171. package/dist/components/p-DGkn8FwV.js.map +1 -0
  172. package/dist/components/p-DIqT1m2r.js +2 -0
  173. package/dist/components/p-DIqT1m2r.js.map +1 -0
  174. package/dist/components/p-DKt_8s-U.js +2 -0
  175. package/dist/components/p-DKt_8s-U.js.map +1 -0
  176. package/dist/components/p-DOUk4KoT.js.map +1 -1
  177. package/dist/components/p-DQBT1Jkf.js +2 -0
  178. package/dist/components/p-DQBT1Jkf.js.map +1 -0
  179. package/dist/components/p-DW5Ita-P.js +2 -0
  180. package/dist/components/{p-DUdOmSFR.js.map → p-DW5Ita-P.js.map} +1 -1
  181. package/dist/components/{p-DNpLDbWY.js → p-DZ58Sg5a.js} +1 -1
  182. package/dist/components/p-DZ58Sg5a.js.map +1 -0
  183. package/dist/components/{p-DDgeXGbB.js → p-DZv2g9Pe.js} +2 -2
  184. package/dist/components/p-DZv2g9Pe.js.map +1 -0
  185. package/dist/components/{p-BknXYAEc.js → p-DdH7b4JF.js} +2 -2
  186. package/dist/components/p-DdH7b4JF.js.map +1 -0
  187. package/dist/components/{p-DBue3ISk.js → p-Demfba7T.js} +2 -2
  188. package/dist/components/p-Demfba7T.js.map +1 -0
  189. package/dist/components/p-Djxw2FjZ.js +2 -0
  190. package/dist/components/{p-CwjVgUqy.js.map → p-Djxw2FjZ.js.map} +1 -1
  191. package/dist/components/p-DmWoFSGs.js +2 -0
  192. package/dist/components/p-DmWoFSGs.js.map +1 -0
  193. package/dist/components/p-Do8wbFff.js +2 -0
  194. package/dist/components/p-Do8wbFff.js.map +1 -0
  195. package/dist/components/p-Drnyq8z7.js +2 -0
  196. package/dist/components/p-Drnyq8z7.js.map +1 -0
  197. package/dist/components/p-DsgEY6mZ.js +2 -0
  198. package/dist/components/p-DsgEY6mZ.js.map +1 -0
  199. package/dist/components/p-Is1lFmwp.js +2 -0
  200. package/dist/components/p-Is1lFmwp.js.map +1 -0
  201. package/dist/components/{p-BUDAwJVV.js → p-caLOcQUK.js} +2 -2
  202. package/dist/components/p-caLOcQUK.js.map +1 -0
  203. package/dist/components/{p-D1eEgwcP.js → p-etg-Uk1u.js} +1 -1
  204. package/dist/components/{p-D1eEgwcP.js.map → p-etg-Uk1u.js.map} +1 -1
  205. package/dist/components/{p-C9gC4haA.js → p-fRDzpfi9.js} +2 -2
  206. package/dist/components/p-fRDzpfi9.js.map +1 -0
  207. package/dist/components/{p-C-vRkDyn.js → p-rCeztgVn.js} +1 -1
  208. package/dist/components/{p-C-vRkDyn.js.map → p-rCeztgVn.js.map} +1 -1
  209. package/dist/components/{p-B_jZIC9R.js → p-vrotWZxt.js} +2 -2
  210. package/dist/components/{p-B_jZIC9R.js.map → p-vrotWZxt.js.map} +1 -1
  211. package/dist/docs/components.json +6 -6
  212. package/dist/lib/shell/index.d.ts +2 -2
  213. package/dist/lib/shell/index.js +8 -6
  214. package/dist/lib/shell/index.js.map +2 -2
  215. package/dist/lib/toast/index.js +1 -4
  216. package/dist/lib/toast/index.js.map +2 -2
  217. package/dist/lib/utils/index.d.ts +1 -1
  218. package/dist/lib/utils/index.js +104 -22
  219. package/dist/lib/utils/index.js.map +2 -2
  220. package/dist/mcp/cli.js +70 -31
  221. package/dist/mcp-data/registry/agent-activity.json +1 -1
  222. package/dist/mcp-data/registry/agent-questionnaire.json +3 -3
  223. package/dist/mcp-data/registry/agent-source-list.json +2 -2
  224. package/dist/mcp-data/registry/agent-tool-call.json +2 -2
  225. package/dist/mcp-data/registry/attachment-list.json +1 -1
  226. package/dist/mcp-data/registry/badge.json +1 -1
  227. package/dist/mcp-data/registry/banner.json +2 -2
  228. package/dist/mcp-data/registry/bar-action.json +1 -1
  229. package/dist/mcp-data/registry/bar-nav.json +3 -3
  230. package/dist/mcp-data/registry/bar-workflow.json +1 -1
  231. package/dist/mcp-data/registry/breadcrumb.json +1 -1
  232. package/dist/mcp-data/registry/button-filled.json +1 -1
  233. package/dist/mcp-data/registry/button-unfilled.json +1 -1
  234. package/dist/mcp-data/registry/card-chart.json +2 -2
  235. package/dist/mcp-data/registry/card-overview.json +3 -3
  236. package/dist/mcp-data/registry/card-setting.json +1 -1
  237. package/dist/mcp-data/registry/chart-legend.json +1 -1
  238. package/dist/mcp-data/registry/chart.json +1 -1
  239. package/dist/mcp-data/registry/checkbox.json +1 -1
  240. package/dist/mcp-data/registry/chip.json +1 -1
  241. package/dist/mcp-data/registry/code-block.json +1 -1
  242. package/dist/mcp-data/registry/conversation-list-item.json +1 -1
  243. package/dist/mcp-data/registry/conversation-list.json +2 -2
  244. package/dist/mcp-data/registry/divider.json +1 -1
  245. package/dist/mcp-data/registry/empty-state.json +1 -1
  246. package/dist/mcp-data/registry/field.json +1 -1
  247. package/dist/mcp-data/registry/filter-menu.json +1 -1
  248. package/dist/mcp-data/registry/icon.json +2 -2
  249. package/dist/mcp-data/registry/input.json +2 -2
  250. package/dist/mcp-data/registry/loader.json +1 -1
  251. package/dist/mcp-data/registry/menu.json +3 -3
  252. package/dist/mcp-data/registry/message-bubble.json +1 -1
  253. package/dist/mcp-data/registry/message-composer.json +2 -2
  254. package/dist/mcp-data/registry/message-scroller.json +3 -3
  255. package/dist/mcp-data/registry/mobile-bar-nav.json +1 -1
  256. package/dist/mcp-data/registry/mobile-header.json +2 -2
  257. package/dist/mcp-data/registry/mobile-section-switcher.json +2 -2
  258. package/dist/mcp-data/registry/mobile-sheet-nav.json +1 -1
  259. package/dist/mcp-data/registry/modal.json +2 -2
  260. package/dist/mcp-data/registry/pagination.json +2 -2
  261. package/dist/mcp-data/registry/panel-nav.json +2 -2
  262. package/dist/mcp-data/registry/panel-sub-nav.json +1 -1
  263. package/dist/mcp-data/registry/panel-tool-header.json +1 -1
  264. package/dist/mcp-data/registry/panel-tool-search.json +1 -1
  265. package/dist/mcp-data/registry/panel-tools.json +2 -2
  266. package/dist/mcp-data/registry/radio.json +1 -1
  267. package/dist/mcp-data/registry/select.json +1 -1
  268. package/dist/mcp-data/registry/shell-app.json +2 -2
  269. package/dist/mcp-data/registry/shell-page.json +1 -1
  270. package/dist/mcp-data/registry/shell-tools.json +1 -1
  271. package/dist/mcp-data/registry/skeleton.json +2 -2
  272. package/dist/mcp-data/registry/slider.json +2 -2
  273. package/dist/mcp-data/registry/swatch-picker.json +3 -3
  274. package/dist/mcp-data/registry/switch.json +2 -2
  275. package/dist/mcp-data/registry/tab-group.json +2 -2
  276. package/dist/mcp-data/registry/table-sort.json +1 -1
  277. package/dist/mcp-data/registry/table.json +18 -18
  278. package/dist/mcp-data/registry/tag.json +2 -2
  279. package/dist/mcp-data/registry/text.json +4 -4
  280. package/dist/mcp-data/registry/toast.json +2 -2
  281. package/dist/mcp-data/registry/tooltip-chart.json +2 -2
  282. package/dist/mcp-data/registry/tooltip.json +2 -2
  283. package/dist/styles/prose.css +42 -38
  284. package/dist/styles/table.css +39 -67
  285. package/dist/types/components/CardSetting/index.d.ts +1 -1
  286. package/dist/types/components/TooltipChart/index.d.ts +1 -1
  287. package/dist/types/shell/index.d.ts +2 -2
  288. package/dist/types/utils/index.d.ts +1 -1
  289. package/package.json +11 -1
  290. package/dist/components/p--CRAu9fJ.js +0 -2
  291. package/dist/components/p--CRAu9fJ.js.map +0 -1
  292. package/dist/components/p-BCOl1x0_.js +0 -2
  293. package/dist/components/p-BCOl1x0_.js.map +0 -1
  294. package/dist/components/p-BHVOiWz5.js +0 -2
  295. package/dist/components/p-BHVOiWz5.js.map +0 -1
  296. package/dist/components/p-BKp__CQX.js.map +0 -1
  297. package/dist/components/p-BMc0DE59.js.map +0 -1
  298. package/dist/components/p-BNiuAMeh.js.map +0 -1
  299. package/dist/components/p-BPG0r_mC.js +0 -2
  300. package/dist/components/p-BPG0r_mC.js.map +0 -1
  301. package/dist/components/p-BS0AbMNK.js.map +0 -1
  302. package/dist/components/p-BUDAwJVV.js.map +0 -1
  303. package/dist/components/p-BZVWmzKf.js +0 -2
  304. package/dist/components/p-BZVWmzKf.js.map +0 -1
  305. package/dist/components/p-Bbb9A3NV.js.map +0 -1
  306. package/dist/components/p-BhYS_Ump.js +0 -2
  307. package/dist/components/p-BhYS_Ump.js.map +0 -1
  308. package/dist/components/p-BknXYAEc.js.map +0 -1
  309. package/dist/components/p-BxGQ3cRJ.js +0 -2
  310. package/dist/components/p-BxGQ3cRJ.js.map +0 -1
  311. package/dist/components/p-BysVBVQv.js +0 -2
  312. package/dist/components/p-BysVBVQv.js.map +0 -1
  313. package/dist/components/p-C-Y7gYgz.js.map +0 -1
  314. package/dist/components/p-C6DNhlES.js.map +0 -1
  315. package/dist/components/p-C6R5Lft0.js.map +0 -1
  316. package/dist/components/p-C9gC4haA.js.map +0 -1
  317. package/dist/components/p-CAnnQL1F.js +0 -2
  318. package/dist/components/p-CAnnQL1F.js.map +0 -1
  319. package/dist/components/p-CJq3n5kA.js.map +0 -1
  320. package/dist/components/p-CY4YFAT3.js.map +0 -1
  321. package/dist/components/p-Cg0kimXZ.js +0 -2
  322. package/dist/components/p-Cg0kimXZ.js.map +0 -1
  323. package/dist/components/p-CsBICYmt.js.map +0 -1
  324. package/dist/components/p-CwjVgUqy.js +0 -2
  325. package/dist/components/p-D3fMaUJ3.js.map +0 -1
  326. package/dist/components/p-D7R4yE2C.js +0 -2
  327. package/dist/components/p-D7R4yE2C.js.map +0 -1
  328. package/dist/components/p-DAvh38E4.js +0 -2
  329. package/dist/components/p-DAvh38E4.js.map +0 -1
  330. package/dist/components/p-DBue3ISk.js.map +0 -1
  331. package/dist/components/p-DDgeXGbB.js.map +0 -1
  332. package/dist/components/p-DFQ9mcbK.js.map +0 -1
  333. package/dist/components/p-DNpLDbWY.js.map +0 -1
  334. package/dist/components/p-DOUDRJbE.js +0 -2
  335. package/dist/components/p-DUdOmSFR.js +0 -2
  336. package/dist/components/p-DaAXY-XS.js.map +0 -1
  337. package/dist/components/p-DlYw4UGQ.js +0 -2
  338. package/dist/components/p-DlYw4UGQ.js.map +0 -1
  339. package/dist/components/p-DtndC9f1.js +0 -2
  340. package/dist/components/p-JPTkZ3Ji.js +0 -2
  341. package/dist/components/p-ZpQBAwZC.js.map +0 -1
  342. package/dist/components/p-ag6Io-kL.js +0 -2
  343. package/dist/components/p-ag6Io-kL.js.map +0 -1
  344. package/dist/components/p-fg9EKoZp.js +0 -2
  345. package/dist/components/p-fg9EKoZp.js.map +0 -1
  346. package/dist/components/p-iMuFgSoM.js.map +0 -1
  347. package/dist/components/p-r8PMqlqm.js.map +0 -1
  348. /package/dist/components/{p-uI6z53BE.js.map → p-Bb4KnRy0.js.map} +0 -0
@@ -1 +0,0 @@
1
- {"version":3,"names":["resolveShellPageHeaderVariant","presentation","capacity","pageTopVisible","shellPageCss","ShellPage","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","headerPresentation","contentInset","contentInsetBlockStart","scrollCompaction","contentSurface","responsiveMode","sentinelEl","spacerEl","stickyHeaderEl","headerEl","expandedHeaderHeight","headerTravel","expandedGeometryFrozen","pageHeaderResizeObserver","headerResizeObserver","headerMutationObserver","headerRevealFrame","headerGeometryFrame","reconnectFrame","scrollRoot","hasLoaded","handleScroll","rootTop","window","getBoundingClientRect","top","syncHeaderDividerInset","nextPageTopVisible","classList","contains","variantClass","captureExpandedHeaderGeometry","el","handleHeaderSlotChange","event","slot","target","header","assignedElements","find","element","tagName","toLowerCase","observeHeader","handleHeaderContractChange","syncHeaderVariant","handleResponsiveModeChange","style","removeProperty","findHeader","componentDidLoad","connectRuntime","componentDidRender","connectedCallback","cancelAnimationFrame","requestAnimationFrame","isConnected","disconnectedCallback","disconnect","cancelHeaderReveal","cancelHeaderGeometrySync","removeEventListener","observePageHeaderGeometry","connectScrollRoot","effectiveVariant","headerCapacity","headerContractResolved","undefined","isScrollCompacted","contentInsetStyles","styles","expanded","contentInsetBlockStartSize","trim","compact","compactContentInsetBlockStartSize","composedParent","assignedSlot","parentElement","findScrollRoot","ancestor","document","documentElement","overflow","getComputedStyle","overflowY","next","addEventListener","passive","scrollRootResolved","shell","closest","expected","querySelector","compactHeaderHeight","resolveCssLengthPx","ownsScrollTransition","expandedInset","scrollRootTop","remainingTravel","progress","Math","min","max","setProperty","setHeaderTravel","distance","abs","measureHeaderTravel","anchor","compactHeight","headerRect","anchorRect","height","expandedAnchorTop","compactAnchorTop","setSpacerHeight","variant","setStickyHeaderOffset","renderedVariant","syncPageHeaderBlockSize","renderedHeight","ResizeObserver","observe","syncRenderedHeaderGeometry","scheduleHeaderGeometrySync","framesRemaining","MAX_HEADER_GEOMETRY_FRAMES","framesElapsed","sync","geometryReady","removeAttribute","revealHeaderWhenSynced","MAX_HEADER_REVEAL_FRAMES","reveal","concealUntilSynced","setAttribute","renderedVariantIsStale","MutationObserver","attributes","attributeFilter","childList","subtree","render","mobile","h","Host","key","role","class","ref","hidden","inert","name","onSlotchange"],"sources":["src/wc/components/ShellPage/shell-page-responsive.ts","src/wc/components/ShellPage/ShellPage.css?tag=ds-shell-page&encapsulation=scoped","src/wc/components/ShellPage/ShellPage.tsx"],"sourcesContent":["import type { ShellPageCapacity, ShellPageHeaderPresentation } from './shell-page-types';\nimport type { BarTitleVariant } from '../BarTitle/bar-title-types';\n\nexport function resolveShellPageHeaderVariant(\n presentation: ShellPageHeaderPresentation,\n capacity: ShellPageCapacity,\n pageTopVisible: boolean\n): BarTitleVariant {\n if (presentation !== 'auto') return presentation;\n if (capacity === 'constrained') return 'constrained';\n if (capacity === 'compact' || !pageTopVisible) return 'compact';\n return 'expanded';\n}\n",":host {\n --_shell-page-content-background: var(--color-background-primary);\n --_shell-page-header-background: var(--color-background-primary);\n --_shell-page-responsive-content-block-start-inset: var(--dimension-space-400);\n --_shell-page-content-block-start-inset: var(\n --ds-shell-page-content-block-start-inset,\n var(--_shell-page-responsive-content-block-start-inset)\n );\n --ds-shell-page-sticky-header-block-size: var(--dimension-size-600);\n --ds-shell-page-content-block-start-offset: calc(\n var(--ds-shell-page-sticky-header-block-size) +\n var(--_shell-page-content-block-start-inset)\n );\n display: block;\n position: relative;\n min-width: 0;\n min-height: 100%;\n box-sizing: border-box;\n background: var(--_shell-page-content-background);\n}\n\n:host(.shell-page-host--surface-secondary) {\n --_shell-page-content-background: var(--color-background-secondary);\n}\n\n:host(.shell-page-host--surface-secondary[responsive-mode='desktop']),\n:host(.shell-page-host--surface-secondary[responsive-mode='tablet']) {\n --_shell-page-header-background: var(--color-background-secondary);\n}\n\n:host([responsive-mode='tablet']),\n:host([responsive-mode='mobile']) {\n --_shell-page-responsive-content-block-start-inset: var(--dimension-space-200);\n}\n\n:host([responsive-mode='mobile']) {\n --ds-shell-page-sticky-header-block-size: calc(\n var(--dimension-size-500) + var(--dimension-space-200)\n );\n}\n\n:host(.shell-page-host--header-compact),\n:host(.shell-page-host--header-constrained) {\n --_shell-page-content-block-start-inset: var(\n --ds-shell-page-compact-content-block-start-inset,\n var(--_shell-page-responsive-content-block-start-inset)\n );\n}\n\n:host(.shell-page-host--inset-none),\n:host(.shell-page-host--block-start-inset-none) {\n --_shell-page-content-block-start-inset: 0px;\n}\n\n.shell-page__scroll-sentinel {\n position: absolute;\n inset-block-start: var(--ds-shell-page-header-travel, 0);\n inset-inline-start: 0;\n width: var(--dimension-stroke-width-012);\n height: var(--dimension-stroke-width-012);\n pointer-events: none;\n}\n\n.shell-page__sticky-header {\n position: sticky;\n inset-block-start: var(--ds-shell-page-sticky-offset, 0);\n z-index: var(--dimension-z-index-raised);\n min-width: 0;\n background: var(--_shell-page-header-background);\n overflow: visible;\n overflow-anchor: none;\n}\n\n.shell-page__desktop-header ::slotted(ds-bar-title),\n.shell-page__desktop-header ::slotted(ds-bar-workflow),\n.shell-page__mobile-header ::slotted(ds-mobile-header) {\n display: block;\n min-width: 0;\n}\n\n.shell-page__desktop-header[hidden],\n.shell-page__mobile-header[hidden] {\n display: none;\n}\n\n:host(.shell-page-host--mobile) .shell-page__scroll-sentinel,\n:host(.shell-page-host--mobile) .shell-page__flow-spacer {\n display: none;\n}\n\n.shell-page__flow-spacer {\n height: var(--ds-shell-page-flow-spacer, 0);\n background: var(--_shell-page-content-background);\n}\n\n.shell-page__content {\n min-width: 0;\n box-sizing: border-box;\n background: var(--_shell-page-content-background);\n}\n\n:host(.shell-page-host--inset-default) .shell-page__content {\n padding: var(--dimension-space-400);\n padding-block-start: var(--_shell-page-content-block-start-inset);\n}\n\n:host(.shell-page-host--inset-default[responsive-mode='tablet']) .shell-page__content,\n:host(.shell-page-host--inset-default[responsive-mode='mobile']) .shell-page__content {\n padding: var(--dimension-space-200);\n padding-block-start: var(--_shell-page-content-block-start-inset);\n}\n\n:host(.shell-page-host--inset-none) .shell-page__content {\n padding: 0;\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\nimport type { ShellResponsiveMode } from '../../shell/shell-responsive';\nimport { resolveCssLengthPx } from '../../utils/resolve-css-length-px';\nimport type { BarTitleVariant } from '../BarTitle/bar-title-types';\nimport { resolveShellPageHeaderVariant } from './shell-page-responsive';\nimport type {\n ShellPageCapacity,\n ShellPageContentInset,\n ShellPageContentSurface,\n ShellPageHeaderPresentation,\n} from './shell-page-types';\n\ntype BarTitleElement = HTMLElement & { variant: BarTitleVariant };\n\n@Component({\n tag: 'ds-shell-page',\n styleUrl: 'ShellPage.css',\n scoped: true,\n})\nexport class ShellPage {\n private static readonly MAX_HEADER_REVEAL_FRAMES = 12;\n private static readonly MAX_HEADER_GEOMETRY_FRAMES = 12;\n\n @Element() el!: HTMLElement;\n\n /** Automatic capacity/scroll behavior, or an explicit header variant override. */\n @Prop() headerPresentation: ShellPageHeaderPresentation = 'auto';\n\n /** Available page-header capacity supplied by the owning application shell. */\n @Prop() headerCapacity?: ShellPageCapacity;\n\n /** Standard page gutters, or no inset for full-bleed page content. */\n @Prop() contentInset: ShellPageContentInset = 'default';\n\n /** Preserve the responsive side/end gutters while allowing content to meet the header. */\n @Prop() contentInsetBlockStart: ShellPageContentInset = 'default';\n\n /** Exact block-start content inset, overriding the responsive default when provided. */\n @Prop() contentInsetBlockStartSize?: string;\n\n /** Exact block-start content inset while the header is compact or constrained. */\n @Prop() compactContentInsetBlockStartSize?: string;\n\n /** Allow roomy automatic headers to compact as the page scrolls. */\n @Prop() scrollCompaction: boolean = true;\n\n /** Canvas surface painted around and beneath routed page content. */\n @Prop() contentSurface: ShellPageContentSurface = 'primary';\n\n /** Explicit shell breakpoint presentation. Mobile uses the dedicated mobile-header slot. */\n @Prop({ attribute: 'responsive-mode', reflect: true })\n responsiveMode: ShellResponsiveMode = 'desktop';\n\n @State() private pageTopVisible = true;\n\n private sentinelEl: HTMLElement | null = null;\n private spacerEl: HTMLElement | null = null;\n private stickyHeaderEl: HTMLElement | null = null;\n private headerEl: BarTitleElement | null = null;\n private expandedHeaderHeight = 0;\n private headerTravel = 0;\n private expandedGeometryFrozen = false;\n private pageHeaderResizeObserver: ResizeObserver | null = null;\n private headerResizeObserver: ResizeObserver | null = null;\n private headerMutationObserver: MutationObserver | null = null;\n private headerRevealFrame: number | null = null;\n private headerGeometryFrame: number | null = null;\n private reconnectFrame: number | null = null;\n private scrollRoot: HTMLElement | Window | null = null;\n private hasLoaded = false;\n\n @Watch('headerCapacity')\n @Watch('headerPresentation')\n @Watch('scrollCompaction')\n handleHeaderContractChange() {\n this.syncHeaderVariant(true);\n }\n\n @Watch('responsiveMode')\n handleResponsiveModeChange() {\n this.el.style.removeProperty('--ds-shell-page-sticky-header-block-size');\n this.observeHeader(this.responsiveMode === 'mobile' ? null : this.findHeader());\n }\n\n componentDidLoad() {\n this.hasLoaded = true;\n this.connectRuntime();\n }\n\n componentDidRender() {\n this.syncHeaderVariant();\n }\n\n connectedCallback() {\n if (!this.hasLoaded) return;\n if (this.reconnectFrame !== null) cancelAnimationFrame(this.reconnectFrame);\n this.reconnectFrame = requestAnimationFrame(() => {\n this.reconnectFrame = null;\n if (this.el.isConnected) this.connectRuntime();\n });\n }\n\n disconnectedCallback() {\n if (this.reconnectFrame !== null) cancelAnimationFrame(this.reconnectFrame);\n this.reconnectFrame = null;\n this.headerResizeObserver?.disconnect();\n this.headerResizeObserver = null;\n this.pageHeaderResizeObserver?.disconnect();\n this.pageHeaderResizeObserver = null;\n this.headerMutationObserver?.disconnect();\n this.headerMutationObserver = null;\n this.cancelHeaderReveal();\n this.cancelHeaderGeometrySync();\n this.headerEl?.style.removeProperty('--ds-bar-title-divider-inset');\n this.scrollRoot?.removeEventListener('scroll', this.handleScroll);\n this.scrollRoot = null;\n }\n\n private connectRuntime() {\n this.observePageHeaderGeometry();\n this.observeHeader(this.responsiveMode === 'mobile' ? null : this.findHeader());\n this.connectScrollRoot();\n }\n\n private get effectiveVariant(): BarTitleVariant {\n return resolveShellPageHeaderVariant(\n this.headerPresentation,\n this.headerCapacity ?? 'roomy',\n this.scrollCompaction ? this.pageTopVisible : true\n );\n }\n\n private get headerContractResolved(): boolean {\n return this.headerPresentation !== 'auto' || this.headerCapacity !== undefined;\n }\n\n private get isScrollCompacted(): boolean {\n return (\n this.scrollCompaction &&\n this.headerPresentation === 'auto' &&\n this.headerCapacity === 'roomy' &&\n !this.pageTopVisible\n );\n }\n\n private get contentInsetStyles(): { [name: string]: string } {\n const styles: { [name: string]: string } = {};\n const expanded = this.contentInsetBlockStartSize?.trim();\n const compact = this.compactContentInsetBlockStartSize?.trim();\n if (expanded) styles['--ds-shell-page-content-block-start-inset'] = expanded;\n if (compact) styles['--ds-shell-page-compact-content-block-start-inset'] = compact;\n return styles;\n }\n\n private composedParent(element: Element): Element | null {\n return (element as HTMLElement).assignedSlot?.parentElement ?? element.parentElement;\n }\n\n private findScrollRoot(): HTMLElement | Window {\n let ancestor = this.composedParent(this.el);\n while (ancestor && ancestor !== document.documentElement) {\n const overflow = getComputedStyle(ancestor).overflowY;\n if (overflow === 'auto' || overflow === 'scroll' || overflow === 'overlay') {\n return ancestor as HTMLElement;\n }\n ancestor = this.composedParent(ancestor);\n }\n return window;\n }\n\n private connectScrollRoot() {\n const next = this.findScrollRoot();\n if (next === this.scrollRoot) return;\n this.scrollRoot?.removeEventListener('scroll', this.handleScroll);\n this.scrollRoot = next;\n this.scrollRoot.addEventListener('scroll', this.handleScroll, { passive: true });\n this.handleScroll();\n }\n\n private get scrollRootResolved(): boolean {\n const shell = this.el.closest('ds-shell-app');\n if (!shell) return true;\n const expected = shell.querySelector<HTMLElement>('.shell-app__content');\n return expected !== null && this.scrollRoot === expected;\n }\n\n private handleScroll = () => {\n if (!this.sentinelEl || !this.scrollRoot) return;\n const rootTop =\n this.scrollRoot === window ? 0 : (this.scrollRoot as HTMLElement).getBoundingClientRect().top;\n this.syncHeaderDividerInset(rootTop);\n const nextPageTopVisible = this.sentinelEl.getBoundingClientRect().top >= rootTop;\n if (\n this.scrollCompaction &&\n !nextPageTopVisible &&\n this.pageTopVisible &&\n this.headerEl?.classList.contains(this.variantClass('expanded'))\n ) {\n this.captureExpandedHeaderGeometry(this.headerEl);\n this.expandedGeometryFrozen = true;\n }\n if (\n nextPageTopVisible &&\n this.expandedGeometryFrozen &&\n this.el.getBoundingClientRect().top >= rootTop\n ) {\n this.expandedGeometryFrozen = false;\n if (this.headerEl?.classList.contains(this.variantClass('expanded'))) {\n this.captureExpandedHeaderGeometry(this.headerEl);\n }\n }\n this.pageTopVisible = nextPageTopVisible;\n };\n\n private findHeader(): BarTitleElement | null {\n return this.el.querySelector<BarTitleElement>('ds-bar-title');\n }\n\n private get compactHeaderHeight(): number {\n return resolveCssLengthPx('--dimension-size-600', 0);\n }\n\n private syncHeaderDividerInset(rootTop?: number) {\n const header = this.headerEl;\n if (!header) return;\n\n const ownsScrollTransition =\n this.scrollCompaction &&\n this.headerPresentation === 'auto' &&\n this.headerCapacity === 'roomy';\n const expandedInset = resolveCssLengthPx('--dimension-space-400', 0);\n if (\n !ownsScrollTransition ||\n !this.sentinelEl ||\n !this.scrollRoot ||\n this.headerTravel <= 0 ||\n expandedInset <= 0\n ) {\n header.style.removeProperty('--ds-bar-title-divider-inset');\n return;\n }\n\n const scrollRootTop =\n rootTop ??\n (this.scrollRoot === window\n ? 0\n : (this.scrollRoot as HTMLElement).getBoundingClientRect().top);\n const remainingTravel = this.sentinelEl.getBoundingClientRect().top - scrollRootTop;\n const progress = Math.min(1, Math.max(0, 1 - remainingTravel / this.headerTravel));\n header.style.setProperty('--ds-bar-title-divider-inset', `${expandedInset * (1 - progress)}px`);\n }\n\n private setHeaderTravel(distance: number) {\n const next = Math.max(0, distance);\n if (Math.abs(next - this.headerTravel) < 0.5) return;\n this.headerTravel = next;\n this.el.style.setProperty('--ds-shell-page-header-travel', `${next}px`);\n this.handleScroll();\n }\n\n private measureHeaderTravel(header: BarTitleElement) {\n const anchor = header.querySelector<HTMLElement>('[data-shell-page-header-anchor]');\n const compactHeight = this.compactHeaderHeight;\n if (!anchor || compactHeight <= 0) return;\n\n const headerRect = header.getBoundingClientRect();\n const anchorRect = anchor.getBoundingClientRect();\n if (headerRect.height <= 0 || anchorRect.height <= 0) return;\n\n const expandedAnchorTop = anchorRect.top - headerRect.top;\n const compactAnchorTop = Math.max(0, (compactHeight - anchorRect.height) / 2);\n this.setHeaderTravel(expandedAnchorTop - compactAnchorTop);\n }\n\n private captureExpandedHeaderGeometry(header: BarTitleElement) {\n // Keep the largest observed expanded geometry for this header instance.\n // During a variant handoff Chromium can briefly report the compact box\n // before the child host class mutation is delivered; that transient must\n // not erase the flow reservation captured at the roomy page top.\n this.expandedHeaderHeight = Math.max(\n this.expandedHeaderHeight,\n header.getBoundingClientRect().height\n );\n this.measureHeaderTravel(header);\n }\n\n private setSpacerHeight(height: number) {\n if (!this.spacerEl) return;\n this.spacerEl.style.setProperty('--ds-shell-page-flow-spacer', `${Math.max(0, height)}px`);\n }\n\n private variantClass(variant: BarTitleVariant): string {\n return `bar-title-host--${variant}`;\n }\n\n private setStickyHeaderOffset(renderedVariant: BarTitleVariant) {\n this.stickyHeaderEl?.style.setProperty(\n '--ds-shell-page-sticky-offset',\n renderedVariant === 'expanded' &&\n this.scrollCompaction &&\n this.headerPresentation === 'auto' &&\n this.headerCapacity === 'roomy'\n ? `${-this.headerTravel}px`\n : '0px'\n );\n }\n\n private syncPageHeaderBlockSize() {\n const renderedHeight = this.stickyHeaderEl?.getBoundingClientRect().height ?? 0;\n if (renderedHeight > 0) {\n this.el.style.setProperty('--ds-shell-page-sticky-header-block-size', `${renderedHeight}px`);\n }\n }\n\n private observePageHeaderGeometry() {\n this.pageHeaderResizeObserver?.disconnect();\n this.pageHeaderResizeObserver = null;\n this.syncPageHeaderBlockSize();\n\n if (!this.stickyHeaderEl || typeof ResizeObserver === 'undefined') return;\n this.pageHeaderResizeObserver = new ResizeObserver(() => {\n this.syncPageHeaderBlockSize();\n });\n this.pageHeaderResizeObserver.observe(this.stickyHeaderEl);\n }\n\n private syncRenderedHeaderGeometry(header: BarTitleElement) {\n const renderedVariant = this.effectiveVariant;\n if (!header.classList.contains(this.variantClass(renderedVariant))) return;\n\n this.syncPageHeaderBlockSize();\n\n // Update both flow-preservation pieces before reading layout. Otherwise a\n // reverse compact → expanded render can briefly contain the tall header and\n // the compact spacer together, giving browser scroll anchoring a transient\n // height change to compensate.\n this.setSpacerHeight(\n this.isScrollCompacted ? this.expandedHeaderHeight - this.compactHeaderHeight : 0\n );\n this.setStickyHeaderOffset(renderedVariant);\n\n if (renderedVariant === 'expanded' && !this.expandedGeometryFrozen) {\n this.captureExpandedHeaderGeometry(header);\n this.setStickyHeaderOffset(renderedVariant);\n }\n }\n\n private cancelHeaderGeometrySync() {\n if (this.headerGeometryFrame !== null) cancelAnimationFrame(this.headerGeometryFrame);\n this.headerGeometryFrame = null;\n }\n\n private scheduleHeaderGeometrySync(header: BarTitleElement) {\n this.cancelHeaderGeometrySync();\n let framesRemaining = ShellPage.MAX_HEADER_GEOMETRY_FRAMES;\n let framesElapsed = 0;\n const sync = () => {\n if (this.headerEl !== header) return;\n framesRemaining -= 1;\n framesElapsed += 1;\n // In WebKit a child's componentDidLoad can precede its assignment into\n // the parent's rendered slot. Revalidate after ShellApp has had a frame\n // to expose the actual content scroller.\n this.connectScrollRoot();\n this.syncRenderedHeaderGeometry(header);\n const geometryReady =\n this.effectiveVariant !== 'expanded' ||\n (this.expandedHeaderHeight > 0 && this.headerTravel > 0);\n if (\n (geometryReady && this.scrollRootResolved && framesElapsed >= 2) ||\n framesRemaining <= 0\n ) {\n this.headerGeometryFrame = null;\n return;\n }\n this.headerGeometryFrame = requestAnimationFrame(sync);\n };\n this.headerGeometryFrame = requestAnimationFrame(sync);\n }\n\n private cancelHeaderReveal() {\n if (this.headerRevealFrame !== null) cancelAnimationFrame(this.headerRevealFrame);\n this.headerRevealFrame = null;\n this.headerEl?.removeAttribute('data-shell-page-syncing');\n }\n\n private revealHeaderWhenSynced(header: BarTitleElement, variant: BarTitleVariant) {\n // Stencil normally re-renders within a frame or two of a prop change. Stop\n // polling at the cap, but fail closed: a stale variant must never paint.\n let framesRemaining = ShellPage.MAX_HEADER_REVEAL_FRAMES;\n const reveal = () => {\n if (this.headerEl !== header) {\n header.removeAttribute('data-shell-page-syncing');\n return;\n }\n framesRemaining -= 1;\n if (header.classList.contains(this.variantClass(variant))) {\n header.removeAttribute('data-shell-page-syncing');\n this.headerRevealFrame = null;\n return;\n }\n if (framesRemaining <= 0) {\n this.headerRevealFrame = null;\n return;\n }\n this.headerRevealFrame = requestAnimationFrame(reveal);\n };\n this.headerRevealFrame = requestAnimationFrame(reveal);\n }\n\n private syncHeaderVariant(concealUntilSynced = false) {\n const header = this.headerEl;\n if (!header) return;\n\n this.syncHeaderDividerInset();\n if (!this.headerContractResolved) {\n this.cancelHeaderReveal();\n header.setAttribute('data-shell-page-syncing', '');\n return;\n }\n\n const next = this.effectiveVariant;\n const renderedVariantIsStale = !header.classList.contains(this.variantClass(next));\n if (!renderedVariantIsStale) this.syncRenderedHeaderGeometry(header);\n if (renderedVariantIsStale && this.isScrollCompacted) {\n // Preserve the expanded flow before asking BarTitle to become compact.\n // This prevents the sentinel from moving back into view during the\n // parent/child render handoff and keeps the variant transition stable.\n this.setSpacerHeight(this.expandedHeaderHeight - this.compactHeaderHeight);\n this.setStickyHeaderOffset(next);\n }\n if (concealUntilSynced) {\n this.cancelHeaderReveal();\n header.setAttribute('data-shell-page-syncing', '');\n }\n if (header.variant !== next) {\n header.variant = next;\n // The child update and its MutationObserver callback can land in\n // different phases across engines. Poll the rendered class as the\n // authoritative handoff before committing sticky/spacer geometry.\n this.scheduleHeaderGeometrySync(header);\n }\n if (concealUntilSynced) {\n this.revealHeaderWhenSynced(header, next);\n }\n }\n\n private observeHeader(header: BarTitleElement | null) {\n this.cancelHeaderReveal();\n this.cancelHeaderGeometrySync();\n this.headerResizeObserver?.disconnect();\n this.headerResizeObserver = null;\n this.headerMutationObserver?.disconnect();\n this.headerMutationObserver = null;\n this.headerEl?.style.removeProperty('--ds-bar-title-divider-inset');\n this.headerEl = header;\n this.expandedHeaderHeight = 0;\n this.expandedGeometryFrozen = false;\n this.setHeaderTravel(0);\n this.setSpacerHeight(0);\n this.stickyHeaderEl?.style.setProperty('--ds-shell-page-sticky-offset', '0px');\n\n if (!header) return;\n if (header.classList.contains(this.variantClass('expanded'))) {\n this.captureExpandedHeaderGeometry(header);\n }\n if (typeof ResizeObserver !== 'undefined') {\n this.headerResizeObserver = new ResizeObserver(() => {\n this.syncRenderedHeaderGeometry(header);\n });\n this.headerResizeObserver.observe(header);\n }\n if (typeof MutationObserver !== 'undefined') {\n this.headerMutationObserver = new MutationObserver(() => {\n this.syncRenderedHeaderGeometry(header);\n });\n this.headerMutationObserver.observe(header, {\n attributes: true,\n attributeFilter: ['class'],\n childList: true,\n subtree: true,\n });\n }\n this.syncHeaderVariant(true);\n this.scheduleHeaderGeometrySync(header);\n }\n\n private handleHeaderSlotChange = (event: Event) => {\n if (this.responsiveMode === 'mobile') return;\n const slot = event.target as HTMLSlotElement;\n const header = slot\n .assignedElements()\n .find(element => element.tagName.toLowerCase() === 'ds-bar-title');\n this.observeHeader((header as BarTitleElement | undefined) ?? null);\n };\n\n render() {\n const mobile = this.responsiveMode === 'mobile';\n return (\n <Host\n role=\"main\"\n style={this.contentInsetStyles}\n class={{\n 'shell-page-host--inset-default': this.contentInset === 'default',\n 'shell-page-host--inset-none': this.contentInset === 'none',\n 'shell-page-host--block-start-inset-none': this.contentInsetBlockStart === 'none',\n 'shell-page-host--surface-primary': this.contentSurface === 'primary',\n 'shell-page-host--surface-secondary': this.contentSurface === 'secondary',\n 'shell-page-host--mobile': mobile,\n [`shell-page-host--header-${this.effectiveVariant}`]: true,\n }}\n >\n <div\n ref={el => {\n this.sentinelEl = el ?? null;\n }}\n class=\"shell-page__scroll-sentinel\"\n aria-hidden=\"true\"\n />\n <div\n ref={el => {\n this.stickyHeaderEl = el ?? null;\n }}\n class=\"shell-page__sticky-header\"\n >\n <div\n class=\"shell-page__desktop-header\"\n hidden={mobile}\n aria-hidden={mobile ? 'true' : undefined}\n inert={mobile ? true : undefined}\n >\n <slot name=\"header\" onSlotchange={this.handleHeaderSlotChange} />\n </div>\n <div\n class=\"shell-page__mobile-header\"\n hidden={!mobile}\n aria-hidden={!mobile ? 'true' : undefined}\n inert={!mobile ? true : undefined}\n >\n <slot name=\"mobile-header\" />\n </div>\n </div>\n <div\n ref={el => {\n this.spacerEl = el ?? null;\n }}\n class=\"shell-page__flow-spacer\"\n aria-hidden=\"true\"\n />\n <div class=\"shell-page__content\">\n <slot />\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- import{p as s,H as c,c as e,h as r,a as i,t}from"./index.js";function o(s,c){return c.length>0?c.flatMap((s=>s.options)):[...s]}function a(s,c){const e=s.findIndex((s=>s.value===c&&!s.isInactive));if(e>=0)return e;return s.findIndex((s=>!s.isInactive))}function n(s,c,e){const r=s.map(((s,c)=>({option:s,index:c}))).filter((({option:s})=>!s.isInactive)).map((({index:s})=>s));if(r.length===0)return null;if(e==="Home")return r[0];if(e==="End")return r[r.length-1];const i=e==="ArrowRight"||e==="ArrowDown"?1:-1;const t=r.indexOf(c);if(t<0){return i>0?r[0]:r[r.length-1]}return r[(t+i+r.length)%r.length]}function d(s){if(s===undefined||!Number.isFinite(s))return 1;return Math.min(1,Math.max(0,s))}const h=()=>`@media (forced-colors: active){.sc-ds-swatch-picker:root,.sc-ds-swatch-picker-h,.ds-forced-colors-scope.sc-ds-swatch-picker{--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-swatch-picker-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-swatch-picker-h,.ds-focus-ring.sc-ds-swatch-picker,.ds-focus-ring-inset.sc-ds-swatch-picker-h,.ds-focus-ring-inset.sc-ds-swatch-picker{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-swatch-picker-h:focus-visible,.ds-focus-ring.sc-ds-swatch-picker: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-swatch-picker-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-swatch-picker{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-swatch-picker-h:focus-visible,.ds-focus-ring-inset.sc-ds-swatch-picker:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-swatch-picker-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-swatch-picker: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-swatch-picker-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-swatch-picker{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-swatch-picker-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-swatch-picker::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-swatch-picker-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-swatch-picker:root,.sc-ds-swatch-picker-h,.ds-forced-colors-scope.sc-ds-swatch-picker{--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-control-inactive.sc-ds-swatch-picker-h,.ds-control-inactive.sc-ds-swatch-picker{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-swatch-picker-h,.ds-control-inactive.sc-ds-swatch-picker{color:var(--ds-forced-color-disabled);opacity:1}}@media (forced-colors: active){.sc-ds-swatch-picker:root,.sc-ds-swatch-picker-h,.ds-forced-colors-scope.sc-ds-swatch-picker{--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-swatch-picker-h{box-sizing:border-box;display:block;width:100%;--_swatch-inner-inset:calc( var(--dimension-stroke-width-025) + var(--dimension-space-025) );--_swatch-ring-bg:var(--color-background-primary);--_swatch-select-motion:var(--effect-motion-short-3)}.swatch-picker.sc-ds-swatch-picker{box-sizing:border-box;display:flex;align-items:center;flex-wrap:wrap;width:100%;min-height:var(--dimension-size-400);gap:var(--dimension-space-100);padding:var(--dimension-space-100)}.swatch-picker__option.sc-ds-swatch-picker{position:relative;box-sizing:border-box;flex:0 0 auto;width:var(--dimension-size-300);height:var(--dimension-size-300);padding:0;border:none;border-radius:var(--dimension-radius-half);background:transparent;cursor:default;isolation:isolate}.swatch-picker__fill.sc-ds-swatch-picker,.swatch-picker__border.sc-ds-swatch-picker,.swatch-picker__interaction.sc-ds-swatch-picker,.swatch-picker__halo.sc-ds-swatch-picker,.swatch-picker__stroke.sc-ds-swatch-picker{position:absolute;inset:0;border-radius:inherit;pointer-events:none}.swatch-picker__fill.sc-ds-swatch-picker{z-index:1;background-color:var(--_swatch-preview-color);background-image:var(--_swatch-preview-image);background-repeat:no-repeat;background-position:center;background-size:cover;opacity:var(--_swatch-preview-opacity);transition:inset var(--_swatch-select-motion)}.swatch-picker__border.sc-ds-swatch-picker{z-index:2;box-shadow:inset 0 0 0 var(--dimension-stroke-width-012) var(--color-border-secondary);transition:inset var(--_swatch-select-motion)}.swatch-picker__interaction.sc-ds-swatch-picker{z-index:3;background-color:transparent;transition:inset var(--_swatch-select-motion), background-color 0s}@media (hover: hover) and (pointer: fine){.swatch-picker__option.sc-ds-swatch-picker:hover:not(:disabled) .swatch-picker__interaction.sc-ds-swatch-picker{background-color:var(--color-interaction-hover)}}.swatch-picker__option.sc-ds-swatch-picker:active:not(:disabled) .swatch-picker__interaction.sc-ds-swatch-picker{background-color:var(--color-interaction-pressed)}.swatch-picker__halo.sc-ds-swatch-picker,.swatch-picker__stroke.sc-ds-swatch-picker{opacity:0;transform:scale(1.2);transform-origin:center;transition:opacity var(--_swatch-select-motion), transform var(--_swatch-select-motion)}.swatch-picker__halo.sc-ds-swatch-picker{z-index:4;box-shadow:inset 0 0 0 var(--_swatch-inner-inset) var(--_swatch-ring-bg)}.swatch-picker__stroke.sc-ds-swatch-picker{z-index:5;box-shadow:inset 0 0 0 var(--dimension-stroke-width-025) var(--color-border-bold-brand)}.swatch-picker__option--selected.sc-ds-swatch-picker .swatch-picker__fill.sc-ds-swatch-picker,.swatch-picker__option--selected.sc-ds-swatch-picker .swatch-picker__border.sc-ds-swatch-picker,.swatch-picker__option--selected.sc-ds-swatch-picker .swatch-picker__interaction.sc-ds-swatch-picker{inset:var(--_swatch-inner-inset)}.swatch-picker__option--selected.sc-ds-swatch-picker .swatch-picker__halo.sc-ds-swatch-picker,.swatch-picker__option--selected.sc-ds-swatch-picker .swatch-picker__stroke.sc-ds-swatch-picker{opacity:1;transform:scale(1)}.swatch-picker__divider.sc-ds-swatch-picker{flex:0 0 auto;align-self:center;width:var(--dimension-stroke-width-012);height:var(--dimension-size-300);background-color:var(--color-border-tertiary)}@media (prefers-reduced-motion: reduce){.swatch-picker__fill.sc-ds-swatch-picker,.swatch-picker__border.sc-ds-swatch-picker,.swatch-picker__interaction.sc-ds-swatch-picker,.swatch-picker__halo.sc-ds-swatch-picker,.swatch-picker__stroke.sc-ds-swatch-picker{transition:none}}@media (forced-colors: active){.swatch-picker__fill.sc-ds-swatch-picker{forced-color-adjust:none}.swatch-picker__border.sc-ds-swatch-picker{box-shadow:none;outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);outline-offset:calc(-1 * var(--dimension-stroke-width-012))}.swatch-picker__halo.sc-ds-swatch-picker{box-shadow:none}.swatch-picker__stroke.sc-ds-swatch-picker{box-shadow:none;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}.swatch-picker__divider.sc-ds-swatch-picker{background-color:var(--ds-forced-color-content)}}`;const l=s(class s extends c{constructor(s){super();if(s!==false){this.__registerHost()}this.dsChange=e(this,"dsChange",7);this.value="";this.options=[];this.sections=[];this.groupLabel="Swatch options"}get activeOptions(){return o(this.options,this.sections)}selectOption(s){if(s.isInactive||s.value===this.value)return;this.value=s.value;this.dsChange.emit(s.value)}focusOption(s){requestAnimationFrame((()=>{const c=this.el.querySelectorAll(".swatch-picker__option");c[s]?.focus()}))}handleOptionKeyDown(s,c){const e=s.key;if(!["ArrowDown","ArrowLeft","ArrowRight","ArrowUp","Home","End"].includes(e)){return}const r=n(this.activeOptions,c,e);if(r===null)return;s.preventDefault();const i=this.activeOptions[r];this.selectOption(i);this.focusOption(r)}renderOption(s,c,e){const i=s.value===this.value;const t=d(s.preview.opacity);return r("button",{key:s.value,type:"button",class:{"swatch-picker__option":true,"swatch-picker__option--selected":i,"ds-focus-ring-inset":true,"ds-control-inactive":!!s.isInactive},style:{"--_swatch-preview-color":s.preview.backgroundColor??"var(--color-background-secondary)","--_swatch-preview-image":s.preview.backgroundImage??"none","--_swatch-preview-opacity":String(t)},role:"radio","aria-label":s.label,"aria-checked":i?"true":"false",tabIndex:c===e?0:-1,disabled:s.isInactive,onClick:()=>this.selectOption(s),onKeyDown:s=>this.handleOptionKeyDown(s,c)},r("span",{class:"swatch-picker__fill","aria-hidden":"true"}),r("span",{class:"swatch-picker__border","aria-hidden":"true"}),r("span",{class:"swatch-picker__interaction","aria-hidden":"true"}),r("span",{class:"swatch-picker__halo","aria-hidden":"true"}),r("span",{class:"swatch-picker__stroke","aria-hidden":"true"}))}render(){const s=this.activeOptions;const c=a(s,this.value);let e=0;return r(i,{key:"f621418068395f9b3b71a2e75c13b33537aa64b8"},r("div",{key:"bdbc7cdcd46aa8742cea459f42879502ecebda09",class:"swatch-picker",role:"radiogroup","aria-label":this.groupLabel},(this.sections.length>0?this.sections:[{options:this.options}]).map(((s,i)=>[s.options.map((s=>{const r=e++;return this.renderOption(s,r,c)})),i<(this.sections.length>0?this.sections.length:1)-1&&r("span",{class:"swatch-picker__divider","aria-hidden":"true"})]))))}get el(){return this}static get style(){return h()}},[2,"ds-swatch-picker",{value:[1537],options:[16],sections:[16],groupLabel:[1,"group-label"]}]);function p(){if(typeof customElements==="undefined"){return}const s=["ds-swatch-picker"];s.forEach((s=>{switch(s){case"ds-swatch-picker":if(!customElements.get(t(s))){customElements.define(t(s),l)}break}}))}p();export{l as S,p as d};
2
- //# sourceMappingURL=p-BysVBVQv.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["flattenSwatchPickerOptions","options","sections","length","flatMap","section","resolveSwatchPickerTabIndex","value","selectedIndex","findIndex","option","isInactive","resolveSwatchPickerNavigationIndex","currentIndex","key","enabledIndexes","map","index","filter","direction","currentEnabledIndex","indexOf","normalizeSwatchPickerOpacity","opacity","undefined","Number","isFinite","Math","min","max","swatchPickerCss","SwatchPicker","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","groupLabel","activeOptions","selectOption","dsChange","emit","focusOption","requestAnimationFrame","optionButtons","el","querySelectorAll","focus","handleOptionKeyDown","event","includes","nextIndex","preventDefault","nextOption","renderOption","tabIndex","selected","preview","h","type","class","style","backgroundColor","backgroundImage","String","role","label","disabled","onClick","onKeyDown","render","optionIndex","Host","sectionIndex"],"sources":["src/wc/components/SwatchPicker/swatch-picker-types.ts","src/wc/components/SwatchPicker/SwatchPicker.css?tag=ds-swatch-picker&encapsulation=scoped","src/wc/components/SwatchPicker/SwatchPicker.tsx"],"sourcesContent":["export interface SwatchPickerPreview {\n /** CSS color used as the swatch base or as a complete flat-color preview. */\n backgroundColor?: string;\n /** CSS gradient used as the swatch image. */\n backgroundImage?: string;\n /** Optional preview-layer opacity, clamped to the inclusive 0–1 range. */\n opacity?: number;\n}\n\nexport interface SwatchPickerOption {\n /** Stable value emitted when this option is selected. */\n value: string;\n /** Accessible option name; the visual preview never replaces this label. */\n label: string;\n preview: SwatchPickerPreview;\n isInactive?: boolean;\n}\n\nexport interface SwatchPickerSection {\n /** Sections remain one radio group and are separated visually. */\n options: SwatchPickerOption[];\n}\n\nexport type SwatchPickerNavigationKey =\n | 'ArrowDown'\n | 'ArrowLeft'\n | 'ArrowRight'\n | 'ArrowUp'\n | 'Home'\n | 'End';\n\nexport function flattenSwatchPickerOptions(\n options: readonly SwatchPickerOption[],\n sections: readonly SwatchPickerSection[],\n): SwatchPickerOption[] {\n return sections.length > 0\n ? sections.flatMap(section => section.options)\n : [...options];\n}\n\nexport function resolveSwatchPickerTabIndex(\n options: readonly SwatchPickerOption[],\n value: string,\n): number {\n const selectedIndex = options.findIndex(option => (\n option.value === value && !option.isInactive\n ));\n if (selectedIndex >= 0) return selectedIndex;\n return options.findIndex(option => !option.isInactive);\n}\n\nexport function resolveSwatchPickerNavigationIndex(\n options: readonly SwatchPickerOption[],\n currentIndex: number,\n key: SwatchPickerNavigationKey,\n): number | null {\n const enabledIndexes = options\n .map((option, index) => ({ option, index }))\n .filter(({ option }) => !option.isInactive)\n .map(({ index }) => index);\n\n if (enabledIndexes.length === 0) return null;\n if (key === 'Home') return enabledIndexes[0];\n if (key === 'End') return enabledIndexes[enabledIndexes.length - 1];\n\n const direction = key === 'ArrowRight' || key === 'ArrowDown' ? 1 : -1;\n const currentEnabledIndex = enabledIndexes.indexOf(currentIndex);\n if (currentEnabledIndex < 0) {\n return direction > 0\n ? enabledIndexes[0]\n : enabledIndexes[enabledIndexes.length - 1];\n }\n\n return enabledIndexes[\n (currentEnabledIndex + direction + enabledIndexes.length) % enabledIndexes.length\n ];\n}\n\nexport function normalizeSwatchPickerOpacity(opacity: number | undefined): number {\n if (opacity === undefined || !Number.isFinite(opacity)) return 1;\n return Math.min(1, Math.max(0, opacity));\n}\n","@import '../../utils/focus-ring.css';\n@import '../../utils/control-inactive.css';\n@import '../../utils/forced-colors.css';\n\n:host {\n box-sizing: border-box;\n display: block;\n width: 100%;\n --_swatch-inner-inset: calc(\n var(--dimension-stroke-width-025) + var(--dimension-space-025)\n );\n --_swatch-ring-bg: var(--color-background-primary);\n --_swatch-select-motion: var(--effect-motion-short-3);\n}\n\n.swatch-picker {\n box-sizing: border-box;\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n width: 100%;\n min-height: var(--dimension-size-400);\n gap: var(--dimension-space-100);\n padding: var(--dimension-space-100);\n}\n\n.swatch-picker__option {\n position: relative;\n box-sizing: border-box;\n flex: 0 0 auto;\n width: var(--dimension-size-300);\n height: var(--dimension-size-300);\n padding: 0;\n border: none;\n border-radius: var(--dimension-radius-half);\n background: transparent;\n cursor: default;\n isolation: isolate;\n}\n\n.swatch-picker__fill,\n.swatch-picker__border,\n.swatch-picker__interaction,\n.swatch-picker__halo,\n.swatch-picker__stroke {\n position: absolute;\n inset: 0;\n border-radius: inherit;\n pointer-events: none;\n}\n\n.swatch-picker__fill {\n z-index: 1;\n background-color: var(--_swatch-preview-color);\n background-image: var(--_swatch-preview-image);\n background-repeat: no-repeat;\n background-position: center;\n background-size: cover;\n opacity: var(--_swatch-preview-opacity);\n transition:\n inset var(--_swatch-select-motion);\n}\n\n.swatch-picker__border {\n z-index: 2;\n box-shadow: inset 0 0 0 var(--dimension-stroke-width-012) var(--color-border-secondary);\n transition:\n inset var(--_swatch-select-motion);\n}\n\n.swatch-picker__interaction {\n z-index: 3;\n background-color: transparent;\n transition:\n inset var(--_swatch-select-motion),\n background-color 0s;\n}\n\n@media (hover: hover) and (pointer: fine) {\n .swatch-picker__option:hover:not(:disabled) .swatch-picker__interaction {\n background-color: var(--color-interaction-hover);\n }\n}\n\n.swatch-picker__option:active:not(:disabled) .swatch-picker__interaction {\n background-color: var(--color-interaction-pressed);\n}\n\n.swatch-picker__halo,\n.swatch-picker__stroke {\n opacity: 0;\n transform: scale(1.2);\n transform-origin: center;\n transition:\n opacity var(--_swatch-select-motion),\n transform var(--_swatch-select-motion);\n}\n\n.swatch-picker__halo {\n z-index: 4;\n box-shadow: inset 0 0 0 var(--_swatch-inner-inset) var(--_swatch-ring-bg);\n}\n\n.swatch-picker__stroke {\n z-index: 5;\n box-shadow: inset 0 0 0 var(--dimension-stroke-width-025) var(--color-border-bold-brand);\n}\n\n.swatch-picker__option--selected .swatch-picker__fill,\n.swatch-picker__option--selected .swatch-picker__border,\n.swatch-picker__option--selected .swatch-picker__interaction {\n inset: var(--_swatch-inner-inset);\n}\n\n.swatch-picker__option--selected .swatch-picker__halo,\n.swatch-picker__option--selected .swatch-picker__stroke {\n opacity: 1;\n transform: scale(1);\n}\n\n.swatch-picker__divider {\n flex: 0 0 auto;\n align-self: center;\n width: var(--dimension-stroke-width-012);\n height: var(--dimension-size-300);\n background-color: var(--color-border-tertiary);\n}\n\n@media (prefers-reduced-motion: reduce) {\n .swatch-picker__fill,\n .swatch-picker__border,\n .swatch-picker__interaction,\n .swatch-picker__halo,\n .swatch-picker__stroke {\n transition: none;\n }\n}\n\n@media (forced-colors: active) {\n .swatch-picker__fill {\n forced-color-adjust: none;\n }\n\n .swatch-picker__border {\n box-shadow: none;\n outline: var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);\n outline-offset: calc(-1 * var(--dimension-stroke-width-012));\n }\n\n .swatch-picker__halo {\n box-shadow: none;\n }\n\n .swatch-picker__stroke {\n box-shadow: none;\n outline: var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);\n outline-offset: calc(-1 * var(--dimension-stroke-width-025));\n }\n\n .swatch-picker__divider {\n background-color: var(--ds-forced-color-content);\n }\n}\n","import { Component, Element, Event, EventEmitter, Prop, h, Host } from '@stencil/core';\nimport {\n flattenSwatchPickerOptions,\n normalizeSwatchPickerOpacity,\n resolveSwatchPickerNavigationIndex,\n resolveSwatchPickerTabIndex,\n type SwatchPickerNavigationKey,\n type SwatchPickerOption,\n type SwatchPickerSection,\n} from './swatch-picker-types';\n\n@Component({\n tag: 'ds-swatch-picker',\n styleUrl: 'SwatchPicker.css',\n scoped: true,\n})\nexport class SwatchPicker {\n @Element() el!: HTMLElement;\n\n /** Selected option value. */\n @Prop({ mutable: true, reflect: true }) value: string = '';\n\n /** Flat option list. Sections take precedence when supplied. Assign as a JavaScript property. */\n @Prop() options: SwatchPickerOption[] = [];\n\n /** Visually separated option groups that remain one radio group. Assign as a JavaScript property. */\n @Prop() sections: SwatchPickerSection[] = [];\n\n /** Accessible name for the complete one-of-many choice. */\n @Prop() groupLabel: string = 'Swatch options';\n\n @Event() dsChange!: EventEmitter<string>;\n\n private get activeOptions(): SwatchPickerOption[] {\n return flattenSwatchPickerOptions(this.options, this.sections);\n }\n\n private selectOption(option: SwatchPickerOption) {\n if (option.isInactive || option.value === this.value) return;\n this.value = option.value;\n this.dsChange.emit(option.value);\n }\n\n private focusOption(index: number) {\n requestAnimationFrame(() => {\n const optionButtons = this.el\n .querySelectorAll<HTMLButtonElement>('.swatch-picker__option');\n optionButtons[index]?.focus();\n });\n }\n\n private handleOptionKeyDown(\n event: KeyboardEvent,\n currentIndex: number,\n ) {\n const key = event.key as SwatchPickerNavigationKey;\n if (!['ArrowDown', 'ArrowLeft', 'ArrowRight', 'ArrowUp', 'Home', 'End'].includes(key)) {\n return;\n }\n\n const nextIndex = resolveSwatchPickerNavigationIndex(\n this.activeOptions,\n currentIndex,\n key,\n );\n if (nextIndex === null) return;\n\n event.preventDefault();\n const nextOption = this.activeOptions[nextIndex];\n this.selectOption(nextOption);\n this.focusOption(nextIndex);\n }\n\n private renderOption(\n option: SwatchPickerOption,\n index: number,\n tabIndex: number,\n ) {\n const selected = option.value === this.value;\n const opacity = normalizeSwatchPickerOpacity(option.preview.opacity);\n\n return (\n <button\n key={option.value}\n type=\"button\"\n class={{\n 'swatch-picker__option': true,\n 'swatch-picker__option--selected': selected,\n 'ds-focus-ring-inset': true,\n 'ds-control-inactive': !!option.isInactive,\n }}\n style={{\n '--_swatch-preview-color': option.preview.backgroundColor ?? 'var(--color-background-secondary)',\n '--_swatch-preview-image': option.preview.backgroundImage ?? 'none',\n '--_swatch-preview-opacity': String(opacity),\n }}\n role=\"radio\"\n aria-label={option.label}\n aria-checked={selected ? 'true' : 'false'}\n tabIndex={index === tabIndex ? 0 : -1}\n disabled={option.isInactive}\n onClick={() => this.selectOption(option)}\n onKeyDown={(event: KeyboardEvent) => this.handleOptionKeyDown(event, index)}\n >\n <span class=\"swatch-picker__fill\" aria-hidden=\"true\" />\n <span class=\"swatch-picker__border\" aria-hidden=\"true\" />\n <span class=\"swatch-picker__interaction\" aria-hidden=\"true\" />\n <span class=\"swatch-picker__halo\" aria-hidden=\"true\" />\n <span class=\"swatch-picker__stroke\" aria-hidden=\"true\" />\n </button>\n );\n }\n\n render() {\n const activeOptions = this.activeOptions;\n const tabIndex = resolveSwatchPickerTabIndex(activeOptions, this.value);\n let optionIndex = 0;\n\n return (\n <Host>\n <div\n class=\"swatch-picker\"\n role=\"radiogroup\"\n aria-label={this.groupLabel}\n >\n {(this.sections.length > 0 ? this.sections : [{ options: this.options }]).map((section, sectionIndex) => [\n section.options.map(option => {\n const currentIndex = optionIndex++;\n return this.renderOption(option, currentIndex, tabIndex);\n }),\n sectionIndex < (this.sections.length > 0 ? this.sections.length : 1) - 1 && (\n <span class=\"swatch-picker__divider\" aria-hidden=\"true\" />\n ),\n ])}\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"names":["mobileBarNavCss","MINIMUM_DIRECT_PRESS_MS","MobileBarNav","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","activeDestination","currentArea","id","icon","label","sheetNavExpanded","menuLabel","searchLabel","activityMode","activityLabel","inboxLabel","messagesLabel","agentsLabel","helpLabel","searchDot","activityDot","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","activity","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 /** Render Activity directly, or retain the optional grouped Inbox destination. */\n @Prop() activityMode: 'direct' | 'inbox' = 'direct';\n @Prop() activityLabel: string = 'Activity';\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() activityDot: 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 const activity =\n this.activityMode === 'direct'\n ? {\n id: 'activity' as const,\n icon: 'Bell',\n label: this.activityLabel,\n dot: this.activityDot,\n }\n : {\n id: 'inbox' as const,\n icon: 'Inbox',\n label: this.inboxLabel,\n dot: this.inboxDot,\n };\n\n return [\n currentArea,\n { id: 'search', icon: 'MagnifyingGlass', label: this.searchLabel, dot: this.searchDot },\n activity,\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 +0,0 @@
1
- {"version":3,"names":["INSET_ACTION_SIZE","lg","md","sm","xs","ChoiceSearch","size","value","placeholder","ariaLabel","controls","activeDescendant","disabled","inputRef","clearLabel","onValueChange","onClear","onKeyDown","inputElement","h","class","name","color","CONTROL_TEXT_VARIANT","replace","ref","element","type","onInput","event","target","label","side","variant","icon","hasBorder","rounded","onDsChange","stopPropagation","onDsClick","requestAnimationFrame","focus","ChoiceFooter","summary","compactSummary","useCompactSummary","contentRef","summaryMeasureRef","clearRef","key","as","onClick","ChoiceActionFooter","onAction","ChoiceOptionRow","id","option","selected","active","focusRingVisible","usesSubtext","leading","supporting","action","actionOpen","popupRole","tabIndex","onFocus","onHover","onSelect","grid","undefined","role","String","isInactive","onMouseDown","preventDefault","onMouseMove","CONTROL_SUPPORTING_TEXT_VARIANT","subtext","trim"],"sources":["src/wc/utils/choice-list-parts.tsx"],"sourcesContent":["import { FunctionalComponent, h, VNode } from '@stencil/core';\nimport type { ChoiceOption } from './choice-list';\nimport {\n CONTROL_SUPPORTING_TEXT_VARIANT,\n CONTROL_TEXT_VARIANT,\n type ControlSize,\n} from './control-text';\n\nconst INSET_ACTION_SIZE: Record<ControlSize, 'md' | 'sm' | 'xs'> = {\n lg: 'md',\n md: 'sm',\n sm: 'xs',\n xs: 'xs',\n};\n\ninterface ChoiceSearchProps {\n size?: ControlSize;\n value: string;\n placeholder: string;\n ariaLabel?: string;\n controls?: string;\n activeDescendant?: string;\n disabled?: boolean;\n inputRef: (element: HTMLInputElement | null) => void;\n clearLabel: string;\n onValueChange: (value: string) => void;\n onClear?: () => void;\n onKeyDown: (event: KeyboardEvent) => void;\n}\n\nexport const ChoiceSearch: FunctionalComponent<ChoiceSearchProps> = ({\n size = 'md',\n value,\n placeholder,\n ariaLabel,\n controls,\n activeDescendant,\n disabled = false,\n inputRef,\n clearLabel,\n onValueChange,\n onClear,\n onKeyDown,\n}) => {\n let inputElement: HTMLInputElement | null = null;\n\n return (\n <div class=\"select-search\">\n <div class={`select-search__control ds-control--${size}`}>\n <ds-icon name=\"MagnifyingGlass\" size={size} color=\"inherit\" />\n <input\n class={`ds-text--${CONTROL_TEXT_VARIANT[size].replace('text-', '')} ds-text--regular`}\n ref={element => {\n inputElement = (element as HTMLInputElement) ?? null;\n inputRef(inputElement);\n }}\n type=\"search\"\n value={value}\n placeholder={placeholder}\n disabled={disabled}\n aria-label={ariaLabel ?? placeholder}\n aria-controls={controls}\n aria-activedescendant={activeDescendant}\n onInput={event => onValueChange((event.target as HTMLInputElement).value)}\n onKeyDown={onKeyDown}\n />\n {value && !disabled && (\n <ds-tooltip\n class=\"select-search__clear-tooltip\"\n label={clearLabel}\n side=\"top\"\n size=\"sm\"\n >\n <ds-button-unfilled\n class=\"select-search__clear\"\n variant=\"icon\"\n size={INSET_ACTION_SIZE[size]}\n icon=\"CrossCircle\"\n hasBorder={false}\n rounded\n ariaLabel={clearLabel}\n onDsChange={event => event.stopPropagation()}\n onDsClick={() => {\n onValueChange('');\n onClear?.();\n requestAnimationFrame(() => inputElement?.focus());\n }}\n />\n </ds-tooltip>\n )}\n </div>\n </div>\n );\n};\n\ninterface ChoiceFooterProps {\n size?: ControlSize;\n clearLabel: string;\n summary?: string;\n compactSummary?: string;\n useCompactSummary?: boolean;\n contentRef?: (element: HTMLDivElement | null) => void;\n summaryMeasureRef?: (element: HTMLElement | null) => void;\n clearRef?: (element: HTMLButtonElement | null) => void;\n onClear: (event: MouseEvent) => void;\n}\n\nexport const ChoiceFooter: FunctionalComponent<ChoiceFooterProps> = ({\n size = 'md',\n clearLabel,\n summary,\n compactSummary,\n useCompactSummary = false,\n contentRef,\n summaryMeasureRef,\n clearRef,\n onClear,\n}) => (\n <div class=\"ds-choice-footer\">\n <div\n ref={element => contentRef?.((element as HTMLDivElement) ?? null)}\n class={`ds-choice-footer__content ds-control--${size}`}\n >\n {summary && [\n <ds-text\n key=\"summary\"\n class=\"ds-choice-footer__summary\"\n as=\"span\"\n variant={CONTROL_TEXT_VARIANT[size]}\n color=\"secondary\"\n >\n {useCompactSummary ? compactSummary ?? summary : summary}\n </ds-text>,\n <ds-text\n key=\"summary-measure\"\n ref={element => summaryMeasureRef?.((element as HTMLElement) ?? null)}\n class=\"ds-choice-footer__summary-measure\"\n as=\"span\"\n variant={CONTROL_TEXT_VARIANT[size]}\n color=\"secondary\"\n aria-hidden=\"true\"\n >\n {summary}\n </ds-text>,\n ]}\n <button\n ref={element => clearRef?.((element as HTMLButtonElement) ?? null)}\n type=\"button\"\n class=\"ds-choice-footer__clear ds-text-action ds-focus-ring\"\n onClick={onClear}\n >\n <ds-text as=\"span\" variant={CONTROL_TEXT_VARIANT[size]} color=\"inherit\">\n {clearLabel}\n </ds-text>\n </button>\n </div>\n </div>\n);\n\ninterface ChoiceActionFooterProps {\n size?: ControlSize;\n label: string;\n onAction: (event: MouseEvent) => void;\n}\n\nexport const ChoiceActionFooter: FunctionalComponent<ChoiceActionFooterProps> = ({\n size = 'md',\n label,\n onAction,\n}) => (\n <div class=\"ds-choice-footer\">\n <div class={`ds-choice-footer__content ds-control--${size}`}>\n <button\n type=\"button\"\n class=\"ds-choice-footer__action ds-text-action ds-focus-ring\"\n onClick={onAction}\n >\n <ds-text as=\"span\" variant={CONTROL_TEXT_VARIANT[size]} color=\"inherit\">\n {label}\n </ds-text>\n </button>\n </div>\n </div>\n);\n\ninterface ChoiceOptionRowProps {\n size?: ControlSize;\n id: string;\n option: ChoiceOption;\n selected: boolean;\n active: boolean;\n focusRingVisible: boolean;\n usesSubtext: boolean;\n leading?: VNode;\n supporting?: VNode;\n action?: VNode;\n actionOpen?: boolean;\n popupRole?: 'listbox' | 'grid';\n tabIndex?: number;\n onFocus?: () => void;\n onKeyDown?: (event: KeyboardEvent) => void;\n onHover: () => void;\n onSelect: () => void;\n}\n\nexport const ChoiceOptionRow: FunctionalComponent<ChoiceOptionRowProps> = ({\n size = 'md',\n id,\n option,\n selected,\n active,\n focusRingVisible,\n usesSubtext,\n leading,\n supporting,\n action,\n actionOpen = false,\n popupRole = 'listbox',\n tabIndex,\n onFocus,\n onKeyDown,\n onHover,\n onSelect,\n}) => {\n const grid = popupRole === 'grid';\n return (\n <div\n id={grid ? id : undefined}\n role={grid ? 'row' : undefined}\n aria-selected={grid ? String(selected) : undefined}\n aria-disabled={grid && option.isInactive ? 'true' : undefined}\n class={{\n 'select-option-row': true,\n 'select-option-row--has-action': !!action,\n 'select-option-row--action-open': actionOpen,\n 'select-option-row--keyboard-active': !!action && active && focusRingVisible,\n }}\n >\n <div\n id={grid ? undefined : id}\n class={{\n 'select-option': true,\n 'ds-choice-item': true,\n 'ds-control-frame': true,\n [`ds-control--${size}`]: true,\n 'ds-focus-ring-inset': true,\n 'ds-focus-ring--visible': active && focusRingVisible,\n 'ds-interaction-fill': !option.isInactive,\n 'ds-interaction-fill--selected': selected && !option.isInactive,\n 'ds-control-inactive': !!option.isInactive,\n 'select-option--active': active,\n }}\n role={grid ? 'gridcell' : 'option'}\n tabIndex={tabIndex}\n aria-selected={grid ? undefined : String(selected)}\n aria-disabled={!grid && option.isInactive ? 'true' : undefined}\n onMouseDown={event => event.preventDefault()}\n onFocus={onFocus}\n onKeyDown={onKeyDown}\n onMouseMove={() => {\n if (!option.isInactive) onHover();\n }}\n onClick={onSelect}\n >\n {leading}\n <div class=\"ds-choice-item__content ds-interaction-fill__content\">\n <ds-text\n class=\"ds-choice-item__label ds-control-label-box\"\n as=\"span\"\n variant={CONTROL_TEXT_VARIANT[size]}\n color={selected ? 'primary' : 'secondary'}\n >\n {option.label}\n </ds-text>\n {supporting ?? (usesSubtext ? (\n <ds-text\n class=\"ds-choice-item__subtext ds-control-label-box\"\n as=\"span\"\n variant={CONTROL_SUPPORTING_TEXT_VARIANT[size]}\n color=\"secondary\"\n >\n {option.subtext?.trim() || '—'}\n </ds-text>\n ) : null)}\n </div>\n </div>\n {action && (\n <div\n class=\"select-option-row__action ds-control-elevation ds-control-elevation--md ds-control-elevation--press-scale\"\n role={grid ? 'gridcell' : undefined}\n >\n {action}\n </div>\n )}\n </div>\n );\n};\n"],"mappings":"0EAQA,MAAMA,EAA6D,CACjEC,GAAI,KACJC,GAAI,KACJC,GAAI,KACJC,GAAI,MAkBC,MAAMC,EAAuD,EAClEC,OAAO,KACPC,QACAC,cACAC,YACAC,WACAC,mBACAC,WAAW,MACXC,WACAC,aACAC,gBACAC,UACAC,gBAEA,IAAIC,EAAwC,KAE5C,OACEC,EAAA,OAAKC,MAAM,iBACTD,EAAA,OAAKC,MAAO,sCAAsCd,KAChDa,EAAA,WAASE,KAAK,kBAAkBf,KAAMA,EAAMgB,MAAM,YAClDH,EAAA,SACEC,MAAO,YAAYG,EAAqBjB,GAAMkB,QAAQ,QAAS,uBAC/DC,IAAKC,IACHR,EAAgBQ,GAAgC,KAChDb,EAASK,EAAa,EAExBS,KAAK,SACLpB,MAAOA,EACPC,YAAaA,EACbI,SAAUA,EAAQ,aACNH,GAAaD,EAAW,gBACrBE,EAAQ,wBACAC,EACvBiB,QAASC,GAASd,EAAec,EAAMC,OAA4BvB,OACnEU,UAAWA,IAEZV,IAAUK,GACTO,EAAA,cACEC,MAAM,+BACNW,MAAOjB,EACPkB,KAAK,MACL1B,KAAK,MAELa,EAAA,sBACEC,MAAM,uBACNa,QAAQ,OACR3B,KAAMN,EAAkBM,GACxB4B,KAAK,cACLC,UAAW,MACXC,QAAO,KACP3B,UAAWK,EACXuB,WAAYR,GAASA,EAAMS,kBAC3BC,UAAW,KACTxB,EAAc,IACdC,MACAwB,uBAAsB,IAAMtB,GAAcuB,SAAQ,MAMxD,EAgBH,MAAMC,EAAuD,EAClEpC,OAAO,KACPQ,aACA6B,UACAC,iBACAC,oBAAoB,MACpBC,aACAC,oBACAC,WACAhC,aAEAG,EAAA,OAAKC,MAAM,oBACTD,EAAA,OACEM,IAAKC,GAAWoB,IAAcpB,GAA8B,MAC5DN,MAAO,yCAAyCd,KAE/CqC,GAAW,CACVxB,EAAA,WACE8B,IAAI,UACJ7B,MAAM,4BACN8B,GAAG,OACHjB,QAASV,EAAqBjB,GAC9BgB,MAAM,aAELuB,EAAoBD,GAAkBD,EAAUA,GAEnDxB,EAAA,WACE8B,IAAI,kBACJxB,IAAKC,GAAWqB,IAAqBrB,GAA2B,MAChEN,MAAM,oCACN8B,GAAG,OACHjB,QAASV,EAAqBjB,GAC9BgB,MAAM,YAAW,cACL,QAEXqB,IAGLxB,EAAA,UACEM,IAAKC,GAAWsB,IAAYtB,GAAiC,MAC7DC,KAAK,SACLP,MAAM,uDACN+B,QAASnC,GAETG,EAAA,WAAS+B,GAAG,OAAOjB,QAASV,EAAqBjB,GAAOgB,MAAM,WAC3DR,MAaJ,MAAMsC,EAAmE,EAC9E9C,OAAO,KACPyB,QACAsB,cAEAlC,EAAA,OAAKC,MAAM,oBACTD,EAAA,OAAKC,MAAO,yCAAyCd,KACnDa,EAAA,UACEQ,KAAK,SACLP,MAAM,wDACN+B,QAASE,GAETlC,EAAA,WAAS+B,GAAG,OAAOjB,QAASV,EAAqBjB,GAAOgB,MAAM,WAC3DS,M,MA2BEuB,EAA6D,EACxEhD,OAAO,KACPiD,KACAC,SACAC,WACAC,SACAC,mBACAC,cACAC,UACAC,aACAC,SACAC,aAAa,MACbC,YAAY,UACZC,WACAC,UACAlD,YACAmD,UACAC,eAEA,MAAMC,EAAOL,IAAc,OAC3B,OACE9C,EAAA,OACEoC,GAAIe,EAAOf,EAAKgB,UAChBC,KAAMF,EAAO,MAAQC,UAAS,gBACfD,EAAOG,OAAOhB,GAAYc,UAAS,gBACnCD,GAAQd,EAAOkB,WAAa,OAASH,UACpDnD,MAAO,CACL,oBAAqB,KACrB,kCAAmC2C,EACnC,iCAAkCC,EAClC,uCAAwCD,GAAUL,GAAUC,IAG9DxC,EAAA,OACEoC,GAAIe,EAAOC,UAAYhB,EACvBnC,MAAO,CACL,gBAAiB,KACjB,iBAAkB,KAClB,mBAAoB,KACpB,CAAC,eAAed,KAAS,KACzB,sBAAuB,KACvB,yBAA0BoD,GAAUC,EACpC,uBAAwBH,EAAOkB,WAC/B,gCAAiCjB,IAAaD,EAAOkB,WACrD,wBAAyBlB,EAAOkB,WAChC,wBAAyBhB,GAE3Bc,KAAMF,EAAO,WAAa,SAC1BJ,SAAUA,EAAQ,gBACHI,EAAOC,UAAYE,OAAOhB,GAAS,iBAClCa,GAAQd,EAAOkB,WAAa,OAASH,UACrDI,YAAa9C,GAASA,EAAM+C,iBAC5BT,QAASA,EACTlD,UAAWA,EACX4D,YAAa,KACX,IAAKrB,EAAOkB,WAAYN,GAAS,EAEnCjB,QAASkB,GAERR,EACD1C,EAAA,OAAKC,MAAM,wDACTD,EAAA,WACEC,MAAM,6CACN8B,GAAG,OACHjB,QAASV,EAAqBjB,GAC9BgB,MAAOmC,EAAW,UAAY,aAE7BD,EAAOzB,OAET+B,IAAeF,EACdzC,EAAA,WACEC,MAAM,+CACN8B,GAAG,OACHjB,QAAS6C,EAAgCxE,GACzCgB,MAAM,aAELkC,EAAOuB,SAASC,QAAU,KAE3B,QAGPjB,GACC5C,EAAA,OACEC,MAAM,4GACNoD,KAAMF,EAAO,WAAaC,WAEzBR,GAGD,S","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"names":["radioCss","radioIdCounter","Radio","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","instanceId","options","value","size","disabled","required","requiredMessage","DEFAULT_REQUIRED_MESSAGE","direction","isInactive","ariaLabel","initialValue","formDisabled","componentWillLoad","syncFormValue","inactive","setFormControlValue","internals","missing","length","setRequiredValidity","formDisabledCallback","formResetCallback","formStateRestoreCallback","state","restoreStringFormState","setFocus","activeItems","find","item","tabIndex","focus","Array","from","el","querySelectorAll","handleKeyDown","e","items","focused","document","activeElement","idx","indexOf","next","key","preventDefault","nextValue","dataset","dsChange","emit","selectItem","optValue","render","invalid","selectedIdx","findIndex","option","firstActiveIdx","focusableIdx","h","Host","role","ariaLabelledby","undefined","class","radio","map","index","isItemInactive","isChecked","tabIdx","labelId","descriptionId","String","description","radio__item","Boolean","onClick","onKeyDown","radio__circle","as","variant","CONTROL_TEXT_VARIANT","textId","label","CONTROL_SUPPORTING_TEXT_VARIANT","color"],"sources":["src/wc/components/Radio/Radio.css?tag=ds-radio&encapsulation=scoped","src/wc/components/Radio/Radio.tsx"],"sourcesContent":["@import '../../utils/control-inactive.css';\n@import '../../utils/control-density.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n@import '../../utils/forced-colors.css';\n\n:host {\n display: flex;\n flex-direction: column;\n gap: var(--dimension-space-025);\n}\n\n:host(.radio--horizontal) {\n flex-direction: row;\n gap: var(--dimension-space-100);\n}\n\n:host(.radio--lg) {\n --_radio-circle: var(--dimension-iconography-md);\n --_radio-dot: calc(var(--dimension-size-base) * 5 / 4);\n --_radio-stroke: var(--dimension-stroke-width-018);\n}\n\n:host(.radio--md) {\n --_radio-circle: var(--dimension-iconography-sm);\n --_radio-dot: var(--dimension-size-100);\n --_radio-stroke: var(--dimension-stroke-width-015);\n}\n\n:host(.radio--sm) {\n --_radio-circle: var(--dimension-iconography-xs);\n --_radio-dot: var(--dimension-size-075);\n --_radio-stroke: var(--dimension-stroke-width-012);\n}\n\n:host(.radio--xs) {\n --_radio-circle: var(--dimension-size-100);\n --_radio-dot: var(--dimension-size-050);\n --_radio-stroke: calc(var(--dimension-stroke-width-base) * 3 / 32);\n}\n\n.radio__item {\n display: inline-flex;\n align-items: center;\n box-sizing: border-box;\n gap: var(--ds-control-gap);\n height: var(--ds-control-height);\n padding: 0 var(--ds-control-padding-inline);\n border-radius: var(--ds-control-radius);\n cursor: default;\n user-select: none;\n}\n\n.radio__item--described {\n height: auto;\n min-height: var(--ds-control-height);\n padding-block: var(--dimension-space-075);\n}\n\n.radio__placement {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: var(--ds-control-icon);\n height: var(--ds-control-icon);\n}\n\n.radio__circle {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: var(--_radio-circle);\n height: var(--_radio-circle);\n border: 0;\n border-radius: var(--dimension-radius-half);\n box-shadow: inset 0 0 0 var(--_radio-stroke) var(--color-foreground-tertiary);\n transition:\n background-color var(--effect-motion-short-2),\n box-shadow var(--effect-motion-short-2);\n}\n\n.radio__circle--checked {\n background-color: var(--color-background-bold-brand);\n box-shadow: none;\n}\n\n.radio__dot {\n width: var(--_radio-dot);\n height: var(--_radio-dot);\n border-radius: var(--dimension-radius-half);\n background-color: var(--color-foreground-on-bold-background-primary);\n}\n\n.radio__copy {\n display: grid;\n flex: 1;\n gap: var(--dimension-space-025);\n min-width: 0;\n padding: 0 var(--ds-control-label-inset);\n}\n\n@media (forced-colors: active) {\n .radio__circle {\n border: var(--_radio-stroke) solid var(--ds-forced-color-content);\n box-shadow: none;\n }\n\n .radio__circle--checked {\n background-color: var(--ds-forced-color-selected);\n border-color: var(--ds-forced-color-selected);\n }\n\n .radio__dot {\n background-color: var(--ds-forced-color-on-selected);\n }\n}\n","import { AttachInternals, Component, Prop, State, Event, EventEmitter, Element, Listen, Method, Watch, h, Host } from '@stencil/core';\nimport {\n CONTROL_SUPPORTING_TEXT_VARIANT,\n CONTROL_TEXT_VARIANT,\n DEFAULT_REQUIRED_MESSAGE,\n restoreStringFormState,\n setFormControlValue,\n setRequiredValidity,\n} from '../../utils';\n\nexport interface RadioOption {\n label: string;\n value: string;\n description?: string;\n isInactive?: boolean;\n}\n\nexport type RadioSize = 'lg' | 'md' | 'sm' | 'xs';\n\nlet radioIdCounter = 0;\n\n@Component({\n tag: 'ds-radio',\n styleUrl: 'Radio.css',\n scoped: true,\n formAssociated: true,\n})\nexport class Radio {\n @Element() el!: HTMLElement;\n @AttachInternals() internals!: ElementInternals;\n\n private readonly instanceId = ++radioIdCounter;\n\n /** Visible choices in this one-of-many set. */\n @Prop() options: RadioOption[] = [];\n /** Selected option value. */\n @Prop({ mutable: true }) value: string = '';\n /** Visual and placement density for every option. */\n @Prop() size: RadioSize = 'md';\n /** Native form field name. */\n @Prop({ reflect: true }) name: string | undefined;\n /** Associates the radio set with a form by id when rendered outside that form. */\n @Prop({ reflect: true }) form: string | undefined;\n /** Native disabled state for the complete set. */\n @Prop({ reflect: true }) disabled: boolean = false;\n /** Require one option to be selected for form validity. */\n @Prop({ reflect: true }) required: boolean = false;\n /** Validation message used when a required set has no selection. */\n @Prop() requiredMessage: string = DEFAULT_REQUIRED_MESSAGE;\n /** Layout direction for the option set. */\n @Prop() direction: 'vertical' | 'horizontal' = 'vertical';\n /** Design-system inactive state for the complete set. */\n @Prop() isInactive: boolean = false;\n /** Accessible name when visible group labeling is unavailable. */\n @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n /** Id reference for a visible group label. */\n @Prop({ attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined;\n\n /** Emitted after user selection with the selected option value. */\n @Event() dsChange!: EventEmitter<string>;\n\n private initialValue = '';\n @State() private formDisabled = false;\n\n componentWillLoad() {\n this.initialValue = this.value;\n this.syncFormValue();\n }\n\n @Watch('value')\n @Watch('disabled')\n @Watch('isInactive')\n @Watch('required')\n syncFormValue() {\n const inactive = this.isInactive || this.disabled || this.formDisabled;\n setFormControlValue(this.internals, this.value, { inactive });\n const missing = this.required && !inactive && this.value.length === 0;\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.value = this.initialValue;\n }\n\n formStateRestoreCallback(state: string | File | FormData | null) {\n this.value = restoreStringFormState(state);\n }\n\n /** Focus the selected option, or the first active option when nothing is selected. */\n @Method()\n async setFocus() {\n this.activeItems.find(item => item.tabIndex === 0)?.focus();\n }\n\n private get activeItems(): HTMLElement[] {\n return Array.from(this.el.querySelectorAll<HTMLElement>('[data-radio-item]:not([data-inactive])'));\n }\n\n @Listen('keydown')\n handleKeyDown(e: KeyboardEvent) {\n const items = this.activeItems;\n if (!items.length) return;\n\n const focused = items.find(item => item === document.activeElement);\n if (!focused) return;\n\n const idx = items.indexOf(focused);\n let next = -1;\n\n switch (e.key) {\n case 'ArrowDown':\n case 'ArrowRight':\n e.preventDefault();\n next = (idx + 1) % items.length;\n break;\n case 'ArrowUp':\n case 'ArrowLeft':\n e.preventDefault();\n next = (idx - 1 + items.length) % items.length;\n break;\n case 'Home':\n e.preventDefault();\n next = 0;\n break;\n case 'End':\n e.preventDefault();\n next = items.length - 1;\n break;\n }\n\n if (next >= 0) {\n items[next].focus();\n const nextValue = items[next].dataset['value'];\n if (nextValue && nextValue !== this.value) {\n this.value = nextValue;\n this.dsChange.emit(nextValue);\n }\n }\n }\n\n private selectItem(optValue: string) {\n if (this.isInactive || this.disabled || this.formDisabled) return;\n if (optValue !== this.value) {\n this.value = optValue;\n this.dsChange.emit(optValue);\n }\n }\n\n render() {\n const inactive = this.isInactive || this.disabled || this.formDisabled;\n const invalid = this.required && !inactive && this.value.length === 0;\n const selectedIdx = this.options.findIndex(option => option.value === this.value);\n const firstActiveIdx = this.options.findIndex(option => !inactive && !option.isInactive);\n const focusableIdx = selectedIdx >= 0 && !inactive && !this.options[selectedIdx]?.isInactive\n ? selectedIdx\n : firstActiveIdx;\n\n return (\n <Host\n role=\"radiogroup\"\n aria-label={this.ariaLabel}\n aria-labelledby={this.ariaLabelledby}\n aria-required={this.required ? 'true' : undefined}\n aria-invalid={invalid ? 'true' : undefined}\n class={{\n radio: true,\n 'radio--horizontal': this.direction === 'horizontal',\n [`radio--${this.size}`]: true,\n }}\n >\n {this.options.map((option, index) => {\n const isItemInactive = inactive || !!option.isInactive;\n const isChecked = option.value === this.value;\n const tabIdx = isItemInactive ? -1 : index === focusableIdx ? 0 : -1;\n const labelId = `ds-radio-${this.instanceId}-label-${index}`;\n const descriptionId = `ds-radio-${this.instanceId}-description-${index}`;\n\n return (\n <div\n key={option.value}\n role=\"radio\"\n aria-checked={String(isChecked)}\n aria-disabled={isItemInactive ? 'true' : undefined}\n aria-labelledby={labelId}\n aria-describedby={option.description ? descriptionId : undefined}\n tabIndex={tabIdx}\n data-radio-item\n data-value={option.value}\n data-inactive={isItemInactive || undefined}\n class={{\n radio__item: true,\n 'radio__item--described': Boolean(option.description),\n [`ds-control--${this.size}`]: true,\n 'ds-control-inactive': isItemInactive,\n 'ds-focus-ring-inset': !isItemInactive,\n 'ds-interaction-fill': !isItemInactive,\n }}\n onClick={() => !isItemInactive && this.selectItem(option.value)}\n onKeyDown={(e: KeyboardEvent) => {\n if ((e.key === ' ' || e.key === 'Enter') && !isItemInactive) {\n e.preventDefault();\n this.selectItem(option.value);\n }\n }}\n >\n <span class=\"radio__placement ds-interaction-fill__content\" aria-hidden=\"true\">\n <span class={{ radio__circle: true, 'radio__circle--checked': isChecked }}>\n {isChecked && <span class=\"radio__dot\" />}\n </span>\n </span>\n <span class=\"radio__copy ds-interaction-fill__content\">\n <ds-text\n class=\"radio__label\"\n as=\"span\"\n variant={CONTROL_TEXT_VARIANT[this.size]}\n textId={labelId}\n >\n {option.label}\n </ds-text>\n {option.description ? (\n <ds-text\n as=\"span\"\n variant={CONTROL_SUPPORTING_TEXT_VARIANT[this.size]}\n color=\"secondary\"\n textId={descriptionId}\n >\n {option.description}\n </ds-text>\n ) : null}\n </span>\n </div>\n );\n })}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"names":["agentSourceListCss","AgentSourceList","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","items","heading","open","hostname","href","URL","render","length","h","Host","class","onToggle","event","dsOpenChange","emit","currentTarget","name","size","color","variant","emphasis","map","source","resolveSafeUrl","url","target","rel","title","description"],"sources":["src/wc/components/AgentSourceList/AgentSourceList.css?tag=ds-agent-source-list&encapsulation=scoped","src/wc/components/AgentSourceList/AgentSourceList.tsx"],"sourcesContent":["@import '../../utils/text-decoration.css';\n\n:host { display: block; }\n.agent-sources { border-block-start: var(--dimension-stroke-width-012) solid var(--color-border-tertiary); }\nsummary { align-items: center; cursor: default; display: flex; gap: var(--dimension-space-050); list-style: none; padding-block: var(--dimension-space-075); }\nsummary::-webkit-details-marker { display: none; }\ndetails[open] summary ds-icon { transform: rotate(90deg); }\nol { display: grid; gap: var(--dimension-space-075); margin: 0; padding: 0 0 var(--dimension-space-075) var(--dimension-space-150); }\nli { display: grid; gap: var(--dimension-space-025); }\na { --ds-text-decoration-color: var(--color-foreground-tertiary); align-items: center; color: inherit; display: inline-flex; gap: var(--dimension-space-025); width: fit-content; }\n\n@media (prefers-reduced-motion: no-preference) { summary ds-icon { transition: transform var(--effect-motion-short-2); } }\n","import { Component, Event, EventEmitter, Prop, h, Host } from '@stencil/core';\nimport { resolveSafeUrl } from '../../utils';\nimport type { AgentSource } from '../conversation-types';\n\n@Component({ tag: 'ds-agent-source-list', styleUrl: 'AgentSourceList.css', scoped: true })\nexport class AgentSourceList {\n @Prop() items: AgentSource[] = [];\n @Prop() heading: string = 'Sources';\n @Prop() open: boolean = false;\n\n @Event() dsOpenChange!: EventEmitter<{ open: boolean }>;\n\n private hostname(href: string): string {\n try {\n return new URL(href).hostname;\n } catch {\n return '';\n }\n }\n\n render() {\n if (!this.items.length) return null;\n return (\n <Host>\n <details\n class=\"agent-sources\"\n open={this.open}\n onToggle={(event: Event) =>\n this.dsOpenChange.emit({\n open: (event.currentTarget as HTMLDetailsElement).open,\n })\n }\n >\n <summary>\n <ds-icon name=\"ChevronRight\" size=\"xs\" color=\"inherit\" />\n <ds-text variant=\"text-body-small\" emphasis>{this.heading} · {this.items.length}</ds-text>\n </summary>\n <ol>\n {this.items.map(source => {\n const href = resolveSafeUrl(source.url);\n const hostname = href ? this.hostname(href) : '';\n return <li>\n {href\n ? <a\n class=\"ds-text-decoration\"\n href={href}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n aria-label={`${source.title} (${hostname}, opens in a new tab)`}\n ><ds-text variant=\"text-body-small\" emphasis>{source.title}</ds-text><ds-icon name=\"ExternalLink\" size=\"xs\" color=\"inherit\" /></a>\n : <ds-text variant=\"text-body-small\" emphasis>{source.title}</ds-text>}\n {hostname ? <ds-text variant=\"text-caption\" color=\"secondary\">{hostname}</ds-text> : null}\n {source.description ? <ds-text variant=\"text-body-small\" color=\"secondary\">{source.description}</ds-text> : null}\n </li>;\n })}\n </ol>\n </details>\n </Host>\n );\n }\n}\n"],"mappings":"8KAAA,MAAMA,EAAqB,IAAM,mnF,MCKpBC,EAAeC,EAAA,MAAAD,UAAAE,EAD5B,WAAAC,CAAAC,G,uFAEUC,KAAAC,MAAuB,GACvBD,KAAAE,QAAkB,UAClBF,KAAAG,KAAgB,KAoDzB,CAhDS,QAAAC,CAASC,GACf,IACE,OAAO,IAAIC,IAAID,GAAMD,Q,CACrB,MACA,MAAO,E,EAIX,MAAAG,GACE,IAAKP,KAAKC,MAAMO,OAAQ,OAAO,KAC/B,OACEC,EAACC,EAAI,KACHD,EAAA,WACEE,MAAM,gBACNR,KAAMH,KAAKG,KACXS,SAAWC,GACTb,KAAKc,aAAaC,KAAK,CACrBZ,KAAOU,EAAMG,cAAqCb,QAItDM,EAAA,eACEA,EAAA,WAASQ,KAAK,eAAeC,KAAK,KAAKC,MAAM,YAC7CV,EAAA,WAASW,QAAQ,kBAAkBC,SAAQ,MAAErB,KAAKE,QAAO,MAAKF,KAAKC,MAAMO,SAE3EC,EAAA,UACGT,KAAKC,MAAMqB,KAAIC,IACd,MAAMlB,EAAOmB,EAAeD,EAAOE,KACnC,MAAMrB,EAAWC,EAAOL,KAAKI,SAASC,GAAQ,GAC9C,OAAOI,EAAA,UACJJ,EACGI,EAAA,KACEE,MAAM,qBACNN,KAAMA,EACNqB,OAAO,SACPC,IAAI,sBAAqB,aACb,GAAGJ,EAAOK,UAAUxB,0BACjCK,EAAA,WAASW,QAAQ,kBAAkBC,SAAQ,MAAEE,EAAOK,OAAgBnB,EAAA,WAASQ,KAAK,eAAeC,KAAK,KAAKC,MAAM,aAClHV,EAAA,WAASW,QAAQ,kBAAkBC,SAAQ,MAAEE,EAAOK,OACvDxB,EAAWK,EAAA,WAASW,QAAQ,eAAeD,MAAM,aAAaf,GAAsB,KACpFmB,EAAOM,YAAcpB,EAAA,WAASW,QAAQ,kBAAkBD,MAAM,aAAaI,EAAOM,aAAyB,KACzG,M","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- import{p as t,H as e,h as s,a as r,t as i}from"./index.js";function d(t){return`ds-text--${t.replace(/^text-/,"")}`}function a(t){return t==="span"||t==="label"?"ds-text--inline-box":"ds-text--block-box"}const o=()=>`.ds-text--display-medium.sc-ds-text-h,.ds-text--display-medium.sc-ds-text{font-size:var(--typography-fontsize-3xl);line-height:var(--typography-lineheight-3xl)}.ds-text--display-small.sc-ds-text-h,.ds-text--display-small.sc-ds-text{font-size:var(--typography-fontsize-2xl);line-height:var(--typography-lineheight-2xl)}.ds-text--title-large.sc-ds-text-h,.ds-text--title-large.sc-ds-text{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl)}.ds-text--title-medium.sc-ds-text-h,.ds-text--title-medium.sc-ds-text{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--title-small.sc-ds-text-h,.ds-text--title-small.sc-ds-text{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-large.sc-ds-text-h,.ds-text--body-large.sc-ds-text{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--body-medium.sc-ds-text-h,.ds-text--body-medium.sc-ds-text{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-small.sc-ds-text-h,.ds-text--body-small.sc-ds-text{font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm)}.ds-text--caption.sc-ds-text-h,.ds-text--caption.sc-ds-text{font-size:var(--typography-fontsize-xs);line-height:var(--typography-lineheight-xs);text-transform:uppercase}.ds-text--display-medium.ds-text--emphasis.sc-ds-text-h,.ds-text--display-small.ds-text--emphasis.sc-ds-text-h,.ds-text--display-medium.ds-text--emphasis.sc-ds-text,.ds-text--display-small.ds-text--emphasis.sc-ds-text{font-weight:var(--typography-weight-bold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--display-medium.ds-text--regular.sc-ds-text-h,.ds-text--display-small.ds-text--regular.sc-ds-text-h,.ds-text--display-medium.ds-text--regular.sc-ds-text,.ds-text--display-small.ds-text--regular.sc-ds-text{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-large.ds-text--emphasis.sc-ds-text-h,.ds-text--title-large.ds-text--emphasis.sc-ds-text{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--title-large.ds-text--regular.sc-ds-text-h,.ds-text--title-large.ds-text--regular.sc-ds-text{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--emphasis.sc-ds-text-h,.ds-text--title-small.ds-text--emphasis.sc-ds-text-h,.ds-text--title-medium.ds-text--emphasis.sc-ds-text,.ds-text--title-small.ds-text--emphasis.sc-ds-text{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--regular.sc-ds-text-h,.ds-text--title-small.ds-text--regular.sc-ds-text-h,.ds-text--title-medium.ds-text--regular.sc-ds-text,.ds-text--title-small.ds-text--regular.sc-ds-text{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-large.ds-text--emphasis.sc-ds-text-h,.ds-text--body-medium.ds-text--emphasis.sc-ds-text-h,.ds-text--body-large.ds-text--emphasis.sc-ds-text,.ds-text--body-medium.ds-text--emphasis.sc-ds-text{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--body-large.ds-text--regular.sc-ds-text-h,.ds-text--body-medium.ds-text--regular.sc-ds-text-h,.ds-text--body-large.ds-text--regular.sc-ds-text,.ds-text--body-medium.ds-text--regular.sc-ds-text{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--emphasis.sc-ds-text-h,.ds-text--body-small.ds-text--emphasis.sc-ds-text{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--regular.sc-ds-text-h,.ds-text--body-small.ds-text--regular.sc-ds-text{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-none)}.ds-text--caption.ds-text--emphasis.sc-ds-text-h,.ds-text--caption.ds-text--emphasis.sc-ds-text{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-positive)}.ds-text--caption.ds-text--regular.sc-ds-text-h,.ds-text--caption.ds-text--regular.sc-ds-text{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-positive)}@media (forced-colors: active){.sc-ds-text:root,.sc-ds-text-h,.ds-forced-colors-scope.sc-ds-text{--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}}@keyframes ds-shimmer-text-motion{0%{background-position:100% 0}76.923%{background-position:0 0}100%{background-position:0 0}}@keyframes ds-shimmer-surface-motion{0%{background-position:100% 0}76.923%{background-position:0 0}100%{background-position:0 0}}.ds-shimmer-text.sc-ds-text{--ds-shimmer-base:currentColor;--ds-shimmer-duration:var(--effect-animation-duration-long-2);--ds-shimmer-repeat-delay:var(--effect-animation-delay-short-3);--ds-shimmer-cycle-duration:calc( var(--ds-shimmer-duration) + var(--ds-shimmer-repeat-delay) );--ds-shimmer-easing:var(--effect-animation-easing-linear);--ds-shimmer-spread:var(--dimension-size-500);--ds-shimmer-travel:calc( var(--dimension-size-800) + var(--dimension-size-500) + var(--dimension-size-200) );background-color:var(--ds-shimmer-base);background-image:linear-gradient( 330deg, transparent calc(50% - var(--ds-shimmer-spread)), var(--ds-shimmer, var(--color-shimmer-shimmer)) 50%, transparent calc(50% + var(--ds-shimmer-spread)) );background-repeat:no-repeat;background-position:100% 0;background-size:calc( 200% + var(--ds-shimmer-spread) * 2 + var(--ds-shimmer-travel) * 2 ) 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:ds-shimmer-text-motion var(--ds-shimmer-cycle-duration) var(--ds-shimmer-easing) infinite}.ds-shimmer-surface.sc-ds-text{--ds-shimmer-surface-base:var(--color-foreground-quaternary);--ds-shimmer-duration:var(--effect-animation-duration-long-2);--ds-shimmer-repeat-delay:var(--effect-animation-delay-short-3);--ds-shimmer-cycle-duration:calc( var(--ds-shimmer-duration) + var(--ds-shimmer-repeat-delay) );--ds-shimmer-easing:var(--effect-animation-easing-linear);--ds-shimmer-spread:var(--dimension-size-500);--ds-shimmer-travel:calc( var(--dimension-size-800) + var(--dimension-size-500) + var(--dimension-size-200) );position:relative;overflow:hidden;background-color:var(--ds-shimmer-surface-base)}.ds-shimmer-surface.sc-ds-text::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient( 330deg, transparent calc(50% - var(--ds-shimmer-spread)), var(--ds-shimmer, var(--color-shimmer-shimmer)) 50%, transparent calc(50% + var(--ds-shimmer-spread)) );background-repeat:no-repeat;background-position:100% 0;background-size:calc( 200% + var(--ds-shimmer-spread) * 2 + var(--ds-shimmer-travel) * 2 ) 100%;animation:ds-shimmer-surface-motion var(--ds-shimmer-cycle-duration) var(--ds-shimmer-easing) infinite}@media (prefers-reduced-motion: reduce){.ds-shimmer-text.sc-ds-text{animation:none;background-image:none;-webkit-text-fill-color:currentColor}.ds-shimmer-surface.sc-ds-text::after{display:none;animation:none}}@media (forced-colors: active){.ds-shimmer-text.sc-ds-text{animation:none;background-image:none;-webkit-text-fill-color:currentColor}.ds-shimmer-surface.sc-ds-text{background-color:var(--ds-forced-color-disabled)}.ds-shimmer-surface.sc-ds-text::after{display:none;animation:none}}.sc-ds-text-h{box-sizing:border-box;max-width:100%;min-width:0;margin:0;padding:0;border:0;font-family:var(--typography-font-family-ui)}.sc-ds-text-h:where(.ds-text--inline-box){display:inline-block}.sc-ds-text-h:where(.ds-text--block-box){display:block;width:100%}.ds-text__element.sc-ds-text{display:block;box-sizing:border-box;width:100%;min-width:0;margin:0;padding:0;border:0;font:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;text-transform:inherit;text-align:inherit;text-decoration:inherit;text-underline-offset:inherit;font-style:inherit;font-variant-numeric:inherit;font-feature-settings:inherit;-webkit-user-select:inherit;user-select:inherit;white-space:inherit;text-wrap:inherit;overflow-wrap:inherit;word-break:inherit;overflow:inherit;text-overflow:inherit}.ds-text--truncate-1.sc-ds-text-h{overflow:hidden}.ds-text--truncate-1.sc-ds-text-h .ds-text__element.sc-ds-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ds-text--truncate-2.sc-ds-text-h,.ds-text--truncate-3.sc-ds-text-h,.ds-text--truncate-4.sc-ds-text-h,.ds-text--truncate-5.sc-ds-text-h{overflow:hidden}.ds-text--truncate-2.sc-ds-text-h .ds-text__element.sc-ds-text,.ds-text--truncate-3.sc-ds-text-h .ds-text__element.sc-ds-text,.ds-text--truncate-4.sc-ds-text-h .ds-text__element.sc-ds-text,.ds-text--truncate-5.sc-ds-text-h .ds-text__element.sc-ds-text{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-break:break-word}.ds-text--truncate-2.sc-ds-text-h .ds-text__element.sc-ds-text{-webkit-line-clamp:2}.ds-text--truncate-3.sc-ds-text-h .ds-text__element.sc-ds-text{-webkit-line-clamp:3}.ds-text--truncate-4.sc-ds-text-h .ds-text__element.sc-ds-text{-webkit-line-clamp:4}.ds-text--truncate-5.sc-ds-text-h .ds-text__element.sc-ds-text{-webkit-line-clamp:5}.ds-text--nowrap.sc-ds-text-h,.ds-text--nowrap.sc-ds-text-h .ds-text__element.sc-ds-text{white-space:nowrap;word-break:normal;overflow:hidden;text-overflow:ellipsis;min-width:0}.ds-text--balance.sc-ds-text-h,.ds-text--balance.sc-ds-text-h .ds-text__element.sc-ds-text{text-wrap:balance}.ds-text--pretty.sc-ds-text-h,.ds-text--pretty.sc-ds-text-h .ds-text__element.sc-ds-text{text-wrap:pretty}.ds-text--color-primary.sc-ds-text-h{color:var(--color-foreground-primary)}.ds-text--color-secondary.sc-ds-text-h{color:var(--color-foreground-secondary)}.ds-text--color-tertiary.sc-ds-text-h{color:var(--color-foreground-tertiary)}.ds-text--color-quaternary.sc-ds-text-h{color:var(--color-foreground-quaternary)}.ds-text--color-brand.sc-ds-text-h{color:var(--color-foreground-bold-brand)}.ds-text--color-negative.sc-ds-text-h{color:var(--color-foreground-bold-negative)}.ds-text--color-positive.sc-ds-text-h{color:var(--color-foreground-bold-positive)}.ds-text--color-warning.sc-ds-text-h{color:var(--color-foreground-bold-warning)}.ds-text--color-caution.sc-ds-text-h{color:var(--color-foreground-bold-caution)}.ds-text--color-ai.sc-ds-text-h{color:var(--color-foreground-bold-ai)}.ds-text--color-on-strong.sc-ds-text-h{color:var(--color-foreground-on-strong-background-primary)}.ds-text--color-on-bold.sc-ds-text-h{color:var(--color-foreground-on-bold-background-primary)}.ds-text--decoration-underline.sc-ds-text-h,.ds-text--decoration-dotted-underline.sc-ds-text-h{text-decoration-color:var(--ds-text-decoration-color, var(--color-foreground-tertiary));text-decoration-thickness:var(--ds-text-decoration-thickness, var(--dimension-stroke-width-012));text-underline-offset:var(--ds-text-decoration-offset, var(--dimension-space-025))}.ds-text--decoration-underline.sc-ds-text-h{text-decoration-line:underline}.ds-text--decoration-dotted-underline.sc-ds-text-h{text-decoration-line:underline;text-decoration-style:dotted}.ds-text--italic.sc-ds-text-h{font-style:italic}.ds-text--font-feature-tabular-nums.sc-ds-text-h{font-variant-numeric:tabular-nums;font-feature-settings:'tnum'}.ds-text--align-left.sc-ds-text-h{text-align:left}.ds-text--align-center.sc-ds-text-h{text-align:center}.ds-text--align-right.sc-ds-text-h{text-align:right}`;const n=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.variant="text-body-medium";this.emphasis=false;this.color="inherit";this.italic=false;this.shimmer=false;this.lineTruncation="none";this.fontFeature="normal";this.as="p"}render(){const t=this.as;const e=t=>typeof t==="string"&&t.startsWith("var(--");const i=Number(this.lineTruncation);const o={"ds-text":true,[a(this.as)]:true,[d(this.variant)]:true,"ds-text--emphasis":this.emphasis,"ds-text--regular":!this.emphasis,"ds-text--nowrap":this.wrap==="nowrap","ds-text--balance":this.wrap==="balance","ds-text--pretty":this.wrap==="pretty","ds-text--truncate-1":i===1&&this.wrap!=="nowrap","ds-text--truncate-2":i===2&&this.wrap!=="nowrap","ds-text--truncate-3":i===3&&this.wrap!=="nowrap","ds-text--truncate-4":i===4&&this.wrap!=="nowrap","ds-text--truncate-5":i===5&&this.wrap!=="nowrap","ds-text--color-primary":this.color==="primary","ds-text--color-secondary":this.color==="secondary","ds-text--color-tertiary":this.color==="tertiary","ds-text--color-quaternary":this.color==="quaternary","ds-text--color-brand":this.color==="brand","ds-text--color-negative":this.color==="negative","ds-text--color-positive":this.color==="positive","ds-text--color-warning":this.color==="warning","ds-text--color-caution":this.color==="caution","ds-text--color-ai":this.color==="ai","ds-text--color-on-strong":this.color==="on-strong","ds-text--color-on-bold":this.color==="on-bold","ds-text--color-inherit":this.color==="inherit","ds-text--decoration-underline":this.decoration==="underline","ds-text--decoration-dotted-underline":this.decoration==="dotted-underline","ds-text--italic":this.italic,"ds-text--align-left":this.align==="left","ds-text--align-center":this.align==="center","ds-text--align-right":this.align==="right","ds-text--font-feature-tabular-nums":this.fontFeature==="tabular-nums"};const n=this.color&&e(this.color)?{color:this.color}:undefined;const c={};if(this.as==="label"&&this.for)c["for"]=this.for;if(this.textId)c["id"]=this.textId;return s(r,{key:"d23be6df058b95db801969b0f84460b6e63dba05",class:o,style:n},s(t,{key:"110af41049c4355cbd8c83057a06c4305f79dcd1",class:{"ds-text__element":true,"ds-shimmer-text":this.shimmer},...c},s("slot",{key:"08047bf24986f8192295b977cde7ed99931b2ef1"})))}static get style(){return o()}},[262,"ds-text",{variant:[1],emphasis:[4],color:[1],decoration:[1],italic:[4],shimmer:[4],align:[1],lineTruncation:[8,"line-truncation"],wrap:[1],fontFeature:[1,"font-feature"],as:[1],for:[1],textId:[1,"text-id"]}]);function c(){if(typeof customElements==="undefined"){return}const t=["ds-text"];t.forEach((t=>{switch(t){case"ds-text":if(!customElements.get(i(t))){customElements.define(i(t),n)}break}}))}c();export{n as T,c as d};
2
- //# sourceMappingURL=p-CAnnQL1F.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["textVariantClass","variant","replace","textDisplayClass","element","textCss","Text","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","emphasis","color","italic","shimmer","lineTruncation","fontFeature","as","render","Tag","isCustomColor","c","startsWith","truncationLines","Number","cls","wrap","decoration","align","style","undefined","extraProps","for","textId","h","Host","key","class"],"sources":["src/wc/components/Text/text-utils.ts","src/wc/components/Text/Text.css?tag=ds-text&encapsulation=scoped","src/wc/components/Text/Text.tsx"],"sourcesContent":["import type { TextElement, TextVariant } from './text-types';\n\n/** `text-body-medium` → `ds-text--body-medium` */\nexport function textVariantClass(variant: TextVariant): string {\n return `ds-text--${variant.replace(/^text-/, '')}`;\n}\n\n/** Inline semantics get a measurable inline box; paragraphs/headings get a block box. */\nexport function textDisplayClass(element: TextElement): string {\n return element === 'span' || element === 'label'\n ? 'ds-text--inline-box'\n : 'ds-text--block-box';\n}\n","@import '../../utils/typography.css';\n@import '../../utils/shimmer.css';\n\n:host {\n box-sizing: border-box;\n max-width: 100%;\n min-width: 0;\n margin: 0;\n padding: 0;\n border: 0;\n font-family: var(--typography-font-family-ui);\n}\n\n:host(:where(.ds-text--inline-box)) {\n display: inline-block;\n}\n\n:host(:where(.ds-text--block-box)) {\n display: block;\n width: 100%;\n}\n\n/*\n * The host is the measurable typography box. The semantic inner element fills\n * it and inherits every text metric without adding margins, padding, or its own\n * line-height strut. One rendered line therefore measures exactly one token\n * line-height; N lines measure N × that token.\n */\n.ds-text__element {\n display: block;\n box-sizing: border-box;\n width: 100%;\n min-width: 0;\n margin: 0;\n padding: 0;\n border: 0;\n font: inherit;\n line-height: inherit;\n letter-spacing: inherit;\n color: inherit;\n text-transform: inherit;\n text-align: inherit;\n text-decoration: inherit;\n text-underline-offset: inherit;\n font-style: inherit;\n font-variant-numeric: inherit;\n font-feature-settings: inherit;\n -webkit-user-select: inherit;\n user-select: inherit;\n white-space: inherit;\n text-wrap: inherit;\n overflow-wrap: inherit;\n word-break: inherit;\n /* Consumer truncation on the host (PanelNav, ChartLegend, …) must reach the\n text node — overflow/text-overflow are not inherited by default. */\n overflow: inherit;\n text-overflow: inherit;\n}\n\n/* ── Truncation ─────────────────────────────────────────────────────────── */\n\n:host(.ds-text--truncate-1) {\n overflow: hidden;\n}\n\n:host(.ds-text--truncate-1) .ds-text__element {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n:host(.ds-text--truncate-2),\n:host(.ds-text--truncate-3),\n:host(.ds-text--truncate-4),\n:host(.ds-text--truncate-5) {\n overflow: hidden;\n}\n\n:host(.ds-text--truncate-2) .ds-text__element,\n:host(.ds-text--truncate-3) .ds-text__element,\n:host(.ds-text--truncate-4) .ds-text__element,\n:host(.ds-text--truncate-5) .ds-text__element {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n word-break: break-word;\n}\n\n:host(.ds-text--truncate-2) .ds-text__element { -webkit-line-clamp: 2; }\n:host(.ds-text--truncate-3) .ds-text__element { -webkit-line-clamp: 3; }\n:host(.ds-text--truncate-4) .ds-text__element { -webkit-line-clamp: 4; }\n:host(.ds-text--truncate-5) .ds-text__element { -webkit-line-clamp: 5; }\n\n/* ── Wrap ───────────────────────────────────────────────────────────────── */\n\n:host(.ds-text--nowrap),\n:host(.ds-text--nowrap) .ds-text__element {\n white-space: nowrap;\n word-break: normal;\n overflow: hidden;\n text-overflow: ellipsis;\n min-width: 0;\n}\n\n:host(.ds-text--balance),\n:host(.ds-text--balance) .ds-text__element { text-wrap: balance; }\n\n:host(.ds-text--pretty),\n:host(.ds-text--pretty) .ds-text__element { text-wrap: pretty; }\n\n/* ── Color ──────────────────────────────────────────────────────────────── */\n\n:host(.ds-text--color-primary) { color: var(--color-foreground-primary); }\n:host(.ds-text--color-secondary) { color: var(--color-foreground-secondary); }\n:host(.ds-text--color-tertiary) { color: var(--color-foreground-tertiary); }\n:host(.ds-text--color-quaternary) { color: var(--color-foreground-quaternary); }\n:host(.ds-text--color-brand) { color: var(--color-foreground-bold-brand); }\n:host(.ds-text--color-negative) { color: var(--color-foreground-bold-negative); }\n:host(.ds-text--color-positive) { color: var(--color-foreground-bold-positive); }\n:host(.ds-text--color-warning) { color: var(--color-foreground-bold-warning); }\n:host(.ds-text--color-caution) { color: var(--color-foreground-bold-caution); }\n:host(.ds-text--color-ai) { color: var(--color-foreground-bold-ai); }\n:host(.ds-text--color-on-strong) { color: var(--color-foreground-on-strong-background-primary); }\n:host(.ds-text--color-on-bold) { color: var(--color-foreground-on-bold-background-primary); }\n/*\n * The inherit state intentionally has no declaration. `color` inherits\n * naturally, while omitting a host rule lets an owning component apply a\n * semantic token directly to ds-text without depending on stylesheet order.\n */\n\n/* ── Decorations ─────────────────────────────────────────────────────────── */\n\n:host(.ds-text--decoration-underline),\n:host(.ds-text--decoration-dotted-underline) {\n text-decoration-color: var(--ds-text-decoration-color, var(--color-foreground-tertiary));\n text-decoration-thickness: var(--ds-text-decoration-thickness, var(--dimension-stroke-width-012));\n text-underline-offset: var(--ds-text-decoration-offset, var(--dimension-space-025));\n}\n\n:host(.ds-text--decoration-underline) {\n text-decoration-line: underline;\n}\n\n:host(.ds-text--decoration-dotted-underline) {\n text-decoration-line: underline;\n text-decoration-style: dotted;\n}\n\n/* ── Style ──────────────────────────────────────────────────────────────── */\n\n:host(.ds-text--italic) { font-style: italic; }\n\n:host(.ds-text--font-feature-tabular-nums) {\n font-variant-numeric: tabular-nums;\n font-feature-settings: 'tnum';\n}\n\n/* ── Align ──────────────────────────────────────────────────────────────── */\n\n:host(.ds-text--align-left) { text-align: left; }\n:host(.ds-text--align-center) { text-align: center; }\n:host(.ds-text--align-right) { text-align: right; }\n","import { Component, Prop, h, Host } from '@stencil/core';\nimport { textDisplayClass, textVariantClass } from './text-utils';\nimport type {\n TextAlign,\n TextColor,\n TextDecoration,\n TextElement,\n TextFontFeature,\n TextVariant,\n LineTruncation,\n TextWrap,\n} from './text-types';\n\n@Component({\n tag: 'ds-text',\n styleUrl: 'Text.css',\n scoped: true,\n})\nexport class Text {\n @Prop() variant: TextVariant = 'text-body-medium';\n /**\n * Heavier weight + tighter letter-spacing for the variant.\n * `false` (default): one step below emphasis (display semibold, title/body\n * medium, caption medium).\n * `true`: display bold, title/caption semibold, body medium.\n */\n @Prop() emphasis: boolean = false;\n /**\n * Semantic foreground color token or CSS variable. `tertiary` and the\n * still-fainter `quaternary` are restricted to genuinely inactive/disabled\n * UI content or purely decorative content; prefer the owning control's\n * inactive state whenever one exists.\n */\n @Prop() color: TextColor = 'inherit';\n /** Link underline or dotted hidden-interaction affordance; does not add semantics. */\n @Prop() decoration: TextDecoration | undefined;\n @Prop() italic: boolean = false;\n /** Animate the visible glyphs with the shared loading shimmer treatment. */\n @Prop() shimmer: boolean = false;\n @Prop() align: TextAlign | undefined;\n @Prop() lineTruncation: LineTruncation = 'none';\n @Prop() wrap: TextWrap | undefined;\n @Prop() fontFeature: TextFontFeature = 'normal';\n @Prop() as: TextElement = 'p';\n /** Maps to `for` attribute on <label> elements. */\n @Prop() for: string | undefined;\n /** Forwarded to the inner element (e.g. aria-labelledby targets). */\n @Prop() textId: string | undefined;\n\n render() {\n // Polymorphic element: TSX treats a variable tag as a component, so a\n // dynamic intrinsic element name must be cast to `any` to render.\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const Tag = this.as as any;\n const isCustomColor = (c: TextColor) => typeof c === 'string' && c.startsWith('var(--');\n const truncationLines = Number(this.lineTruncation);\n\n const cls: Record<string, boolean> = {\n 'ds-text': true,\n [textDisplayClass(this.as)]: true,\n [textVariantClass(this.variant)]: true,\n 'ds-text--emphasis': this.emphasis,\n 'ds-text--regular': !this.emphasis,\n 'ds-text--nowrap': this.wrap === 'nowrap',\n 'ds-text--balance': this.wrap === 'balance',\n 'ds-text--pretty': this.wrap === 'pretty',\n 'ds-text--truncate-1': truncationLines === 1 && this.wrap !== 'nowrap',\n 'ds-text--truncate-2': truncationLines === 2 && this.wrap !== 'nowrap',\n 'ds-text--truncate-3': truncationLines === 3 && this.wrap !== 'nowrap',\n 'ds-text--truncate-4': truncationLines === 4 && this.wrap !== 'nowrap',\n 'ds-text--truncate-5': truncationLines === 5 && this.wrap !== 'nowrap',\n 'ds-text--color-primary': this.color === 'primary',\n 'ds-text--color-secondary': this.color === 'secondary',\n 'ds-text--color-tertiary': this.color === 'tertiary',\n 'ds-text--color-quaternary': this.color === 'quaternary',\n 'ds-text--color-brand': this.color === 'brand',\n 'ds-text--color-negative': this.color === 'negative',\n 'ds-text--color-positive': this.color === 'positive',\n 'ds-text--color-warning': this.color === 'warning',\n 'ds-text--color-caution': this.color === 'caution',\n 'ds-text--color-ai': this.color === 'ai',\n 'ds-text--color-on-strong': this.color === 'on-strong',\n 'ds-text--color-on-bold': this.color === 'on-bold',\n 'ds-text--color-inherit': this.color === 'inherit',\n 'ds-text--decoration-underline': this.decoration === 'underline',\n 'ds-text--decoration-dotted-underline': this.decoration === 'dotted-underline',\n 'ds-text--italic': this.italic,\n 'ds-text--align-left': this.align === 'left',\n 'ds-text--align-center': this.align === 'center',\n 'ds-text--align-right': this.align === 'right',\n 'ds-text--font-feature-tabular-nums': this.fontFeature === 'tabular-nums',\n };\n\n const style = this.color && isCustomColor(this.color)\n ? { color: this.color as string }\n : undefined;\n\n const extraProps: Record<string, string> = {};\n if (this.as === 'label' && this.for) extraProps['for'] = this.for;\n if (this.textId) extraProps['id'] = this.textId;\n\n return (\n <Host class={cls} style={style}>\n <Tag\n class={{\n 'ds-text__element': true,\n 'ds-shimmer-text': this.shimmer,\n }}\n {...extraProps}\n >\n <slot />\n </Tag>\n </Host>\n );\n }\n}\n"],"mappings":"2DAGM,SAAUA,EAAiBC,GAC/B,MAAO,YAAYA,EAAQC,QAAQ,SAAU,KAC/C,CAGM,SAAUC,EAAiBC,GAC/B,OAAOA,IAAY,QAAUA,IAAY,QACrC,sBACA,oBACN,CCZA,MAAMC,EAAU,IAAM,qnX,MCkBTC,EAAIC,EAAA,MAAAD,UAAAE,EALjB,WAAAC,CAAAC,G,4CAMUC,KAAAV,QAAuB,mBAOvBU,KAAAC,SAAoB,MAOpBD,KAAAE,MAAmB,UAGnBF,KAAAG,OAAkB,MAElBH,KAAAI,QAAmB,MAEnBJ,KAAAK,eAAiC,OAEjCL,KAAAM,YAA+B,SAC/BN,KAAAO,GAAkB,GAwE3B,CAlEC,MAAAC,GAIE,MAAMC,EAAMT,KAAKO,GACjB,MAAMG,EAAiBC,UAAwBA,IAAM,UAAYA,EAAEC,WAAW,UAC9E,MAAMC,EAAkBC,OAAOd,KAAKK,gBAEpC,MAAMU,EAA+B,CACnC,UAAW,KACX,CAACvB,EAAiBQ,KAAKO,KAAM,KAC7B,CAAClB,EAAiBW,KAAKV,UAAW,KAClC,oBAAqBU,KAAKC,SAC1B,oBAAqBD,KAAKC,SAC1B,kBAAmBD,KAAKgB,OAAS,SACjC,mBAAoBhB,KAAKgB,OAAS,UAClC,kBAAmBhB,KAAKgB,OAAS,SACjC,sBAAuBH,IAAoB,GAAKb,KAAKgB,OAAS,SAC9D,sBAAuBH,IAAoB,GAAKb,KAAKgB,OAAS,SAC9D,sBAAuBH,IAAoB,GAAKb,KAAKgB,OAAS,SAC9D,sBAAuBH,IAAoB,GAAKb,KAAKgB,OAAS,SAC9D,sBAAuBH,IAAoB,GAAKb,KAAKgB,OAAS,SAC9D,yBAA4BhB,KAAKE,QAAU,UAC3C,2BAA4BF,KAAKE,QAAU,YAC3C,0BAA4BF,KAAKE,QAAU,WAC3C,4BAA6BF,KAAKE,QAAU,aAC5C,uBAA4BF,KAAKE,QAAU,QAC3C,0BAA4BF,KAAKE,QAAU,WAC3C,0BAA4BF,KAAKE,QAAU,WAC3C,yBAA4BF,KAAKE,QAAU,UAC3C,yBAA4BF,KAAKE,QAAU,UAC3C,oBAA4BF,KAAKE,QAAU,KAC3C,2BAA4BF,KAAKE,QAAU,YAC3C,yBAA4BF,KAAKE,QAAU,UAC3C,yBAA4BF,KAAKE,QAAU,UAC3C,gCAAwCF,KAAKiB,aAAe,YAC5D,uCAAwCjB,KAAKiB,aAAe,mBAC5D,kBAAmBjB,KAAKG,OACxB,sBAAyBH,KAAKkB,QAAU,OACxC,wBAAyBlB,KAAKkB,QAAU,SACxC,uBAAyBlB,KAAKkB,QAAU,QACxC,qCAAsClB,KAAKM,cAAgB,gBAG7D,MAAMa,EAAQnB,KAAKE,OAASQ,EAAcV,KAAKE,OAC3C,CAAEA,MAAOF,KAAKE,OACdkB,UAEJ,MAAMC,EAAqC,GAC3C,GAAIrB,KAAKO,KAAO,SAAWP,KAAKsB,IAAKD,EAAW,OAASrB,KAAKsB,IAC9D,GAAItB,KAAKuB,OAAQF,EAAW,MAAQrB,KAAKuB,OAEzC,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAOZ,EAAKI,MAAOA,GACvBK,EAACf,EAAG,CAAAiB,IAAA,2CACFC,MAAO,CACL,mBAAoB,KACpB,kBAAmB3B,KAAKI,YAEtBiB,GAEJG,EAAA,QAAAE,IAAA,8C","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"names":["SCROLL_OVERLAY_BLOCK_SIZE","SCROLL_OVERLAY_CONTENT_BLOCK_SIZE","SCROLL_OVERLAY_FADE_BLOCK_SIZE","ScrollOverlayController","constructor","options","this","overlayBlockSize","overlayContentBlockSize","fadeBlockSize","connect","resizeObserver","ResizeObserver","sync","onGeometryChange","observe","viewport","content","overlay","disconnect","syncOverlayGeometry","syncFadeWindow","getOverlayBlockSize","getOverlayContentBlockSize","host","overlayRect","getBoundingClientRect","Math","max","ceil","height","assigned","querySelector","overlayContentSelector","style","setProperty","visibleContent","firstElementChild","HTMLElement","topInset","top","fadeLead","resolveCssLengthPx","fadeEnd","scrollTop","clientHeight","fadeStart"],"sources":["src/wc/utils/scroll-overlay-controller.ts"],"sourcesContent":["import { resolveCssLengthPx } from './resolve-css-length-px';\n\nexport const SCROLL_OVERLAY_BLOCK_SIZE = '--ds-scroll-overlay-block-size';\nexport const SCROLL_OVERLAY_CONTENT_BLOCK_SIZE = '--ds-scroll-overlay-content-block-size';\nexport const SCROLL_OVERLAY_FADE_BLOCK_SIZE = '--ds-scroll-overlay-fade-block-size';\n\ninterface ScrollOverlayControllerOptions {\n host: HTMLElement;\n viewport: HTMLElement;\n content: HTMLElement;\n overlay: HTMLElement;\n overlayContentSelector?: string;\n onGeometryChange?: () => void;\n}\n\n/**\n * Keeps a content-owned alpha mask pinned behind a fixed overlay.\n *\n * The mask lives on the long content element so native scrollbars stay outside\n * the fade and the actual parent surface shows through. Its stop positions are\n * therefore expressed in content coordinates and must follow scrollTop.\n */\nexport class ScrollOverlayController {\n private resizeObserver?: ResizeObserver;\n private overlayBlockSize = 0;\n private overlayContentBlockSize = 0;\n private fadeBlockSize = 0;\n\n constructor(private readonly options: ScrollOverlayControllerOptions) {}\n\n connect(): void {\n this.resizeObserver = new ResizeObserver(() => {\n this.sync();\n this.options.onGeometryChange?.();\n });\n this.resizeObserver.observe(this.options.viewport);\n this.resizeObserver.observe(this.options.content);\n this.resizeObserver.observe(this.options.overlay);\n this.sync();\n }\n\n disconnect(): void {\n this.resizeObserver?.disconnect();\n }\n\n sync(): void {\n this.syncOverlayGeometry();\n this.syncFadeWindow();\n }\n\n getOverlayBlockSize(): number {\n return this.overlayBlockSize;\n }\n\n getOverlayContentBlockSize(): number {\n return this.overlayContentBlockSize;\n }\n\n private syncOverlayGeometry(): void {\n const { host, overlay } = this.options;\n const overlayRect = overlay.getBoundingClientRect();\n this.overlayBlockSize = Math.max(Math.ceil(overlayRect.height), 0);\n\n const assigned = host.querySelector<HTMLElement>(\n this.options.overlayContentSelector ?? '[slot=\"overlay\"]',\n );\n if (!assigned) {\n this.overlayBlockSize = 0;\n this.overlayContentBlockSize = 0;\n this.fadeBlockSize = 0;\n host.style.setProperty(SCROLL_OVERLAY_BLOCK_SIZE, '0px');\n host.style.setProperty(SCROLL_OVERLAY_CONTENT_BLOCK_SIZE, '0px');\n host.style.setProperty(SCROLL_OVERLAY_FADE_BLOCK_SIZE, '0px');\n return;\n }\n\n const visibleContent =\n assigned.firstElementChild instanceof HTMLElement ? assigned.firstElementChild : assigned;\n const topInset = Math.max(\n Math.ceil(visibleContent.getBoundingClientRect().top - overlayRect.top),\n 0,\n );\n this.overlayContentBlockSize = Math.max(this.overlayBlockSize - topInset, 0);\n const fadeLead = resolveCssLengthPx('var(--dimension-space-100)', 8);\n this.fadeBlockSize = this.overlayContentBlockSize + fadeLead;\n\n host.style.setProperty(SCROLL_OVERLAY_BLOCK_SIZE, `${this.overlayBlockSize}px`);\n host.style.setProperty(\n SCROLL_OVERLAY_CONTENT_BLOCK_SIZE,\n `${this.overlayContentBlockSize}px`,\n );\n host.style.setProperty(SCROLL_OVERLAY_FADE_BLOCK_SIZE, `${this.fadeBlockSize}px`);\n }\n\n private syncFadeWindow(): void {\n const { viewport, content } = this.options;\n const fadeEnd = Math.max(viewport.scrollTop + viewport.clientHeight, 0);\n const fadeStart = Math.max(fadeEnd - this.fadeBlockSize, 0);\n content.style.setProperty('--ds-scroll-edge-fade-window-start', `${fadeStart}px`);\n content.style.setProperty('--ds-scroll-edge-fade-window-end', `${fadeEnd}px`);\n }\n}\n"],"mappings":"oCAEO,MAAMA,EAA4B,iCAClC,MAAMC,EAAoC,yCAC1C,MAAMC,EAAiC,sC,MAkBjCC,EAMX,WAAAC,CAA6BC,GAAAC,KAAAD,UAJrBC,KAAAC,iBAAmB,EACnBD,KAAAE,wBAA0B,EAC1BF,KAAAG,cAAgB,C,CAIxB,OAAAC,GACEJ,KAAKK,eAAiB,IAAIC,gBAAe,KACvCN,KAAKO,OACLP,KAAKD,QAAQS,oBAAoB,IAEnCR,KAAKK,eAAeI,QAAQT,KAAKD,QAAQW,UACzCV,KAAKK,eAAeI,QAAQT,KAAKD,QAAQY,SACzCX,KAAKK,eAAeI,QAAQT,KAAKD,QAAQa,SACzCZ,KAAKO,M,CAGP,UAAAM,GACEb,KAAKK,gBAAgBQ,Y,CAGvB,IAAAN,GACEP,KAAKc,sBACLd,KAAKe,gB,CAGP,mBAAAC,GACE,OAAOhB,KAAKC,gB,CAGd,0BAAAgB,GACE,OAAOjB,KAAKE,uB,CAGN,mBAAAY,GACN,MAAMI,KAAEA,EAAIN,QAAEA,GAAYZ,KAAKD,QAC/B,MAAMoB,EAAcP,EAAQQ,wBAC5BpB,KAAKC,iBAAmBoB,KAAKC,IAAID,KAAKE,KAAKJ,EAAYK,QAAS,GAEhE,MAAMC,EAAWP,EAAKQ,cACpB1B,KAAKD,QAAQ4B,wBAA0B,oBAEzC,IAAKF,EAAU,CACbzB,KAAKC,iBAAmB,EACxBD,KAAKE,wBAA0B,EAC/BF,KAAKG,cAAgB,EACrBe,EAAKU,MAAMC,YAAYnC,EAA2B,OAClDwB,EAAKU,MAAMC,YAAYlC,EAAmC,OAC1DuB,EAAKU,MAAMC,YAAYjC,EAAgC,OACvD,M,CAGF,MAAMkC,EACJL,EAASM,6BAA6BC,YAAcP,EAASM,kBAAoBN,EACnF,MAAMQ,EAAWZ,KAAKC,IACpBD,KAAKE,KAAKO,EAAeV,wBAAwBc,IAAMf,EAAYe,KACnE,GAEFlC,KAAKE,wBAA0BmB,KAAKC,IAAItB,KAAKC,iBAAmBgC,EAAU,GAC1E,MAAME,EAAWC,EAAmB,6BAA8B,GAClEpC,KAAKG,cAAgBH,KAAKE,wBAA0BiC,EAEpDjB,EAAKU,MAAMC,YAAYnC,EAA2B,GAAGM,KAAKC,sBAC1DiB,EAAKU,MAAMC,YACTlC,EACA,GAAGK,KAAKE,6BAEVgB,EAAKU,MAAMC,YAAYjC,EAAgC,GAAGI,KAAKG,kB,CAGzD,cAAAY,GACN,MAAML,SAAEA,EAAQC,QAAEA,GAAYX,KAAKD,QACnC,MAAMsC,EAAUhB,KAAKC,IAAIZ,EAAS4B,UAAY5B,EAAS6B,aAAc,GACrE,MAAMC,EAAYnB,KAAKC,IAAIe,EAAUrC,KAAKG,cAAe,GACzDQ,EAAQiB,MAAMC,YAAY,qCAAsC,GAAGW,OACnE7B,EAAQiB,MAAMC,YAAY,mCAAoC,GAAGQ,M","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"names":["OPPOSITE_SIDE","top","right","bottom","left","rawPosition","input","side","anchorRect","anchor","popupWidth","popupHeight","align","sideOffsetPx","alignOffsetPx","x","width","y","height","collisionBounds","boundary","collisionRect","viewportWidth","viewportHeight","viewportPadPx","mainAxisOverflow","position","bounds","Math","max","clampToBounds","value","size","minimum","maximumEdge","maximum","min","computeAnchoredPosition","preferred","oppositeSide","opposite","preferredOverflow","oppositeOverflow","useOpposite","resolvedSide","availableHeight","POSITION_RETRY_BUDGET","AnchoredPositionController","constructor","options","this","scrollResizeHandler","resizeObserver","retryRaf","liveRaf","anchorMotionRaf","activeAnchorMotions","ownerDocument","last","isReady","anchorMotionStartHandler","event","eventCanMoveAnchor","scheduleAnchorMotionUpdate","anchorMotionEndHandler","ready","observe","bindListeners","unobserve","unbindListeners","cancel","schedule","onReady","cancelRetry","remaining","retryBudget","attempt","update","requestAnimationFrame","getAnchor","popup","getPopup","observeResizeTargets","topLayer","showPopover","matches","measure","next","apply","scheduleLiveUpdate","mode","liveUpdate","cancelAnimationFrame","window","addEventListener","observeResize","ResizeObserver","observeAnchorMotion","getOwnerDocument","removeEventListener","disconnect","target","Element","contains","tick","isConnected","ANCHORED_OVERLAY_BOUNDARY_ATTRIBUTE","composedParentElement","element","assignedSlot","parentElement","root","getRootNode","ShadowRoot","host","findAnchoredOverlayBoundary","current","HTMLElement","hasAttribute","resolveAnchoredOverlayBoundaryRect","explicitBoundary","undefined","getBoundingClientRect"],"sources":["src/wc/utils/anchored-position.ts","src/wc/utils/anchored-position-controller.ts","src/wc/utils/anchored-overlay-boundary.ts"],"sourcesContent":["export type AnchoredSide = 'top' | 'right' | 'bottom' | 'left';\nexport type AnchoredAlign = 'start' | 'center' | 'end';\n\nexport type AnchoredCollisionRect = Pick<\n DOMRectReadOnly,\n 'top' | 'left' | 'right' | 'bottom' | 'width' | 'height'\n>;\n\nexport interface AnchoredPositionInput {\n anchorRect: Pick<DOMRectReadOnly, 'top' | 'left' | 'right' | 'bottom' | 'width' | 'height'>;\n popupWidth: number;\n popupHeight: number;\n side: AnchoredSide;\n align: AnchoredAlign;\n sideOffsetPx: number;\n alignOffsetPx: number;\n viewportPadPx: number;\n viewportWidth: number;\n viewportHeight: number;\n /** Optional page or panel collision rectangle in viewport-fixed coordinates. */\n collisionRect?: AnchoredCollisionRect;\n}\n\nexport interface AnchoredPosition {\n x: number;\n y: number;\n /** Side actually used, which differs from the request when placement flipped. */\n resolvedSide: AnchoredSide;\n /** Vertical room available on the resolved side inside the padded viewport. */\n availableHeight: number;\n}\n\nconst OPPOSITE_SIDE: Record<AnchoredSide, AnchoredSide> = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right',\n};\n\n/** Unclamped coordinates for one candidate side. */\nfunction rawPosition(\n input: AnchoredPositionInput,\n side: AnchoredSide,\n): Pick<AnchoredPosition, 'x' | 'y'> {\n const { anchorRect: anchor, popupWidth, popupHeight, align, sideOffsetPx, alignOffsetPx } = input;\n\n if (side === 'top' || side === 'bottom') {\n return {\n x:\n align === 'start'\n ? anchor.left + alignOffsetPx\n : align === 'end'\n ? anchor.right - popupWidth + alignOffsetPx\n : anchor.left + anchor.width / 2 - popupWidth / 2 + alignOffsetPx,\n y: side === 'top'\n ? anchor.top - popupHeight - sideOffsetPx\n : anchor.bottom + sideOffsetPx,\n };\n }\n\n return {\n x: side === 'left'\n ? anchor.left - popupWidth - sideOffsetPx\n : anchor.right + sideOffsetPx,\n y:\n align === 'start'\n ? anchor.top + alignOffsetPx\n : align === 'end'\n ? anchor.bottom - popupHeight + alignOffsetPx\n : anchor.top + anchor.height / 2 - popupHeight / 2 + alignOffsetPx,\n };\n}\n\n/** Total main-axis spill past the padded viewport for a candidate position. */\nfunction collisionBounds(input: AnchoredPositionInput) {\n const boundary = input.collisionRect ?? {\n top: 0,\n left: 0,\n right: input.viewportWidth,\n bottom: input.viewportHeight,\n };\n return {\n top: boundary.top + input.viewportPadPx,\n left: boundary.left + input.viewportPadPx,\n right: boundary.right - input.viewportPadPx,\n bottom: boundary.bottom - input.viewportPadPx,\n };\n}\n\nfunction mainAxisOverflow(\n input: AnchoredPositionInput,\n side: AnchoredSide,\n position: Pick<AnchoredPosition, 'x' | 'y'>,\n): number {\n const { popupWidth, popupHeight } = input;\n const bounds = collisionBounds(input);\n\n if (side === 'top' || side === 'bottom') {\n return Math.max(bounds.top - position.y, 0) +\n Math.max(position.y + popupHeight - bounds.bottom, 0);\n }\n\n return Math.max(bounds.left - position.x, 0) +\n Math.max(position.x + popupWidth - bounds.right, 0);\n}\n\nfunction clampToBounds(value: number, size: number, minimum: number, maximumEdge: number): number {\n const maximum = Math.max(minimum, maximumEdge - size);\n return Math.min(Math.max(value, minimum), maximum);\n}\n\n/**\n * Pure viewport-fixed anchored-popup layout math shared by every element-anchored\n * overlay: menus, selects, tooltips, and anchored toasts.\n *\n * `side` is preferred. When the popup spills past the padded collision boundary and\n * the opposite side spills less, placement flips on the main axis; the result is\n * then clamped into that boundary on both axes. The viewport is the fallback when\n * no page or panel collision rectangle is supplied. Cross-axis `align` is applied\n * before clamping so `alignOffsetPx` stays an additive nudge.\n *\n * Callers own their own anchor semantics — inner-cell alignment offsets and\n * minimum widths belong to the calling component, not here.\n * @see choice-popup-alignment.ts for the choice-cell alignment transform.\n */\nexport function computeAnchoredPosition(input: AnchoredPositionInput): AnchoredPosition {\n const bounds = collisionBounds(input);\n const preferred = rawPosition(input, input.side);\n const oppositeSide = OPPOSITE_SIDE[input.side];\n const opposite = rawPosition(input, oppositeSide);\n const preferredOverflow = mainAxisOverflow(input, input.side, preferred);\n const oppositeOverflow = mainAxisOverflow(input, oppositeSide, opposite);\n const useOpposite = preferredOverflow > 0 && oppositeOverflow < preferredOverflow;\n const resolvedSide = useOpposite ? oppositeSide : input.side;\n const position = useOpposite ? opposite : preferred;\n const availableHeight =\n resolvedSide === 'top'\n ? input.anchorRect.top - bounds.top - input.sideOffsetPx\n : resolvedSide === 'bottom'\n ? bounds.bottom - input.anchorRect.bottom - input.sideOffsetPx\n : bounds.bottom - bounds.top;\n\n return {\n x: clampToBounds(position.x, input.popupWidth, bounds.left, bounds.right),\n y: clampToBounds(position.y, input.popupHeight, bounds.top, bounds.bottom),\n resolvedSide,\n availableHeight: Math.max(0, availableHeight),\n };\n}\n","import {\n computeAnchoredPosition,\n type AnchoredPosition,\n type AnchoredPositionInput,\n} from './anchored-position';\n\n/** Frames to wait for an anchor and popup to become measurable before giving up. */\nconst POSITION_RETRY_BUDGET = 8;\n\n/**\n * How the scroll/resize path reschedules. Each consumer family measured\n * differently before consolidation, and the differences are preserved verbatim\n * so placement timing is unchanged.\n *\n * - `sync` — measure inside the listener. Selects.\n * - `frame` — coalesce and measure on the next frame. Tooltips.\n * - `double-frame` — coalesce, measure next frame, then measure once more the\n * frame after. Scroll-driven owners such as ShellPage commit a compact-header\n * render in the frame after the scroll event, so a single frame reads a stale\n * anchor rect. Menus.\n */\nexport type AnchoredLiveUpdateMode = 'sync' | 'frame' | 'double-frame';\n\nexport interface AnchoredPositionControllerOptions {\n /** Resolve the anchor at measure time; positioning retries while this is null. */\n getAnchor: () => HTMLElement | null;\n /** Resolve the popup at measure time; positioning retries while this is null. */\n getPopup: () => HTMLElement | null;\n /** Stable owner fallback when framework bindings assign open before anchor. */\n getOwnerDocument?: () => Document | null;\n /**\n * Build the layout input for one measurement pass.\n *\n * The owning component keeps its own anchor semantics here — inner-cell align\n * offsets, minimum widths, and token resolution stay with the component rather\n * than moving into this controller. Return `null` when the component's own\n * guards say the popup is not measurable yet, which schedules a retry.\n */\n measure: (anchor: HTMLElement, popup: HTMLElement) => AnchoredPositionInput | null;\n /** Commit a changed position. Not called when the result is unchanged. */\n apply: (position: AnchoredPosition) => void;\n /**\n * Move a `popover=\"manual\"` popup into the native top layer before measuring.\n *\n * Use this for popups that remain in their owner's DOM tree. The top layer\n * gives `position: fixed` viewport coordinates even when an application\n * ancestor establishes a fixed-position containing block through containment,\n * transforms, or filters.\n */\n topLayer?: boolean;\n /** Fired once per `start()` when the first measurement succeeds. */\n onReady?: () => void;\n /** Scroll/resize behavior. Defaults to `sync`. */\n liveUpdate?: AnchoredLiveUpdateMode;\n /**\n * Re-measure when the popup or anchor resizes. Tooltips need this because the\n * label's `ds-text` upgrade changes the measured width after mount.\n */\n observeResize?: boolean;\n /**\n * Follow CSS transitions or animations that move the anchor without resizing\n * it. The observer only runs a measurement loop while related motion is active.\n */\n observeAnchorMotion?: boolean;\n retryBudget?: number;\n}\n\n/**\n * Lifecycle owner for an element-anchored popup: listener binding, measurement\n * retries, frame coalescing, and teardown.\n *\n * Pairs with `computeAnchoredPosition`, which owns the geometry. Split this way\n * because the geometry is pure and exhaustively testable while the lifecycle is\n * timing-dependent; keeping them separate means the risky half lives in exactly\n * one place.\n *\n * Not suitable for overlays that place several popups in one shared pass — Toast\n * positions N anchored records inside a single layout commit and keeps its own\n * scheduler, using only the geometry function.\n */\nexport class AnchoredPositionController {\n private readonly options: AnchoredPositionControllerOptions;\n private scrollResizeHandler: (() => void) | null = null;\n private resizeObserver: ResizeObserver | null = null;\n private retryRaf: number | null = null;\n private liveRaf: number | null = null;\n private anchorMotionRaf: number | null = null;\n private activeAnchorMotions = 0;\n private ownerDocument: Document | null = null;\n private last: AnchoredPosition | null = null;\n private isReady = false;\n private readonly anchorMotionStartHandler = (event: Event) => {\n if (!this.eventCanMoveAnchor(event)) return;\n this.activeAnchorMotions += 1;\n this.scheduleAnchorMotionUpdate();\n };\n private readonly anchorMotionEndHandler = (event: Event) => {\n if (!this.eventCanMoveAnchor(event)) return;\n this.activeAnchorMotions = Math.max(0, this.activeAnchorMotions - 1);\n this.scheduleAnchorMotionUpdate();\n };\n\n constructor(options: AnchoredPositionControllerOptions) {\n this.options = options;\n }\n\n /** `true` once a measurement has succeeded, for gating popup reveal. */\n get ready(): boolean {\n return this.isReady;\n }\n\n /**\n * Bind scroll/resize tracking for an opening popup.\n *\n * Deliberately does not schedule placement: every consumer binds listeners and\n * then schedules in its own order, and folding both into one call produced two\n * overlapping retry loops. Call `schedule()` or `update()` separately.\n */\n observe(): void {\n this.bindListeners();\n }\n\n /** Unbind tracking, cancel pending frames, and clear the cached position. */\n unobserve(): void {\n this.unbindListeners();\n this.cancel();\n this.last = null;\n this.isReady = false;\n }\n\n /**\n * Retry measurement each frame until it succeeds or the budget runs out, so a\n * popup is never revealed at 0,0 after a failed first pass.\n */\n schedule(onReady?: () => void): void {\n this.cancelRetry();\n this.isReady = false;\n\n let remaining = this.options.retryBudget ?? POSITION_RETRY_BUDGET;\n\n const attempt = () => {\n this.retryRaf = null;\n if (this.update()) {\n this.isReady = true;\n this.options.onReady?.();\n onReady?.();\n return;\n }\n if (remaining > 0) {\n remaining -= 1;\n this.retryRaf = requestAnimationFrame(attempt);\n }\n };\n\n this.retryRaf = requestAnimationFrame(attempt);\n }\n\n /** Measure and commit once. @returns `false` when the popup is not measurable. */\n update(): boolean {\n const anchor = this.options.getAnchor();\n if (!anchor) return false;\n const popup = this.options.getPopup();\n if (!popup) return false;\n this.observeResizeTargets();\n\n if (\n this.options.topLayer &&\n typeof popup.showPopover === 'function' &&\n !popup.matches(':popover-open')\n ) {\n try {\n popup.showPopover();\n } catch {\n // The popup may not be connected yet. The scheduled retry will try again\n // on the next frame instead of measuring it in the wrong coordinate space.\n return false;\n }\n }\n\n const input = this.options.measure(anchor, popup);\n if (!input) return false;\n\n const next = computeAnchoredPosition(input);\n if (\n !this.last ||\n this.last.x !== next.x ||\n this.last.y !== next.y ||\n this.last.resolvedSide !== next.resolvedSide ||\n this.last.availableHeight !== next.availableHeight\n ) {\n this.last = next;\n this.options.apply(next);\n }\n return true;\n }\n\n /** Reposition an already-open popup without hiding it. */\n scheduleLiveUpdate(): void {\n const mode = this.options.liveUpdate ?? 'sync';\n if (mode === 'sync') {\n this.update();\n return;\n }\n\n if (this.liveRaf !== null) return;\n\n if (mode === 'frame') {\n this.liveRaf = requestAnimationFrame(() => {\n this.liveRaf = null;\n this.update();\n });\n return;\n }\n\n // double-frame stays coalesced until the second frame resolves.\n this.liveRaf = requestAnimationFrame(() => {\n this.update();\n this.liveRaf = requestAnimationFrame(() => {\n this.liveRaf = null;\n this.update();\n });\n });\n }\n\n /** Cancel pending retry and live frames without unbinding listeners. */\n cancel(): void {\n this.cancelRetry();\n if (this.liveRaf !== null) {\n cancelAnimationFrame(this.liveRaf);\n this.liveRaf = null;\n }\n if (this.anchorMotionRaf !== null) {\n cancelAnimationFrame(this.anchorMotionRaf);\n this.anchorMotionRaf = null;\n }\n }\n\n private cancelRetry(): void {\n if (this.retryRaf === null) return;\n cancelAnimationFrame(this.retryRaf);\n this.retryRaf = null;\n }\n\n private bindListeners(): void {\n this.unbindListeners();\n this.scrollResizeHandler = () => this.scheduleLiveUpdate();\n // Capture phase so scrolling inside any ancestor repositions the popup.\n window.addEventListener('scroll', this.scrollResizeHandler, true);\n window.addEventListener('resize', this.scrollResizeHandler);\n\n if (this.options.observeResize && typeof ResizeObserver !== 'undefined') {\n this.resizeObserver = new ResizeObserver(() => this.update());\n this.observeResizeTargets();\n }\n\n if (this.options.observeAnchorMotion) {\n this.ownerDocument =\n this.options.getAnchor()?.ownerDocument ?? this.options.getOwnerDocument?.() ?? null;\n this.ownerDocument?.addEventListener('transitionrun', this.anchorMotionStartHandler, true);\n this.ownerDocument?.addEventListener('transitionend', this.anchorMotionEndHandler, true);\n this.ownerDocument?.addEventListener('transitioncancel', this.anchorMotionEndHandler, true);\n this.ownerDocument?.addEventListener('animationstart', this.anchorMotionStartHandler, true);\n this.ownerDocument?.addEventListener('animationend', this.anchorMotionEndHandler, true);\n this.ownerDocument?.addEventListener('animationcancel', this.anchorMotionEndHandler, true);\n }\n }\n\n private unbindListeners(): void {\n if (this.scrollResizeHandler) {\n window.removeEventListener('scroll', this.scrollResizeHandler, true);\n window.removeEventListener('resize', this.scrollResizeHandler);\n this.scrollResizeHandler = null;\n }\n this.resizeObserver?.disconnect();\n this.resizeObserver = null;\n this.ownerDocument?.removeEventListener('transitionrun', this.anchorMotionStartHandler, true);\n this.ownerDocument?.removeEventListener('transitionend', this.anchorMotionEndHandler, true);\n this.ownerDocument?.removeEventListener('transitioncancel', this.anchorMotionEndHandler, true);\n this.ownerDocument?.removeEventListener('animationstart', this.anchorMotionStartHandler, true);\n this.ownerDocument?.removeEventListener('animationend', this.anchorMotionEndHandler, true);\n this.ownerDocument?.removeEventListener('animationcancel', this.anchorMotionEndHandler, true);\n this.ownerDocument = null;\n this.activeAnchorMotions = 0;\n }\n\n private eventCanMoveAnchor(event: Event): boolean {\n const anchor = this.options.getAnchor();\n const target = event.target;\n if (!anchor || !(target instanceof Element)) return false;\n // Motion on the anchor or one of its layout ancestors can move its rect.\n // Descendant-only animation is irrelevant unless it resizes the anchor,\n // which the ResizeObserver path already covers.\n return target === anchor || target.contains(anchor);\n }\n\n private scheduleAnchorMotionUpdate(): void {\n if (this.anchorMotionRaf !== null) return;\n const tick = () => {\n this.anchorMotionRaf = null;\n this.update();\n if (this.activeAnchorMotions <= 0 || !this.options.getAnchor()?.isConnected) {\n this.activeAnchorMotions = 0;\n return;\n }\n this.anchorMotionRaf = requestAnimationFrame(tick);\n };\n this.anchorMotionRaf = requestAnimationFrame(tick);\n }\n\n /**\n * Re-attach the resize observer after the popup remounts. Safe to call\n * repeatedly; `ResizeObserver.observe` ignores duplicate targets.\n */\n observeResizeTargets(): void {\n if (!this.resizeObserver) return;\n const popup = this.options.getPopup();\n if (popup) this.resizeObserver.observe(popup);\n const anchor = this.options.getAnchor();\n if (anchor) this.resizeObserver.observe(anchor);\n }\n}\n","import type { AnchoredCollisionRect } from './anchored-position';\n\n/** Attribute placed on a page or panel whose visible rectangle owns anchored overlays. */\nexport const ANCHORED_OVERLAY_BOUNDARY_ATTRIBUTE = 'data-ds-overlay-boundary';\n\n/** An element-owned collision rectangle, or an explicit escape to the viewport. */\nexport type AnchoredOverlayBoundary = HTMLElement | 'viewport';\n\nfunction composedParentElement(element: Element): Element | null {\n if (element.assignedSlot) return element.assignedSlot;\n if (element.parentElement) return element.parentElement;\n const root = element.getRootNode();\n return root instanceof ShadowRoot ? root.host : null;\n}\n\n/**\n * Find the nearest collision owner through light DOM, assigned slots, and open\n * shadow roots. The popup may live in the top layer or a body portal; ownership\n * follows its anchor instead of the popup's rendering location.\n */\nexport function findAnchoredOverlayBoundary(anchor: Element): HTMLElement | null {\n let current: Element | null = anchor;\n while (current) {\n if (\n current instanceof HTMLElement &&\n current.hasAttribute(ANCHORED_OVERLAY_BOUNDARY_ATTRIBUTE)\n ) {\n return current;\n }\n current = composedParentElement(current);\n }\n return null;\n}\n\n/** Resolve an explicit owner first, then the nearest composed-tree boundary. */\nexport function resolveAnchoredOverlayBoundaryRect(\n anchor: Element,\n explicitBoundary?: AnchoredOverlayBoundary,\n): AnchoredCollisionRect | undefined {\n if (explicitBoundary === 'viewport') return undefined;\n return (explicitBoundary ?? findAnchoredOverlayBoundary(anchor))?.getBoundingClientRect();\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- import{p as o,H as t,c as n,h as r,a as i,t as s}from"./index.js";import{d as a}from"./p-BFfLvMZd.js";import{d as e}from"./p-CAnnQL1F.js";import{C as c}from"./p-CuwopElg.js";const d=()=>`.ds-control--lg.sc-ds-tag,.ds-control--lg.sc-ds-tag-h,.ds-control--md.sc-ds-tag-h,.ds-control--md.sc-ds-tag,.ds-control--sm.sc-ds-tag-h,.ds-control--sm.sc-ds-tag,.ds-control--xs.sc-ds-tag-h,.ds-control--xs.sc-ds-tag{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-tag-h,.ds-control--lg.sc-ds-tag{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-tag-h,.ds-control--md.sc-ds-tag{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-tag-h,.ds-control--sm.sc-ds-tag{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-tag-h,.ds-control--xs.sc-ds-tag{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}@media (forced-colors: active){.sc-ds-tag:root,.sc-ds-tag-h,.ds-forced-colors-scope.sc-ds-tag{--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-tag-h,.ds-interaction-fill.sc-ds-tag{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-tag-h::before,.ds-interaction-fill.sc-ds-tag::before,.ds-interaction-fill.sc-ds-tag-h::after,.ds-interaction-fill.sc-ds-tag::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-tag-h::before,.ds-interaction-fill.sc-ds-tag::before{z-index:1}.ds-interaction-fill.sc-ds-tag-h::after,.ds-interaction-fill.sc-ds-tag::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-tag-h,.ds-interaction-fill--bordered.sc-ds-tag{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-tag-h::before,.ds-interaction-fill--selected.sc-ds-tag::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-tag-h,.ds-interaction-fill--selected.sc-ds-tag{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-tag-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-tag:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-tag-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-tag:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-tag-h::after,.ds-interaction-fill--grouped.sc-ds-tag::after,.ds-interaction-fill--grouped.sc-ds-tag-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-tag:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-tag-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-tag:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-tag-h,.ds-interaction-fill--grouped.sc-ds-tag{--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-tag-h>.ds-interaction-fill__content.sc-ds-tag,.ds-interaction-fill.sc-ds-tag>.ds-interaction-fill__content.sc-ds-tag,.ds-interaction-fill__content.sc-ds-tag{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-tag-h,.ds-interaction-fill--on-faint.sc-ds-tag{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-tag-h,.ds-interaction-fill--on-medium.sc-ds-tag{--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-tag-h,.ds-interaction-fill--on-bold.sc-ds-tag{--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-tag-h,.ds-interaction-fill--on-strong.sc-ds-tag{--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-tag-h,.ds-interaction-fill--on-translucent.sc-ds-tag{--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-tag-h,.ds-interaction-fill--on-inverted.sc-ds-tag{--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-tag-h,.ds-interaction-fill--on-media.sc-ds-tag{--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-tag-h,.ds-interaction-fill--on-always-dark.sc-ds-tag{--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-tag-h,.ds-interaction-fill--on-navigation.sc-ds-tag{--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-tag-h::after,.ds-interaction-fill.sc-ds-tag::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-tag-h::before,.ds-interaction-fill--selected.sc-ds-tag::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-tag-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-tag: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)}}@media (forced-colors: active){.sc-ds-tag:root,.sc-ds-tag-h,.ds-forced-colors-scope.sc-ds-tag{--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-tag-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-tag-h,.ds-focus-ring.sc-ds-tag,.ds-focus-ring-inset.sc-ds-tag-h,.ds-focus-ring-inset.sc-ds-tag{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-tag-h:focus-visible,.ds-focus-ring.sc-ds-tag: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-tag-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-tag{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-tag-h:focus-visible,.ds-focus-ring-inset.sc-ds-tag:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-tag-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-tag: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-tag-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-tag{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-tag-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-tag::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-tag-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-tag:root,.sc-ds-tag-h,.ds-forced-colors-scope.sc-ds-tag{--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-control-inactive.sc-ds-tag-h,.ds-control-inactive.sc-ds-tag{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-tag-h,.ds-control-inactive.sc-ds-tag{color:var(--ds-forced-color-disabled);opacity:1}}.sc-ds-tag-h{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;color:var(--color-foreground-primary);position:relative;border-radius:var(--ds-control-radius, var(--dimension-radius-025));height:var(--ds-control-height);padding:0 var(--ds-control-padding-inline);gap:var(--ds-control-gap);user-select:none;-webkit-user-select:none}.tag--rounded.sc-ds-tag-h{border-radius:var(--dimension-radius-half)}.tag__label.sc-ds-tag{position:relative;z-index:2;padding:0 var(--ds-control-label-inset);white-space:nowrap;flex-shrink:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.ds-control--lg.ds-control--inset.sc-ds-tag-h,.ds-control--lg.ds-control--inset.sc-ds-tag{--ds-control-height:calc(var(--dimension-size-500) - var(--dimension-space-050));--ds-control-padding-inline:calc( var(--dimension-space-100) - var(--dimension-space-025) )}.ds-control--md.ds-control--inset.sc-ds-tag-h,.ds-control--md.ds-control--inset.sc-ds-tag{--ds-control-height:calc(var(--dimension-size-400) - var(--dimension-space-050));--ds-control-padding-inline:calc( var(--dimension-space-075) - var(--dimension-space-025) )}.ds-control--sm.ds-control--inset.sc-ds-tag-h,.ds-control--sm.ds-control--inset.sc-ds-tag{--ds-control-height:calc(var(--dimension-size-300) - var(--dimension-space-050));--ds-control-padding-inline:calc( var(--dimension-space-050) - var(--dimension-space-025) )}.ds-control--xs.ds-control--inset.sc-ds-tag-h,.ds-control--xs.ds-control--inset.sc-ds-tag{--ds-control-height:calc(var(--dimension-size-200) - var(--dimension-space-050));--ds-control-padding-inline:calc( var(--dimension-space-025) - var(--dimension-space-025) )}.ds-control--lg.ds-control--inset-double.sc-ds-tag-h,.ds-control--lg.ds-control--inset-double.sc-ds-tag{--ds-control-height:calc(var(--dimension-size-500) - var(--dimension-space-100));--ds-control-padding-inline:calc( var(--dimension-space-100) - var(--dimension-space-050) )}.ds-control--md.ds-control--inset-double.sc-ds-tag-h,.ds-control--md.ds-control--inset-double.sc-ds-tag{--ds-control-height:calc(var(--dimension-size-400) - var(--dimension-space-100));--ds-control-padding-inline:calc( var(--dimension-space-075) - var(--dimension-space-050) )}.ds-control--sm.ds-control--inset-double.sc-ds-tag-h,.ds-control--sm.ds-control--inset-double.sc-ds-tag{--ds-control-height:calc(var(--dimension-size-300) - var(--dimension-space-100));--ds-control-padding-inline:calc( var(--dimension-space-050) - var(--dimension-space-050) )}.sc-ds-tag-h{min-inline-size:var(--ds-control-height)}.tag--intent-neutral.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-neutral);color:var(--color-foreground-medium-neutral)}.tag--intent-brand.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-brand);color:var(--color-foreground-on-strong-background-primary)}.tag--intent-ai.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-ai);color:var(--color-foreground-medium-ai)}.tag--intent-negative.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-negative);color:var(--color-foreground-medium-negative)}.tag--intent-warning.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-warning);color:var(--color-foreground-medium-warning)}.tag--intent-caution.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-caution);color:var(--color-foreground-medium-caution)}.tag--intent-positive.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-positive);color:var(--color-foreground-medium-positive)}.tag--intent-neutral.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-neutral);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-brand.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-brand);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-ai.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-ai);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-negative.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-negative);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-warning.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-warning);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-caution.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-caution);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-positive.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-positive);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-neutral.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-neutral);color:var(--color-foreground-strong-neutral)}.tag--intent-brand.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-brand);color:var(--color-foreground-on-medium-background-primary)}.tag--intent-ai.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-ai);color:var(--color-foreground-strong-ai)}.tag--intent-negative.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-negative);color:var(--color-foreground-strong-negative)}.tag--intent-warning.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-warning);color:var(--color-foreground-strong-warning)}.tag--intent-caution.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-caution);color:var(--color-foreground-strong-caution)}.tag--intent-positive.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-positive);color:var(--color-foreground-strong-positive)}.tag--intent-neutral.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-neutral);color:var(--color-foreground-bold-neutral)}.tag--intent-brand.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-brand);color:var(--color-foreground-bold-brand)}.tag--intent-ai.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-ai);color:var(--color-foreground-bold-ai)}.tag--intent-negative.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-negative);color:var(--color-foreground-bold-negative)}.tag--intent-warning.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-warning);color:var(--color-foreground-bold-warning)}.tag--intent-caution.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-caution);color:var(--color-foreground-bold-caution)}.tag--intent-positive.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-positive);color:var(--color-foreground-bold-positive)}.tag--interactive.sc-ds-tag-h{padding:0;gap:0}.tag__button.sc-ds-tag{all:unset;position:relative;z-index:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:0;max-width:100%;height:100%;padding:0 var(--ds-control-padding-inline);gap:var(--ds-control-gap);border-radius:inherit;color:inherit;cursor:default}.tag__button.sc-ds-tag:disabled{cursor:not-allowed}.tag__button--expanded.sc-ds-tag::after{background:var(--ds-interaction-pressed)}.tag__prefix-icon.sc-ds-tag,.tag__suffix-icon.sc-ds-tag{position:relative;z-index:2;display:inline-flex;flex-shrink:0;width:var(--ds-control-icon);height:var(--ds-control-icon)}`;const l={md:"md",sm:"sm",xs:"xs"};const g=o(class o extends t{constructor(o){super();if(o!==false){this.__registerHost()}this.dsClick=n(this,"dsClick",7);this.icon="";this.intent="neutral";this.contrast="faint";this.size="md";this.isInset=false;this.insetDepth="single";this.rounded=false;this.interactive=false;this.expanded=false;this.isInactive=false;this.handleClick=o=>{if(!this.interactive||this.isInactive)return;this.dsClick.emit(o)}}render(){const o=c[this.size];const t=l[this.size];const n=this.isInset&&this.insetDepth==="double"&&this.size!=="xs";const s=this.maxWidth!=null?{maxWidth:typeof this.maxWidth==="number"?`${this.maxWidth}px`:this.maxWidth}:undefined;const a={tag:true,[`tag--intent-${this.intent}`]:true,[`tag--contrast-${this.contrast}`]:true,[`tag--size-${this.size}`]:true,"ds-control--md":this.size==="md","ds-control--sm":this.size==="sm","ds-control--xs":this.size==="xs","ds-control--inset":this.isInset&&!n,"ds-control--inset-double":n,"tag--rounded":this.rounded,"tag--interactive":this.interactive,"ds-control-inactive":this.interactive&&this.isInactive};const e=[this.icon&&r("ds-icon",{class:"tag__prefix-icon",name:this.icon,size:t,color:"inherit"}),r("ds-text",{class:"tag__label",as:"span",variant:o,color:"inherit"},this.label)];if(!this.interactive){return r(i,{class:a,style:s},e)}return r(i,{class:a,style:s},r("button",{type:"button",class:{tag__button:true,"tag__button--expanded":this.expanded,"ds-interaction-fill":true,"ds-focus-ring-inset":true},"aria-haspopup":"menu","aria-expanded":this.expanded?"true":"false","aria-controls":this.ariaControls,disabled:this.isInactive||undefined,onClick:this.handleClick},e,r("ds-icon",{class:"tag__suffix-icon",name:"ChevronUpDown",size:t,color:"inherit"})))}static get style(){return d()}},[2,"ds-tag",{label:[1],icon:[1],intent:[1],contrast:[1],size:[1],isInset:[4,"is-inset"],insetDepth:[1,"inset-depth"],rounded:[4],maxWidth:[8,"max-width"],interactive:[4],expanded:[4],ariaControls:[1,"aria-controls"],isInactive:[4,"is-inactive"]}]);function v(){if(typeof customElements==="undefined"){return}const o=["ds-tag","ds-icon","ds-text"];o.forEach((o=>{switch(o){case"ds-tag":if(!customElements.get(s(o))){customElements.define(s(o),g)}break;case"ds-icon":if(!customElements.get(s(o))){a()}break;case"ds-text":if(!customElements.get(s(o))){e()}break}}))}v();export{g as T,v as d};
2
- //# sourceMappingURL=p-Cg0kimXZ.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["tagCss","ICON_SIZE","md","sm","xs","Tag","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","icon","intent","contrast","size","isInset","insetDepth","rounded","interactive","expanded","isInactive","handleClick","event","dsClick","emit","render","textVariant","CONTROL_TEXT_VARIANT","iconSize","doubleInset","maxWidthStyle","maxWidth","undefined","hostClass","tag","content","h","class","name","color","as","variant","label","Host","style","type","tag__button","ariaControls","disabled","onClick"],"sources":["src/wc/components/Tag/Tag.css?tag=ds-tag&encapsulation=scoped","src/wc/components/Tag/Tag.tsx"],"sourcesContent":["@import '../../utils/tag-chip.css';\n@import '../../utils/control-density-inset.css';\n\n/* A one-character rounded Tag resolves to a circle at every density. */\n:host {\n min-inline-size: var(--ds-control-height);\n}\n\n/* ── Intent × Contrast — strong ─────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-strong) { background-color: var(--color-background-strong-neutral); color: var(--color-foreground-medium-neutral); }\n:host(.tag--intent-brand.tag--contrast-strong) { background-color: var(--color-background-strong-brand); color: var(--color-foreground-on-strong-background-primary); }\n:host(.tag--intent-ai.tag--contrast-strong) { background-color: var(--color-background-strong-ai); color: var(--color-foreground-medium-ai); }\n:host(.tag--intent-negative.tag--contrast-strong) { background-color: var(--color-background-strong-negative); color: var(--color-foreground-medium-negative); }\n:host(.tag--intent-warning.tag--contrast-strong) { background-color: var(--color-background-strong-warning); color: var(--color-foreground-medium-warning); }\n:host(.tag--intent-caution.tag--contrast-strong) { background-color: var(--color-background-strong-caution); color: var(--color-foreground-medium-caution); }\n:host(.tag--intent-positive.tag--contrast-strong) { background-color: var(--color-background-strong-positive); color: var(--color-foreground-medium-positive); }\n\n/* ── Intent × Contrast — bold ───────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-bold) { background-color: var(--color-background-bold-neutral); color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-brand.tag--contrast-bold) { background-color: var(--color-background-bold-brand); color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-ai.tag--contrast-bold) { background-color: var(--color-background-bold-ai); color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-negative.tag--contrast-bold) { background-color: var(--color-background-bold-negative); color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-warning.tag--contrast-bold) { background-color: var(--color-background-bold-warning); color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-caution.tag--contrast-bold) { background-color: var(--color-background-bold-caution); color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-positive.tag--contrast-bold) { background-color: var(--color-background-bold-positive); color: var(--color-foreground-on-bold-background-primary); }\n\n/* ── Intent × Contrast — medium ─────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-medium) { background-color: var(--color-background-medium-neutral); color: var(--color-foreground-strong-neutral); }\n:host(.tag--intent-brand.tag--contrast-medium) { background-color: var(--color-background-medium-brand); color: var(--color-foreground-on-medium-background-primary); }\n:host(.tag--intent-ai.tag--contrast-medium) { background-color: var(--color-background-medium-ai); color: var(--color-foreground-strong-ai); }\n:host(.tag--intent-negative.tag--contrast-medium) { background-color: var(--color-background-medium-negative); color: var(--color-foreground-strong-negative); }\n:host(.tag--intent-warning.tag--contrast-medium) { background-color: var(--color-background-medium-warning); color: var(--color-foreground-strong-warning); }\n:host(.tag--intent-caution.tag--contrast-medium) { background-color: var(--color-background-medium-caution); color: var(--color-foreground-strong-caution); }\n:host(.tag--intent-positive.tag--contrast-medium) { background-color: var(--color-background-medium-positive); color: var(--color-foreground-strong-positive); }\n\n/* ── Intent × Contrast — faint ──────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-faint) { background-color: var(--color-background-faint-neutral); color: var(--color-foreground-bold-neutral); }\n:host(.tag--intent-brand.tag--contrast-faint) { background-color: var(--color-background-faint-brand); color: var(--color-foreground-bold-brand); }\n:host(.tag--intent-ai.tag--contrast-faint) { background-color: var(--color-background-faint-ai); color: var(--color-foreground-bold-ai); }\n:host(.tag--intent-negative.tag--contrast-faint) { background-color: var(--color-background-faint-negative); color: var(--color-foreground-bold-negative); }\n:host(.tag--intent-warning.tag--contrast-faint) { background-color: var(--color-background-faint-warning); color: var(--color-foreground-bold-warning); }\n:host(.tag--intent-caution.tag--contrast-faint) { background-color: var(--color-background-faint-caution); color: var(--color-foreground-bold-caution); }\n:host(.tag--intent-positive.tag--contrast-faint) { background-color: var(--color-background-faint-positive); color: var(--color-foreground-bold-positive); }\n\n/* ── Interactive menu trigger ───────────────────────────────────────────── */\n\n:host(.tag--interactive) {\n padding: 0;\n gap: 0;\n}\n\n.tag__button {\n all: unset;\n position: relative;\n z-index: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n min-width: 0;\n max-width: 100%;\n height: 100%;\n padding: 0 var(--ds-control-padding-inline);\n gap: var(--ds-control-gap);\n border-radius: inherit;\n color: inherit;\n cursor: default;\n}\n\n.tag__button:disabled {\n cursor: not-allowed;\n}\n\n.tag__button--expanded::after {\n background: var(--ds-interaction-pressed);\n}\n\n/* Hover/press wash stays above the Tag's semantic background. */\n\n/* ── Icons ──────────────────────────────────────────────────────────────── */\n\n.tag__prefix-icon,\n.tag__suffix-icon {\n position: relative;\n z-index: 2;\n display: inline-flex;\n flex-shrink: 0;\n width: var(--ds-control-icon);\n height: var(--ds-control-icon);\n}\n","import { Component, Event, EventEmitter, Prop, h, Host } from '@stencil/core';\nimport { CONTROL_TEXT_VARIANT, type ControlInsetDepth } from '../../utils';\n\nexport type TagIntent = 'neutral' | 'brand' | 'ai' | 'negative' | 'warning' | 'caution' | 'positive';\nexport type TagContrast = 'strong' | 'bold' | 'medium' | 'faint';\nexport type TagSize = 'md' | 'sm' | 'xs';\n\n/**\n * `ds-icon` size prop matching control-density icon metrics\n * (md→20 / sm→16 / xs→12 via `--dimension-iconography-*`).\n */\nconst ICON_SIZE: Record<TagSize, 'md' | 'sm' | 'xs'> = {\n md: 'md',\n sm: 'sm',\n xs: 'xs',\n};\n\n@Component({\n tag: 'ds-tag',\n styleUrl: 'Tag.css',\n scoped: true,\n})\nexport class Tag {\n @Prop() label!: string;\n /** Canonical icon name rendered before the visible label. */\n @Prop() icon: string = '';\n @Prop() intent: TagIntent = 'neutral';\n @Prop() contrast: TagContrast = 'faint';\n @Prop() size: TagSize = 'md';\n /** Use the reduced outer geometry when nested inside a control of the same size. */\n @Prop() isInset: boolean = false;\n /** Single removes 4px overall; double removes 8px overall (xs stays single). */\n @Prop() insetDepth: ControlInsetDepth = 'single';\n @Prop() rounded: boolean = false;\n @Prop() maxWidth: string | number | undefined;\n /** Render a menu-trigger button with a fixed ChevronUpDown suffix. */\n @Prop() interactive: boolean = false;\n /** Controlled open state for the menu triggered by an interactive Tag. */\n @Prop() expanded: boolean = false;\n /** ID of the menu controlled by an interactive Tag. */\n @Prop() ariaControls: string | undefined;\n /** Disable an interactive Tag and apply the shared inactive treatment. */\n @Prop() isInactive: boolean = false;\n\n /** Fired when the interactive Tag button is activated. */\n @Event() dsClick!: EventEmitter<MouseEvent>;\n\n private handleClick = (event: MouseEvent) => {\n if (!this.interactive || this.isInactive) return;\n this.dsClick.emit(event);\n };\n\n render() {\n const textVariant = CONTROL_TEXT_VARIANT[this.size];\n const iconSize = ICON_SIZE[this.size];\n const doubleInset = this.isInset && this.insetDepth === 'double' && this.size !== 'xs';\n\n const maxWidthStyle = this.maxWidth != null\n ? { maxWidth: typeof this.maxWidth === 'number' ? `${this.maxWidth}px` : this.maxWidth }\n : undefined;\n const hostClass = {\n 'tag': true,\n [`tag--intent-${this.intent}`]: true,\n [`tag--contrast-${this.contrast}`]: true,\n [`tag--size-${this.size}`]: true,\n 'ds-control--md': this.size === 'md',\n 'ds-control--sm': this.size === 'sm',\n 'ds-control--xs': this.size === 'xs',\n 'ds-control--inset': this.isInset && !doubleInset,\n 'ds-control--inset-double': doubleInset,\n 'tag--rounded': this.rounded,\n 'tag--interactive': this.interactive,\n 'ds-control-inactive': this.interactive && this.isInactive,\n };\n const content = [\n this.icon && (\n <ds-icon\n class=\"tag__prefix-icon\"\n name={this.icon}\n size={iconSize}\n color=\"inherit\"\n ></ds-icon>\n ),\n <ds-text class=\"tag__label\" as=\"span\" variant={textVariant} color=\"inherit\">\n {this.label}\n </ds-text>,\n ];\n\n if (!this.interactive) {\n return <Host class={hostClass} style={maxWidthStyle}>{content}</Host>;\n }\n\n return (\n <Host class={hostClass} style={maxWidthStyle}>\n <button\n type=\"button\"\n class={{\n 'tag__button': true,\n 'tag__button--expanded': this.expanded,\n 'ds-interaction-fill': true,\n 'ds-focus-ring-inset': true,\n }}\n aria-haspopup=\"menu\"\n aria-expanded={this.expanded ? 'true' : 'false'}\n aria-controls={this.ariaControls}\n disabled={this.isInactive || undefined}\n onClick={this.handleClick}\n >\n {content}\n <ds-icon\n class=\"tag__suffix-icon\"\n name=\"ChevronUpDown\"\n size={iconSize}\n color=\"inherit\"\n ></ds-icon>\n </button>\n </Host>\n );\n }\n}\n"],"mappings":"8KAAA,MAAMA,EAAS,IAAM,k5mBCWrB,MAAMC,EAAiD,CACrDC,GAAI,KACJC,GAAI,KACJC,GAAI,M,MAQOC,EAAGC,EAAA,MAAAD,UAAAE,EALhB,WAAAC,CAAAC,G,6EAQUC,KAAAC,KAAe,GACfD,KAAAE,OAAoB,UACpBF,KAAAG,SAAwB,QACxBH,KAAAI,KAAgB,KAEhBJ,KAAAK,QAAmB,MAEnBL,KAAAM,WAAgC,SAChCN,KAAAO,QAAmB,MAGnBP,KAAAQ,YAAuB,MAEvBR,KAAAS,SAAoB,MAIpBT,KAAAU,WAAsB,MAKtBV,KAAAW,YAAeC,IACrB,IAAKZ,KAAKQ,aAAeR,KAAKU,WAAY,OAC1CV,KAAKa,QAAQC,KAAKF,EAAM,CAsE3B,CAnEC,MAAAG,GACE,MAAMC,EAAcC,EAAqBjB,KAAKI,MAC9C,MAAMc,EAAW3B,EAAUS,KAAKI,MAChC,MAAMe,EAAcnB,KAAKK,SAAWL,KAAKM,aAAe,UAAYN,KAAKI,OAAS,KAElF,MAAMgB,EAAgBpB,KAAKqB,UAAY,KACnC,CAAEA,gBAAiBrB,KAAKqB,WAAa,SAAW,GAAGrB,KAAKqB,aAAerB,KAAKqB,UAC5EC,UACJ,MAAMC,EAAY,CAChBC,IAAO,KACP,CAAC,eAAexB,KAAKE,UAAW,KAChC,CAAC,iBAAiBF,KAAKG,YAAa,KACpC,CAAC,aAAaH,KAAKI,QAAS,KAC5B,iBAAkBJ,KAAKI,OAAS,KAChC,iBAAkBJ,KAAKI,OAAS,KAChC,iBAAkBJ,KAAKI,OAAS,KAChC,oBAAqBJ,KAAKK,UAAYc,EACtC,2BAA4BA,EAC5B,eAAgBnB,KAAKO,QACrB,mBAAoBP,KAAKQ,YACzB,sBAAuBR,KAAKQ,aAAeR,KAAKU,YAElD,MAAMe,EAAU,CACdzB,KAAKC,MACHyB,EAAA,WACEC,MAAM,mBACNC,KAAM5B,KAAKC,KACXG,KAAMc,EACNW,MAAM,YAGVH,EAAA,WAASC,MAAM,aAAaG,GAAG,OAAOC,QAASf,EAAaa,MAAM,WAC/D7B,KAAKgC,QAIV,IAAKhC,KAAKQ,YAAa,CACrB,OAAOkB,EAACO,EAAI,CAACN,MAAOJ,EAAWW,MAAOd,GAAgBK,E,CAGxD,OACEC,EAACO,EAAI,CAACN,MAAOJ,EAAWW,MAAOd,GAC7BM,EAAA,UACES,KAAK,SACLR,MAAO,CACLS,YAAe,KACf,wBAAyBpC,KAAKS,SAC9B,sBAAuB,KACvB,sBAAuB,MACxB,gBACa,OAAM,gBACLT,KAAKS,SAAW,OAAS,QAAO,gBAChCT,KAAKqC,aACpBC,SAAUtC,KAAKU,YAAcY,UAC7BiB,QAASvC,KAAKW,aAEbc,EACDC,EAAA,WACEC,MAAM,mBACNC,KAAK,gBACLxB,KAAMc,EACNW,MAAM,a","ignoreList":[]}