@ds-mo/ui 15.2.0 → 15.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (504) hide show
  1. package/dist/.package-ready.json +1 -1
  2. package/dist/agent-patterns.json +3 -3
  3. package/dist/agent.json +936 -80
  4. package/dist/angular/ds-card-setting.d.ts +1 -1
  5. package/dist/angular/ds-card-setting.js +3 -3
  6. package/dist/angular/ds-checkbox-group.d.ts +12 -0
  7. package/dist/angular/ds-checkbox-group.js +38 -0
  8. package/dist/angular/ds-checkbox.d.ts +1 -1
  9. package/dist/angular/ds-checkbox.js +3 -3
  10. package/dist/angular/ds-inline-banner-settings.d.ts +12 -0
  11. package/dist/angular/ds-inline-banner-settings.js +38 -0
  12. package/dist/angular/ds-input-time.d.ts +1 -1
  13. package/dist/angular/ds-input-time.js +3 -3
  14. package/dist/angular/ds-input.d.ts +5 -1
  15. package/dist/angular/ds-input.js +10 -4
  16. package/dist/angular/ds-map-entity-marker.d.ts +1 -1
  17. package/dist/angular/ds-map-entity-marker.js +3 -3
  18. package/dist/angular/ds-radio-tile.d.ts +15 -0
  19. package/dist/angular/ds-radio-tile.js +43 -0
  20. package/dist/angular/ds-radio.d.ts +1 -1
  21. package/dist/angular/ds-radio.js +3 -3
  22. package/dist/angular/ds-setting-row-checkbox.d.ts +12 -0
  23. package/dist/angular/ds-setting-row-checkbox.js +38 -0
  24. package/dist/angular/ds-setting-row-radio.d.ts +12 -0
  25. package/dist/angular/ds-setting-row-radio.js +38 -0
  26. package/dist/angular/ds-setting-row-toggle.d.ts +18 -0
  27. package/dist/angular/ds-setting-row-toggle.js +42 -0
  28. package/dist/angular/ds-slider.d.ts +1 -1
  29. package/dist/angular/ds-slider.js +3 -3
  30. package/dist/angular/ds-textarea.d.ts +1 -1
  31. package/dist/angular/ds-textarea.js +3 -3
  32. package/dist/angular/ds-time-picker.d.ts +1 -1
  33. package/dist/angular/ds-time-picker.js +3 -3
  34. package/dist/angular/index.d.ts +1 -1
  35. package/dist/angular/index.js +6 -0
  36. package/dist/angular/number-value-accessor.d.ts +9 -0
  37. package/dist/angular/number-value-accessor.js +39 -0
  38. package/dist/angular/proxies.d.ts +6 -0
  39. package/dist/angular/proxies.js +6 -0
  40. package/dist/angular/radio-value-accessor.d.ts +1 -1
  41. package/dist/angular/radio-value-accessor.js +2 -2
  42. package/dist/angular/select-value-accessor.d.ts +1 -1
  43. package/dist/angular/select-value-accessor.js +2 -2
  44. package/dist/angular/text-value-accessor.d.ts +1 -1
  45. package/dist/angular/text-value-accessor.js +2 -2
  46. package/dist/components/ds-agent-activity.js +1 -1
  47. package/dist/components/ds-agent-questionnaire.js +1 -1
  48. package/dist/components/ds-agent-response.js +1 -1
  49. package/dist/components/ds-agent-response.js.map +1 -1
  50. package/dist/components/ds-agent-source-list.js +1 -1
  51. package/dist/components/ds-agent-tool-call.js +1 -1
  52. package/dist/components/ds-attachment-list.js +1 -1
  53. package/dist/components/ds-badge.js +1 -1
  54. package/dist/components/ds-banner.js +1 -1
  55. package/dist/components/ds-bar-action.js +1 -1
  56. package/dist/components/ds-bar-nav.js +1 -1
  57. package/dist/components/ds-bar-page-title.js +1 -1
  58. package/dist/components/ds-bar-title.js +1 -1
  59. package/dist/components/ds-bar-workflow.js +1 -1
  60. package/dist/components/ds-breadcrumb.js +1 -1
  61. package/dist/components/ds-button-filled.js +1 -1
  62. package/dist/components/ds-button-inverted.js +1 -1
  63. package/dist/components/ds-button-inverted.js.map +1 -1
  64. package/dist/components/ds-button-unfilled.js +1 -1
  65. package/dist/components/ds-calendar.js +1 -1
  66. package/dist/components/ds-card-action-center.js +1 -1
  67. package/dist/components/ds-card-action-center.js.map +1 -1
  68. package/dist/components/ds-card-chart.js +1 -1
  69. package/dist/components/ds-card-navigation.js +1 -1
  70. package/dist/components/ds-card-navigation.js.map +1 -1
  71. package/dist/components/ds-card-overview.js +1 -1
  72. package/dist/components/ds-card-overview.js.map +1 -1
  73. package/dist/components/ds-card-setting.js +1 -1
  74. package/dist/components/ds-card-setting.js.map +1 -1
  75. package/dist/components/ds-card-settings-scope.js +1 -1
  76. package/dist/components/ds-card-settings-scope.js.map +1 -1
  77. package/dist/components/ds-chart-legend.js +1 -1
  78. package/dist/components/ds-chart-legend.js.map +1 -1
  79. package/dist/components/ds-chart.js +1 -1
  80. package/dist/components/ds-checkbox-group.d.ts +11 -0
  81. package/dist/components/ds-checkbox-group.js +2 -0
  82. package/dist/components/ds-checkbox-group.js.map +1 -0
  83. package/dist/components/ds-checkbox.js +1 -1
  84. package/dist/components/ds-chip.js +1 -1
  85. package/dist/components/ds-code-block.js +1 -1
  86. package/dist/components/ds-conversation-list-item.js +1 -1
  87. package/dist/components/ds-conversation-list-item.js.map +1 -1
  88. package/dist/components/ds-conversation-list-section.js +1 -1
  89. package/dist/components/ds-conversation-list.js +1 -1
  90. package/dist/components/ds-data-customize.js +1 -1
  91. package/dist/components/ds-data-customize.js.map +1 -1
  92. package/dist/components/ds-data-filter.js +1 -1
  93. package/dist/components/ds-data-filter.js.map +1 -1
  94. package/dist/components/ds-data-group.js +1 -1
  95. package/dist/components/ds-data-preferences.js +1 -1
  96. package/dist/components/ds-data-preferences.js.map +1 -1
  97. package/dist/components/ds-data-saved-views.js +1 -1
  98. package/dist/components/ds-data-saved-views.js.map +1 -1
  99. package/dist/components/ds-data-search.js +1 -1
  100. package/dist/components/ds-data-search.js.map +1 -1
  101. package/dist/components/ds-data-sort.js +1 -1
  102. package/dist/components/ds-data-toolbar.js +1 -1
  103. package/dist/components/ds-divider.js +1 -1
  104. package/dist/components/ds-empty-state.js +1 -1
  105. package/dist/components/ds-field.js +1 -1
  106. package/dist/components/ds-filter-menu.js +1 -1
  107. package/dist/components/ds-inline-banner-settings.d.ts +11 -0
  108. package/dist/components/ds-inline-banner-settings.js +2 -0
  109. package/dist/components/ds-inline-banner-settings.js.map +1 -0
  110. package/dist/components/ds-input-date.js +1 -1
  111. package/dist/components/ds-input-date.js.map +1 -1
  112. package/dist/components/ds-input-time.js +1 -1
  113. package/dist/components/ds-input-time.js.map +1 -1
  114. package/dist/components/ds-input.js +1 -1
  115. package/dist/components/ds-map-cluster-marker.js +1 -1
  116. package/dist/components/ds-map-entity-marker.js +1 -1
  117. package/dist/components/ds-map-entity-marker.js.map +1 -1
  118. package/dist/components/ds-markdown.js +1 -1
  119. package/dist/components/ds-menu.js +1 -1
  120. package/dist/components/ds-message-actions.js +1 -1
  121. package/dist/components/ds-message-bubble.js +1 -1
  122. package/dist/components/ds-message-bubble.js.map +1 -1
  123. package/dist/components/ds-message-composer.js +1 -1
  124. package/dist/components/ds-message-composer.js.map +1 -1
  125. package/dist/components/ds-message-scroller.js +1 -1
  126. package/dist/components/ds-message.js +1 -1
  127. package/dist/components/ds-mobile-bar-nav.js +1 -1
  128. package/dist/components/ds-mobile-header.js +1 -1
  129. package/dist/components/ds-mobile-section-switcher.js +1 -1
  130. package/dist/components/ds-mobile-sheet-nav.js +1 -1
  131. package/dist/components/ds-modal.js +1 -1
  132. package/dist/components/ds-pagination.js +1 -1
  133. package/dist/components/ds-panel-nav.js +1 -1
  134. package/dist/components/ds-panel-sub-nav.js +1 -1
  135. package/dist/components/ds-panel-sub-nav.js.map +1 -1
  136. package/dist/components/ds-panel-tool-header.js +1 -1
  137. package/dist/components/ds-panel-tool-search.js +1 -1
  138. package/dist/components/ds-panel-tool-search.js.map +1 -1
  139. package/dist/components/ds-panel-tools.js +1 -1
  140. package/dist/components/ds-paper-texture.js +1 -1
  141. package/dist/components/ds-radio-tile.d.ts +11 -0
  142. package/dist/components/ds-radio-tile.js +2 -0
  143. package/dist/components/ds-radio-tile.js.map +1 -0
  144. package/dist/components/ds-radio.js +1 -1
  145. package/dist/components/ds-score.js +1 -1
  146. package/dist/components/ds-scroll-overlay.js +1 -1
  147. package/dist/components/ds-select.js +1 -1
  148. package/dist/components/ds-setting-row-checkbox.d.ts +11 -0
  149. package/dist/components/ds-setting-row-checkbox.js +2 -0
  150. package/dist/components/ds-setting-row-checkbox.js.map +1 -0
  151. package/dist/components/ds-setting-row-radio.d.ts +11 -0
  152. package/dist/components/ds-setting-row-radio.js +2 -0
  153. package/dist/components/ds-setting-row-radio.js.map +1 -0
  154. package/dist/components/ds-setting-row-toggle.d.ts +11 -0
  155. package/dist/components/ds-setting-row-toggle.js +2 -0
  156. package/dist/components/ds-setting-row-toggle.js.map +1 -0
  157. package/dist/components/ds-shell-app.js +1 -1
  158. package/dist/components/ds-shell-app.js.map +1 -1
  159. package/dist/components/ds-shell-page.js +1 -1
  160. package/dist/components/ds-shell-tools.js +1 -1
  161. package/dist/components/ds-skeleton.js +1 -1
  162. package/dist/components/ds-slider.js +1 -1
  163. package/dist/components/ds-slider.js.map +1 -1
  164. package/dist/components/ds-swatch-picker.js +1 -1
  165. package/dist/components/ds-switch.js +1 -1
  166. package/dist/components/ds-tab-group.js +1 -1
  167. package/dist/components/ds-table.js +1 -1
  168. package/dist/components/ds-table.js.map +1 -1
  169. package/dist/components/ds-tag.js +1 -1
  170. package/dist/components/ds-text.js +1 -1
  171. package/dist/components/ds-textarea.js +1 -1
  172. package/dist/components/ds-textarea.js.map +1 -1
  173. package/dist/components/ds-time-picker.js +1 -1
  174. package/dist/components/ds-toast.js +1 -1
  175. package/dist/components/ds-tooltip-chart.js +1 -1
  176. package/dist/components/ds-tooltip.js +1 -1
  177. package/dist/components/ds-typing-indicator.js +1 -1
  178. package/dist/components/p-7TVdPhGR.js +2 -0
  179. package/dist/components/{p-YrnU2fM7.js.map → p-7TVdPhGR.js.map} +1 -1
  180. package/dist/components/{p-7V1AhetH.js → p-B0BQCVkq.js} +2 -2
  181. package/dist/components/p-B0EpvBDs.js +2 -0
  182. package/dist/components/{p-lamoJZE4.js.map → p-B0EpvBDs.js.map} +1 -1
  183. package/dist/components/{p-Cu8o2rOz.js → p-B39iJO8F.js} +2 -2
  184. package/dist/components/p-B9TM6FqC.js +2 -0
  185. package/dist/components/{p-BJJh-Bf7.js.map → p-B9TM6FqC.js.map} +1 -1
  186. package/dist/components/{p-B6qQaYkB.js → p-B9y6azEw.js} +2 -2
  187. package/dist/components/p-BDdlJZyL.js +2 -0
  188. package/dist/components/{p-CZ7hxDy_.js.map → p-BDdlJZyL.js.map} +1 -1
  189. package/dist/components/{p-5SVmAjXY.js → p-BERXvOCf.js} +2 -2
  190. package/dist/components/{p-xhn1cZgU.js → p-BFHpU-uU.js} +2 -2
  191. package/dist/components/{p-CuWPWC3t.js → p-BQspV5U7.js} +2 -2
  192. package/dist/components/p-BWSIw8AQ.js +2 -0
  193. package/dist/components/p-BWSIw8AQ.js.map +1 -0
  194. package/dist/components/p-BhjqYTiY.js +2 -0
  195. package/dist/components/p-BhjqYTiY.js.map +1 -0
  196. package/dist/components/{p-BOhefRMt.js → p-Bk3poU91.js} +2 -2
  197. package/dist/components/{p-QWukusRL.js → p-BnuNaXR2.js} +2 -2
  198. package/dist/components/p-BwdnVqAY.js +2 -0
  199. package/dist/components/p-BwdnVqAY.js.map +1 -0
  200. package/dist/components/p-C4huuwed.js +2 -0
  201. package/dist/components/{p-CRk0TjQv.js.map → p-C4huuwed.js.map} +1 -1
  202. package/dist/components/{p-BtnTQp4K.js → p-C8V4lkVy.js} +2 -2
  203. package/dist/components/p-CJ1NnOEW.js +2 -0
  204. package/dist/components/p-CJ1NnOEW.js.map +1 -0
  205. package/dist/components/p-CPamUzaj.js +2 -0
  206. package/dist/components/{p-CNZ6-kWd.js.map → p-CPamUzaj.js.map} +1 -1
  207. package/dist/components/{p-Dqfc6Nvd.js → p-CUDocY23.js} +2 -2
  208. package/dist/components/{p-Dqfc6Nvd.js.map → p-CUDocY23.js.map} +1 -1
  209. package/dist/components/p-CX6ZxUQT.js +2 -0
  210. package/dist/components/p-CX6ZxUQT.js.map +1 -0
  211. package/dist/components/p-CZNZTcYS.js +2 -0
  212. package/dist/components/p-CZNZTcYS.js.map +1 -0
  213. package/dist/components/p-CbCN9ew9.js +2 -0
  214. package/dist/components/p-CbCN9ew9.js.map +1 -0
  215. package/dist/components/p-CeXf9-X3.js.map +1 -1
  216. package/dist/components/p-Cgn-BORA.js +2 -0
  217. package/dist/components/p-Cgn-BORA.js.map +1 -0
  218. package/dist/components/{p-mux14tWZ.js → p-Co1rUdOR.js} +2 -2
  219. package/dist/components/p-Co1rUdOR.js.map +1 -0
  220. package/dist/components/{p-CGidq1iC.js → p-CuwopElg.js} +2 -2
  221. package/dist/components/p-CwUXroLs.js +2 -0
  222. package/dist/components/{p-etg-Uk1u.js.map → p-CwUXroLs.js.map} +1 -1
  223. package/dist/components/{p-Cn6AfzeF.js → p-CwdRaJER.js} +2 -2
  224. package/dist/components/p-D6FRqNhN.js +2 -0
  225. package/dist/components/p-D6FRqNhN.js.map +1 -0
  226. package/dist/components/{p-ZwRLjD5M.js → p-D8OWhnID.js} +2 -2
  227. package/dist/components/p-DCyJ3_PL.js +2 -0
  228. package/dist/components/{p-BZ_e69zx.js.map → p-DCyJ3_PL.js.map} +1 -1
  229. package/dist/components/{p-C_Ma6Xa-.js → p-DIQiHX0q.js} +2 -2
  230. package/dist/components/{p-B3CZvMXs.js → p-DJDbskZf.js} +2 -2
  231. package/dist/components/p-DRdoGSGX.js +2 -0
  232. package/dist/components/{p-CTGgXIXM.js.map → p-DRdoGSGX.js.map} +1 -1
  233. package/dist/components/{p-C1gaWjOm.js → p-DSZPO06T.js} +2 -2
  234. package/dist/components/{p-uADksYMl.js → p-DSmDyI2o.js} +2 -2
  235. package/dist/components/{p-UY63jmrO.js → p-DVEx-Xg9.js} +2 -2
  236. package/dist/components/p-DXk1eml1.js +2 -0
  237. package/dist/components/{p-Dlp1HqgS.js.map → p-DXk1eml1.js.map} +1 -1
  238. package/dist/components/{p-p0FVyEFa.js → p-DYQa1DVF.js} +2 -2
  239. package/dist/components/p-DYQa1DVF.js.map +1 -0
  240. package/dist/components/p-DYsE6HLk.js +2 -0
  241. package/dist/components/p-DYsE6HLk.js.map +1 -0
  242. package/dist/components/{p-vfCu7XSc.js → p-DZ58Sg5a.js} +2 -2
  243. package/dist/components/p-DebLYW7A.js +2 -0
  244. package/dist/components/p-DebLYW7A.js.map +1 -0
  245. package/dist/components/p-DhKvqh5G.js +2 -0
  246. package/dist/components/p-DhKvqh5G.js.map +1 -0
  247. package/dist/components/{p-DFO5lV_A.js → p-DmSnHVW6.js} +2 -2
  248. package/dist/components/p-Dnt5xUBD.js +2 -0
  249. package/dist/components/{p-BR5OC2PX.js.map → p-Dnt5xUBD.js.map} +1 -1
  250. package/dist/components/p-Doa2blZT.js +2 -0
  251. package/dist/components/{p-BLuqpHvp.js.map → p-Doa2blZT.js.map} +1 -1
  252. package/dist/components/{p-DsLXlxt3.js → p-Dyqd-cub.js} +2 -2
  253. package/dist/components/p-Dyqd-cub.js.map +1 -0
  254. package/dist/components/p-DzvTC27M.js +2 -0
  255. package/dist/components/p-DzvTC27M.js.map +1 -0
  256. package/dist/components/p-JBki_jyY.js +2 -0
  257. package/dist/components/{p-C0JkLR83.js.map → p-JBki_jyY.js.map} +1 -1
  258. package/dist/components/p-MOJmB6vX.js +2 -0
  259. package/dist/components/{p-BzYW1IqO.js.map → p-MOJmB6vX.js.map} +1 -1
  260. package/dist/components/p-TVkFIMXz.js +2 -0
  261. package/dist/components/p-TVkFIMXz.js.map +1 -0
  262. package/dist/components/{p-ER5M085B.js → p-UJMEz8_O.js} +2 -2
  263. package/dist/components/{p-CR-Jjdcn.js → p-_IqSPt5V.js} +2 -2
  264. package/dist/components/p-g0jsfEXz.js +2 -0
  265. package/dist/components/{p-BfF4RZdp.js.map → p-g0jsfEXz.js.map} +1 -1
  266. package/dist/components/{p-BLSSaVWm.js → p-pp1IQN4Z.js} +2 -2
  267. package/dist/docs/components.json +2901 -835
  268. package/dist/framework/angular.d.ts +1 -0
  269. package/dist/framework/angular.js +1 -0
  270. package/dist/lib/shell/index.js +1 -1
  271. package/dist/lib/shell/index.js.map +1 -1
  272. package/dist/lint/index.js +1 -1
  273. package/dist/mcp-data/registry/agent-activity.json +2 -2
  274. package/dist/mcp-data/registry/agent-questionnaire.json +2 -2
  275. package/dist/mcp-data/registry/agent-response.json +3 -3
  276. package/dist/mcp-data/registry/agent-source-list.json +2 -2
  277. package/dist/mcp-data/registry/agent-tool-call.json +2 -2
  278. package/dist/mcp-data/registry/attachment-list.json +2 -2
  279. package/dist/mcp-data/registry/avatar.json +2 -2
  280. package/dist/mcp-data/registry/badge.json +2 -2
  281. package/dist/mcp-data/registry/banner.json +2 -2
  282. package/dist/mcp-data/registry/bar-action.json +2 -2
  283. package/dist/mcp-data/registry/bar-nav.json +5 -5
  284. package/dist/mcp-data/registry/bar-page-title.json +4 -4
  285. package/dist/mcp-data/registry/bar-title.json +4 -4
  286. package/dist/mcp-data/registry/bar-workflow.json +2 -2
  287. package/dist/mcp-data/registry/breadcrumb.json +2 -2
  288. package/dist/mcp-data/registry/button-filled.json +2 -2
  289. package/dist/mcp-data/registry/button-inverted.json +2 -2
  290. package/dist/mcp-data/registry/button-unfilled.json +9 -9
  291. package/dist/mcp-data/registry/calendar.json +2 -2
  292. package/dist/mcp-data/registry/card-action-center.json +2 -2
  293. package/dist/mcp-data/registry/card-chart.json +2 -2
  294. package/dist/mcp-data/registry/card-navigation.json +2 -2
  295. package/dist/mcp-data/registry/card-overview.json +2 -2
  296. package/dist/mcp-data/registry/card-setting.json +50 -15
  297. package/dist/mcp-data/registry/card-settings-scope.json +2 -2
  298. package/dist/mcp-data/registry/chart-legend.json +2 -2
  299. package/dist/mcp-data/registry/chart.json +2 -2
  300. package/dist/mcp-data/registry/checkbox-group.json +246 -0
  301. package/dist/mcp-data/registry/checkbox.json +26 -6
  302. package/dist/mcp-data/registry/chip.json +2 -2
  303. package/dist/mcp-data/registry/code-block.json +2 -2
  304. package/dist/mcp-data/registry/conversation-list-item.json +2 -2
  305. package/dist/mcp-data/registry/conversation-list-section.json +2 -2
  306. package/dist/mcp-data/registry/conversation-list.json +2 -2
  307. package/dist/mcp-data/registry/data-customize.json +3 -3
  308. package/dist/mcp-data/registry/data-filter.json +2 -2
  309. package/dist/mcp-data/registry/data-group.json +2 -2
  310. package/dist/mcp-data/registry/data-preferences.json +2 -2
  311. package/dist/mcp-data/registry/data-saved-views.json +2 -2
  312. package/dist/mcp-data/registry/data-search.json +2 -2
  313. package/dist/mcp-data/registry/data-sort.json +2 -2
  314. package/dist/mcp-data/registry/data-toolbar.json +2 -2
  315. package/dist/mcp-data/registry/divider.json +2 -2
  316. package/dist/mcp-data/registry/empty-state.json +27 -14
  317. package/dist/mcp-data/registry/field.json +6 -5
  318. package/dist/mcp-data/registry/filter-menu.json +2 -2
  319. package/dist/mcp-data/registry/icon.json +2 -2
  320. package/dist/mcp-data/registry/inline-banner-settings.json +175 -0
  321. package/dist/mcp-data/registry/input-date.json +2 -2
  322. package/dist/mcp-data/registry/input-time.json +26 -7
  323. package/dist/mcp-data/registry/input.json +265 -15
  324. package/dist/mcp-data/registry/loader.json +2 -2
  325. package/dist/mcp-data/registry/map-cluster-marker.json +3 -3
  326. package/dist/mcp-data/registry/map-entity-marker.json +56 -56
  327. package/dist/mcp-data/registry/markdown.json +2 -2
  328. package/dist/mcp-data/registry/menu.json +2 -2
  329. package/dist/mcp-data/registry/message-actions.json +2 -2
  330. package/dist/mcp-data/registry/message-bubble.json +5 -5
  331. package/dist/mcp-data/registry/message-composer.json +7 -7
  332. package/dist/mcp-data/registry/message-scroller.json +2 -2
  333. package/dist/mcp-data/registry/message.json +3 -3
  334. package/dist/mcp-data/registry/mobile-bar-nav.json +2 -2
  335. package/dist/mcp-data/registry/mobile-header.json +2 -2
  336. package/dist/mcp-data/registry/mobile-section-switcher.json +2 -2
  337. package/dist/mcp-data/registry/mobile-sheet-nav.json +2 -2
  338. package/dist/mcp-data/registry/modal.json +2 -2
  339. package/dist/mcp-data/registry/pagination.json +2 -2
  340. package/dist/mcp-data/registry/panel-nav.json +4 -4
  341. package/dist/mcp-data/registry/panel-sub-nav.json +2 -2
  342. package/dist/mcp-data/registry/panel-tool-header.json +4 -4
  343. package/dist/mcp-data/registry/panel-tool-search.json +3 -3
  344. package/dist/mcp-data/registry/panel-tools.json +4 -4
  345. package/dist/mcp-data/registry/paper-texture.json +2 -2
  346. package/dist/mcp-data/registry/radio-tile.json +399 -0
  347. package/dist/mcp-data/registry/radio.json +51 -9
  348. package/dist/mcp-data/registry/registry.json +954 -80
  349. package/dist/mcp-data/registry/score.json +2 -2
  350. package/dist/mcp-data/registry/scroll-overlay.json +2 -2
  351. package/dist/mcp-data/registry/select.json +2 -2
  352. package/dist/mcp-data/registry/setting-row-checkbox.json +197 -0
  353. package/dist/mcp-data/registry/setting-row-radio.json +196 -0
  354. package/dist/mcp-data/registry/setting-row-toggle.json +233 -0
  355. package/dist/mcp-data/registry/shell-app.json +4 -4
  356. package/dist/mcp-data/registry/shell-page.json +2 -2
  357. package/dist/mcp-data/registry/shell-tools.json +2 -2
  358. package/dist/mcp-data/registry/skeleton.json +2 -2
  359. package/dist/mcp-data/registry/slider.json +32 -12
  360. package/dist/mcp-data/registry/swatch-picker.json +2 -2
  361. package/dist/mcp-data/registry/switch.json +4 -4
  362. package/dist/mcp-data/registry/tab-group.json +2 -2
  363. package/dist/mcp-data/registry/table.json +5 -5
  364. package/dist/mcp-data/registry/tag.json +2 -2
  365. package/dist/mcp-data/registry/text.json +2 -2
  366. package/dist/mcp-data/registry/textarea.json +72 -5
  367. package/dist/mcp-data/registry/time-picker.json +28 -9
  368. package/dist/mcp-data/registry/toast.json +2 -2
  369. package/dist/mcp-data/registry/tooltip-chart.json +2 -2
  370. package/dist/mcp-data/registry/tooltip.json +2 -2
  371. package/dist/mcp-data/registry/typing-indicator.json +2 -2
  372. package/dist/react/components.d.ts +6 -0
  373. package/dist/react/components.js +6 -0
  374. package/dist/react/ds-checkbox-group.d.ts +9 -0
  375. package/dist/react/ds-checkbox-group.js +12 -0
  376. package/dist/react/ds-inline-banner-settings.d.ts +9 -0
  377. package/dist/react/ds-inline-banner-settings.js +12 -0
  378. package/dist/react/ds-input.d.ts +2 -0
  379. package/dist/react/ds-input.js +2 -0
  380. package/dist/react/ds-radio-tile.d.ts +12 -0
  381. package/dist/react/ds-radio-tile.js +12 -0
  382. package/dist/react/ds-setting-row-checkbox.d.ts +9 -0
  383. package/dist/react/ds-setting-row-checkbox.js +12 -0
  384. package/dist/react/ds-setting-row-radio.d.ts +9 -0
  385. package/dist/react/ds-setting-row-radio.js +12 -0
  386. package/dist/react/ds-setting-row-toggle.d.ts +12 -0
  387. package/dist/react/ds-setting-row-toggle.js +12 -0
  388. package/dist/types/components/BarPageTitle/BarPageTitle.d.ts +2 -0
  389. package/dist/types/components/BarTitle/bar-title-action-chrome.d.ts +4 -0
  390. package/dist/types/components/ButtonUnfilled/ButtonUnfilled.d.ts +5 -2
  391. package/dist/types/components/CardSetting/CardSetting.d.ts +15 -3
  392. package/dist/types/components/CardSetting/index.d.ts +1 -1
  393. package/dist/types/components/Checkbox/Checkbox.d.ts +2 -0
  394. package/dist/types/components/CheckboxGroup/CheckboxGroup.d.ts +20 -0
  395. package/dist/types/components/EmptyState/EmptyState.d.ts +3 -0
  396. package/dist/types/components/Field/Field.d.ts +4 -0
  397. package/dist/types/components/InlineBannerSettings/InlineBannerSettings.d.ts +6 -0
  398. package/dist/types/components/Input/Input.d.ts +50 -1
  399. package/dist/types/components/InputTime/InputTime.d.ts +3 -0
  400. package/dist/types/components/MapEntityMarker/MapEntityMarker.d.ts +5 -5
  401. package/dist/types/components/Radio/Radio.d.ts +8 -0
  402. package/dist/types/components/RadioTile/RadioTile.d.ts +40 -0
  403. package/dist/types/components/RadioTile/index.d.ts +2 -0
  404. package/dist/types/components/SettingRowCheckbox/SettingRowCheckbox.d.ts +19 -0
  405. package/dist/types/components/SettingRowRadio/SettingRowRadio.d.ts +19 -0
  406. package/dist/types/components/SettingRowToggle/SettingRowToggle.d.ts +21 -0
  407. package/dist/types/components/Slider/Slider.d.ts +8 -1
  408. package/dist/types/components/Slider/index.d.ts +1 -1
  409. package/dist/types/components/Switch/Switch.d.ts +7 -0
  410. package/dist/types/components/Textarea/Textarea.d.ts +12 -0
  411. package/dist/types/components/TimePicker/TimePicker.d.ts +4 -0
  412. package/dist/types/components.d.ts +728 -37
  413. package/dist/types/utils/text-constraints.d.ts +20 -0
  414. package/dist/vue/components.d.ts +6 -0
  415. package/dist/vue/components.js +6 -0
  416. package/dist/vue/ds-card-setting.js +1 -0
  417. package/dist/vue/ds-checkbox-group.d.ts +3 -0
  418. package/dist/vue/ds-checkbox-group.js +12 -0
  419. package/dist/vue/ds-checkbox.js +1 -0
  420. package/dist/vue/ds-inline-banner-settings.d.ts +3 -0
  421. package/dist/vue/ds-inline-banner-settings.js +8 -0
  422. package/dist/vue/ds-input-time.js +1 -0
  423. package/dist/vue/ds-input.js +17 -0
  424. package/dist/vue/ds-map-entity-marker.js +2 -2
  425. package/dist/vue/ds-radio-tile.d.ts +3 -0
  426. package/dist/vue/ds-radio-tile.js +24 -0
  427. package/dist/vue/ds-radio.js +2 -0
  428. package/dist/vue/ds-setting-row-checkbox.d.ts +3 -0
  429. package/dist/vue/ds-setting-row-checkbox.js +11 -0
  430. package/dist/vue/ds-setting-row-radio.d.ts +3 -0
  431. package/dist/vue/ds-setting-row-radio.js +11 -0
  432. package/dist/vue/ds-setting-row-toggle.d.ts +3 -0
  433. package/dist/vue/ds-setting-row-toggle.js +15 -0
  434. package/dist/vue/ds-slider.d.ts +1 -1
  435. package/dist/vue/ds-slider.js +2 -1
  436. package/dist/vue/ds-textarea.js +4 -0
  437. package/dist/vue/ds-time-picker.js +1 -0
  438. package/package.json +5 -5
  439. package/dist/components/p-BCnzbfma.js +0 -2
  440. package/dist/components/p-BCnzbfma.js.map +0 -1
  441. package/dist/components/p-BJJh-Bf7.js +0 -2
  442. package/dist/components/p-BLuqpHvp.js +0 -2
  443. package/dist/components/p-BR5OC2PX.js +0 -2
  444. package/dist/components/p-BX506yEW.js +0 -2
  445. package/dist/components/p-BX506yEW.js.map +0 -1
  446. package/dist/components/p-BZ_e69zx.js +0 -2
  447. package/dist/components/p-BfF4RZdp.js +0 -2
  448. package/dist/components/p-Br5e83Fr.js +0 -2
  449. package/dist/components/p-Br5e83Fr.js.map +0 -1
  450. package/dist/components/p-Bv9rSkp0.js +0 -2
  451. package/dist/components/p-Bv9rSkp0.js.map +0 -1
  452. package/dist/components/p-BzYW1IqO.js +0 -2
  453. package/dist/components/p-C0JkLR83.js +0 -2
  454. package/dist/components/p-C6Aavz9h.js +0 -2
  455. package/dist/components/p-C6Aavz9h.js.map +0 -1
  456. package/dist/components/p-C6zycbhC.js +0 -2
  457. package/dist/components/p-C6zycbhC.js.map +0 -1
  458. package/dist/components/p-CNZ6-kWd.js +0 -2
  459. package/dist/components/p-CRk0TjQv.js +0 -2
  460. package/dist/components/p-CTGgXIXM.js +0 -2
  461. package/dist/components/p-CZ7hxDy_.js +0 -2
  462. package/dist/components/p-Cc3ZUQlJ.js +0 -2
  463. package/dist/components/p-Cc3ZUQlJ.js.map +0 -1
  464. package/dist/components/p-D5HxZrMA.js +0 -2
  465. package/dist/components/p-D5HxZrMA.js.map +0 -1
  466. package/dist/components/p-D7K1ZHML.js +0 -2
  467. package/dist/components/p-D7K1ZHML.js.map +0 -1
  468. package/dist/components/p-Dlp1HqgS.js +0 -2
  469. package/dist/components/p-DsLXlxt3.js.map +0 -1
  470. package/dist/components/p-YrnU2fM7.js +0 -2
  471. package/dist/components/p-ZYWnJaye.js +0 -2
  472. package/dist/components/p-ZYWnJaye.js.map +0 -1
  473. package/dist/components/p-etg-Uk1u.js +0 -2
  474. package/dist/components/p-lamoJZE4.js +0 -2
  475. package/dist/components/p-mV4vSjSK.js +0 -2
  476. package/dist/components/p-mV4vSjSK.js.map +0 -1
  477. package/dist/components/p-mux14tWZ.js.map +0 -1
  478. package/dist/components/p-mxZoWfnS.js +0 -2
  479. package/dist/components/p-mxZoWfnS.js.map +0 -1
  480. package/dist/components/p-p0FVyEFa.js.map +0 -1
  481. package/dist/components/p-xtGGIZmU.js +0 -2
  482. package/dist/components/p-xtGGIZmU.js.map +0 -1
  483. /package/dist/components/{p-7V1AhetH.js.map → p-B0BQCVkq.js.map} +0 -0
  484. /package/dist/components/{p-Cu8o2rOz.js.map → p-B39iJO8F.js.map} +0 -0
  485. /package/dist/components/{p-B6qQaYkB.js.map → p-B9y6azEw.js.map} +0 -0
  486. /package/dist/components/{p-5SVmAjXY.js.map → p-BERXvOCf.js.map} +0 -0
  487. /package/dist/components/{p-xhn1cZgU.js.map → p-BFHpU-uU.js.map} +0 -0
  488. /package/dist/components/{p-CuWPWC3t.js.map → p-BQspV5U7.js.map} +0 -0
  489. /package/dist/components/{p-BOhefRMt.js.map → p-Bk3poU91.js.map} +0 -0
  490. /package/dist/components/{p-QWukusRL.js.map → p-BnuNaXR2.js.map} +0 -0
  491. /package/dist/components/{p-BtnTQp4K.js.map → p-C8V4lkVy.js.map} +0 -0
  492. /package/dist/components/{p-CGidq1iC.js.map → p-CuwopElg.js.map} +0 -0
  493. /package/dist/components/{p-Cn6AfzeF.js.map → p-CwdRaJER.js.map} +0 -0
  494. /package/dist/components/{p-ZwRLjD5M.js.map → p-D8OWhnID.js.map} +0 -0
  495. /package/dist/components/{p-C_Ma6Xa-.js.map → p-DIQiHX0q.js.map} +0 -0
  496. /package/dist/components/{p-B3CZvMXs.js.map → p-DJDbskZf.js.map} +0 -0
  497. /package/dist/components/{p-C1gaWjOm.js.map → p-DSZPO06T.js.map} +0 -0
  498. /package/dist/components/{p-uADksYMl.js.map → p-DSmDyI2o.js.map} +0 -0
  499. /package/dist/components/{p-UY63jmrO.js.map → p-DVEx-Xg9.js.map} +0 -0
  500. /package/dist/components/{p-vfCu7XSc.js.map → p-DZ58Sg5a.js.map} +0 -0
  501. /package/dist/components/{p-DFO5lV_A.js.map → p-DmSnHVW6.js.map} +0 -0
  502. /package/dist/components/{p-ER5M085B.js.map → p-UJMEz8_O.js.map} +0 -0
  503. /package/dist/components/{p-CR-Jjdcn.js.map → p-_IqSPt5V.js.map} +0 -0
  504. /package/dist/components/{p-BLSSaVWm.js.map → p-pp1IQN4Z.js.map} +0 -0
@@ -1 +0,0 @@
1
- {"version":3,"names":["PANEL_TOOLS_TOOL_IDS","PANEL_TOOLS_PRIMARY_TOOL_ID","PANEL_TOOLS_LABELS","search","messages","stacks","activity","agents","help","PANEL_TOOLS_SHORTCUTS","PANEL_TOOLS_DEFAULT_ITEMS","id","icon","label","railPlacement","order","shortcutKey","mobileDestination","PANEL_TOOLS_REGION_ORDER","header","body","footer","panelToolsItemOrder","item","canonical","findIndex","Number","MAX_SAFE_INTEGER","orderPanelToolsItems","items","firstById","Map","trim","has","set","Array","from","values","sort","left","right","leftRegion","panelToolsRailPlacement","rightRegion","regionDelta","orderPanelToolsRailEntries","accessories","toolEntries","map","type","firstAccessoryById","accessory","accessoryEntries","leftPlacement","rightPlacement","leftOrder","rightOrder","panelToolsRailFocusKeys","entries","flatMap","entry","action","isInactive","keys","primaryAction","secondaryAction","push","reconcilePanelToolsRovingIndex","previousKeys","nextKeys","currentIndex","length","currentKey","preservedIndex","indexOf","index","nextIndex","Math","min","max","panelToolsRailAccessoryActionDetail","accessoryId","actionId","anchor","isPanelToolsToolId","value","reconcilePanelToolsAvailability","open","activeTool","some","removedTool","panelToolsDrawerTransitionMs","style","properties","transitionProperty","split","durations","transitionDuration","parseCssTimeMs","delays","transitionDelay","reduce","property","duration","delay","panelToolsDrawerResting","motion","panelToolsDrawerAtTerminal","width","targetWidth","resolvePanelToolActivation","selected","panelToolsCss","PanelTools","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","presentation","fullscreenHeaderMode","toolsLabel","toolShortcutsLabel","headers","storageKey","drawerSurfaceRetained","readyForMotion","presentationMotionSuppressed","rovingIndex","fullViewToolIds","railBodyScrollable","motionEnableGeneration","presentationMotionGeneration","transitionGeneration","transitionFallbackTimer","ignoreReplacementTerminal","focusBeforeFullscreen","fullViewObserver","handleComposedHeaderAction","event","detail","stopPropagation","dsHeaderAction","emit","tool","handleTransitionEnd","drawer","renderRoot","querySelector","target","propertyName","drawerTransitionAtTerminal","finishDrawerTransition","handleToolChange","next","dsToolChange","handleRailKeyDown","e","activate","orderedRailEntries","key","preventDefault","focusRailAt","railItems","orderedRailItems","railAccessories","disconnectedCallback","el","removeEventListener","clearTransitionCompletion","disconnect","disconnectRailBodyObserver","presentationChanged","previous","getAttribute","setAttribute","presentationGeneration","requestAnimationFrame","document","activeElement","fallbackActionId","activeHeader","actions","async","isConnected","focus","preventScroll","focusRestored","contains","focusHeaderAction","dsPresentationChange","handleFullscreenEscape","deferMotionEnable","generation","connectedCallback","ANCHORED_OVERLAY_BOUNDARY_ATTRIBUTE","addEventListener","componentWillLoad","restoreLastActiveTool","openChanged","isOpen","wasOpen","undefined","startDrawerTransition","activeToolChanged","persistLastActiveTool","storageKeyChanged","componentDidLoad","connectRailBodyObserver","updateRailBodyScrollable","syncFullViewTools","MutationObserver","observe","childList","attributes","attributeFilter","componentDidRender","railBodyEl","ResizeObserver","railBodyObserver","Boolean","scrollHeight","clientHeight","itemsChanged","reconcileActiveTool","accessoriesChanged","focusedKey","closest","dataset","railFocusKey","focusedIndex","restoreFocus","includes","stored","localStorage","getItem","setItem","clearPersistedTool","removeItem","phase","dsChromeTransitionStart","source","fallbackMs","getComputedStyle","window","setTimeout","getBoundingClientRect","surface","completedPhase","wasTransitioning","dsChromeTransitionEnd","clearTimeout","isRailSelected","isDrawerPresent","isViewActive","hasFullView","ids","filter","join","shadowRoot","accessibleLabel","find","candidate","resolvedHeaders","activateTool","closeDrawer","CSS","escape","setFocus","bounded","renderRailAction","focusKey","ariaLabel","h","side","size","boundary","variant","class","isActive","activeFill","hasBorder","pressScale","dot","focusTabIndex","pressed","onFocusin","onKeyDown","onDsClick","accessoryPrimaryLabel","actionLabel","status","statusText","emitAccessoryAction","dsRailAccessoryAction","renderAccessoryVisual","visual","src","alt","initial","slice","as","emphasis","color","name","renderRailShortcut","focusIndexes","focusIndex","get","initials","disabled","tabIndex","onFocus","onClick","currentTarget","background","renderRailAccessory","primaryKey","primaryIndex","primaryLabel","secondary","secondaryKey","secondaryIndex","statusTone","rounded","renderRailEntry","render","headerTitle","title","headerActions","entryPlacement","headerEntries","bodyEntries","footerEntries","showDrawerChrome","drawerResting","activeFullView","toolIds","Host","role","ref","element","inert","heading","showBack","backIcon","backAriaLabel","showMenu","toolHeader","onDsBack","dsHeaderBack","hidden","active"],"sources":["src/wc/components/PanelTools/panel-tools-types.ts","src/wc/components/PanelTools/panel-tools-utils.ts","src/wc/components/PanelTools/PanelTools.css?tag=ds-panel-tools&encapsulation=shadow","src/wc/components/PanelTools/PanelTools.tsx"],"sourcesContent":["/** Application-owned tool id for the shell rail and responsive tool views. */\nexport type PanelToolsToolId = string;\n\n/** Canonical Motive shell recipe used when item metadata is omitted. */\nexport type CanonicalPanelToolsToolId =\n | 'search'\n | 'messages'\n | 'agents'\n | 'stacks'\n | 'activity'\n | 'help';\n\nexport const PANEL_TOOLS_TOOL_IDS: CanonicalPanelToolsToolId[] = [\n 'agents',\n 'messages',\n 'activity',\n 'search',\n 'stacks',\n 'help',\n];\n\n/** Rail header slot — mirrors panel-nav M logo row. */\nexport const PANEL_TOOLS_PRIMARY_TOOL_ID: CanonicalPanelToolsToolId = 'agents';\n\n/** Rail footer slot — flush to the bottom of the tools column. */\nexport const PANEL_TOOLS_FOOTER_TOOL_ID: CanonicalPanelToolsToolId = 'help';\n\nexport const PANEL_TOOLS_LABELS: Record<CanonicalPanelToolsToolId, string> = {\n search: 'Search',\n messages: 'Messages',\n stacks: 'Stacks',\n activity: 'Activity',\n agents: 'Agents',\n help: 'Help & Support',\n};\n\nexport const PANEL_TOOLS_SHORTCUTS: Partial<Record<CanonicalPanelToolsToolId, string>> = {\n search: 'K',\n agents: 'A',\n messages: 'M',\n stacks: 'S',\n activity: 'N',\n help: '/',\n};\n\nexport type PanelToolsRailPlacement = 'header' | 'body' | 'footer';\n\nexport interface PanelToolsItem {\n id: PanelToolsToolId;\n /** Icon name for <ds-icon>. */\n icon: string;\n /** Visible and accessible fallback label for custom tool ids. */\n label?: string;\n /** Explicit rail region; canonical Agents/Help placement is the fallback. */\n railPlacement?: PanelToolsRailPlacement;\n /** Stable ordering within the selected rail region. */\n order?: number;\n /** Optional shortcut label displayed by the tooltip. */\n shortcutKey?: string;\n /** Mobile destination recipe; canonical ids retain their explicit defaults. */\n mobileDestination?: 'search' | 'inbox' | 'activity' | 'messages' | 'agents' | 'help';\n /** Whether this rail button is currently pressed/active. */\n selected?: boolean;\n /** Show a notification dot. */\n dot?: boolean;\n isInactive?: boolean;\n ariaLabel?: string;\n}\n\nexport type PanelToolsRailAccessoryVisual =\n | { type: 'icon'; icon: string }\n | { type: 'initial'; initial: string }\n | { type: 'image'; src: string };\n\nexport interface PanelToolsRailAccessoryAction {\n /** Stable application-owned action id emitted with the accessory id. */\n id: string;\n /** Overrides the accessory label for the primary action. */\n ariaLabel?: string;\n isInactive?: boolean;\n}\n\nexport interface PanelToolsRailAccessorySecondaryAction {\n id: string;\n icon: string;\n ariaLabel: string;\n isInactive?: boolean;\n}\n\nexport type PanelToolsRailTransientTone = 'active' | 'positive';\n\ninterface PanelToolsRailAccessoryBase {\n /** Stable application-owned identity. Duplicate or blank ids are omitted. */\n id: string;\n /** Explicit rail region; accessories never infer placement from their id. */\n railPlacement: PanelToolsRailPlacement;\n /** Stable ordering within the selected rail region. */\n order: number;\n}\n\n/** Decorative boundary between application-owned rail accessory groups. */\nexport interface PanelToolsRailDividerAccessory extends PanelToolsRailAccessoryBase {\n type: 'divider';\n}\n\n/**\n * A compact one-action shortcut that matches standard tool-button geometry.\n * PanelTools owns its initial orb, notification dot, and transient interaction paint.\n */\nexport interface PanelToolsRailShortcutAccessory extends PanelToolsRailAccessoryBase {\n type: 'shortcut';\n /** Accessible shortcut name and action-label fallback. */\n ariaLabel: string;\n /** One or two displayed graphemes. Longer values are truncated visually. */\n initials: string;\n /** Supplemental notification dot. Include its meaning in the accessible label when needed. */\n dot?: boolean;\n action: PanelToolsRailAccessoryAction;\n}\n\n/**\n * A direct application intent that never selects a tool or changes drawer state.\n * PanelTools owns the two-control-height surface and its focus behavior.\n */\nexport interface PanelToolsRailTransientAccessory extends PanelToolsRailAccessoryBase {\n type: 'transient';\n /** Accessible accessory name and primary-action fallback label. */\n ariaLabel: string;\n visual: PanelToolsRailAccessoryVisual;\n /** State announced with the primary action and shown in its tooltip. */\n statusText: string;\n /** Bold surface treatment. Active uses brand; positive uses positive semantic color. */\n statusTone: PanelToolsRailTransientTone;\n primaryAction: PanelToolsRailAccessoryAction;\n secondaryAction?: PanelToolsRailAccessorySecondaryAction;\n}\n\nexport type PanelToolsRailAccessory =\n | PanelToolsRailDividerAccessory\n | PanelToolsRailShortcutAccessory\n | PanelToolsRailTransientAccessory;\n\nexport interface PanelToolsRailAccessoryActionDetail {\n accessoryId: string;\n actionId: string;\n /** Rendered action control, suitable for anchoring an application-owned overlay. */\n anchor: HTMLElement;\n}\n\n/** Canonical shell recipe used by Lab and by managed ShellApp examples. */\nexport const PANEL_TOOLS_DEFAULT_ITEMS: PanelToolsItem[] = [\n {\n id: 'agents',\n icon: 'AIAsterisk',\n label: PANEL_TOOLS_LABELS.agents,\n railPlacement: 'header',\n order: 0,\n shortcutKey: PANEL_TOOLS_SHORTCUTS.agents,\n mobileDestination: 'agents',\n },\n {\n id: 'messages',\n icon: 'MessageBubbleStack',\n label: PANEL_TOOLS_LABELS.messages,\n order: 0,\n shortcutKey: PANEL_TOOLS_SHORTCUTS.messages,\n mobileDestination: 'messages',\n },\n {\n id: 'activity',\n icon: 'Bell',\n label: PANEL_TOOLS_LABELS.activity,\n order: 1,\n shortcutKey: PANEL_TOOLS_SHORTCUTS.activity,\n mobileDestination: 'activity',\n },\n {\n id: 'search',\n icon: 'MagnifyingGlass',\n label: PANEL_TOOLS_LABELS.search,\n order: 2,\n shortcutKey: PANEL_TOOLS_SHORTCUTS.search,\n mobileDestination: 'search',\n },\n {\n id: 'help',\n icon: 'QuestionCircle',\n label: PANEL_TOOLS_LABELS.help,\n railPlacement: 'footer',\n order: 0,\n shortcutKey: PANEL_TOOLS_SHORTCUTS.help,\n mobileDestination: 'help',\n },\n];\n\nexport interface PanelToolsHeaderAction {\n id: string;\n icon: string;\n ariaLabel: string;\n triggerId?: string;\n controls?: string;\n expanded?: boolean;\n /** Associated surface remains visible, including exit motion. */\n surfaceOpen?: boolean;\n haspopup?: 'menu' | 'dialog' | 'listbox' | 'tree' | 'grid';\n pressed?: boolean;\n isInactive?: boolean;\n}\n\nexport interface PanelToolsHeaderActionDetail {\n tool: PanelToolsToolId;\n id: string;\n /** Rendered header action host. Pass this to an external overlay's element anchor prop. */\n anchor?: HTMLElement;\n}\n\nexport interface PanelToolHeaderActionDetail {\n id: string;\n originalEvent: MouseEvent;\n /** Rendered action host, suitable for anchoring an external overlay across a shadow boundary. */\n anchor: HTMLElement;\n}\n\nexport interface PanelToolsHeaderConfig {\n title?: string;\n showBack?: boolean;\n backIcon?: string;\n backAriaLabel?: string;\n actions?: PanelToolsHeaderAction[];\n}\n\n/** Per-tool header state. The application replaces the object when a tool changes depth or actions. */\nexport type PanelToolsHeaders = Partial<Record<PanelToolsToolId, PanelToolsHeaderConfig>>;\n","import { parseCssTimeMs } from '../../utils/resolve-css-time-ms';\nimport {\n PANEL_TOOLS_PRIMARY_TOOL_ID,\n PANEL_TOOLS_TOOL_IDS,\n type PanelToolsItem,\n type PanelToolsRailAccessory,\n type PanelToolsRailAccessoryActionDetail,\n type PanelToolsRailPlacement,\n type PanelToolsToolId,\n} from './panel-tools-types';\n\nconst PANEL_TOOLS_REGION_ORDER: Record<PanelToolsRailPlacement, number> = {\n header: 0,\n body: 1,\n footer: 2,\n};\n\nfunction panelToolsItemOrder(item: PanelToolsItem): number {\n const canonical = PANEL_TOOLS_TOOL_IDS.findIndex(id => id === item.id);\n return item.order ?? (canonical < 0 ? Number.MAX_SAFE_INTEGER : canonical);\n}\n\nexport function orderPanelToolsItems(items: PanelToolsItem[]): PanelToolsItem[] {\n const firstById = new Map<PanelToolsToolId, PanelToolsItem>();\n for (const item of items) {\n if (item.id.trim() && !firstById.has(item.id)) firstById.set(item.id, item);\n }\n return Array.from(firstById.values()).sort((left, right) => {\n const leftRegion = panelToolsRailPlacement(left);\n const rightRegion = panelToolsRailPlacement(right);\n const regionDelta =\n PANEL_TOOLS_REGION_ORDER[leftRegion] - PANEL_TOOLS_REGION_ORDER[rightRegion];\n if (regionDelta !== 0) return regionDelta;\n\n return panelToolsItemOrder(left) - panelToolsItemOrder(right);\n });\n}\n\nexport type PanelToolsRailEntry =\n | { type: 'tool'; id: string; item: PanelToolsItem }\n | { type: 'accessory'; id: string; accessory: PanelToolsRailAccessory };\n\n/** Merge tools and governed accessories into one visual and keyboard order. */\nexport function orderPanelToolsRailEntries(\n items: PanelToolsItem[],\n accessories: PanelToolsRailAccessory[]\n): PanelToolsRailEntry[] {\n const toolEntries: PanelToolsRailEntry[] = orderPanelToolsItems(items).map(item => ({\n type: 'tool',\n id: item.id,\n item,\n }));\n const firstAccessoryById = new Map<string, PanelToolsRailAccessory>();\n for (const accessory of accessories) {\n if (accessory.id.trim() && !firstAccessoryById.has(accessory.id)) {\n firstAccessoryById.set(accessory.id, accessory);\n }\n }\n const accessoryEntries: PanelToolsRailEntry[] = Array.from(firstAccessoryById.values()).map(\n accessory => ({\n type: 'accessory',\n id: accessory.id,\n accessory,\n })\n );\n\n return [...toolEntries, ...accessoryEntries].sort((left, right) => {\n const leftPlacement =\n left.type === 'tool' ? panelToolsRailPlacement(left.item) : left.accessory.railPlacement;\n const rightPlacement =\n right.type === 'tool' ? panelToolsRailPlacement(right.item) : right.accessory.railPlacement;\n const regionDelta =\n PANEL_TOOLS_REGION_ORDER[leftPlacement] - PANEL_TOOLS_REGION_ORDER[rightPlacement];\n if (regionDelta !== 0) return regionDelta;\n\n const leftOrder = left.type === 'tool' ? panelToolsItemOrder(left.item) : left.accessory.order;\n const rightOrder =\n right.type === 'tool' ? panelToolsItemOrder(right.item) : right.accessory.order;\n return leftOrder - rightOrder;\n });\n}\n\n/** Flatten interactive entries while leaving decorative boundaries out of focus order. */\nexport function panelToolsRailFocusKeys(entries: PanelToolsRailEntry[]): string[] {\n return entries.flatMap(entry => {\n if (entry.type === 'tool') return [`tool:${entry.id}`];\n if (entry.accessory.type === 'divider') return [];\n if (entry.accessory.type === 'shortcut') {\n return entry.accessory.action.isInactive\n ? []\n : [`accessory:${entry.id}:${entry.accessory.action.id}`];\n }\n const keys = entry.accessory.primaryAction.isInactive\n ? []\n : [`accessory:${entry.id}:${entry.accessory.primaryAction.id}`];\n if (entry.accessory.secondaryAction && !entry.accessory.secondaryAction.isInactive) {\n keys.push(`accessory:${entry.id}:${entry.accessory.secondaryAction.id}`);\n }\n return keys;\n });\n}\n\n/** Preserve the current target across collection changes, or choose its nearest survivor. */\nexport function reconcilePanelToolsRovingIndex(\n previousKeys: string[],\n nextKeys: string[],\n currentIndex: number\n): number {\n if (!nextKeys.length) return 0;\n const currentKey = previousKeys[currentIndex];\n const preservedIndex = currentKey ? nextKeys.indexOf(currentKey) : -1;\n if (preservedIndex >= 0) return preservedIndex;\n for (let index = currentIndex + 1; index < previousKeys.length; index += 1) {\n const nextIndex = nextKeys.indexOf(previousKeys[index]);\n if (nextIndex >= 0) return nextIndex;\n }\n for (let index = currentIndex - 1; index >= 0; index -= 1) {\n const nextIndex = nextKeys.indexOf(previousKeys[index]);\n if (nextIndex >= 0) return nextIndex;\n }\n return Math.min(Math.max(currentIndex, 0), nextKeys.length - 1);\n}\n\nexport function panelToolsRailAccessoryActionDetail(\n accessoryId: string,\n actionId: string,\n anchor: HTMLElement\n): PanelToolsRailAccessoryActionDetail {\n return { accessoryId, actionId, anchor };\n}\n\nexport function isPanelToolsToolId(value: string | null): value is PanelToolsToolId {\n return typeof value === 'string' && value.trim().length > 0;\n}\n\nexport function panelToolsRailPlacement(item: PanelToolsItem): 'header' | 'body' | 'footer' {\n if (item.railPlacement) return item.railPlacement;\n if (item.id === PANEL_TOOLS_PRIMARY_TOOL_ID) return 'header';\n if (item.id === 'help') return 'footer';\n return 'body';\n}\n\nexport function reconcilePanelToolsAvailability(\n items: PanelToolsItem[],\n open: boolean,\n activeTool: PanelToolsToolId | ''\n): { open: boolean; activeTool: PanelToolsToolId | ''; removedTool: PanelToolsToolId | '' } {\n if (!activeTool || items.some(item => item.id === activeTool)) {\n return { open, activeTool, removedTool: '' };\n }\n return { open: false, activeTool: '', removedTool: activeTool };\n}\n\nexport function shouldResyncPanelToolsItems(\n prev: PanelToolsItem[],\n next: PanelToolsItem[]\n): boolean {\n if (prev.length !== next.length) return true;\n return next.some((item, index) => {\n const prior = prev[index];\n if (!prior) return true;\n return (\n prior.id !== item.id ||\n prior.icon !== item.icon ||\n prior.label !== item.label ||\n prior.railPlacement !== item.railPlacement ||\n prior.order !== item.order ||\n prior.shortcutKey !== item.shortcutKey ||\n prior.mobileDestination !== item.mobileDestination ||\n prior.selected !== item.selected ||\n prior.dot !== item.dot ||\n prior.isInactive !== item.isInactive ||\n prior.ariaLabel !== item.ariaLabel\n );\n });\n}\n\nexport type PanelToolsMotion = 'opening' | 'closing' | 'idle';\n\nexport interface PanelToolsTransitionStyle {\n transitionProperty: string;\n transitionDuration: string;\n transitionDelay: string;\n}\n\n/** Maximum computed time for the drawer's max-width transition, including delay. */\nexport function panelToolsDrawerTransitionMs(style: PanelToolsTransitionStyle): number {\n const properties = style.transitionProperty.split(',').map(item => item.trim());\n const durations = style.transitionDuration.split(',').map(item => parseCssTimeMs(item.trim(), 0));\n const delays = style.transitionDelay.split(',').map(item => parseCssTimeMs(item.trim(), 0));\n\n return properties.reduce((max, property, index) => {\n if (property !== 'all' && property !== 'max-width') return max;\n const duration = durations[index % durations.length] ?? 0;\n const delay = delays[index % delays.length] ?? 0;\n return Math.max(max, duration + delay, 0);\n }, 0);\n}\n\n/** True when the drawer clip is fully closed — safe to skip painting slot content. */\nexport function panelToolsDrawerResting(open: boolean, motion: PanelToolsMotion): boolean {\n return !open && motion === 'idle';\n}\n\n/** True only when the animated clip has reached the terminal width for its motion phase. */\nexport function panelToolsDrawerAtTerminal(\n width: number,\n targetWidth: number,\n motion: PanelToolsMotion\n): boolean {\n if (motion === 'closing') return width <= 0.5;\n if (motion === 'opening') return targetWidth > 0 && width >= targetWidth - 0.5;\n return true;\n}\n\n/** Toggle or switch rail tool selection — repeat activation closes the active tool. */\nexport function resolvePanelToolActivation(\n open: boolean,\n activeTool: PanelToolsToolId | '',\n id: PanelToolsToolId\n): { open: boolean; activeTool: PanelToolsToolId; selected: boolean } {\n if (open && activeTool === id) {\n return { open: false, activeTool: id, selected: false };\n }\n return { open: true, activeTool: id, selected: true };\n}\n","@import '../../utils/radius.css';\n@import '../../utils/control-density.css';\n@import '../../utils/chrome-layout.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n@import '../../utils/scrollbar-hidden.css';\n\n:host {\n display: block;\n flex: 0 0 auto;\n box-sizing: border-box;\n height: 100%;\n min-height: 0;\n overflow: hidden;\n --_panel-tools-rail-width: var(--dimension-size-600);\n --_panel-tools-drawer-width: var(--ds-shell-panel-tools-width, var(--dimension-panel-width-xs));\n --_panel-tools-border: var(--dimension-stroke-width-012, 1px) solid var(--color-border-tertiary);\n /* Match panel-nav expand timing (medium-1); easing differs by direction. */\n --_panel-tools-expand-dur: var(--effect-animation-duration-medium-1, 300ms);\n}\n\n.panel-tools__layout {\n display: flex;\n flex-direction: row-reverse;\n align-items: stretch;\n height: 100%;\n min-height: 0;\n box-sizing: border-box;\n}\n\n/* Clip frame — only max-width animates (slide reveal, same as pre-rail :host). */\n.panel-tools__drawer {\n flex: 0 0 auto;\n max-width: 0;\n min-width: 0;\n height: 100%;\n min-height: 0;\n overflow: hidden;\n box-sizing: border-box;\n transition: none;\n}\n\n:host(.panel-tools--ready) .panel-tools__drawer {\n transition: max-width var(--_panel-tools-expand-dur)\n var(--effect-animation-easing-ease-in-out, ease);\n}\n\n:host(.panel-tools--ready.panel-tools--motion-opening) .panel-tools__drawer {\n transition: max-width var(--_panel-tools-expand-dur)\n var(--effect-animation-easing-ease-out, ease-out);\n}\n\n:host(.panel-tools--ready.panel-tools--motion-closing) .panel-tools__drawer {\n transition: max-width var(--_panel-tools-expand-dur)\n var(--effect-animation-easing-ease-in, ease-in);\n}\n\n:host(.panel-tools--open) .panel-tools__drawer {\n max-width: var(--_panel-tools-drawer-width);\n}\n\n.panel-tools__drawer--visible {\n border-left: var(--_panel-tools-border);\n}\n\n/* Fixed-width surface — ShellApp supplies the standard 300px tools width. */\n.panel-tools__drawer-surface {\n display: flex;\n flex-direction: column;\n width: var(--_panel-tools-drawer-width);\n height: 100%;\n min-height: 0;\n box-sizing: border-box;\n background-color: transparent;\n}\n\n.panel-tools__full-views,\n.panel-tools__full-view {\n flex: 1 1 auto;\n min-height: 0;\n overflow: hidden;\n}\n\n.panel-tools__full-view {\n height: 100%;\n}\n\n.panel-tools__full-view {\n display: none;\n}\n.panel-tools__full-view--active {\n display: block;\n}\n\n:host([presentation='fullscreen']) {\n height: 100%;\n inset: 0;\n position: fixed;\n width: 100%;\n z-index: var(--dimension-z-index-modal);\n}\n\n:host([presentation='fullscreen']) .panel-tools__rail {\n display: none;\n}\n:host([presentation='fullscreen']) .panel-tools__drawer {\n max-width: 100%;\n transition: none;\n width: 100%;\n}\n:host([presentation='fullscreen']) .panel-tools__drawer--visible {\n border-left: none;\n}\n:host([presentation='fullscreen']) .panel-tools__drawer-surface {\n background-color: transparent;\n width: 100%;\n}\n\n/*\n * A framework can update the reflected presentation attribute before Stencil\n * commits the matching render class. Conceal that single inconsistent frame so\n * slotted master/detail content never paints against the previous geometry.\n */\n:host([presentation='fullscreen']:not(.panel-tools--fullscreen)) .panel-tools__drawer-surface,\n:host(.panel-tools--fullscreen:not([presentation='fullscreen'])) .panel-tools__drawer-surface {\n visibility: hidden;\n}\n\n:host(.panel-tools--presentation-snap) .panel-tools__drawer {\n transition: none;\n}\n\n.panel-tools__body {\n flex: 1 1 auto;\n min-height: 0;\n overflow: auto;\n position: relative;\n}\n\n/* Skip paint while fully closed; cleared during open/close motion for WYSIWYG slide. */\n:host(.panel-tools--drawer-resting) .panel-tools__body {\n content-visibility: auto;\n contain-intrinsic-size: auto 200px;\n}\n\n.panel-tools__view {\n display: none;\n height: 100%;\n min-height: 0;\n box-sizing: border-box;\n padding: var(--dimension-space-200);\n color: var(--color-foreground-secondary);\n font-family: var(--typography-font-family-ui);\n font-size: var(--typography-fontsize-md);\n line-height: var(--typography-lineheight-md);\n font-weight: var(--typography-weight-regular);\n letter-spacing: var(--typography-letterspacing-negative-half);\n}\n\n.panel-tools__view ::slotted(*) {\n margin: 0;\n color: var(--color-foreground-secondary);\n font-family: var(--typography-font-family-ui);\n font-size: var(--typography-fontsize-md);\n line-height: var(--typography-lineheight-md);\n font-weight: var(--typography-weight-regular);\n letter-spacing: var(--typography-letterspacing-negative-half);\n}\n\n.panel-tools__view--active {\n display: block;\n}\n\n/* Rail — mirrors collapsed panel-nav width, padding, and item rhythm. */\n.panel-tools__rail {\n flex: 0 0 var(--_panel-tools-rail-width);\n width: var(--_panel-tools-rail-width);\n min-width: var(--_panel-tools-rail-width);\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n height: 100%;\n min-height: 0;\n border-left: var(--_panel-tools-border);\n background-color: transparent;\n}\n\n.panel-tools__rail-header {\n justify-content: center;\n height: var(--dimension-size-600);\n flex-shrink: 0;\n border-bottom: var(--_panel-tools-border);\n}\n\n.panel-tools__rail-header.panel-tools__rail-section--stacked {\n height: auto;\n min-height: var(--dimension-size-600);\n}\n\n.panel-tools__rail-body {\n flex: 1 1 auto;\n min-height: 0;\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n.panel-tools__rail-actions {\n display: flex;\n flex-direction: column;\n gap: var(--dimension-space-050);\n width: 100%;\n}\n\n/* Flush to the bottom of the rail — mirrors Search header pin. */\n.panel-tools__rail-footer {\n justify-content: center;\n flex-shrink: 0;\n margin-top: auto;\n}\n\n.panel-tools__rail-section--stacked {\n align-items: stretch;\n}\n\n.panel-tools__rail-action {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: var(--ds-control-height);\n flex-shrink: 0;\n}\n\n.panel-tools__accessory {\n display: flex;\n flex-direction: column;\n flex: 0 0 calc(var(--dimension-size-400) * 2);\n box-sizing: border-box;\n width: 100%;\n min-height: calc(var(--dimension-size-400) * 2);\n}\n\n.panel-tools__accessory--shortcut {\n flex-basis: var(--dimension-size-400);\n min-width: var(--dimension-size-400);\n min-height: var(--dimension-size-400);\n}\n\n.panel-tools__accessory--shortcut > ds-tooltip {\n display: flex;\n flex: 1 1 auto;\n width: 100%;\n min-height: 0;\n}\n\n.panel-tools__accessory--transient {\n align-items: center;\n gap: var(--dimension-space-100);\n width: var(--dimension-size-400);\n height: calc(var(--dimension-size-400) * 2);\n min-height: calc(var(--dimension-size-400) * 2);\n padding: var(--dimension-space-050);\n border-radius: var(--dimension-radius-half);\n}\n\n.panel-tools__accessory--transient-active {\n background-color: var(--color-background-bold-brand);\n}\n\n.panel-tools__accessory--transient-positive {\n background-color: var(--color-background-bold-positive);\n}\n\n.panel-tools__accessory--transient > ds-tooltip {\n display: flex;\n flex: 0 0 var(--dimension-size-300);\n width: var(--dimension-size-300);\n height: var(--dimension-size-300);\n min-height: var(--dimension-size-300);\n}\n\n.panel-tools__shortcut {\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n border: 0;\n border-radius: var(--dimension-radius-half);\n color: var(--color-foreground-secondary);\n background: transparent;\n font: inherit;\n}\n\n.panel-tools__shortcut:disabled {\n color: var(--color-foreground-disabled);\n cursor: not-allowed;\n}\n\n.panel-tools__shortcut-content {\n display: flex;\n align-items: center;\n justify-content: center;\n width: var(--dimension-size-400);\n height: var(--dimension-size-400);\n}\n\n.panel-tools__shortcut-orb {\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: var(--dimension-size-300);\n height: var(--dimension-size-300);\n border: var(--dimension-stroke-width-012) solid var(--color-border-secondary);\n border-radius: var(--dimension-radius-half);\n background: transparent;\n}\n\n.panel-tools__shortcut-dot {\n position: absolute;\n inset-block-start: calc((var(--dimension-size-400) - var(--dimension-iconography-md)) / 2);\n inset-inline-end: calc((var(--dimension-size-400) - var(--dimension-iconography-md)) / 2);\n z-index: 2;\n pointer-events: none;\n}\n\n.panel-tools__accessory-primary {\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: var(--dimension-size-300);\n height: var(--dimension-size-300);\n margin: 0;\n padding: 0;\n border: 0;\n border-radius: var(--dimension-radius-half);\n color: var(--color-foreground-on-bold-background-secondary);\n background: transparent;\n font: inherit;\n --ds-interaction-border-width: var(--dimension-stroke-width-012);\n --ds-interaction-border-color: var(--color-border-on-bold-background-secondary);\n}\n\n.panel-tools__accessory-primary:disabled {\n color: var(--color-foreground-on-bold-background-quaternary);\n cursor: not-allowed;\n}\n\n.panel-tools__accessory-primary-content {\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n width: 100%;\n height: 100%;\n}\n\n.panel-tools__accessory-image,\n.panel-tools__accessory-initial {\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n border-radius: var(--dimension-radius-half);\n}\n\n.panel-tools__accessory-image {\n object-fit: cover;\n}\n\n.panel-tools__accessory-initial {\n color: inherit;\n background: transparent;\n}\n\n.panel-tools__accessory-secondary {\n display: inline-flex;\n flex: 0 0 var(--dimension-size-300);\n width: var(--dimension-size-300);\n height: var(--dimension-size-300);\n}\n\n.panel-tools__accessory-divider {\n flex: 0 0 auto;\n box-sizing: border-box;\n width: 100%;\n padding-block: var(--dimension-space-050);\n}\n\n.panel-tools__accessory-divider ds-divider {\n display: block;\n}\n\n@media (prefers-reduced-motion: reduce) {\n :host(.panel-tools--ready.panel-tools--motion-opening) .panel-tools__drawer,\n :host(.panel-tools--ready.panel-tools--motion-closing) .panel-tools__drawer {\n transition: none;\n }\n}\n","import {\n Component,\n Prop,\n Event,\n EventEmitter,\n Element,\n State,\n Watch,\n Method,\n Listen,\n h,\n Host,\n} from '@stencil/core';\nimport type { ChromeTransitionDetail } from '../../shell/chrome-transition';\nimport { ANCHORED_OVERLAY_BOUNDARY_ATTRIBUTE } from '../../utils/anchored-overlay-boundary';\nimport {\n PANEL_TOOLS_LABELS,\n PANEL_TOOLS_SHORTCUTS,\n type PanelToolsHeaderAction,\n type PanelToolsHeaderActionDetail,\n type PanelToolsHeaderConfig,\n type PanelToolsHeaders,\n type PanelToolsItem,\n type PanelToolsRailAccessory,\n type PanelToolsRailAccessoryAction,\n type PanelToolsRailAccessoryActionDetail,\n type PanelToolsRailShortcutAccessory,\n type PanelToolsRailTransientAccessory,\n type PanelToolsToolId,\n} from './panel-tools-types';\nimport {\n isPanelToolsToolId,\n orderPanelToolsRailEntries,\n orderPanelToolsItems,\n panelToolsRailAccessoryActionDetail,\n panelToolsRailFocusKeys,\n panelToolsDrawerAtTerminal,\n panelToolsDrawerResting,\n panelToolsDrawerTransitionMs,\n panelToolsRailPlacement,\n reconcilePanelToolsAvailability,\n reconcilePanelToolsRovingIndex,\n resolvePanelToolActivation,\n type PanelToolsRailEntry,\n} from './panel-tools-utils';\n\n@Component({\n tag: 'ds-panel-tools',\n styleUrl: 'PanelTools.css',\n shadow: true,\n})\nexport class PanelTools {\n @Element() el!: HTMLElement;\n\n /** When false, only the icon rail is shown. */\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n /** Drawer presentation or presentation covering the shell stage for the active tool. */\n @Prop({ mutable: true, reflect: true }) presentation: 'drawer' | 'fullscreen' = 'drawer';\n\n /** Let a fullscreen product supply independent master/detail headers inside its view. */\n @Prop({ attribute: 'fullscreen-header-mode', reflect: true })\n fullscreenHeaderMode: 'shared' | 'split' = 'shared';\n\n /** Active tool view — `search`, `agents`, `messages`, `stacks`, `activity`, or `help`. */\n @Prop({ mutable: true, attribute: 'active-tool', reflect: true })\n activeTool: PanelToolsToolId | '' = '';\n\n /**\n * Rail items rendered in the right column.\n * Set via JS property: `el.items = [...]`. Replace the array reference to update.\n */\n @Prop() items: PanelToolsItem[] = [];\n\n /**\n * Desktop/tablet-only application-owned rail boundaries and direct intents.\n * Set via JS property and replace the array reference to update.\n */\n @Prop() accessories: PanelToolsRailAccessory[] = [];\n\n @Prop() toolsLabel: string = 'Tools';\n @Prop() toolShortcutsLabel: string = 'Tool shortcuts';\n\n /** Active header state per tool. Replace the object when title, depth, or actions change. */\n @Prop() headers: PanelToolsHeaders = {};\n\n /**\n * Optional localStorage key for the last active tool. The drawer always starts\n * closed; only the tool identity is restored for continuity within this browser.\n */\n @Prop({ attribute: 'storage-key' }) storageKey: string = '';\n\n /** Emitted when a rail button is toggled. Detail = { id, selected }. */\n @Event({ bubbles: true, composed: true }) dsToolChange!: EventEmitter<{\n id: PanelToolsToolId;\n selected: boolean;\n }>;\n\n /** Emitted when fullscreen changes, including Escape-initiated exits. */\n @Event({ bubbles: true, composed: true }) dsPresentationChange!: EventEmitter<{\n presentation: 'drawer' | 'fullscreen';\n }>;\n\n /** Requests navigation to the active tool's parent view. */\n @Event({ bubbles: true, composed: true }) dsHeaderBack!: EventEmitter<{\n tool: PanelToolsToolId;\n }>;\n\n /** Requests one application-owned action from the active tool header. */\n @Event({ bubbles: true, composed: true })\n dsHeaderAction!: EventEmitter<PanelToolsHeaderActionDetail>;\n\n /** Direct accessory intent. Emitting this event never changes the active tool or drawer. */\n @Event({ bubbles: true, composed: true })\n dsRailAccessoryAction!: EventEmitter<PanelToolsRailAccessoryActionDetail>;\n\n /** Bubbling lifecycle — `ds-bar-nav` defers overflow checks during drawer motion. */\n @Event({ bubbles: true, composed: true })\n dsChromeTransitionStart!: EventEmitter<ChromeTransitionDetail>;\n\n @Event({ bubbles: true, composed: true })\n dsChromeTransitionEnd!: EventEmitter<ChromeTransitionDetail>;\n\n /** Arms open vs close easing for the in-flight width transition. */\n @State() private motion: 'opening' | 'closing' | 'idle' = 'idle';\n\n /** Keeps header and slotted content painted until the closing clip transition completes. */\n @State() private drawerSurfaceRetained = false;\n\n /** Suppresses width transition until the host has painted its initial open state. */\n @State() private readyForMotion = false;\n\n /** Fullscreen presentation changes snap without borrowing drawer width motion. */\n @State() private presentationMotionSuppressed = false;\n\n @State() private rovingIndex = 0;\n @State() private fullViewToolIds: PanelToolsToolId[] = [];\n @State() private railBodyScrollable = false;\n\n private motionEnableGeneration = 0;\n private presentationMotionGeneration = 0;\n private transitionGeneration = 0;\n private transitionFallbackTimer: number | null = null;\n /** Ignores the old transition's terminal event when reversing direction. */\n private ignoreReplacementTerminal = false;\n private focusBeforeFullscreen: HTMLElement | null = null;\n private fullViewObserver: MutationObserver | null = null;\n private railBodyEl?: HTMLElement;\n private railBodyObserver?: ResizeObserver;\n\n private get railItems(): PanelToolsItem[] {\n return this.items ?? [];\n }\n\n private get orderedRailItems(): PanelToolsItem[] {\n return orderPanelToolsItems(this.railItems);\n }\n\n private get railAccessories(): PanelToolsRailAccessory[] {\n return this.accessories ?? [];\n }\n\n private get orderedRailEntries(): PanelToolsRailEntry[] {\n return orderPanelToolsRailEntries(this.railItems, this.railAccessories);\n }\n\n disconnectedCallback() {\n this.el.removeEventListener('transitionend', this.handleTransitionEnd);\n this.el.removeEventListener('transitioncancel', this.handleTransitionEnd);\n this.el.removeEventListener('dsAction', this.handleComposedHeaderAction);\n this.clearTransitionCompletion();\n this.motionEnableGeneration += 1;\n this.fullViewObserver?.disconnect();\n this.fullViewObserver = null;\n this.disconnectRailBodyObserver();\n }\n\n @Watch('presentation')\n presentationChanged(next: 'drawer' | 'fullscreen', previous?: 'drawer' | 'fullscreen') {\n if (next === previous) return;\n // Framework property bindings can update slotted master/detail content in\n // the same render that requests fullscreen. Reflect the host selector\n // immediately so that content cannot paint once in the drawer geometry\n // while Stencil waits to commit its next render.\n if (this.el.getAttribute('presentation') !== next) {\n this.el.setAttribute('presentation', next);\n }\n const presentationGeneration = ++this.presentationMotionGeneration;\n this.presentationMotionSuppressed = true;\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n if (presentationGeneration !== this.presentationMotionGeneration) return;\n this.presentationMotionSuppressed = false;\n });\n });\n if (next === 'fullscreen') {\n this.focusBeforeFullscreen =\n document.activeElement instanceof HTMLElement ? document.activeElement : null;\n this.open = true;\n } else if (previous === 'fullscreen') {\n const focusBeforeFullscreen = this.focusBeforeFullscreen;\n const fallbackActionId = this.activeHeader().actions?.[0]?.id;\n requestAnimationFrame(async () => {\n if (focusBeforeFullscreen?.isConnected) {\n focusBeforeFullscreen.focus({ preventScroll: true });\n }\n const focusRestored = focusBeforeFullscreen\n ? document.activeElement === focusBeforeFullscreen ||\n focusBeforeFullscreen.contains(document.activeElement)\n : false;\n if (!focusRestored && fallbackActionId) await this.focusHeaderAction(fallbackActionId);\n this.focusBeforeFullscreen = null;\n });\n }\n this.dsPresentationChange.emit({ presentation: next });\n }\n\n @Listen('keydown', { target: 'window', capture: true })\n handleFullscreenEscape(event: KeyboardEvent) {\n if (this.presentation !== 'fullscreen' || event.key !== 'Escape') return;\n event.preventDefault();\n event.stopPropagation();\n this.presentation = 'drawer';\n }\n\n private deferMotionEnable() {\n if (this.readyForMotion) return;\n const generation = ++this.motionEnableGeneration;\n requestAnimationFrame(() => {\n if (generation !== this.motionEnableGeneration) return;\n requestAnimationFrame(() => {\n if (generation !== this.motionEnableGeneration) return;\n this.readyForMotion = true;\n });\n });\n }\n\n connectedCallback() {\n this.el.setAttribute(ANCHORED_OVERLAY_BOUNDARY_ATTRIBUTE, '');\n this.el.addEventListener('transitionend', this.handleTransitionEnd);\n this.el.addEventListener('transitioncancel', this.handleTransitionEnd);\n this.el.addEventListener('dsAction', this.handleComposedHeaderAction);\n }\n\n private handleComposedHeaderAction = (event: Event) => {\n const detail = (event as CustomEvent<{ id?: string; anchor?: HTMLElement }>).detail;\n if (!this.activeTool || !detail?.id) return;\n event.stopPropagation();\n this.dsHeaderAction.emit({\n tool: this.activeTool,\n id: detail.id,\n anchor: detail.anchor,\n });\n };\n\n componentWillLoad() {\n this.restoreLastActiveTool();\n this.drawerSurfaceRetained = this.open;\n }\n\n @Watch('open')\n openChanged(isOpen: boolean, wasOpen?: boolean) {\n if (isOpen) this.drawerSurfaceRetained = true;\n if (this.readyForMotion && wasOpen !== undefined && wasOpen !== isOpen) {\n this.startDrawerTransition(isOpen ? 'opening' : 'closing');\n } else if (!isOpen) {\n this.drawerSurfaceRetained = false;\n }\n this.deferMotionEnable();\n }\n\n @Watch('activeTool')\n activeToolChanged() {\n this.persistLastActiveTool();\n this.deferMotionEnable();\n }\n\n @Watch('storageKey')\n storageKeyChanged() {\n this.restoreLastActiveTool();\n }\n\n componentDidLoad() {\n this.deferMotionEnable();\n this.connectRailBodyObserver();\n this.updateRailBodyScrollable();\n this.syncFullViewTools();\n this.fullViewObserver = new MutationObserver(() => this.syncFullViewTools());\n this.fullViewObserver.observe(this.el, {\n childList: true,\n attributes: true,\n attributeFilter: ['slot'],\n });\n }\n\n componentDidRender() {\n this.updateRailBodyScrollable();\n }\n\n private connectRailBodyObserver() {\n this.disconnectRailBodyObserver();\n if (!this.railBodyEl || typeof ResizeObserver === 'undefined') return;\n this.railBodyObserver = new ResizeObserver(() => this.updateRailBodyScrollable());\n this.railBodyObserver.observe(this.railBodyEl);\n }\n\n private disconnectRailBodyObserver() {\n this.railBodyObserver?.disconnect();\n this.railBodyObserver = undefined;\n }\n\n private updateRailBodyScrollable() {\n const next = Boolean(\n this.railBodyEl && this.railBodyEl.scrollHeight > this.railBodyEl.clientHeight + 1\n );\n if (next !== this.railBodyScrollable) this.railBodyScrollable = next;\n }\n\n @Watch('items')\n itemsChanged() {\n this.rovingIndex = 0;\n this.reconcileActiveTool();\n this.deferMotionEnable();\n }\n\n @Watch('accessories')\n accessoriesChanged(\n next: PanelToolsRailAccessory[] = [],\n previous: PanelToolsRailAccessory[] = []\n ) {\n const previousKeys = panelToolsRailFocusKeys(\n orderPanelToolsRailEntries(this.railItems, previous)\n );\n const nextKeys = panelToolsRailFocusKeys(orderPanelToolsRailEntries(this.railItems, next));\n const activeElement = (this.renderRoot as ShadowRoot).activeElement as HTMLElement | null;\n const focusedKey =\n activeElement?.closest<HTMLElement>('[data-rail-focus-key]')?.dataset.railFocusKey;\n const focusedIndex = focusedKey ? previousKeys.indexOf(focusedKey) : -1;\n const currentIndex = focusedIndex >= 0 ? focusedIndex : this.rovingIndex;\n const nextIndex = reconcilePanelToolsRovingIndex(previousKeys, nextKeys, currentIndex);\n const restoreFocus = focusedIndex >= 0 && !nextKeys.includes(focusedKey ?? '');\n this.rovingIndex = nextIndex;\n if (restoreFocus && nextKeys.length) {\n requestAnimationFrame(() => this.focusRailAt(nextIndex));\n }\n }\n\n private restoreLastActiveTool() {\n if (!this.storageKey || this.activeTool) return;\n try {\n const stored = localStorage.getItem(this.storageKey);\n if (isPanelToolsToolId(stored)) this.activeTool = stored;\n } catch {\n /* localStorage unavailable */\n }\n }\n\n private persistLastActiveTool() {\n if (!this.storageKey || !this.activeTool) return;\n try {\n localStorage.setItem(this.storageKey, this.activeTool);\n } catch {\n /* unavailable */\n }\n }\n\n private clearPersistedTool() {\n if (!this.storageKey) return;\n try {\n localStorage.removeItem(this.storageKey);\n } catch {\n /* unavailable */\n }\n }\n\n private reconcileActiveTool() {\n const next = reconcilePanelToolsAvailability(this.railItems, this.open, this.activeTool);\n if (!next.removedTool) return;\n this.clearPersistedTool();\n this.open = next.open;\n this.activeTool = next.activeTool;\n this.dsToolChange.emit({ id: next.removedTool, selected: false });\n }\n\n private startDrawerTransition(phase: 'opening' | 'closing') {\n const drawer = this.renderRoot.querySelector('.panel-tools__drawer') as HTMLElement | null;\n if (this.motion !== 'idle') {\n this.finishDrawerTransition();\n this.ignoreReplacementTerminal = true;\n }\n this.motion = phase;\n this.dsChromeTransitionStart.emit({ source: 'panel-tools', phase });\n const generation = ++this.transitionGeneration;\n\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n if (generation !== this.transitionGeneration || this.motion !== phase) return;\n if (!drawer) {\n this.finishDrawerTransition();\n return;\n }\n\n if (this.drawerTransitionAtTerminal(drawer, phase)) {\n this.finishDrawerTransition();\n return;\n }\n\n const fallbackMs = panelToolsDrawerTransitionMs(getComputedStyle(drawer));\n if (fallbackMs <= 0) {\n this.finishDrawerTransition();\n return;\n }\n this.transitionFallbackTimer = window.setTimeout(() => {\n this.finishDrawerTransition();\n }, fallbackMs);\n });\n });\n }\n\n private handleTransitionEnd = (event: TransitionEvent) => {\n const drawer = this.renderRoot.querySelector('.panel-tools__drawer') as HTMLElement | null;\n if (event.target !== drawer) return;\n if (event.propertyName !== 'max-width') return;\n if (this.ignoreReplacementTerminal) {\n this.ignoreReplacementTerminal = false;\n return;\n }\n // Changing from the neutral transition recipe to the direction-specific\n // easing can cancel the transition that the reflected `open` class began.\n // The replacement transition and its watchdog still own completion; ending\n // motion here would hide the fixed-width tool surface while it is visible.\n if (event.type === 'transitioncancel') return;\n if (drawer && !this.drawerTransitionAtTerminal(drawer, this.motion)) return;\n this.finishDrawerTransition();\n };\n\n private drawerTransitionAtTerminal(\n drawer: HTMLElement,\n phase: 'opening' | 'closing' | 'idle'\n ): boolean {\n const width = drawer.getBoundingClientRect().width;\n const surface = drawer.querySelector('.panel-tools__drawer-surface') as HTMLElement | null;\n const targetWidth = surface?.getBoundingClientRect().width ?? 0;\n return panelToolsDrawerAtTerminal(width, targetWidth, phase);\n }\n\n private finishDrawerTransition() {\n const completedPhase = this.motion;\n const wasTransitioning = completedPhase !== 'idle';\n this.clearTransitionCompletion();\n if (!wasTransitioning) return;\n this.ignoreReplacementTerminal = false;\n this.motion = 'idle';\n if (completedPhase === 'closing' && !this.open) {\n this.drawerSurfaceRetained = false;\n }\n this.dsChromeTransitionEnd.emit({ source: 'panel-tools' });\n }\n\n private clearTransitionCompletion() {\n this.transitionGeneration += 1;\n if (this.transitionFallbackTimer !== null) {\n window.clearTimeout(this.transitionFallbackTimer);\n this.transitionFallbackTimer = null;\n }\n }\n\n /** Rail selection follows `open` immediately — independent of the slide animation. */\n private isRailSelected(id: PanelToolsToolId): boolean {\n return this.open && this.activeTool === id;\n }\n\n /** Drawer body stays mounted while the clip frame animates closed. */\n private isDrawerPresent(): boolean {\n return this.open || this.drawerSurfaceRetained;\n }\n\n private isViewActive(id: PanelToolsToolId): boolean {\n return this.isDrawerPresent() && this.activeTool === id;\n }\n\n private hasFullView(id: PanelToolsToolId): boolean {\n return this.fullViewToolIds.includes(id);\n }\n\n private syncFullViewTools() {\n const ids = this.orderedRailItems.map(item => item.id);\n const next = ids.filter(id => Boolean(this.el.querySelector(`[slot=\"${id}-view\"]`)));\n if (next.join('|') !== this.fullViewToolIds.join('|')) this.fullViewToolIds = next;\n }\n\n private get renderRoot(): ParentNode {\n return this.el.shadowRoot ?? this.el;\n }\n\n private accessibleLabel(): string {\n if (!this.isDrawerPresent() || !this.activeTool) return '';\n const item = this.railItems.find(candidate => candidate.id === this.activeTool);\n return (\n item?.label ??\n PANEL_TOOLS_LABELS[this.activeTool as keyof typeof PANEL_TOOLS_LABELS] ??\n this.activeTool\n );\n }\n\n private resolvedHeaders(): PanelToolsHeaders {\n return this.headers ?? {};\n }\n\n private activeHeader(): PanelToolsHeaderConfig {\n if (!this.activeTool) return {};\n return this.resolvedHeaders()[this.activeTool] ?? {};\n }\n\n private handleToolChange = (id: PanelToolsToolId) => {\n const next = resolvePanelToolActivation(this.open, this.activeTool, id);\n this.open = next.open;\n this.activeTool = next.activeTool;\n this.dsToolChange.emit({ id, selected: next.selected });\n };\n\n /** Toggle any rail tool open/closed — shell shortcuts K/A/S/M/N call this. */\n @Method()\n async activateTool(id: PanelToolsToolId) {\n const item = this.railItems.find(entry => entry.id === id);\n if (!item || item.isInactive) return;\n this.handleToolChange(id);\n }\n\n /** Close the tools drawer when open — used by shell keyboard shortcuts. */\n @Method()\n async closeDrawer() {\n if (!this.open) return;\n const id = this.activeTool;\n this.open = false;\n if (id) {\n this.dsToolChange.emit({ id, selected: false });\n }\n }\n\n /** Focus an active tool-header action by its application-owned id. */\n @Method()\n async focusHeaderAction(id: string) {\n const action = this.renderRoot.querySelector(`[data-header-action-id=\"${CSS.escape(id)}\"]`) as\n | (HTMLElement & { setFocus?: () => Promise<void> })\n | null;\n await action?.setFocus?.();\n }\n\n private focusRailAt(index: number) {\n const keys = panelToolsRailFocusKeys(this.orderedRailEntries);\n if (!keys.length) return;\n const bounded = Math.max(0, Math.min(index, keys.length - 1));\n this.rovingIndex = bounded;\n const action = this.renderRoot.querySelector(\n `[data-rail-focus-key=\"${CSS.escape(keys[bounded])}\"]`\n ) as (HTMLElement & { setFocus?: () => Promise<void> }) | null;\n if (action?.setFocus) {\n void action.setFocus();\n } else {\n action?.focus({ preventScroll: true });\n }\n }\n\n private handleRailKeyDown = (e: KeyboardEvent, index: number, activate?: () => void) => {\n const keys = panelToolsRailFocusKeys(this.orderedRailEntries);\n if (!keys.length) return;\n\n if ((e.key === 'Enter' || e.key === ' ') && activate) {\n e.preventDefault();\n activate();\n return;\n }\n\n if (e.key === 'ArrowDown') {\n if (index >= keys.length - 1) return;\n e.preventDefault();\n this.focusRailAt(index + 1);\n return;\n }\n\n if (e.key === 'ArrowUp') {\n if (index <= 0) return;\n e.preventDefault();\n this.focusRailAt(index - 1);\n }\n };\n\n private renderRailAction(item: PanelToolsItem, index: number) {\n const focusKey = `tool:${item.id}`;\n const label =\n item.ariaLabel ??\n item.label ??\n PANEL_TOOLS_LABELS[item.id as keyof typeof PANEL_TOOLS_LABELS] ??\n item.id;\n return (\n <ds-tooltip\n key={item.id}\n label={label}\n shortcutKey={\n item.shortcutKey ?? PANEL_TOOLS_SHORTCUTS[item.id as keyof typeof PANEL_TOOLS_SHORTCUTS]\n }\n side=\"left\"\n size=\"sm\"\n boundary=\"viewport\"\n >\n <ds-button-unfilled\n variant=\"icon\"\n class=\"panel-tools__rail-action\"\n icon={item.icon}\n isActive={this.isRailSelected(item.id)}\n activeFill={false}\n hasBorder={false}\n pressScale={false}\n dot={item.dot ?? false}\n isInactive={item.isInactive}\n focusTabIndex={index === this.rovingIndex ? 0 : -1}\n data-rail-focus-key={focusKey}\n aria-label={label}\n pressed={this.isRailSelected(item.id)}\n onFocusin={() => {\n this.rovingIndex = index;\n }}\n onKeyDown={(e: KeyboardEvent) =>\n this.handleRailKeyDown(e, index, () => this.handleToolChange(item.id))\n }\n onDsClick={() => this.handleToolChange(item.id)}\n />\n </ds-tooltip>\n );\n }\n\n private accessoryPrimaryLabel(accessory: PanelToolsRailTransientAccessory): string {\n const actionLabel = accessory.primaryAction.ariaLabel?.trim() || accessory.ariaLabel;\n const status = accessory.statusText.trim();\n return status ? `${actionLabel}. ${status}` : actionLabel;\n }\n\n private emitAccessoryAction(\n accessoryId: string,\n action: PanelToolsRailAccessoryAction,\n anchor: HTMLElement\n ) {\n if (action.isInactive) return;\n this.dsRailAccessoryAction.emit(\n panelToolsRailAccessoryActionDetail(accessoryId, action.id, anchor)\n );\n }\n\n private renderAccessoryVisual(accessory: PanelToolsRailTransientAccessory) {\n if (accessory.visual.type === 'image') {\n return (\n <img\n class=\"panel-tools__accessory-image\"\n src={accessory.visual.src}\n alt=\"\"\n aria-hidden=\"true\"\n />\n );\n }\n if (accessory.visual.type === 'initial') {\n const initial = [...accessory.visual.initial.trim()].slice(0, 2).join('');\n return (\n <ds-text\n class=\"panel-tools__accessory-initial\"\n as=\"span\"\n variant=\"text-caption\"\n emphasis\n color=\"inherit\"\n aria-hidden=\"true\"\n >\n {initial}\n </ds-text>\n );\n }\n return <ds-icon name={accessory.visual.icon} size=\"sm\" aria-hidden=\"true\" />;\n }\n\n private renderRailShortcut(\n accessory: PanelToolsRailShortcutAccessory,\n focusIndexes: Map<string, number>\n ) {\n const focusKey = `accessory:${accessory.id}:${accessory.action.id}`;\n const focusIndex = focusIndexes.get(focusKey);\n const label = accessory.action.ariaLabel?.trim() || accessory.ariaLabel;\n const initials = [...accessory.initials.trim()].slice(0, 2).join('');\n\n return (\n <div\n key={`accessory:${accessory.id}`}\n class=\"panel-tools__accessory panel-tools__accessory--shortcut\"\n >\n <ds-tooltip label={label} side=\"left\" size=\"sm\" boundary=\"viewport\">\n <button\n type=\"button\"\n class=\"panel-tools__shortcut ds-focus-ring-inset ds-interaction-fill\"\n disabled={accessory.action.isInactive}\n tabIndex={focusIndex === this.rovingIndex ? 0 : -1}\n data-rail-focus-key={focusKey}\n aria-label={label}\n onFocus={() => {\n if (focusIndex !== undefined) this.rovingIndex = focusIndex;\n }}\n onKeyDown={(event: KeyboardEvent) =>\n focusIndex === undefined ? undefined : this.handleRailKeyDown(event, focusIndex)\n }\n onClick={(event: MouseEvent) =>\n this.emitAccessoryAction(\n accessory.id,\n accessory.action,\n event.currentTarget as HTMLElement\n )\n }\n >\n <span class=\"panel-tools__shortcut-content ds-interaction-fill__content\">\n <ds-text\n class=\"panel-tools__shortcut-orb\"\n as=\"span\"\n variant=\"text-caption\"\n emphasis\n color=\"inherit\"\n >\n {initials}\n </ds-text>\n {accessory.dot ? (\n <ds-badge\n class=\"panel-tools__shortcut-dot\"\n variant=\"dot\"\n background=\"var(--color-background-secondary)\"\n aria-hidden=\"true\"\n />\n ) : null}\n </span>\n </button>\n </ds-tooltip>\n </div>\n );\n }\n\n private renderRailAccessory(\n accessory: PanelToolsRailAccessory,\n focusIndexes: Map<string, number>\n ) {\n if (accessory.type === 'divider') {\n return (\n <div\n key={`accessory:${accessory.id}`}\n class=\"panel-tools__accessory-divider\"\n aria-hidden=\"true\"\n >\n <ds-divider />\n </div>\n );\n }\n\n if (accessory.type === 'shortcut') {\n return this.renderRailShortcut(accessory, focusIndexes);\n }\n\n const primaryKey = `accessory:${accessory.id}:${accessory.primaryAction.id}`;\n const primaryIndex = focusIndexes.get(primaryKey);\n const primaryLabel = this.accessoryPrimaryLabel(accessory);\n const secondary = accessory.secondaryAction;\n const secondaryKey = secondary ? `accessory:${accessory.id}:${secondary.id}` : '';\n const secondaryIndex = secondary ? focusIndexes.get(secondaryKey) : undefined;\n\n return (\n <div\n key={`accessory:${accessory.id}`}\n class={{\n 'panel-tools__accessory': true,\n 'panel-tools__accessory--transient': true,\n 'panel-tools__accessory--transient-active': accessory.statusTone === 'active',\n 'panel-tools__accessory--transient-positive': accessory.statusTone === 'positive',\n }}\n >\n <ds-tooltip label={primaryLabel} side=\"left\" size=\"sm\" boundary=\"viewport\">\n <button\n type=\"button\"\n class=\"panel-tools__accessory-primary ds-focus-ring-inset ds-interaction-fill ds-interaction-fill--on-bold\"\n disabled={accessory.primaryAction.isInactive}\n tabIndex={primaryIndex === this.rovingIndex ? 0 : -1}\n data-rail-focus-key={primaryKey}\n aria-label={primaryLabel}\n onFocus={() => {\n if (primaryIndex !== undefined) this.rovingIndex = primaryIndex;\n }}\n onKeyDown={(event: KeyboardEvent) =>\n primaryIndex === undefined ? undefined : this.handleRailKeyDown(event, primaryIndex)\n }\n onClick={(event: MouseEvent) =>\n this.emitAccessoryAction(\n accessory.id,\n accessory.primaryAction,\n event.currentTarget as HTMLElement\n )\n }\n >\n <span class=\"panel-tools__accessory-primary-content ds-interaction-fill__content\">\n {this.renderAccessoryVisual(accessory)}\n </span>\n </button>\n </ds-tooltip>\n {secondary ? (\n <ds-tooltip label={secondary.ariaLabel} side=\"left\" size=\"sm\" boundary=\"viewport\">\n <ds-button-unfilled\n class=\"panel-tools__accessory-secondary\"\n variant=\"icon\"\n size=\"sm\"\n rounded\n background=\"bold\"\n hasBorder={false}\n icon={secondary.icon}\n isInactive={secondary.isInactive}\n focusTabIndex={secondaryIndex === this.rovingIndex ? 0 : -1}\n data-rail-focus-key={secondaryKey}\n aria-label={secondary.ariaLabel}\n onFocusin={() => {\n if (secondaryIndex !== undefined) this.rovingIndex = secondaryIndex;\n }}\n onKeyDown={(event: KeyboardEvent) =>\n secondaryIndex === undefined\n ? undefined\n : this.handleRailKeyDown(event, secondaryIndex)\n }\n onDsClick={(event: CustomEvent<MouseEvent>) =>\n this.emitAccessoryAction(\n accessory.id,\n secondary,\n event.currentTarget as HTMLElement\n )\n }\n />\n </ds-tooltip>\n ) : null}\n </div>\n );\n }\n\n private renderRailEntry(entry: PanelToolsRailEntry, focusIndexes: Map<string, number>) {\n if (entry.type === 'tool') {\n return this.renderRailAction(entry.item, focusIndexes.get(`tool:${entry.id}`) ?? 0);\n }\n return this.renderRailAccessory(entry.accessory, focusIndexes);\n }\n\n render() {\n const accessibleLabel = this.accessibleLabel();\n const header = this.activeHeader();\n const headerTitle = header.title?.trim() || accessibleLabel;\n const headerActions = header.actions ?? [];\n const orderedRailItems = this.orderedRailItems;\n const orderedRailEntries = this.orderedRailEntries;\n const entryPlacement = (entry: PanelToolsRailEntry) =>\n entry.type === 'tool' ? panelToolsRailPlacement(entry.item) : entry.accessory.railPlacement;\n const headerEntries = orderedRailEntries.filter(entry => entryPlacement(entry) === 'header');\n const bodyEntries = orderedRailEntries.filter(entry => entryPlacement(entry) === 'body');\n const footerEntries = orderedRailEntries.filter(entry => entryPlacement(entry) === 'footer');\n const focusIndexes = new Map(\n panelToolsRailFocusKeys(orderedRailEntries).map((key, index) => [key, index])\n );\n const showDrawerChrome = this.isDrawerPresent();\n const drawerResting = panelToolsDrawerResting(this.open, this.motion);\n const activeFullView = Boolean(\n showDrawerChrome && this.activeTool && this.hasFullView(this.activeTool)\n );\n const toolIds = orderedRailItems.map(item => item.id);\n\n return (\n <Host\n class={{\n 'panel-tools': true,\n 'panel-tools--open': this.open,\n 'panel-tools--ready': this.readyForMotion,\n 'panel-tools--motion-opening': this.motion === 'opening',\n 'panel-tools--motion-closing': this.motion === 'closing',\n 'panel-tools--drawer-resting': drawerResting,\n 'panel-tools--fullscreen': this.presentation === 'fullscreen',\n 'panel-tools--presentation-snap': this.presentationMotionSuppressed,\n }}\n data-ds-overlay-boundary\n role={this.presentation === 'fullscreen' ? 'dialog' : 'complementary'}\n aria-modal={this.presentation === 'fullscreen' ? 'true' : undefined}\n aria-label={this.toolsLabel}\n >\n <div class=\"panel-tools__layout\">\n <nav class=\"panel-tools__rail\" aria-label={this.toolShortcutsLabel}>\n {headerEntries.length ? (\n <div\n class={{\n 'panel-tools__rail-header': true,\n 'panel-tools__rail-section--stacked': headerEntries.length > 1,\n 'ds-chrome-row': headerEntries.length === 1,\n 'ds-chrome-column': headerEntries.length > 1,\n 'ds-chrome-space--md': true,\n }}\n >\n {headerEntries.map(entry => this.renderRailEntry(entry, focusIndexes))}\n </div>\n ) : null}\n <div\n class={{\n 'panel-tools__rail-body': true,\n 'ds-chrome-column': true,\n 'ds-chrome-space--md': true,\n 'ds-scrollbar-hidden': true,\n 'ds-focus-ring': this.railBodyScrollable,\n }}\n ref={element => {\n const next = (element as HTMLElement) ?? undefined;\n if (next === this.railBodyEl) return;\n this.railBodyEl = next;\n this.connectRailBodyObserver();\n }}\n role={this.railBodyScrollable ? 'region' : undefined}\n aria-label={this.railBodyScrollable ? this.toolShortcutsLabel : undefined}\n tabIndex={this.railBodyScrollable ? 0 : undefined}\n >\n <div class=\"panel-tools__rail-actions\">\n {bodyEntries.map(entry => this.renderRailEntry(entry, focusIndexes))}\n </div>\n </div>\n {footerEntries.length ? (\n <div\n class={{\n 'panel-tools__rail-footer': true,\n 'panel-tools__rail-section--stacked': footerEntries.length > 1,\n 'ds-chrome-row': footerEntries.length === 1,\n 'ds-chrome-column': footerEntries.length > 1,\n 'ds-chrome-space--md': true,\n }}\n >\n {footerEntries.map(entry => this.renderRailEntry(entry, focusIndexes))}\n </div>\n ) : null}\n </nav>\n\n <div\n class={{\n 'panel-tools__drawer': true,\n 'panel-tools__drawer--visible': showDrawerChrome,\n }}\n aria-hidden={showDrawerChrome ? null : 'true'}\n inert={showDrawerChrome ? undefined : true}\n >\n <div class=\"panel-tools__drawer-surface\">\n {this.presentation !== 'fullscreen' || this.fullscreenHeaderMode === 'shared' ? (\n <ds-panel-tool-header\n class=\"panel-tools__header\"\n heading={headerTitle}\n showBack={header.showBack ?? false}\n backIcon={header.backIcon || 'ChevronLeft'}\n backAriaLabel={header.backAriaLabel || 'Back'}\n showMenu={false}\n ref={element => {\n const toolHeader = element as\n | (HTMLDsPanelToolHeaderElement & {\n actions: PanelToolsHeaderAction[];\n })\n | undefined;\n if (toolHeader) toolHeader.actions = headerActions;\n }}\n onDsBack={() => {\n if (this.activeTool) this.dsHeaderBack.emit({ tool: this.activeTool });\n }}\n />\n ) : null}\n <div class=\"panel-tools__body\" hidden={activeFullView}>\n {toolIds.map(id => {\n const active = this.isViewActive(id);\n return (\n <div\n class={{\n 'panel-tools__view': true,\n 'panel-tools__view--active': active,\n }}\n hidden={!active}\n >\n <slot name={id} />\n </div>\n );\n })}\n </div>\n <div class=\"panel-tools__full-views\" hidden={!activeFullView}>\n {toolIds.map(id => (\n <div\n class={{\n 'panel-tools__full-view': true,\n 'panel-tools__full-view--active':\n this.isViewActive(id) && this.hasFullView(id),\n }}\n hidden={!(this.isViewActive(id) && this.hasFullView(id))}\n >\n <slot name={`${id}-view`} />\n </div>\n ))}\n </div>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"qaAYO,MAAMA,EAAoD,CAC/D,SACA,WACA,WACA,SACA,SACA,QAIK,MAAMC,EAAyD,SAK/D,MAAMC,EAAgE,CAC3EC,OAAQ,SACRC,SAAU,WACVC,OAAQ,SACRC,SAAU,WACVC,OAAQ,SACRC,KAAM,kBAGD,MAAMC,EAA4E,CACvFN,OAAQ,IACRI,OAAQ,IACRH,SAAU,IACVC,OAAQ,IACRC,SAAU,IACVE,KAAM,KA4GD,MAAME,EAA8C,CACzD,CACEC,GAAI,SACJC,KAAM,aACNC,MAAOX,EAAmBK,OAC1BO,cAAe,SACfC,MAAO,EACPC,YAAaP,EAAsBF,OACnCU,kBAAmB,UAErB,CACEN,GAAI,WACJC,KAAM,qBACNC,MAAOX,EAAmBE,SAC1BW,MAAO,EACPC,YAAaP,EAAsBL,SACnCa,kBAAmB,YAErB,CACEN,GAAI,WACJC,KAAM,OACNC,MAAOX,EAAmBI,SAC1BS,MAAO,EACPC,YAAaP,EAAsBH,SACnCW,kBAAmB,YAErB,CACEN,GAAI,SACJC,KAAM,kBACNC,MAAOX,EAAmBC,OAC1BY,MAAO,EACPC,YAAaP,EAAsBN,OACnCc,kBAAmB,UAErB,CACEN,GAAI,OACJC,KAAM,iBACNC,MAAOX,EAAmBM,KAC1BM,cAAe,SACfC,MAAO,EACPC,YAAaP,EAAsBD,KACnCS,kBAAmB,SCpLvB,MAAMC,EAAoE,CACxEC,OAAQ,EACRC,KAAM,EACNC,OAAQ,GAGV,SAASC,EAAoBC,GAC3B,MAAMC,EAAYxB,EAAqByB,WAAUd,GAAMA,IAAOY,EAAKZ,KACnE,OAAOY,EAAKR,QAAUS,EAAY,EAAIE,OAAOC,iBAAmBH,EAClE,CAEM,SAAUI,EAAqBC,GACnC,MAAMC,EAAY,IAAIC,IACtB,IAAK,MAAMR,KAAQM,EAAO,CACxB,GAAIN,EAAKZ,GAAGqB,SAAWF,EAAUG,IAAIV,EAAKZ,IAAKmB,EAAUI,IAAIX,EAAKZ,GAAIY,E,CAExE,OAAOY,MAAMC,KAAKN,EAAUO,UAAUC,MAAK,CAACC,EAAMC,KAChD,MAAMC,EAAaC,EAAwBH,GAC3C,MAAMI,EAAcD,EAAwBF,GAC5C,MAAMI,EACJ1B,EAAyBuB,GAAcvB,EAAyByB,GAClE,GAAIC,IAAgB,EAAG,OAAOA,EAE9B,OAAOtB,EAAoBiB,GAAQjB,EAAoBkB,EAAM,GAEjE,CAOM,SAAUK,EACdhB,EACAiB,GAEA,MAAMC,EAAqCnB,EAAqBC,GAAOmB,KAAIzB,IAAI,CAC7E0B,KAAM,OACNtC,GAAIY,EAAKZ,GACTY,WAEF,MAAM2B,EAAqB,IAAInB,IAC/B,IAAK,MAAMoB,KAAaL,EAAa,CACnC,GAAIK,EAAUxC,GAAGqB,SAAWkB,EAAmBjB,IAAIkB,EAAUxC,IAAK,CAChEuC,EAAmBhB,IAAIiB,EAAUxC,GAAIwC,E,EAGzC,MAAMC,EAA0CjB,MAAMC,KAAKc,EAAmBb,UAAUW,KACtFG,IAAS,CACPF,KAAM,YACNtC,GAAIwC,EAAUxC,GACdwC,gBAIJ,MAAO,IAAIJ,KAAgBK,GAAkBd,MAAK,CAACC,EAAMC,KACvD,MAAMa,EACJd,EAAKU,OAAS,OAASP,EAAwBH,EAAKhB,MAAQgB,EAAKY,UAAUrC,cAC7E,MAAMwC,EACJd,EAAMS,OAAS,OAASP,EAAwBF,EAAMjB,MAAQiB,EAAMW,UAAUrC,cAChF,MAAM8B,EACJ1B,EAAyBmC,GAAiBnC,EAAyBoC,GACrE,GAAIV,IAAgB,EAAG,OAAOA,EAE9B,MAAMW,EAAYhB,EAAKU,OAAS,OAAS3B,EAAoBiB,EAAKhB,MAAQgB,EAAKY,UAAUpC,MACzF,MAAMyC,EACJhB,EAAMS,OAAS,OAAS3B,EAAoBkB,EAAMjB,MAAQiB,EAAMW,UAAUpC,MAC5E,OAAOwC,EAAYC,CAAU,GAEjC,CAGM,SAAUC,EAAwBC,GACtC,OAAOA,EAAQC,SAAQC,IACrB,GAAIA,EAAMX,OAAS,OAAQ,MAAO,CAAC,QAAQW,EAAMjD,MACjD,GAAIiD,EAAMT,UAAUF,OAAS,UAAW,MAAO,GAC/C,GAAIW,EAAMT,UAAUF,OAAS,WAAY,CACvC,OAAOW,EAAMT,UAAUU,OAAOC,WAC1B,GACA,CAAC,aAAaF,EAAMjD,MAAMiD,EAAMT,UAAUU,OAAOlD,K,CAEvD,MAAMoD,EAAOH,EAAMT,UAAUa,cAAcF,WACvC,GACA,CAAC,aAAaF,EAAMjD,MAAMiD,EAAMT,UAAUa,cAAcrD,MAC5D,GAAIiD,EAAMT,UAAUc,kBAAoBL,EAAMT,UAAUc,gBAAgBH,WAAY,CAClFC,EAAKG,KAAK,aAAaN,EAAMjD,MAAMiD,EAAMT,UAAUc,gBAAgBtD,K,CAErE,OAAOoD,CAAI,GAEf,C,SAGgBI,EACdC,EACAC,EACAC,GAEA,IAAKD,EAASE,OAAQ,OAAO,EAC7B,MAAMC,EAAaJ,EAAaE,GAChC,MAAMG,EAAiBD,EAAaH,EAASK,QAAQF,IAAc,EACnE,GAAIC,GAAkB,EAAG,OAAOA,EAChC,IAAK,IAAIE,EAAQL,EAAe,EAAGK,EAAQP,EAAaG,OAAQI,GAAS,EAAG,CAC1E,MAAMC,EAAYP,EAASK,QAAQN,EAAaO,IAChD,GAAIC,GAAa,EAAG,OAAOA,C,CAE7B,IAAK,IAAID,EAAQL,EAAe,EAAGK,GAAS,EAAGA,GAAS,EAAG,CACzD,MAAMC,EAAYP,EAASK,QAAQN,EAAaO,IAChD,GAAIC,GAAa,EAAG,OAAOA,C,CAE7B,OAAOC,KAAKC,IAAID,KAAKE,IAAIT,EAAc,GAAID,EAASE,OAAS,EAC/D,C,SAEgBS,EACdC,EACAC,EACAC,GAEA,MAAO,CAAEF,cAAaC,WAAUC,SAClC,CAEM,SAAUC,EAAmBC,GACjC,cAAcA,IAAU,UAAYA,EAAMrD,OAAOuC,OAAS,CAC5D,CAEM,SAAU7B,EAAwBnB,GACtC,GAAIA,EAAKT,cAAe,OAAOS,EAAKT,cACpC,GAAIS,EAAKZ,KAAOV,EAA6B,MAAO,SACpD,GAAIsB,EAAKZ,KAAO,OAAQ,MAAO,SAC/B,MAAO,MACT,C,SAEgB2E,EACdzD,EACA0D,EACAC,GAEA,IAAKA,GAAc3D,EAAM4D,MAAKlE,GAAQA,EAAKZ,KAAO6E,IAAa,CAC7D,MAAO,CAAED,OAAMC,aAAYE,YAAa,G,CAE1C,MAAO,CAAEH,KAAM,MAAOC,WAAY,GAAIE,YAAaF,EACrD,CAmCM,SAAUG,EAA6BC,GAC3C,MAAMC,EAAaD,EAAME,mBAAmBC,MAAM,KAAK/C,KAAIzB,GAAQA,EAAKS,SACxE,MAAMgE,EAAYJ,EAAMK,mBAAmBF,MAAM,KAAK/C,KAAIzB,GAAQ2E,EAAe3E,EAAKS,OAAQ,KAC9F,MAAMmE,EAASP,EAAMQ,gBAAgBL,MAAM,KAAK/C,KAAIzB,GAAQ2E,EAAe3E,EAAKS,OAAQ,KAExF,OAAO6D,EAAWQ,QAAO,CAACtB,EAAKuB,EAAU3B,KACvC,GAAI2B,IAAa,OAASA,IAAa,YAAa,OAAOvB,EAC3D,MAAMwB,EAAWP,EAAUrB,EAAQqB,EAAUzB,SAAW,EACxD,MAAMiC,EAAQL,EAAOxB,EAAQwB,EAAO5B,SAAW,EAC/C,OAAOM,KAAKE,IAAIA,EAAKwB,EAAWC,EAAO,EAAE,GACxC,EACL,CAGM,SAAUC,EAAwBlB,EAAemB,GACrD,OAAQnB,GAAQmB,IAAW,MAC7B,C,SAGgBC,EACdC,EACAC,EACAH,GAEA,GAAIA,IAAW,UAAW,OAAOE,GAAS,GAC1C,GAAIF,IAAW,UAAW,OAAOG,EAAc,GAAKD,GAASC,EAAc,GAC3E,OAAO,IACT,C,SAGgBC,EACdvB,EACAC,EACA7E,GAEA,GAAI4E,GAAQC,IAAe7E,EAAI,CAC7B,MAAO,CAAE4E,KAAM,MAAOC,WAAY7E,EAAIoG,SAAU,M,CAElD,MAAO,CAAExB,KAAM,KAAMC,WAAY7E,EAAIoG,SAAU,KACjD,CCjOA,MAAMC,EAAgB,IAAM,4spB,MCmDfC,EAAUC,EAAA,MAAAD,UAAAE,EALvB,WAAAC,CAAAC,G,6bAS0CC,KAAA/B,KAAgB,MAGhB+B,KAAAC,aAAwC,SAIhFD,KAAAE,qBAA2C,SAI3CF,KAAA9B,WAAoC,GAM5B8B,KAAAzF,MAA0B,GAM1ByF,KAAAxE,YAAyC,GAEzCwE,KAAAG,WAAqB,QACrBH,KAAAI,mBAA6B,iBAG7BJ,KAAAK,QAA6B,GAMDL,KAAAM,WAAqB,GAkCxCN,KAAAZ,OAAyC,OAGzCY,KAAAO,sBAAwB,MAGxBP,KAAAQ,eAAiB,MAGjBR,KAAAS,6BAA+B,MAE/BT,KAAAU,YAAc,EACdV,KAAAW,gBAAsC,GACtCX,KAAAY,mBAAqB,MAE9BZ,KAAAa,uBAAyB,EACzBb,KAAAc,6BAA+B,EAC/Bd,KAAAe,qBAAuB,EACvBf,KAAAgB,wBAAyC,KAEzChB,KAAAiB,0BAA4B,MAC5BjB,KAAAkB,sBAA4C,KAC5ClB,KAAAmB,iBAA4C,KAkG5CnB,KAAAoB,2BAA8BC,IACpC,MAAMC,EAAUD,EAA6DC,OAC7E,IAAKtB,KAAK9B,aAAeoD,GAAQjI,GAAI,OACrCgI,EAAME,kBACNvB,KAAKwB,eAAeC,KAAK,CACvBC,KAAM1B,KAAK9B,WACX7E,GAAIiI,EAAOjI,GACXwE,OAAQyD,EAAOzD,QACf,EAuKImC,KAAA2B,oBAAuBN,IAC7B,MAAMO,EAAS5B,KAAK6B,WAAWC,cAAc,wBAC7C,GAAIT,EAAMU,SAAWH,EAAQ,OAC7B,GAAIP,EAAMW,eAAiB,YAAa,OACxC,GAAIhC,KAAKiB,0BAA2B,CAClCjB,KAAKiB,0BAA4B,MACjC,M,CAMF,GAAII,EAAM1F,OAAS,mBAAoB,OACvC,GAAIiG,IAAW5B,KAAKiC,2BAA2BL,EAAQ5B,KAAKZ,QAAS,OACrEY,KAAKkC,wBAAwB,EAiFvBlC,KAAAmC,iBAAoB9I,IAC1B,MAAM+I,EAAO5C,EAA2BQ,KAAK/B,KAAM+B,KAAK9B,WAAY7E,GACpE2G,KAAK/B,KAAOmE,EAAKnE,KACjB+B,KAAK9B,WAAakE,EAAKlE,WACvB8B,KAAKqC,aAAaZ,KAAK,CAAEpI,KAAIoG,SAAU2C,EAAK3C,UAAW,EA8CjDO,KAAAsC,kBAAoB,CAACC,EAAkBlF,EAAemF,KAC5D,MAAM/F,EAAON,EAAwB6D,KAAKyC,oBAC1C,IAAKhG,EAAKQ,OAAQ,OAElB,IAAKsF,EAAEG,MAAQ,SAAWH,EAAEG,MAAQ,MAAQF,EAAU,CACpDD,EAAEI,iBACFH,IACA,M,CAGF,GAAID,EAAEG,MAAQ,YAAa,CACzB,GAAIrF,GAASZ,EAAKQ,OAAS,EAAG,OAC9BsF,EAAEI,iBACF3C,KAAK4C,YAAYvF,EAAQ,GACzB,M,CAGF,GAAIkF,EAAEG,MAAQ,UAAW,CACvB,GAAIrF,GAAS,EAAG,OAChBkF,EAAEI,iBACF3C,KAAK4C,YAAYvF,EAAQ,E,EAma9B,CAr1BC,aAAYwF,GACV,OAAO7C,KAAKzF,OAAS,E,CAGvB,oBAAYuI,GACV,OAAOxI,EAAqB0F,KAAK6C,U,CAGnC,mBAAYE,GACV,OAAO/C,KAAKxE,aAAe,E,CAG7B,sBAAYiH,GACV,OAAOlH,EAA2ByE,KAAK6C,UAAW7C,KAAK+C,gB,CAGzD,oBAAAC,GACEhD,KAAKiD,GAAGC,oBAAoB,gBAAiBlD,KAAK2B,qBAClD3B,KAAKiD,GAAGC,oBAAoB,mBAAoBlD,KAAK2B,qBACrD3B,KAAKiD,GAAGC,oBAAoB,WAAYlD,KAAKoB,4BAC7CpB,KAAKmD,4BACLnD,KAAKa,wBAA0B,EAC/Bb,KAAKmB,kBAAkBiC,aACvBpD,KAAKmB,iBAAmB,KACxBnB,KAAKqD,4B,CAIP,mBAAAC,CAAoBlB,EAA+BmB,GACjD,GAAInB,IAASmB,EAAU,OAKvB,GAAIvD,KAAKiD,GAAGO,aAAa,kBAAoBpB,EAAM,CACjDpC,KAAKiD,GAAGQ,aAAa,eAAgBrB,E,CAEvC,MAAMsB,IAA2B1D,KAAKc,6BACtCd,KAAKS,6BAA+B,KACpCkD,uBAAsB,KACpBA,uBAAsB,KACpB,GAAID,IAA2B1D,KAAKc,6BAA8B,OAClEd,KAAKS,6BAA+B,KAAK,GACzC,IAEJ,GAAI2B,IAAS,aAAc,CACzBpC,KAAKkB,sBACH0C,SAASC,yBAAyBhE,EAAc+D,SAASC,cAAgB,KAC3E7D,KAAK/B,KAAO,I,MACP,GAAIsF,IAAa,aAAc,CACpC,MAAMrC,EAAwBlB,KAAKkB,sBACnC,MAAM4C,EAAmB9D,KAAK+D,eAAeC,UAAU,IAAI3K,GAC3DsK,uBAAsBM,UACpB,GAAI/C,GAAuBgD,YAAa,CACtChD,EAAsBiD,MAAM,CAAEC,cAAe,M,CAE/C,MAAMC,EAAgBnD,EAClB0C,SAASC,gBAAkB3C,GAC3BA,EAAsBoD,SAASV,SAASC,eACxC,MACJ,IAAKQ,GAAiBP,QAAwB9D,KAAKuE,kBAAkBT,GACrE9D,KAAKkB,sBAAwB,IAAI,G,CAGrClB,KAAKwE,qBAAqB/C,KAAK,CAAExB,aAAcmC,G,CAIjD,sBAAAqC,CAAuBpD,GACrB,GAAIrB,KAAKC,eAAiB,cAAgBoB,EAAMqB,MAAQ,SAAU,OAClErB,EAAMsB,iBACNtB,EAAME,kBACNvB,KAAKC,aAAe,Q,CAGd,iBAAAyE,GACN,GAAI1E,KAAKQ,eAAgB,OACzB,MAAMmE,IAAe3E,KAAKa,uBAC1B8C,uBAAsB,KACpB,GAAIgB,IAAe3E,KAAKa,uBAAwB,OAChD8C,uBAAsB,KACpB,GAAIgB,IAAe3E,KAAKa,uBAAwB,OAChDb,KAAKQ,eAAiB,IAAI,GAC1B,G,CAIN,iBAAAoE,GACE5E,KAAKiD,GAAGQ,aAAaoB,EAAqC,IAC1D7E,KAAKiD,GAAG6B,iBAAiB,gBAAiB9E,KAAK2B,qBAC/C3B,KAAKiD,GAAG6B,iBAAiB,mBAAoB9E,KAAK2B,qBAClD3B,KAAKiD,GAAG6B,iBAAiB,WAAY9E,KAAKoB,2B,CAc5C,iBAAA2D,GACE/E,KAAKgF,wBACLhF,KAAKO,sBAAwBP,KAAK/B,I,CAIpC,WAAAgH,CAAYC,EAAiBC,GAC3B,GAAID,EAAQlF,KAAKO,sBAAwB,KACzC,GAAIP,KAAKQ,gBAAkB2E,IAAYC,WAAaD,IAAYD,EAAQ,CACtElF,KAAKqF,sBAAsBH,EAAS,UAAY,U,MAC3C,IAAKA,EAAQ,CAClBlF,KAAKO,sBAAwB,K,CAE/BP,KAAK0E,mB,CAIP,iBAAAY,GACEtF,KAAKuF,wBACLvF,KAAK0E,mB,CAIP,iBAAAc,GACExF,KAAKgF,uB,CAGP,gBAAAS,GACEzF,KAAK0E,oBACL1E,KAAK0F,0BACL1F,KAAK2F,2BACL3F,KAAK4F,oBACL5F,KAAKmB,iBAAmB,IAAI0E,kBAAiB,IAAM7F,KAAK4F,sBACxD5F,KAAKmB,iBAAiB2E,QAAQ9F,KAAKiD,GAAI,CACrC8C,UAAW,KACXC,WAAY,KACZC,gBAAiB,CAAC,S,CAItB,kBAAAC,GACElG,KAAK2F,0B,CAGC,uBAAAD,GACN1F,KAAKqD,6BACL,IAAKrD,KAAKmG,mBAAqBC,iBAAmB,YAAa,OAC/DpG,KAAKqG,iBAAmB,IAAID,gBAAe,IAAMpG,KAAK2F,6BACtD3F,KAAKqG,iBAAiBP,QAAQ9F,KAAKmG,W,CAG7B,0BAAA9C,GACNrD,KAAKqG,kBAAkBjD,aACvBpD,KAAKqG,iBAAmBjB,S,CAGlB,wBAAAO,GACN,MAAMvD,EAAOkE,QACXtG,KAAKmG,YAAcnG,KAAKmG,WAAWI,aAAevG,KAAKmG,WAAWK,aAAe,GAEnF,GAAIpE,IAASpC,KAAKY,mBAAoBZ,KAAKY,mBAAqBwB,C,CAIlE,YAAAqE,GACEzG,KAAKU,YAAc,EACnBV,KAAK0G,sBACL1G,KAAK0E,mB,CAIP,kBAAAiC,CACEvE,EAAkC,GAClCmB,EAAsC,IAEtC,MAAMzG,EAAeX,EACnBZ,EAA2ByE,KAAK6C,UAAWU,IAE7C,MAAMxG,EAAWZ,EAAwBZ,EAA2ByE,KAAK6C,UAAWT,IACpF,MAAMyB,EAAiB7D,KAAK6B,WAA0BgC,cACtD,MAAM+C,EACJ/C,GAAegD,QAAqB,0BAA0BC,QAAQC,aACxE,MAAMC,EAAeJ,EAAa9J,EAAaM,QAAQwJ,IAAc,EACrE,MAAM5J,EAAegK,GAAgB,EAAIA,EAAehH,KAAKU,YAC7D,MAAMpD,EAAYT,EAA+BC,EAAcC,EAAUC,GACzE,MAAMiK,EAAeD,GAAgB,IAAMjK,EAASmK,SAASN,GAAc,IAC3E5G,KAAKU,YAAcpD,EACnB,GAAI2J,GAAgBlK,EAASE,OAAQ,CACnC0G,uBAAsB,IAAM3D,KAAK4C,YAAYtF,I,EAIzC,qBAAA0H,GACN,IAAKhF,KAAKM,YAAcN,KAAK9B,WAAY,OACzC,IACE,MAAMiJ,EAASC,aAAaC,QAAQrH,KAAKM,YACzC,GAAIxC,EAAmBqJ,GAASnH,KAAK9B,WAAaiJ,C,CAClD,M,EAKI,qBAAA5B,GACN,IAAKvF,KAAKM,aAAeN,KAAK9B,WAAY,OAC1C,IACEkJ,aAAaE,QAAQtH,KAAKM,WAAYN,KAAK9B,W,CAC3C,M,EAKI,kBAAAqJ,GACN,IAAKvH,KAAKM,WAAY,OACtB,IACE8G,aAAaI,WAAWxH,KAAKM,W,CAC7B,M,EAKI,mBAAAoG,GACN,MAAMtE,EAAOpE,EAAgCgC,KAAK6C,UAAW7C,KAAK/B,KAAM+B,KAAK9B,YAC7E,IAAKkE,EAAKhE,YAAa,OACvB4B,KAAKuH,qBACLvH,KAAK/B,KAAOmE,EAAKnE,KACjB+B,KAAK9B,WAAakE,EAAKlE,WACvB8B,KAAKqC,aAAaZ,KAAK,CAAEpI,GAAI+I,EAAKhE,YAAaqB,SAAU,O,CAGnD,qBAAA4F,CAAsBoC,GAC5B,MAAM7F,EAAS5B,KAAK6B,WAAWC,cAAc,wBAC7C,GAAI9B,KAAKZ,SAAW,OAAQ,CAC1BY,KAAKkC,yBACLlC,KAAKiB,0BAA4B,I,CAEnCjB,KAAKZ,OAASqI,EACdzH,KAAK0H,wBAAwBjG,KAAK,CAAEkG,OAAQ,cAAeF,UAC3D,MAAM9C,IAAe3E,KAAKe,qBAE1B4C,uBAAsB,KACpBA,uBAAsB,KACpB,GAAIgB,IAAe3E,KAAKe,sBAAwBf,KAAKZ,SAAWqI,EAAO,OACvE,IAAK7F,EAAQ,CACX5B,KAAKkC,yBACL,M,CAGF,GAAIlC,KAAKiC,2BAA2BL,EAAQ6F,GAAQ,CAClDzH,KAAKkC,yBACL,M,CAGF,MAAM0F,EAAavJ,EAA6BwJ,iBAAiBjG,IACjE,GAAIgG,GAAc,EAAG,CACnB5H,KAAKkC,yBACL,M,CAEFlC,KAAKgB,wBAA0B8G,OAAOC,YAAW,KAC/C/H,KAAKkC,wBAAwB,GAC5B0F,EAAW,GACd,G,CAqBE,0BAAA3F,CACNL,EACA6F,GAEA,MAAMnI,EAAQsC,EAAOoG,wBAAwB1I,MAC7C,MAAM2I,EAAUrG,EAAOE,cAAc,gCACrC,MAAMvC,EAAc0I,GAASD,wBAAwB1I,OAAS,EAC9D,OAAOD,EAA2BC,EAAOC,EAAakI,E,CAGhD,sBAAAvF,GACN,MAAMgG,EAAiBlI,KAAKZ,OAC5B,MAAM+I,EAAmBD,IAAmB,OAC5ClI,KAAKmD,4BACL,IAAKgF,EAAkB,OACvBnI,KAAKiB,0BAA4B,MACjCjB,KAAKZ,OAAS,OACd,GAAI8I,IAAmB,YAAclI,KAAK/B,KAAM,CAC9C+B,KAAKO,sBAAwB,K,CAE/BP,KAAKoI,sBAAsB3G,KAAK,CAAEkG,OAAQ,e,CAGpC,yBAAAxE,GACNnD,KAAKe,sBAAwB,EAC7B,GAAIf,KAAKgB,0BAA4B,KAAM,CACzC8G,OAAOO,aAAarI,KAAKgB,yBACzBhB,KAAKgB,wBAA0B,I,EAK3B,cAAAsH,CAAejP,GACrB,OAAO2G,KAAK/B,MAAQ+B,KAAK9B,aAAe7E,C,CAIlC,eAAAkP,GACN,OAAOvI,KAAK/B,MAAQ+B,KAAKO,qB,CAGnB,YAAAiI,CAAanP,GACnB,OAAO2G,KAAKuI,mBAAqBvI,KAAK9B,aAAe7E,C,CAG/C,WAAAoP,CAAYpP,GAClB,OAAO2G,KAAKW,gBAAgBuG,SAAS7N,E,CAG/B,iBAAAuM,GACN,MAAM8C,EAAM1I,KAAK8C,iBAAiBpH,KAAIzB,GAAQA,EAAKZ,KACnD,MAAM+I,EAAOsG,EAAIC,QAAOtP,GAAMiN,QAAQtG,KAAKiD,GAAGnB,cAAc,UAAUzI,eACtE,GAAI+I,EAAKwG,KAAK,OAAS5I,KAAKW,gBAAgBiI,KAAK,KAAM5I,KAAKW,gBAAkByB,C,CAGhF,cAAYP,GACV,OAAO7B,KAAKiD,GAAG4F,YAAc7I,KAAKiD,E,CAG5B,eAAA6F,GACN,IAAK9I,KAAKuI,oBAAsBvI,KAAK9B,WAAY,MAAO,GACxD,MAAMjE,EAAO+F,KAAK6C,UAAUkG,MAAKC,GAAaA,EAAU3P,KAAO2G,KAAK9B,aACpE,OACEjE,GAAMV,OACNX,EAAmBoH,KAAK9B,aACxB8B,KAAK9B,U,CAID,eAAA+K,GACN,OAAOjJ,KAAKK,SAAW,E,CAGjB,YAAA0D,GACN,IAAK/D,KAAK9B,WAAY,MAAO,GAC7B,OAAO8B,KAAKiJ,kBAAkBjJ,KAAK9B,aAAe,E,CAYpD,kBAAMgL,CAAa7P,GACjB,MAAMY,EAAO+F,KAAK6C,UAAUkG,MAAKzM,GAASA,EAAMjD,KAAOA,IACvD,IAAKY,GAAQA,EAAKuC,WAAY,OAC9BwD,KAAKmC,iBAAiB9I,E,CAKxB,iBAAM8P,GACJ,IAAKnJ,KAAK/B,KAAM,OAChB,MAAM5E,EAAK2G,KAAK9B,WAChB8B,KAAK/B,KAAO,MACZ,GAAI5E,EAAI,CACN2G,KAAKqC,aAAaZ,KAAK,CAAEpI,KAAIoG,SAAU,O,EAM3C,uBAAM8E,CAAkBlL,GACtB,MAAMkD,EAASyD,KAAK6B,WAAWC,cAAc,2BAA2BsH,IAAIC,OAAOhQ,cAG7EkD,GAAQ+M,a,CAGR,WAAA1G,CAAYvF,GAClB,MAAMZ,EAAON,EAAwB6D,KAAKyC,oBAC1C,IAAKhG,EAAKQ,OAAQ,OAClB,MAAMsM,EAAUhM,KAAKE,IAAI,EAAGF,KAAKC,IAAIH,EAAOZ,EAAKQ,OAAS,IAC1D+C,KAAKU,YAAc6I,EACnB,MAAMhN,EAASyD,KAAK6B,WAAWC,cAC7B,yBAAyBsH,IAAIC,OAAO5M,EAAK8M,SAE3C,GAAIhN,GAAQ+M,SAAU,MACf/M,EAAO+M,U,KACP,CACL/M,GAAQ4H,MAAM,CAAEC,cAAe,M,EA4B3B,gBAAAoF,CAAiBvP,EAAsBoD,GAC7C,MAAMoM,EAAW,QAAQxP,EAAKZ,KAC9B,MAAME,EACJU,EAAKyP,WACLzP,EAAKV,OACLX,EAAmBqB,EAAKZ,KACxBY,EAAKZ,GACP,OACEsQ,EAAA,cACEjH,IAAKzI,EAAKZ,GACVE,MAAOA,EACPG,YACEO,EAAKP,aAAeP,EAAsBc,EAAKZ,IAEjDuQ,KAAK,OACLC,KAAK,KACLC,SAAS,YAETH,EAAA,sBACEI,QAAQ,OACRC,MAAM,2BACN1Q,KAAMW,EAAKX,KACX2Q,SAAUjK,KAAKsI,eAAerO,EAAKZ,IACnC6Q,WAAY,MACZC,UAAW,MACXC,WAAY,MACZC,IAAKpQ,EAAKoQ,KAAO,MACjB7N,WAAYvC,EAAKuC,WACjB8N,cAAejN,IAAU2C,KAAKU,YAAc,GAAI,EAAE,sBAC7B+I,EAAQ,aACjBlQ,EACZgR,QAASvK,KAAKsI,eAAerO,EAAKZ,IAClCmR,UAAW,KACTxK,KAAKU,YAAcrD,CAAK,EAE1BoN,UAAYlI,GACVvC,KAAKsC,kBAAkBC,EAAGlF,GAAO,IAAM2C,KAAKmC,iBAAiBlI,EAAKZ,MAEpEqR,UAAW,IAAM1K,KAAKmC,iBAAiBlI,EAAKZ,M,CAM5C,qBAAAsR,CAAsB9O,GAC5B,MAAM+O,EAAc/O,EAAUa,cAAcgN,WAAWhP,QAAUmB,EAAU6N,UAC3E,MAAMmB,EAAShP,EAAUiP,WAAWpQ,OACpC,OAAOmQ,EAAS,GAAGD,MAAgBC,IAAWD,C,CAGxC,mBAAAG,CACNpN,EACApB,EACAsB,GAEA,GAAItB,EAAOC,WAAY,OACvBwD,KAAKgL,sBAAsBvJ,KACzB/D,EAAoCC,EAAapB,EAAOlD,GAAIwE,G,CAIxD,qBAAAoN,CAAsBpP,GAC5B,GAAIA,EAAUqP,OAAOvP,OAAS,QAAS,CACrC,OACEgO,EAAA,OACEK,MAAM,+BACNmB,IAAKtP,EAAUqP,OAAOC,IACtBC,IAAI,GAAE,cACM,Q,CAIlB,GAAIvP,EAAUqP,OAAOvP,OAAS,UAAW,CACvC,MAAM0P,EAAU,IAAIxP,EAAUqP,OAAOG,QAAQ3Q,QAAQ4Q,MAAM,EAAG,GAAG1C,KAAK,IACtE,OACEe,EAAA,WACEK,MAAM,iCACNuB,GAAG,OACHxB,QAAQ,eACRyB,SAAQ,KACRC,MAAM,UAAS,cACH,QAEXJ,E,CAIP,OAAO1B,EAAA,WAAS+B,KAAM7P,EAAUqP,OAAO5R,KAAMuQ,KAAK,KAAI,cAAa,Q,CAG7D,kBAAA8B,CACN9P,EACA+P,GAEA,MAAMnC,EAAW,aAAa5N,EAAUxC,MAAMwC,EAAUU,OAAOlD,KAC/D,MAAMwS,EAAaD,EAAaE,IAAIrC,GACpC,MAAMlQ,EAAQsC,EAAUU,OAAOmN,WAAWhP,QAAUmB,EAAU6N,UAC9D,MAAMqC,EAAW,IAAIlQ,EAAUkQ,SAASrR,QAAQ4Q,MAAM,EAAG,GAAG1C,KAAK,IAEjE,OACEe,EAAA,OACEjH,IAAK,aAAa7G,EAAUxC,KAC5B2Q,MAAM,2DAENL,EAAA,cAAYpQ,MAAOA,EAAOqQ,KAAK,OAAOC,KAAK,KAAKC,SAAS,YACvDH,EAAA,UACEhO,KAAK,SACLqO,MAAM,gEACNgC,SAAUnQ,EAAUU,OAAOC,WAC3ByP,SAAUJ,IAAe7L,KAAKU,YAAc,GAAI,EAAE,sBAC7B+I,EAAQ,aACjBlQ,EACZ2S,QAAS,KACP,GAAIL,IAAezG,UAAWpF,KAAKU,YAAcmL,CAAU,EAE7DpB,UAAYpJ,GACVwK,IAAezG,UAAYA,UAAYpF,KAAKsC,kBAAkBjB,EAAOwK,GAEvEM,QAAU9K,GACRrB,KAAK+K,oBACHlP,EAAUxC,GACVwC,EAAUU,OACV8E,EAAM+K,gBAIVzC,EAAA,QAAMK,MAAM,8DACVL,EAAA,WACEK,MAAM,4BACNuB,GAAG,OACHxB,QAAQ,eACRyB,SAAQ,KACRC,MAAM,WAELM,GAEFlQ,EAAUwO,IACTV,EAAA,YACEK,MAAM,4BACND,QAAQ,MACRsC,WAAW,oCAAmC,cAClC,SAEZ,Q,CAQR,mBAAAC,CACNzQ,EACA+P,GAEA,GAAI/P,EAAUF,OAAS,UAAW,CAChC,OACEgO,EAAA,OACEjH,IAAK,aAAa7G,EAAUxC,KAC5B2Q,MAAM,iCAAgC,cAC1B,QAEZL,EAAA,mB,CAKN,GAAI9N,EAAUF,OAAS,WAAY,CACjC,OAAOqE,KAAK2L,mBAAmB9P,EAAW+P,E,CAG5C,MAAMW,EAAa,aAAa1Q,EAAUxC,MAAMwC,EAAUa,cAAcrD,KACxE,MAAMmT,EAAeZ,EAAaE,IAAIS,GACtC,MAAME,EAAezM,KAAK2K,sBAAsB9O,GAChD,MAAM6Q,EAAY7Q,EAAUc,gBAC5B,MAAMgQ,EAAeD,EAAY,aAAa7Q,EAAUxC,MAAMqT,EAAUrT,KAAO,GAC/E,MAAMuT,EAAiBF,EAAYd,EAAaE,IAAIa,GAAgBvH,UAEpE,OACEuE,EAAA,OACEjH,IAAK,aAAa7G,EAAUxC,KAC5B2Q,MAAO,CACL,yBAA0B,KAC1B,oCAAqC,KACrC,2CAA4CnO,EAAUgR,aAAe,SACrE,6CAA8ChR,EAAUgR,aAAe,aAGzElD,EAAA,cAAYpQ,MAAOkT,EAAc7C,KAAK,OAAOC,KAAK,KAAKC,SAAS,YAC9DH,EAAA,UACEhO,KAAK,SACLqO,MAAM,sGACNgC,SAAUnQ,EAAUa,cAAcF,WAClCyP,SAAUO,IAAiBxM,KAAKU,YAAc,GAAI,EAAE,sBAC/B6L,EAAU,aACnBE,EACZP,QAAS,KACP,GAAIM,IAAiBpH,UAAWpF,KAAKU,YAAc8L,CAAY,EAEjE/B,UAAYpJ,GACVmL,IAAiBpH,UAAYA,UAAYpF,KAAKsC,kBAAkBjB,EAAOmL,GAEzEL,QAAU9K,GACRrB,KAAK+K,oBACHlP,EAAUxC,GACVwC,EAAUa,cACV2E,EAAM+K,gBAIVzC,EAAA,QAAMK,MAAM,uEACThK,KAAKiL,sBAAsBpP,MAIjC6Q,EACC/C,EAAA,cAAYpQ,MAAOmT,EAAUhD,UAAWE,KAAK,OAAOC,KAAK,KAAKC,SAAS,YACrEH,EAAA,sBACEK,MAAM,mCACND,QAAQ,OACRF,KAAK,KACLiD,QAAO,KACPT,WAAW,OACXlC,UAAW,MACX7Q,KAAMoT,EAAUpT,KAChBkD,WAAYkQ,EAAUlQ,WACtB8N,cAAesC,IAAmB5M,KAAKU,YAAc,GAAI,EAAE,sBACtCiM,EAAY,aACrBD,EAAUhD,UACtBc,UAAW,KACT,GAAIoC,IAAmBxH,UAAWpF,KAAKU,YAAckM,CAAc,EAErEnC,UAAYpJ,GACVuL,IAAmBxH,UACfA,UACApF,KAAKsC,kBAAkBjB,EAAOuL,GAEpClC,UAAYrJ,GACVrB,KAAK+K,oBACHlP,EAAUxC,GACVqT,EACArL,EAAM+K,kBAKZ,K,CAKF,eAAAW,CAAgBzQ,EAA4BsP,GAClD,GAAItP,EAAMX,OAAS,OAAQ,CACzB,OAAOqE,KAAKwJ,iBAAiBlN,EAAMrC,KAAM2R,EAAaE,IAAI,QAAQxP,EAAMjD,OAAS,E,CAEnF,OAAO2G,KAAKsM,oBAAoBhQ,EAAMT,UAAW+P,E,CAGnD,MAAAoB,GACE,MAAMlE,EAAkB9I,KAAK8I,kBAC7B,MAAMjP,EAASmG,KAAK+D,eACpB,MAAMkJ,EAAcpT,EAAOqT,OAAOxS,QAAUoO,EAC5C,MAAMqE,EAAgBtT,EAAOmK,SAAW,GACxC,MAAMlB,EAAmB9C,KAAK8C,iBAC9B,MAAML,EAAqBzC,KAAKyC,mBAChC,MAAM2K,EAAkB9Q,GACtBA,EAAMX,OAAS,OAASP,EAAwBkB,EAAMrC,MAAQqC,EAAMT,UAAUrC,cAChF,MAAM6T,EAAgB5K,EAAmBkG,QAAOrM,GAAS8Q,EAAe9Q,KAAW,WACnF,MAAMgR,EAAc7K,EAAmBkG,QAAOrM,GAAS8Q,EAAe9Q,KAAW,SACjF,MAAMiR,EAAgB9K,EAAmBkG,QAAOrM,GAAS8Q,EAAe9Q,KAAW,WACnF,MAAMsP,EAAe,IAAInR,IACvB0B,EAAwBsG,GAAoB/G,KAAI,CAACgH,EAAKrF,IAAU,CAACqF,EAAKrF,MAExE,MAAMmQ,EAAmBxN,KAAKuI,kBAC9B,MAAMkF,EAAgBtO,EAAwBa,KAAK/B,KAAM+B,KAAKZ,QAC9D,MAAMsO,EAAiBpH,QACrBkH,GAAoBxN,KAAK9B,YAAc8B,KAAKyI,YAAYzI,KAAK9B,aAE/D,MAAMyP,EAAU7K,EAAiBpH,KAAIzB,GAAQA,EAAKZ,KAElD,OACEsQ,EAACiE,EAAI,CAAAlL,IAAA,2CACHsH,MAAO,CACL,cAAe,KACf,oBAAqBhK,KAAK/B,KAC1B,qBAAsB+B,KAAKQ,eAC3B,8BAA+BR,KAAKZ,SAAW,UAC/C,8BAA+BY,KAAKZ,SAAW,UAC/C,8BAA+BqO,EAC/B,0BAA2BzN,KAAKC,eAAiB,aACjD,iCAAkCD,KAAKS,8BACxC,gCAEDoN,KAAM7N,KAAKC,eAAiB,aAAe,SAAW,gBAAe,aACzDD,KAAKC,eAAiB,aAAe,OAASmF,UAAS,aACvDpF,KAAKG,YAEjBwJ,EAAA,OAAAjH,IAAA,2CAAKsH,MAAM,uBACTL,EAAA,OAAAjH,IAAA,2CAAKsH,MAAM,oBAAmB,aAAahK,KAAKI,oBAC7CiN,EAAcpQ,OACb0M,EAAA,OACEK,MAAO,CACL,2BAA4B,KAC5B,qCAAsCqD,EAAcpQ,OAAS,EAC7D,gBAAiBoQ,EAAcpQ,SAAW,EAC1C,mBAAoBoQ,EAAcpQ,OAAS,EAC3C,sBAAuB,OAGxBoQ,EAAc3R,KAAIY,GAAS0D,KAAK+M,gBAAgBzQ,EAAOsP,MAExD,KACJjC,EAAA,OAAAjH,IAAA,2CACEsH,MAAO,CACL,yBAA0B,KAC1B,mBAAoB,KACpB,sBAAuB,KACvB,sBAAuB,KACvB,gBAAiBhK,KAAKY,oBAExBkN,IAAKC,IACH,MAAM3L,EAAQ2L,GAA2B3I,UACzC,GAAIhD,IAASpC,KAAKmG,WAAY,OAC9BnG,KAAKmG,WAAa/D,EAClBpC,KAAK0F,yBAAyB,EAEhCmI,KAAM7N,KAAKY,mBAAqB,SAAWwE,UAAS,aACxCpF,KAAKY,mBAAqBZ,KAAKI,mBAAqBgF,UAChE6G,SAAUjM,KAAKY,mBAAqB,EAAIwE,WAExCuE,EAAA,OAAAjH,IAAA,2CAAKsH,MAAM,6BACRsD,EAAY5R,KAAIY,GAAS0D,KAAK+M,gBAAgBzQ,EAAOsP,OAGzD2B,EAActQ,OACb0M,EAAA,OACEK,MAAO,CACL,2BAA4B,KAC5B,qCAAsCuD,EAActQ,OAAS,EAC7D,gBAAiBsQ,EAActQ,SAAW,EAC1C,mBAAoBsQ,EAActQ,OAAS,EAC3C,sBAAuB,OAGxBsQ,EAAc7R,KAAIY,GAAS0D,KAAK+M,gBAAgBzQ,EAAOsP,MAExD,MAGNjC,EAAA,OAAAjH,IAAA,2CACEsH,MAAO,CACL,sBAAuB,KACvB,+BAAgCwD,GACjC,cACYA,EAAmB,KAAO,OACvCQ,MAAOR,EAAmBpI,UAAY,MAEtCuE,EAAA,OAAAjH,IAAA,2CAAKsH,MAAM,+BACRhK,KAAKC,eAAiB,cAAgBD,KAAKE,uBAAyB,SACnEyJ,EAAA,wBACEK,MAAM,sBACNiE,QAAShB,EACTiB,SAAUrU,EAAOqU,UAAY,MAC7BC,SAAUtU,EAAOsU,UAAY,cAC7BC,cAAevU,EAAOuU,eAAiB,OACvCC,SAAU,MACVP,IAAKC,IACH,MAAMO,EAAaP,EAKnB,GAAIO,EAAYA,EAAWtK,QAAUmJ,CAAa,EAEpDoB,SAAU,KACR,GAAIvO,KAAK9B,WAAY8B,KAAKwO,aAAa/M,KAAK,CAAEC,KAAM1B,KAAK9B,YAAa,IAGxE,KACJyL,EAAA,OAAAjH,IAAA,2CAAKsH,MAAM,oBAAoByE,OAAQf,GACpCC,EAAQjS,KAAIrC,IACX,MAAMqV,EAAS1O,KAAKwI,aAAanP,GACjC,OACEsQ,EAAA,OACEK,MAAO,CACL,oBAAqB,KACrB,4BAA6B0E,GAE/BD,QAASC,GAET/E,EAAA,QAAM+B,KAAMrS,IACR,KAIZsQ,EAAA,OAAAjH,IAAA,2CAAKsH,MAAM,0BAA0ByE,QAASf,GAC3CC,EAAQjS,KAAIrC,GACXsQ,EAAA,OACEK,MAAO,CACL,yBAA0B,KAC1B,iCACEhK,KAAKwI,aAAanP,IAAO2G,KAAKyI,YAAYpP,IAE9CoV,SAAUzO,KAAKwI,aAAanP,IAAO2G,KAAKyI,YAAYpP,KAEpDsQ,EAAA,QAAM+B,KAAM,GAAGrS,kB","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"names":["checkboxCss","idCounter","Checkbox","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","labelId","descriptionId","checked","size","value","disabled","required","requiredMessage","DEFAULT_REQUIRED_MESSAGE","indeterminate","isInactive","presentation","initialChecked","initialIndeterminate","formDisabled","handleActivate","dsChange","emit","handleKeyDown","e","key","preventDefault","componentWillLoad","syncFormValue","inactive","setFormControlValue","internals","missing","setRequiredValidity","formDisabledCallback","formResetCallback","render","isMarked","invalid","h","Host","role","undefined","String","description","tabIndex","class","checkbox","Boolean","onClick","onKeyDown","box","viewBox","fill","focusable","d","as","variant","CONTROL_TEXT_VARIANT","textId","label","CONTROL_SUPPORTING_TEXT_VARIANT","color"],"sources":["src/wc/components/Checkbox/Checkbox.css?tag=ds-checkbox&encapsulation=scoped","src/wc/components/Checkbox/Checkbox.tsx"],"sourcesContent":["@import '../../utils/control-inactive.css';\n@import '../../utils/radius.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: 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:host(.checkbox--described) {\n height: auto;\n min-height: var(--ds-control-height);\n padding-block: var(--dimension-space-075);\n}\n\n:host(.checkbox--presentation) {\n width: var(--ds-control-icon);\n height: var(--ds-control-icon);\n padding: 0;\n gap: 0;\n pointer-events: none;\n}\n\n/* Inactive: `.ds-control-inactive` (50% opacity). */\n\n:host(.checkbox--lg) {\n --_checkbox-box: var(--dimension-iconography-md);\n --_checkbox-stroke: var(--dimension-stroke-width-018);\n}\n\n:host(.checkbox--md) {\n --_checkbox-box: var(--dimension-iconography-sm);\n --_checkbox-stroke: var(--dimension-stroke-width-015);\n}\n\n:host(.checkbox--sm) {\n --_checkbox-box: var(--dimension-iconography-xs);\n --_checkbox-stroke: var(--dimension-stroke-width-012);\n}\n\n:host(.checkbox--xs) {\n --_checkbox-box: var(--dimension-size-100);\n --_checkbox-stroke: calc(var(--dimension-stroke-width-base) * 3 / 32);\n}\n\n.checkbox__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.box {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: var(--_checkbox-box);\n height: var(--_checkbox-box);\n border: 0;\n border-radius: var(--dimension-radius-025);\n box-shadow: inset 0 0 0 var(--_checkbox-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.box--marked {\n color: var(--color-foreground-on-bold-background-primary);\n background-color: var(--color-background-bold-brand);\n box-shadow: none;\n}\n\n.checkbox__mark {\n width: 100%;\n height: 100%;\n flex-shrink: 0;\n fill: currentColor;\n}\n\n.checkbox__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 .box {\n border: var(--_checkbox-stroke) solid var(--ds-forced-color-content);\n box-shadow: none;\n }\n\n .box--marked {\n color: var(--ds-forced-color-on-selected);\n background-color: var(--ds-forced-color-selected);\n border-color: var(--ds-forced-color-selected);\n }\n}\n","import {\n AttachInternals,\n Component,\n Prop,\n State,\n Event,\n EventEmitter,\n Watch,\n h,\n Host,\n} from '@stencil/core';\nimport {\n CONTROL_SUPPORTING_TEXT_VARIANT,\n CONTROL_TEXT_VARIANT,\n DEFAULT_REQUIRED_MESSAGE,\n setFormControlValue,\n setRequiredValidity,\n} from '../../utils';\n\nexport type CheckboxSize = 'lg' | 'md' | 'sm' | 'xs';\n\nlet idCounter = 0;\n\n@Component({\n tag: 'ds-checkbox',\n styleUrl: 'Checkbox.css',\n scoped: true,\n formAssociated: true,\n})\nexport class Checkbox {\n @AttachInternals() internals!: ElementInternals;\n private labelId = `ds-checkbox-label-${++idCounter}`;\n private descriptionId = `${this.labelId}-description`;\n\n /** Visible label and accessible name. Omitted only in presentation mode. */\n @Prop() label!: string;\n /** Optional supporting description associated with the checkbox. */\n @Prop() description?: string;\n /** Current checked state. */\n @Prop({ mutable: true }) checked: boolean = false;\n /** Visual and placement density. */\n @Prop() size: CheckboxSize = 'md';\n /** Native form field name. */\n @Prop({ reflect: true }) name: string | undefined;\n /** Submitted value when checked. */\n @Prop() value: string = 'on';\n /** Native disabled state. */\n @Prop({ reflect: true }) disabled: boolean = false;\n /** Require the checkbox to be checked for form validity. */\n @Prop({ reflect: true }) required: boolean = false;\n /** Validation message used when a required checkbox is unchecked. */\n @Prop() requiredMessage: string = DEFAULT_REQUIRED_MESSAGE;\n /** Mixed visual state. Activation clears it before toggling checked. */\n @Prop({ mutable: true }) indeterminate: boolean = false;\n /** Design-system inactive state. */\n @Prop() isInactive: boolean = false;\n /** Visual-only indicator for a composite control that owns selection semantics. */\n @Prop() presentation: boolean = false;\n\n /** Emitted after user activation with the new checked state. */\n @Event() dsChange!: EventEmitter<boolean>;\n\n private initialChecked = false;\n private initialIndeterminate = false;\n @State() private formDisabled = false;\n\n componentWillLoad() {\n this.initialChecked = this.checked;\n this.initialIndeterminate = this.indeterminate;\n this.syncFormValue();\n }\n\n @Watch('checked')\n @Watch('value')\n @Watch('disabled')\n @Watch('isInactive')\n @Watch('required')\n @Watch('presentation')\n syncFormValue() {\n const inactive = this.isInactive || this.disabled || this.formDisabled || this.presentation;\n setFormControlValue(this.internals, this.checked ? this.value : null, { inactive });\n const missing = this.required && !inactive && !this.checked;\n setRequiredValidity(this.internals, missing, this.requiredMessage);\n }\n\n formDisabledCallback(disabled: boolean) {\n this.formDisabled = disabled;\n this.syncFormValue();\n }\n\n formResetCallback() {\n this.checked = this.initialChecked;\n this.indeterminate = this.initialIndeterminate;\n }\n\n private handleActivate = () => {\n if (this.isInactive || this.disabled || this.formDisabled || this.presentation) return;\n if (this.indeterminate) this.indeterminate = false;\n this.checked = !this.checked;\n this.dsChange.emit(this.checked);\n };\n\n private handleKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n this.handleActivate();\n }\n };\n\n render() {\n const inactive = this.isInactive || this.disabled || this.formDisabled;\n const isMarked = this.checked || this.indeterminate;\n const invalid = this.required && !inactive && !this.checked;\n\n return (\n <Host\n role={this.presentation ? undefined : 'checkbox'}\n aria-checked={\n this.presentation ? undefined : this.indeterminate ? 'mixed' : String(this.checked)\n }\n aria-disabled={!this.presentation && inactive ? 'true' : undefined}\n aria-required={!this.presentation && this.required ? 'true' : undefined}\n aria-invalid={!this.presentation && invalid ? 'true' : undefined}\n aria-labelledby={this.presentation ? undefined : this.labelId}\n aria-describedby={!this.presentation && this.description ? this.descriptionId : undefined}\n aria-hidden={this.presentation ? 'true' : undefined}\n tabIndex={this.presentation || inactive ? -1 : 0}\n class={{\n checkbox: true,\n 'checkbox--presentation': this.presentation,\n 'checkbox--described': Boolean(this.description),\n [`checkbox--${this.size}`]: true,\n [`ds-control--${this.size}`]: true,\n 'ds-control-inactive': inactive && !this.presentation,\n 'ds-focus-ring-inset': !this.presentation,\n 'ds-interaction-fill': !inactive && !this.presentation,\n }}\n onClick={this.presentation ? undefined : this.handleActivate}\n onKeyDown={this.presentation ? undefined : this.handleKeyDown}\n >\n <span class=\"checkbox__placement ds-interaction-fill__content\" aria-hidden=\"true\">\n <span class={{ box: true, 'box--marked': isMarked }}>\n {isMarked && (\n // eslint-disable-next-line compomo/prefer-ds-icon -- Checkbox owns this fixed state-mark geometry.\n <svg class=\"checkbox__mark\" viewBox=\"0 0 16 16\" fill=\"currentColor\" focusable=\"false\">\n <path\n d={\n this.indeterminate\n ? 'M12 7.375V8.625H4V7.375H12Z'\n : 'M12.9756 4.65527L7.22559 11.4053C7.11258 11.5379 6.94946 11.6169 6.77539 11.624C6.60111 11.631 6.43095 11.5657 6.30762 11.4424L3.05762 8.19238L3.94238 7.30762L6.71289 10.0781L12.0244 3.84473L12.9756 4.65527Z'\n }\n />\n </svg>\n )}\n </span>\n </span>\n {!this.presentation && (\n <span class=\"checkbox__copy ds-interaction-fill__content\">\n <ds-text\n class=\"checkbox__label\"\n as=\"span\"\n variant={CONTROL_TEXT_VARIANT[this.size]}\n textId={this.labelId}\n >\n {this.label}\n </ds-text>\n {this.description ? (\n <ds-text\n as=\"span\"\n variant={CONTROL_SUPPORTING_TEXT_VARIANT[this.size]}\n color=\"secondary\"\n textId={this.descriptionId}\n >\n {this.description}\n </ds-text>\n ) : null}\n </span>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- import{p as s,H as e,c as i,h as t,a,t as r}from"./index.js";import{g as n,i as o}from"./p-BQq26pt9.js";import{C as d,c,a as l,b as h,t as b,v,e as f,f as u,r as p,d as m}from"./p-BxduVc5g.js";import{d as g}from"./p-Cn6AfzeF.js";import{d as _}from"./p-D7K1ZHML.js";import{d as y}from"./p-DjkUFlDW.js";import{d as w}from"./p-0XTyQNRG.js";import{d as x}from"./p-BR5OC2PX.js";import{d as k}from"./p-B6qQaYkB.js";import{d as C}from"./p-C6Aavz9h.js";import{d as T}from"./p-BJJh-Bf7.js";import{d as F}from"./p-ZwRLjD5M.js";import{d as D}from"./p-C_Ma6Xa-.js";function S(s,e,i){if(!s||!e){return{value:"",hideTabs:false}}if(s!==e&&!s.startsWith(`${e}/`)){return{value:"",hideTabs:false}}const t=s.slice(e.length);const a=t.startsWith("/")?t.slice(1).split("/")[0]:"";const r=n(i);if(!a){return{value:r[0]?.id??"",hideTabs:false}}const o=r.find((s=>s.id===a));if(o){return{value:o.id,hideTabs:false}}return{value:"",hideTabs:true}}function E(s,e){return s.length===0&&(e?.length??0)>0}const M=()=>`.sc-ds-bar-nav-h,.sc-ds-bar-nav:where(.ds-table),.sc-ds-bar-nav:where(.tooltip-popup),.sc-ds-bar-nav:where(.ds-radius){--ds-radius-control:var(--dimension-radius-025);--ds-radius-card:var(--dimension-radius-050);--ds-radius-modal:var(--dimension-radius-050);--ds-radius-menu:var(--dimension-radius-075);--ds-radius-tooltip-control:var(--dimension-radius-025);--ds-radius-tooltip-menu:var(--dimension-radius-075);--ds-radius-table:var(--dimension-radius-050)}.ds-control--lg.sc-ds-bar-nav,.ds-control--lg.sc-ds-bar-nav-h,.ds-control--md.sc-ds-bar-nav-h,.ds-control--md.sc-ds-bar-nav,.ds-control--sm.sc-ds-bar-nav-h,.ds-control--sm.sc-ds-bar-nav,.ds-control--xs.sc-ds-bar-nav-h,.ds-control--xs.sc-ds-bar-nav{--ds-control-radius:var(--ds-radius-control)}.ds-control--lg.sc-ds-bar-nav-h,.ds-control--lg.sc-ds-bar-nav{--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-bar-nav-h,.ds-control--md.sc-ds-bar-nav{--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-bar-nav-h,.ds-control--sm.sc-ds-bar-nav{--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-bar-nav-h,.ds-control--xs.sc-ds-bar-nav{--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}.ds-control-frame.sc-ds-bar-nav{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-bar-nav{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-control-icon-box.sc-ds-bar-nav{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-bar-nav{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-bar-nav{position:relative;padding-inline-end:calc( var(--ds-control-label-inset, var(--dimension-space-025)) + var(--ds-control-gap, var(--dimension-space-050)) )}.ds-control-label-dot__badge.sc-ds-bar-nav{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-chrome-space--sm.sc-ds-bar-nav-h,.ds-chrome-space--sm.sc-ds-bar-nav{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-bar-nav-h,.ds-chrome-space--md.sc-ds-bar-nav{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-bar-nav-h,.ds-chrome-space--lg.sc-ds-bar-nav{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-bar-nav-h,.ds-chrome-row.sc-ds-bar-nav,.ds-chrome-column.sc-ds-bar-nav-h,.ds-chrome-column.sc-ds-bar-nav,.ds-chrome-grid.sc-ds-bar-nav-h,.ds-chrome-grid.sc-ds-bar-nav{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-bar-nav-h,.ds-chrome-row.sc-ds-bar-nav{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-bar-nav-h,.ds-chrome-column.sc-ds-bar-nav{flex-direction:column}.ds-chrome-grid.sc-ds-bar-nav-h,.ds-chrome-grid.sc-ds-bar-nav{display:grid;align-items:center}@media (forced-colors: active){.sc-ds-bar-nav:root,.sc-ds-bar-nav-h,.ds-forced-colors-scope.sc-ds-bar-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-bar-nav-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-bar-nav-h,.ds-focus-ring.sc-ds-bar-nav,.ds-focus-ring-inset.sc-ds-bar-nav-h,.ds-focus-ring-inset.sc-ds-bar-nav{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-bar-nav-h:focus-visible,.ds-focus-ring.sc-ds-bar-nav:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-bar-nav-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-bar-nav{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-bar-nav-h:focus-visible,.ds-focus-ring-inset.sc-ds-bar-nav:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-bar-nav-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-bar-nav:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-bar-nav-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-bar-nav:root,.sc-ds-bar-nav-h,.ds-forced-colors-scope.sc-ds-bar-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-bar-nav-h,.ds-control-inactive.sc-ds-bar-nav{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-bar-nav-h,.ds-control-inactive.sc-ds-bar-nav{color:var(--ds-forced-color-disabled);opacity:1}}.sc-ds-bar-nav-h{display:block}.bar-nav.sc-ds-bar-nav{position:relative;height:var(--dimension-size-600);border-bottom:var(--dimension-stroke-width-012) solid var(--_bar-nav-border);background-color:var(--_bar-nav-bg);color:var(--_bar-nav-fg-primary);-webkit-user-select:none;user-select:none;overflow:hidden;transition:background-color var(--effect-motion-short-3), border-color var(--effect-motion-short-3), color var(--effect-motion-short-3);isolation:isolate;--_bar-nav-bg:var(--color-background-secondary);--_bar-nav-border:var(--color-border-tertiary);--_bar-nav-fg-primary:var(--color-foreground-primary);--_bar-nav-fg-secondary:var(--color-foreground-secondary);--_bar-nav-hover:var(--color-interaction-hover);--_bar-nav-pressed:var(--color-interaction-pressed);--_bar-nav-focus:var(--color-interaction-focus);--_bar-nav-dot:var(--color-foreground-bold-brand);--ds-focus-ring-color:var(--_bar-nav-focus)}.bar-nav--dashboard.sc-ds-bar-nav,.bar-nav--settings.sc-ds-bar-nav{--_bar-nav-bg:var(--color-background-secondary);--_bar-nav-border:var(--color-border-tertiary);--_bar-nav-fg-primary:var(--color-foreground-primary);--_bar-nav-fg-secondary:var(--color-foreground-secondary);--_bar-nav-hover:var(--color-interaction-hover);--_bar-nav-pressed:var(--color-interaction-pressed);--_bar-nav-focus:var(--color-interaction-focus);--_bar-nav-dot:var(--color-foreground-bold-brand)}ds-shell-app.sc-ds-bar-nav-h:not([gradient-preset='none']) .bar-nav.sc-ds-bar-nav,ds-shell-app:not([gradient-preset='none']) .sc-ds-bar-nav-h .bar-nav.sc-ds-bar-nav,ds-shell-app.shell-app--paper-texture.sc-ds-bar-nav-h .bar-nav.sc-ds-bar-nav,ds-shell-app.shell-app--paper-texture .sc-ds-bar-nav-h .bar-nav.sc-ds-bar-nav{background-color:transparent}.bar-nav.sc-ds-bar-nav>.sc-ds-bar-nav:not(.bar-nav__tabs-probe){position:relative;z-index:3}.bar-nav--tabs-collapsed.sc-ds-bar-nav{display:flex;gap:var(--dimension-space-100);align-items:center}.bar-nav__left.sc-ds-bar-nav{position:relative;flex:1 1 0%;min-width:0;width:0;display:flex;align-items:center}.bar-nav__tabs-visible.sc-ds-bar-nav{flex:1;min-width:0;width:100%}.bar-nav__tabs-probe.sc-ds-bar-nav{position:absolute;left:0;top:0;visibility:hidden;pointer-events:none;overflow:visible;width:max-content;max-width:none;z-index:-1}.bar-nav__tabs-probe.sc-ds-bar-nav>div.sc-ds-bar-nav{width:max-content}.bar-nav__tab-list.sc-ds-bar-nav{display:flex;align-items:center;gap:var(--dimension-space-050);position:relative;width:max-content}.bar-nav__tab.sc-ds-bar-nav{display:flex;align-items:center;justify-content:center;gap:var(--ds-control-gap);height:var(--ds-control-height);min-width:var(--ds-control-height);padding:0 var(--ds-control-padding-inline);box-sizing:border-box;border:none;border-radius:var(--ds-control-radius);background-color:transparent;color:var(--_bar-nav-fg-secondary);cursor:default;position:relative;flex-shrink:0;-webkit-user-select:none;user-select:none;transition:color var(--effect-motion-short-2)}.bar-nav__tab.sc-ds-bar-nav::after{content:'';position:absolute;inset:0;border-radius:var(--ds-control-radius);background:transparent;pointer-events:none;cursor:inherit}@media (hover: hover) and (pointer: fine){.bar-nav__tab.sc-ds-bar-nav:hover::after{background:var(--_bar-nav-hover)}}.bar-nav__tab.sc-ds-bar-nav:active::after{background:var(--_bar-nav-pressed)}.bar-nav__tab--selected.sc-ds-bar-nav{color:var(--_bar-nav-fg-primary)}.bar-nav__tab-label.sc-ds-bar-nav{display:inline-flex;align-items:center;white-space:nowrap}.bar-nav__tab-divider.sc-ds-bar-nav{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--dimension-space-100);height:var(--ds-control-height);padding-block:var(--ds-control-padding-inline);flex-shrink:0;pointer-events:none}.bar-nav__tab-divider-line.sc-ds-bar-nav{width:var(--dimension-stroke-width-012);align-self:stretch;background-color:var(--_bar-nav-border)}.bar-nav__tabs-pending.sc-ds-bar-nav{flex:1;min-width:0;height:var(--ds-control-height);visibility:hidden;pointer-events:none}.bar-nav__overflow-trigger.sc-ds-bar-nav{margin-left:auto;--ds-button-unfilled-fg:var(--_bar-nav-fg-secondary);--ds-button-unfilled-fg-active:var(--_bar-nav-fg-primary);--ds-interaction-hover:var(--_bar-nav-hover);--ds-interaction-pressed:var(--_bar-nav-pressed);--ds-focus-ring-color:var(--_bar-nav-focus)}ds-text.bar-nav__heading.sc-ds-bar-nav{display:inline-flex;align-items:center;height:var(--ds-control-height);padding-inline:calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));-webkit-user-select:none;user-select:none}`;const O=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.dsTabChange=i(this,"dsTabChange",7);this.navStyle="dashboard";this.tabs=[];this.value="";this.basePath="";this.currentUrl="";this.moreTabsLabel="More tabs";this.resolvedTabs=[];this.urlDerivedValue="";this.hideTabsForDetailRoute=false;this.tabsCollapsed=false;this.menuOpen=false;this.menuTriggerActive=false;this.tabLayoutCommitted=false;this.visibleTabs=[];this.overflowTabs=[];this.menuInitialFocusVisible=false;this.overflowRovingFocused=false;this.focusedTabId="";this.headerEl=null;this.triggerEl=null;this.menuEl=null;this.visibleTabListEl=null;this.probeTabListEl=null;this.resizeObserver=null;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.panelNavTransition=new d;this.panelToolsTransition=new d;this.overflowCoalescer=c((()=>{this.updateTabsCollapsed()}));this.chromeTransitionShell=null;this.committedSection="";this.pendingSection="";this.onChromeTransitionStart=s=>{const e=p(s);if(e==="panel-nav"){this.panelNavTransition.enter();return}if(e==="panel-tools"){const e=m(s)??"opening";if(e==="closing"){this.panelToolsTransition.enter()}}};this.onChromeTransitionEnd=s=>{const e=p(s);if(e==="panel-nav"){this.panelNavTransition.exit();if(!this.panelNavTransition.isActive){this.scheduleOverflowCheck()}return}if(e==="panel-tools"){this.panelToolsTransition.exit();this.scheduleOverflowCheck()}};this.handleOverflowFocus=()=>{this.overflowRovingFocused=true};this.handleOverflowBlur=()=>{this.overflowRovingFocused=false}}get effectiveValue(){if(this.currentUrl&&this.basePath){return this.urlDerivedValue}return this.value}get renderedSelectableTabs(){const s=this.hasOverflowTabs?this.visibleTabs:this.resolvedTabs;return n(s)}get hasOverflowTabs(){return this.tabLayoutCommitted&&this.tabsCollapsed&&this.overflowTabs.length>0}syncFocusedTabId(s,e){if(e.some((e=>e.id===s&&!e.isInactive))){this.focusedTabId=s;return}const i=e.find((s=>!s.isInactive));this.focusedTabId=i?.id??""}digestTabsConfig(s){return s.map((s=>o(s)?"|":s.id)).join(",")}resetTabOverflowLayout(){this.tabLayoutCommitted=false;this.tabsCollapsed=false;this.menuOpen=false;this.menuTriggerActive=false;this.menuInitialFocusVisible=false;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.visibleTabs=[];this.overflowTabs=[]}onHostPropsChange(){this.applyHostProps()}onSelectionChange(){this.syncFocusedTabId(this.effectiveValue,this.renderedSelectableTabs);this.syncMenuSections();this.scheduleOverflowCheck()}onMenuOpenChange(s){if(this.menuEl){this.menuEl.open=s}}onTabsCollapsedChange(s,e){if(!s){this.menuOpen=false;this.menuTriggerActive=false;this.menuInitialFocusVisible=false;this.menuEl=null}this.scheduleOverflowCheck();if(s){requestAnimationFrame((()=>{this.scheduleOverflowCheck()}))}if(s||e===undefined||e===s)return;requestAnimationFrame((()=>this.scheduleOverflowCheck()));queueMicrotask((()=>this.focusVisibleSelectedTab()))}componentWillLoad(){this.applyHostProps();this.syncFocusedTabId(this.effectiveValue,n(this.resolvedTabs))}componentDidLoad(){this.syncHostPropsIfNeeded();this.scheduleDeferredHostPropSync();this.setupOverflowObserver();this.bindChromeTransitionListeners();this.scheduleOverflowCheck()}componentDidRender(){if(this.chromeOverflowPaused()){this.syncMenuAnchor();return}this.scheduleOverflowCheck();this.syncMenuAnchor()}disconnectedCallback(){this.resizeObserver?.disconnect();this.resizeObserver=null;this.overflowCoalescer.cancel();this.unbindChromeTransitionListeners()}bindChromeTransitionListeners(){const s=this.el.closest("ds-shell-app");if(!s)return;this.chromeTransitionShell=s;s.addEventListener(l,this.onChromeTransitionStart);s.addEventListener(h,this.onChromeTransitionEnd)}unbindChromeTransitionListeners(){if(!this.chromeTransitionShell)return;this.chromeTransitionShell.removeEventListener(l,this.onChromeTransitionStart);this.chromeTransitionShell.removeEventListener(h,this.onChromeTransitionEnd);this.chromeTransitionShell=null}chromeOverflowPaused(){return this.panelNavTransition.isActive||this.panelToolsTransition.isActive}syncHostPropsIfNeeded(){if(E(this.resolvedTabs,this.tabs)){this.applyHostProps()}else if(this.currentUrl&&this.basePath){this.syncValueFromUrl()}}scheduleDeferredHostPropSync(){let e=s.HOST_PROP_SYNC_BUDGET;const i=()=>{this.syncHostPropsIfNeeded();if(--e>0){requestAnimationFrame(i)}};queueMicrotask(i)}setupOverflowObserver(){if(typeof ResizeObserver==="undefined"||!this.headerEl)return;this.resizeObserver?.disconnect();this.resizeObserver=new ResizeObserver((()=>{if(this.chromeOverflowPaused())return;this.scheduleOverflowCheck()}));this.resizeObserver.observe(this.headerEl)}scheduleOverflowCheck(){if(this.chromeOverflowPaused())return;this.overflowCoalescer.schedule()}getLeftZoneAvailableWidth(){if(!this.headerEl)return 0;const s=getComputedStyle(this.headerEl);const e=(parseFloat(s.paddingLeft)||0)+(parseFloat(s.paddingRight)||0);return Math.max(0,this.headerEl.clientWidth-e)}getTabsIntrinsicWidth(){return this.probeTabListEl?.scrollWidth??0}getHeaderGap(){if(!this.headerEl)return 0;const s=getComputedStyle(this.headerEl);return parseFloat(s.columnGap||s.gap)||0}getOverflowTriggerReserveWidth(){if(!this.triggerEl){return 40}return this.triggerEl.getBoundingClientRect().width+this.getHeaderGap()}getProbeTabMetrics(){const s=this.probeTabListEl;if(!s)return null;const e=Array.from(s.children);const i=e.map((s=>s.getBoundingClientRect().width));if(i.length===0||i.some((s=>s===0)))return null;const t=getComputedStyle(s);const a=parseFloat(t.columnGap||t.gap)||0;const r=i.reduce(((s,e)=>s+e),0);const n=a*Math.max(0,i.length-1);const o=Math.max(0,s.scrollWidth-r-n);return{itemWidths:i,itemGap:a,listExtraWidth:o}}setOverflowTabLayout(s,e){const i=e.length>0;const t=this.digestTabsConfig(s)!==this.digestTabsConfig(this.visibleTabs);const a=this.digestTabsConfig(e)!==this.digestTabsConfig(this.overflowTabs);if(t){this.visibleTabs=s}if(a){this.overflowTabs=e}if(i!==this.tabsCollapsed){this.tabsCollapsed=i;if(!i){this.menuOpen=false;this.menuTriggerActive=false}}this.syncFocusedTabId(this.effectiveValue,n(i?s:this.resolvedTabs))}scheduleIntrinsicWidthRetry(){if(this.intrinsicWidthRetryCount>=s.INTRINSIC_WIDTH_RETRY_MAX)return;this.intrinsicWidthRetryCount++;requestAnimationFrame((()=>this.scheduleOverflowCheck()))}forceTabLayoutCommit(s){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.setOverflowTabLayout(s?[]:this.resolvedTabs,s?this.resolvedTabs:[]);this.tabLayoutCommitted=true}updateTabsCollapsed(){if(!this.headerEl||this.resolvedTabs.length===0||this.hideTabsForDetailRoute){if(this.tabsCollapsed){this.setOverflowTabLayout([],[])}this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.tabLayoutCommitted=true;return}const e=this.getProbeTabMetrics();const i=this.getTabsIntrinsicWidth();if(!e||i===0){this.tabLayoutPendingFrames+=1;if(this.intrinsicWidthRetryCount>=s.INTRINSIC_WIDTH_RETRY_MAX){this.forceTabLayoutCommit(false)}else if(this.tabLayoutPendingFrames>=s.TAB_LAYOUT_COMMIT_MAX_FRAMES){this.forceTabLayoutCommit(false)}else{this.scheduleIntrinsicWidthRetry()}return}this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;const t=b(i,this.getLeftZoneAvailableWidth(),this.tabsCollapsed,s.OVERFLOW_HYSTERESIS_PX);if(!t){this.setOverflowTabLayout(this.resolvedTabs,[]);this.tabLayoutCommitted=true;return}const a=v(e.itemWidths,this.getLeftZoneAvailableWidth(),this.getOverflowTriggerReserveWidth(),e.itemGap,e.listExtraWidth);const r=f(this.resolvedTabs.slice(0,a));const n=this.resolvedTabs.slice(r.length);this.setOverflowTabLayout(r,n);this.tabLayoutCommitted=true}syncMenuAnchor(){if(!this.menuEl||!this.triggerEl||!this.hasOverflowTabs)return;this.menuEl.anchor=this.triggerEl;this.syncMenuSections()}handleMenuSelect(s){const e=s.detail;if(e?.value!==undefined){this.selectTab(String(e.value))}this.menuOpen=false;this.menuInitialFocusVisible=false}handleMenuClose(){this.menuOpen=false;this.menuInitialFocusVisible=false}handleMenuAfterClose(){if(!this.menuOpen)this.menuTriggerActive=false}incomingTabs(){return this.tabs??[]}applyHostProps(){const s=this.basePath;const e=s!==""&&this.committedSection!==""&&s!==this.committedSection;if(e){this.urlDerivedValue="";this.committedSection="";this.pendingSection=s;this.resolvedTabs=[];this.resetTabOverflowLayout();return}if(this.pendingSection){if(!s||s!==this.pendingSection){return}if(!this.currentUrl.startsWith(this.pendingSection)){return}const e=this.incomingTabs();if(e.length===0){return}this.pendingSection=""}const i=this.incomingTabs();const t=this.digestTabsConfig(i)!==this.digestTabsConfig(this.resolvedTabs);this.resolvedTabs=i;this.syncValueFromUrl();this.committedSection=s;if(t){this.resetTabOverflowLayout()}this.scheduleOverflowCheck()}syncMenuSections(){if(!this.menuEl)return;this.menuEl.sections=u(this.overflowTabs,this.effectiveValue)}syncValueFromUrl(){const s=this.incomingTabs();if(!this.currentUrl||!this.basePath){this.urlDerivedValue="";this.hideTabsForDetailRoute=false;return}if(!this.currentUrl.startsWith(this.basePath)){this.urlDerivedValue="";this.hideTabsForDetailRoute=false;return}const{value:e,hideTabs:i}=S(this.currentUrl,this.basePath,s);this.urlDerivedValue=e;this.hideTabsForDetailRoute=i}selectTab(s){this.value=s;this.dsTabChange.emit(s)}focusVisibleSelectedTab(){const s=this.visibleTabListEl?.querySelector(`[data-tab-id="${this.effectiveValue}"]`);s?.focus({preventScroll:true})}focusVisibleTab(s){this.focusedTabId=s;const e=this.visibleTabListEl?.querySelector(`[data-tab-id="${s}"]`);e?.focus({preventScroll:true})}focusLastVisibleTab(){const s=[...this.renderedSelectableTabs].reverse().find((s=>!s.isInactive));if(s)this.focusVisibleTab(s.id)}findEnabledVisibleTab(s,e){const i=this.renderedSelectableTabs;for(let t=s+e;t>=0&&t<i.length;t+=e){if(!i[t]?.isInactive)return t}return null}handleTabKeyDown(s){const e=this.renderedSelectableTabs;if(!e.length)return;const i=s.target?.getAttribute("data-tab-id");const t=i??this.focusedTabId;if(s.key==="Enter"||s.key===" "){const i=e.find((s=>s.id===t));if(!i||i.isInactive)return;s.preventDefault();this.selectTab(i.id);return}const a=e.findIndex((s=>s.id===t));if(a<0)return;let r;if(s.key==="ArrowRight"){r=this.findEnabledVisibleTab(a,1);if(r===null&&this.hasOverflowTabs){s.preventDefault();this.overflowRovingFocused=true;void this.triggerEl?.setFocus?.();return}}else if(s.key==="ArrowLeft"){r=this.findEnabledVisibleTab(a,-1)}else if(s.key==="Home"){r=e.findIndex((s=>!s.isInactive))}else if(s.key==="End"){const s=[...e].reverse().findIndex((s=>!s.isInactive));r=s<0?null:e.length-1-s}else{return}if(r===null||r<0||r===a)return;s.preventDefault();this.focusVisibleTab(e[r].id)}toggleTabMenu(s){if(this.menuOpen){this.menuOpen=false;this.menuInitialFocusVisible=false;return}if(this.menuEl&&this.triggerEl){this.menuEl.anchor=this.triggerEl;this.menuEl.minWidth="";this.syncMenuSections()}this.menuInitialFocusVisible=s?.focusVisible??false;this.menuTriggerActive=true;this.menuOpen=true}handleTriggerKeyDown(s){if(!this.hasOverflowTabs)return;if(!this.menuOpen){if(s.key==="ArrowLeft"){s.preventDefault();this.overflowRovingFocused=false;this.focusLastVisibleTab();return}if(s.key==="Enter"||s.key===" "){s.preventDefault();this.toggleTabMenu({focusVisible:true})}return}if(s.key==="Escape"){s.preventDefault();this.menuOpen=false;this.menuInitialFocusVisible=false;void this.triggerEl?.setFocus?.()}}renderTabList(s,e){return t("div",{role:"tablist",class:"bar-nav__tab-list","aria-label":this.heading,ref:s=>{if(e){const e=s??null;if(e===this.probeTabListEl)return;this.probeTabListEl=e;if(e){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.scheduleOverflowCheck()}}else{this.visibleTabListEl=s??null}},onKeyDown:e?undefined:s=>this.handleTabKeyDown(s),onFocusin:e?undefined:()=>{this.overflowRovingFocused=false}},s.map(((s,i)=>{if(o(s)){return t("div",{class:"bar-nav__tab-divider",key:`divider-${i}`,"aria-hidden":"true"},t("div",{class:"bar-nav__tab-divider-line"}))}const a=s.id===this.effectiveValue;return t("button",{key:s.id,type:"button",role:"tab","data-tab-id":s.id,class:{"bar-nav__tab":true,"bar-nav__tab--selected":a,"ds-control--md":true,"ds-focus-ring-inset":true,"ds-control-inactive":!!s.isInactive},"aria-selected":a?"true":"false","aria-disabled":s.isInactive?"true":undefined,"aria-controls":s.panelId??undefined,disabled:s.isInactive,tabIndex:!e&&!this.overflowRovingFocused&&s.id===this.focusedTabId?0:-1,onClick:()=>!e&&!s.isInactive&&this.selectTab(s.id),onFocus:()=>{if(!e)this.focusedTabId=s.id}},t("span",{class:{"bar-nav__tab-label":true,"ds-control-label-box":true,"ds-control-label-dot":!!s.dot,"bar-nav__tab-label--dot":!!s.dot}},t("ds-text",{as:"span",variant:"text-body-medium",emphasis:a,color:"inherit"},s.label),s.dot&&t("ds-badge",{class:"bar-nav__tab-dot ds-control-label-dot__badge",variant:"dot",hasRing:false,label:"","aria-hidden":"true"})))})))}render(){const s=this.basePath===""||this.committedSection===this.basePath;const e=s&&this.resolvedTabs.length>0&&!this.hideTabsForDetailRoute;const i=this.basePath||"no-section";const r=this.hasOverflowTabs?this.visibleTabs:this.resolvedTabs;return t(a,{key:"ee99352c39d293f5d510e8dfb549aa8c4eec79f0"},t("header",{key:"09d618fdd79b251c412c527ebdeb3e8e3064e713",class:{"bar-nav":true,"ds-control--md":true,"ds-chrome-row":true,"ds-chrome-space--md":true,"bar-nav--dashboard":this.navStyle==="dashboard","bar-nav--settings":this.navStyle==="settings","bar-nav--tabs-collapsed":e&&this.hasOverflowTabs},ref:s=>{this.headerEl=s;if(s&&!this.resizeObserver){this.setupOverflowObserver()}}},e&&t("div",{key:"05866e84bf84ca0597dfd297444aabc40b797726",class:"bar-nav__tabs-probe","aria-hidden":"true",inert:true},t("div",{key:`probe-${i}`},this.renderTabList(this.resolvedTabs,true))),e&&this.tabLayoutCommitted&&r.length>0&&t("div",{key:"81de5d4ada7b751df602bbe39324fa37100f12c3",class:"bar-nav__left"},t("div",{key:`visible-${i}`,class:"bar-nav__tabs-visible"},this.renderTabList(r,false))),e&&!this.tabLayoutCommitted&&t("div",{key:"1ceae267e6d4c4d431bd1531a28bf6cbeb7326c9",class:"bar-nav__tabs-pending","aria-hidden":"true"}),!e&&this.heading&&t("ds-text",{key:"0fb03ffbeb4447cb7121ee038853418856c6b385",class:"bar-nav__heading",lineTruncation:1,as:"span",variant:"text-body-medium",emphasis:true,color:"primary",wrap:"nowrap"},this.heading),e&&this.hasOverflowTabs&&t("ds-button-unfilled",{key:"4d99bb71cf19e5124e0785098fd887ad20e9f149",variant:"icon",class:{"bar-nav__overflow-trigger":true},icon:"ChevronDown",activeFill:false,hasBorder:false,focusTabIndex:this.overflowRovingFocused?0:-1,ref:s=>{this.triggerEl=s??null},haspopup:"menu",expanded:this.menuOpen,surfaceOpen:this.menuTriggerActive,"aria-label":this.moreTabsLabel,onDsClick:()=>this.toggleTabMenu({focusVisible:false}),onFocusin:this.handleOverflowFocus,onFocusout:this.handleOverflowBlur,onKeyDown:s=>this.handleTriggerKeyDown(s)})),e&&this.hasOverflowTabs&&t("ds-menu",{key:"7bea07f7f086339bf8852a9afd6300c43d96d636",ref:s=>{this.menuEl=s??null},open:this.menuOpen,sections:u(this.overflowTabs,this.effectiveValue),side:"bottom",align:"end",sideOffset:"calc(var(--dimension-space-100) + var(--dimension-space-050))",initialFocusVisible:this.menuInitialFocusVisible,onDsSelect:s=>this.handleMenuSelect(s),onDsClose:()=>this.handleMenuClose(),onDsAfterClose:()=>this.handleMenuAfterClose()}))}get el(){return this}static get watchers(){return{tabs:[{onHostPropsChange:0}],currentUrl:[{onHostPropsChange:0}],basePath:[{onHostPropsChange:0}],value:[{onSelectionChange:0}],urlDerivedValue:[{onSelectionChange:0}],menuOpen:[{onMenuOpenChange:0}],tabsCollapsed:[{onTabsCollapsedChange:0}]}}static get style(){return M()}},[2,"ds-bar-nav",{navStyle:[513,"nav-style"],tabs:[16],value:[1025],heading:[1],basePath:[1,"base-path"],currentUrl:[1,"current-url"],moreTabsLabel:[1,"more-tabs-label"],resolvedTabs:[32],urlDerivedValue:[32],hideTabsForDetailRoute:[32],tabsCollapsed:[32],menuOpen:[32],menuTriggerActive:[32],tabLayoutCommitted:[32],visibleTabs:[32],overflowTabs:[32],menuInitialFocusVisible:[32],overflowRovingFocused:[32],focusedTabId:[32],committedSection:[32],pendingSection:[32]},undefined,{tabs:[{onHostPropsChange:0}],currentUrl:[{onHostPropsChange:0}],basePath:[{onHostPropsChange:0}],value:[{onSelectionChange:0}],urlDerivedValue:[{onSelectionChange:0}],menuOpen:[{onMenuOpenChange:0}],tabsCollapsed:[{onTabsCollapsedChange:0}]}]);O.HOST_PROP_SYNC_BUDGET=8;O.INTRINSIC_WIDTH_RETRY_MAX=3;O.TAB_LAYOUT_COMMIT_MAX_FRAMES=16;O.OVERFLOW_HYSTERESIS_PX=8;function j(){if(typeof customElements==="undefined"){return}const s=["ds-bar-nav","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-menu","ds-swatch-picker","ds-switch","ds-tag","ds-text","ds-tooltip"];s.forEach((s=>{switch(s){case"ds-bar-nav":if(!customElements.get(r(s))){customElements.define(r(s),O)}break;case"ds-badge":if(!customElements.get(r(s))){g()}break;case"ds-button-unfilled":if(!customElements.get(r(s))){_()}break;case"ds-icon":if(!customElements.get(r(s))){y()}break;case"ds-loader":if(!customElements.get(r(s))){w()}break;case"ds-menu":if(!customElements.get(r(s))){x()}break;case"ds-swatch-picker":if(!customElements.get(r(s))){k()}break;case"ds-switch":if(!customElements.get(r(s))){C()}break;case"ds-tag":if(!customElements.get(r(s))){T()}break;case"ds-text":if(!customElements.get(r(s))){F()}break;case"ds-tooltip":if(!customElements.get(r(s))){D()}break}}))}j();export{O as B,j as d};
2
- //# sourceMappingURL=p-mxZoWfnS.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["deriveBarNavValueFromUrl","path","basePath","tabs","value","hideTabs","startsWith","remainder","slice","length","seg","split","selectableTabs","getSelectableTabs","id","tab","find","t","shouldResyncBarNavProps","resolvedTabs","barNavCss","BarNav","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","navStyle","currentUrl","moreTabsLabel","urlDerivedValue","hideTabsForDetailRoute","tabsCollapsed","menuOpen","menuTriggerActive","tabLayoutCommitted","visibleTabs","overflowTabs","menuInitialFocusVisible","overflowRovingFocused","focusedTabId","headerEl","triggerEl","menuEl","visibleTabListEl","probeTabListEl","resizeObserver","intrinsicWidthRetryCount","tabLayoutPendingFrames","panelNavTransition","ChromeTransitionGate","panelToolsTransition","overflowCoalescer","createRafCoalescer","updateTabsCollapsed","chromeTransitionShell","committedSection","pendingSection","onChromeTransitionStart","event","source","readChromeTransitionSource","enter","phase","readChromeTransitionPhase","onChromeTransitionEnd","exit","isActive","scheduleOverflowCheck","handleOverflowFocus","handleOverflowBlur","effectiveValue","renderedSelectableTabs","hasOverflowTabs","syncFocusedTabId","preferred","some","isInactive","first","digestTabsConfig","map","isTabDivider","join","resetTabOverflowLayout","onHostPropsChange","applyHostProps","onSelectionChange","syncMenuSections","onMenuOpenChange","open","onTabsCollapsedChange","collapsed","prevCollapsed","requestAnimationFrame","undefined","queueMicrotask","focusVisibleSelectedTab","componentWillLoad","componentDidLoad","syncHostPropsIfNeeded","scheduleDeferredHostPropSync","setupOverflowObserver","bindChromeTransitionListeners","componentDidRender","chromeOverflowPaused","syncMenuAnchor","disconnectedCallback","disconnect","cancel","unbindChromeTransitionListeners","shell","el","closest","addEventListener","CHROME_TRANSITION_START","CHROME_TRANSITION_END","removeEventListener","syncValueFromUrl","remaining","HOST_PROP_SYNC_BUDGET","tick","ResizeObserver","observe","schedule","getLeftZoneAvailableWidth","headerStyle","getComputedStyle","horizontalPadding","parseFloat","paddingLeft","paddingRight","Math","max","clientWidth","getTabsIntrinsicWidth","scrollWidth","getHeaderGap","style","columnGap","gap","getOverflowTriggerReserveWidth","getBoundingClientRect","width","getProbeTabMetrics","tabList","children","Array","from","itemWidths","child","itemGap","childrenWidth","reduce","sum","gapWidth","listExtraWidth","setOverflowTabLayout","nextCollapsed","visibleChanged","overflowChanged","scheduleIntrinsicWidthRetry","INTRINSIC_WIDTH_RETRY_MAX","forceTabLayoutCommit","fallbackCollapsed","metrics","intrinsicWidth","TAB_LAYOUT_COMMIT_MAX_FRAMES","shouldCollapse","tabsOverflowContainer","OVERFLOW_HYSTERESIS_PX","visibleCount","visibleTabCountForWidth","trimTrailingDividers","anchor","handleMenuSelect","e","detail","selectTab","String","handleMenuClose","handleMenuAfterClose","incomingTabs","nextBasePath","sectionChanged","tabsConfigChanged","sections","tabsToOverflowMenuSections","dsTabChange","emit","querySelector","focus","preventScroll","focusVisibleTab","focusLastVisibleTab","last","reverse","findEnabledVisibleTab","step","index","handleTabKeyDown","targetId","target","getAttribute","focusedId","key","focused","preventDefault","currentIndex","findIndex","nextIndex","setFocus","reversedIndex","toggleTabMenu","options","minWidth","focusVisible","handleTriggerKeyDown","renderTabList","probe","h","role","class","heading","ref","next","onKeyDown","onFocusin","isSelected","type","panelId","disabled","tabIndex","onClick","onFocus","dot","as","variant","emphasis","color","label","hasRing","render","sectionReady","hasTabs","tabGroupKey","renderedTabs","Host","inert","lineTruncation","wrap","icon","activeFill","hasBorder","focusTabIndex","haspopup","expanded","surfaceOpen","onDsClick","onFocusout","side","align","sideOffset","initialFocusVisible","onDsSelect","onDsClose","onDsAfterClose"],"sources":["src/wc/components/BarNav/bar-nav-utils.ts","src/wc/components/BarNav/BarNav.css?tag=ds-bar-nav&encapsulation=scoped","src/wc/components/BarNav/BarNav.tsx"],"sourcesContent":["import { getSelectableTabs } from '../TabGroup/tab-item-utils';\nimport type { BarNavTab } from './bar-nav-types';\n\nexport interface BarNavUrlState {\n /** Tab id derived from the URL, or empty when none applies. */\n value: string;\n /** When true, tabs should be hidden (e.g. non-tab child routes like detail pages). */\n hideTabs: boolean;\n}\n\n/** Derive BarNav tab selection from `currentUrl` relative to `basePath`.\n * Mirrors motive-webapp-lab `resolveBarNavState` tab-selection semantics. */\nexport function deriveBarNavValueFromUrl(\n path: string,\n basePath: string,\n tabs: BarNavTab[]\n): BarNavUrlState {\n if (!path || !basePath) {\n return { value: '', hideTabs: false };\n }\n\n if (path !== basePath && !path.startsWith(`${basePath}/`)) {\n return { value: '', hideTabs: false };\n }\n\n const remainder = path.slice(basePath.length);\n const seg = remainder.startsWith('/') ? remainder.slice(1).split('/')[0] : '';\n const selectableTabs = getSelectableTabs(tabs);\n\n if (!seg) {\n return { value: selectableTabs[0]?.id ?? '', hideTabs: false };\n }\n\n const tab = selectableTabs.find(t => t.id === seg);\n if (tab) {\n return { value: tab.id, hideTabs: false };\n }\n\n return { value: '', hideTabs: true };\n}\n\n/** True when host array props have data but resolved internal state is still empty. */\nexport function shouldResyncBarNavProps(resolvedTabs: BarNavTab[], tabs: BarNavTab[]): boolean {\n return resolvedTabs.length === 0 && (tabs?.length ?? 0) > 0;\n}\n","@import '../../utils/radius.css';\n@import '../../utils/control-density.css';\n@import '../../utils/control-parts.css';\n@import '../../utils/chrome-layout.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/control-inactive.css';\n\n:host {\n display: block;\n}\n\n.bar-nav {\n position: relative;\n height: var(--dimension-size-600);\n border-bottom: var(--dimension-stroke-width-012) solid var(--_bar-nav-border);\n background-color: var(--_bar-nav-bg);\n color: var(--_bar-nav-fg-primary);\n -webkit-user-select: none;\n user-select: none;\n overflow: hidden;\n transition:\n background-color var(--effect-motion-short-3),\n border-color var(--effect-motion-short-3),\n color var(--effect-motion-short-3);\n isolation: isolate;\n /* Default chrome — app surfaces */\n --_bar-nav-bg: var(--color-background-secondary);\n --_bar-nav-border: var(--color-border-tertiary);\n --_bar-nav-fg-primary: var(--color-foreground-primary);\n --_bar-nav-fg-secondary: var(--color-foreground-secondary);\n --_bar-nav-hover: var(--color-interaction-hover);\n --_bar-nav-pressed: var(--color-interaction-pressed);\n --_bar-nav-focus: var(--color-interaction-focus);\n --_bar-nav-dot: var(--color-foreground-bold-brand);\n --ds-focus-ring-color: var(--_bar-nav-focus);\n}\n\n/* Style slots — same app tokens for now; hook texture/glyph layers later. */\n.bar-nav--dashboard,\n.bar-nav--settings {\n --_bar-nav-bg: var(--color-background-secondary);\n --_bar-nav-border: var(--color-border-tertiary);\n --_bar-nav-fg-primary: var(--color-foreground-primary);\n --_bar-nav-fg-secondary: var(--color-foreground-secondary);\n --_bar-nav-hover: var(--color-interaction-hover);\n --_bar-nav-pressed: var(--color-interaction-pressed);\n --_bar-nav-focus: var(--color-interaction-focus);\n --_bar-nav-dot: var(--color-foreground-bold-brand);\n}\n\n/* Shell-owned chrome (bg + wash) — bar is a transparent frame. */\n:host-context(ds-shell-app:not([gradient-preset='none'])) .bar-nav,\n:host-context(ds-shell-app.shell-app--paper-texture) .bar-nav {\n background-color: transparent;\n}\n\n.bar-nav > :not(.bar-nav__tabs-probe) {\n position: relative;\n z-index: 3;\n}\n\n/* Overflow — keep fitting tabs visible and pin the overflow trigger to the far edge. */\n.bar-nav--tabs-collapsed {\n display: flex;\n gap: var(--dimension-space-100);\n align-items: center;\n}\n\n/* Expanded tabs — consume full header width */\n.bar-nav__left {\n position: relative;\n flex: 1 1 0%;\n min-width: 0;\n width: 0;\n display: flex;\n align-items: center;\n}\n\n.bar-nav__tabs-visible {\n flex: 1;\n min-width: 0;\n width: 100%;\n}\n\n/* Unconstrained width so intrinsic tab row width is measurable while collapsed */\n.bar-nav__tabs-probe {\n position: absolute;\n left: 0;\n top: 0;\n visibility: hidden;\n pointer-events: none;\n overflow: visible;\n width: max-content;\n max-width: none;\n z-index: -1;\n}\n\n.bar-nav__tabs-probe > div {\n width: max-content;\n}\n\n.bar-nav__tab-list {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-050);\n position: relative;\n width: max-content;\n}\n\n.bar-nav__tab {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: var(--ds-control-gap);\n height: var(--ds-control-height);\n min-width: var(--ds-control-height);\n padding: 0 var(--ds-control-padding-inline);\n box-sizing: border-box;\n border: none;\n border-radius: var(--ds-control-radius);\n background-color: transparent;\n color: var(--_bar-nav-fg-secondary);\n cursor: default;\n position: relative;\n flex-shrink: 0;\n -webkit-user-select: none;\n user-select: none;\n transition: color var(--effect-motion-short-2);\n}\n\n.bar-nav__tab::after {\n content: '';\n position: absolute;\n inset: 0;\n border-radius: var(--ds-control-radius);\n background: transparent;\n pointer-events: none;\n cursor: inherit;\n}\n\n@media (hover: hover) and (pointer: fine) {\n .bar-nav__tab:hover::after {\n background: var(--_bar-nav-hover);\n }\n}\n\n.bar-nav__tab:active::after {\n background: var(--_bar-nav-pressed);\n}\n\n.bar-nav__tab--selected {\n color: var(--_bar-nav-fg-primary);\n}\n\n.bar-nav__tab-label {\n display: inline-flex;\n align-items: center;\n white-space: nowrap;\n}\n\n.bar-nav__tab-divider {\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: var(--dimension-space-100);\n height: var(--ds-control-height);\n padding-block: var(--ds-control-padding-inline);\n flex-shrink: 0;\n pointer-events: none;\n}\n\n.bar-nav__tab-divider-line {\n width: var(--dimension-stroke-width-012);\n align-self: stretch;\n background-color: var(--_bar-nav-border);\n}\n\n/* In-flow placeholder while measuring overflow — avoids layout jump; hidden from view/accessibility. */\n.bar-nav__tabs-pending {\n flex: 1;\n min-width: 0;\n height: var(--ds-control-height);\n visibility: hidden;\n pointer-events: none;\n}\n\n/* Overflow trigger — compact icon button aligned to the right edge. */\n.bar-nav__overflow-trigger {\n margin-left: auto;\n --ds-button-unfilled-fg: var(--_bar-nav-fg-secondary);\n --ds-button-unfilled-fg-active: var(--_bar-nav-fg-primary);\n --ds-interaction-hover: var(--_bar-nav-hover);\n --ds-interaction-pressed: var(--_bar-nav-pressed);\n --ds-focus-ring-color: var(--_bar-nav-focus);\n}\n\n/* Fallback heading when no tabs — matches a single (selected) tab so the area\n name shares the tab label's type token, color, height and horizontal inset.\n Inset = tab button padding (space-075, 6px) + label inset (space-025, 2px).\n Color comes from ds-text color=\"primary\"; beat Text's inline-box display. */\nds-text.bar-nav__heading {\n display: inline-flex;\n align-items: center;\n height: var(--ds-control-height);\n padding-inline: calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));\n -webkit-user-select: none;\n user-select: none;\n}\n","import {\n Component,\n Prop,\n Event,\n EventEmitter,\n Element,\n Watch,\n State,\n h,\n Host,\n} from '@stencil/core';\nimport type { NavChromeStyle } from '../../shell/nav-chrome';\nimport type { MenuItemData } from '../Menu/menu-types';\nimport { getSelectableTabs, isTabDivider, type TabItemTab } from '../TabGroup/tab-item-utils';\nimport type { BarNavTab } from './bar-nav-types';\nimport { deriveBarNavValueFromUrl, shouldResyncBarNavProps } from './bar-nav-utils';\nimport {\n tabsOverflowContainer,\n tabsToOverflowMenuSections,\n trimTrailingDividers,\n visibleTabCountForWidth,\n} from './bar-nav-tabs-menu-utils';\nimport {\n CHROME_TRANSITION_END,\n CHROME_TRANSITION_START,\n ChromeTransitionGate,\n createRafCoalescer,\n readChromeTransitionSource,\n readChromeTransitionPhase,\n} from '../../shell/chrome-transition';\n\n@Component({\n tag: 'ds-bar-nav',\n styleUrl: 'BarNav.css',\n scoped: true,\n})\nexport class BarNav {\n /** Style slot: `dashboard` or `settings`. Colors match for now. */\n @Prop({ attribute: 'nav-style', reflect: true }) navStyle: NavChromeStyle = 'dashboard';\n\n @Element() el!: HTMLElement;\n\n /**\n * Tab items for the left section.\n * Set via JS property: `el.tabs = [...]`. Replace the array reference to update.\n */\n @Prop() tabs: BarNavTab[] = [];\n\n /** ID of the currently active tab. Overridden when `currentUrl` + `basePath` are set. */\n @Prop({ mutable: true }) value: string = '';\n\n /**\n * Fallback heading shown when no tabs are provided.\n * When tabs are present the heading is hidden.\n */\n @Prop() heading: string | undefined;\n\n /** Section base path (e.g. `/dashboard/safety`). Used with `currentUrl` to derive `value`. */\n @Prop() basePath: string = '';\n\n /** Current route URL. When set with `basePath`, the active tab is derived automatically. */\n @Prop() currentUrl: string = '';\n @Prop() moreTabsLabel: string = 'More tabs';\n\n /** Emitted when the active tab changes. Detail = tab id. */\n @Event() dsTabChange!: EventEmitter<string>;\n\n @State() private resolvedTabs: BarNavTab[] = [];\n @State() private urlDerivedValue: string = '';\n @State() private hideTabsForDetailRoute = false;\n @State() private tabsCollapsed = false;\n @State() private menuOpen = false;\n @State() private menuTriggerActive = false;\n /** When false, defer showing expanded tabs or the collapsed trigger until intrinsic width is measured (avoids a one-frame flash of the full tab row on narrow viewports). */\n @State() private tabLayoutCommitted = false;\n @State() private visibleTabs: BarNavTab[] = [];\n @State() private overflowTabs: BarNavTab[] = [];\n @State() private menuInitialFocusVisible = false;\n @State() private overflowRovingFocused = false;\n @State() private focusedTabId = '';\n\n private static readonly HOST_PROP_SYNC_BUDGET = 8;\n private static readonly INTRINSIC_WIDTH_RETRY_MAX = 3;\n private static readonly TAB_LAYOUT_COMMIT_MAX_FRAMES = 16;\n private static readonly OVERFLOW_HYSTERESIS_PX = 8;\n\n private headerEl: HTMLElement | null = null;\n private triggerEl: (HTMLElement & { setFocus?: () => Promise<void> }) | null = null;\n private menuEl: HTMLDsMenuElement | null = null;\n private visibleTabListEl: HTMLElement | null = null;\n private probeTabListEl: HTMLElement | null = null;\n private resizeObserver: ResizeObserver | null = null;\n private intrinsicWidthRetryCount = 0;\n private tabLayoutPendingFrames = 0;\n private readonly panelNavTransition = new ChromeTransitionGate();\n private readonly panelToolsTransition = new ChromeTransitionGate();\n private readonly overflowCoalescer = createRafCoalescer(() => {\n this.updateTabsCollapsed();\n });\n private chromeTransitionShell: HTMLElement | null = null;\n /** Matches `basePath` once tabs + URL are reconciled for the active section. */\n @State() private committedSection = '';\n /** Section waiting for URL + tabs to catch up after a cross-area navigation. */\n @State() private pendingSection = '';\n\n private get effectiveValue(): string {\n if (this.currentUrl && this.basePath) {\n return this.urlDerivedValue;\n }\n return this.value;\n }\n\n private get renderedSelectableTabs(): TabItemTab[] {\n const tabs = this.hasOverflowTabs ? this.visibleTabs : this.resolvedTabs;\n return getSelectableTabs(tabs);\n }\n\n private get hasOverflowTabs(): boolean {\n return this.tabLayoutCommitted && this.tabsCollapsed && this.overflowTabs.length > 0;\n }\n\n private syncFocusedTabId(preferred: string, tabs: TabItemTab[]) {\n if (tabs.some(tab => tab.id === preferred && !tab.isInactive)) {\n this.focusedTabId = preferred;\n return;\n }\n const first = tabs.find(tab => !tab.isInactive);\n this.focusedTabId = first?.id ?? '';\n }\n\n private digestTabsConfig(tabs: BarNavTab[]): string {\n return tabs.map(t => (isTabDivider(t) ? '|' : t.id)).join(',');\n }\n\n private resetTabOverflowLayout() {\n this.tabLayoutCommitted = false;\n this.tabsCollapsed = false;\n this.menuOpen = false;\n this.menuTriggerActive = false;\n this.menuInitialFocusVisible = false;\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n this.visibleTabs = [];\n this.overflowTabs = [];\n }\n\n @Watch('tabs')\n @Watch('currentUrl')\n @Watch('basePath')\n onHostPropsChange() {\n this.applyHostProps();\n }\n\n @Watch('value')\n @Watch('urlDerivedValue')\n onSelectionChange() {\n this.syncFocusedTabId(this.effectiveValue, this.renderedSelectableTabs);\n this.syncMenuSections();\n this.scheduleOverflowCheck();\n }\n\n @Watch('menuOpen')\n onMenuOpenChange(open: boolean) {\n if (this.menuEl) {\n this.menuEl.open = open;\n }\n }\n\n @Watch('tabsCollapsed')\n onTabsCollapsedChange(collapsed: boolean, prevCollapsed: boolean | undefined) {\n if (!collapsed) {\n this.menuOpen = false;\n this.menuTriggerActive = false;\n this.menuInitialFocusVisible = false;\n this.menuEl = null;\n }\n this.scheduleOverflowCheck();\n if (collapsed) {\n requestAnimationFrame(() => {\n this.scheduleOverflowCheck();\n });\n }\n if (collapsed || prevCollapsed === undefined || prevCollapsed === collapsed) return;\n requestAnimationFrame(() => this.scheduleOverflowCheck());\n queueMicrotask(() => this.focusVisibleSelectedTab());\n }\n\n componentWillLoad() {\n this.applyHostProps();\n this.syncFocusedTabId(this.effectiveValue, getSelectableTabs(this.resolvedTabs));\n }\n\n componentDidLoad() {\n this.syncHostPropsIfNeeded();\n this.scheduleDeferredHostPropSync();\n this.setupOverflowObserver();\n this.bindChromeTransitionListeners();\n this.scheduleOverflowCheck();\n }\n\n componentDidRender() {\n if (this.chromeOverflowPaused()) {\n this.syncMenuAnchor();\n return;\n }\n this.scheduleOverflowCheck();\n this.syncMenuAnchor();\n }\n\n disconnectedCallback() {\n this.resizeObserver?.disconnect();\n this.resizeObserver = null;\n this.overflowCoalescer.cancel();\n this.unbindChromeTransitionListeners();\n }\n\n private bindChromeTransitionListeners() {\n const shell = this.el.closest<HTMLElement>('ds-shell-app');\n if (!shell) return;\n this.chromeTransitionShell = shell;\n shell.addEventListener(CHROME_TRANSITION_START, this.onChromeTransitionStart);\n shell.addEventListener(CHROME_TRANSITION_END, this.onChromeTransitionEnd);\n }\n\n private unbindChromeTransitionListeners() {\n if (!this.chromeTransitionShell) return;\n this.chromeTransitionShell.removeEventListener(\n CHROME_TRANSITION_START,\n this.onChromeTransitionStart\n );\n this.chromeTransitionShell.removeEventListener(\n CHROME_TRANSITION_END,\n this.onChromeTransitionEnd\n );\n this.chromeTransitionShell = null;\n }\n\n private onChromeTransitionStart = (event: Event) => {\n const source = readChromeTransitionSource(event);\n if (source === 'panel-nav') {\n this.panelNavTransition.enter();\n return;\n }\n if (source === 'panel-tools') {\n const phase = readChromeTransitionPhase(event) ?? 'opening';\n if (phase === 'closing') {\n this.panelToolsTransition.enter();\n }\n }\n };\n\n private chromeOverflowPaused(): boolean {\n return this.panelNavTransition.isActive || this.panelToolsTransition.isActive;\n }\n\n private onChromeTransitionEnd = (event: Event) => {\n const source = readChromeTransitionSource(event);\n if (source === 'panel-nav') {\n this.panelNavTransition.exit();\n if (!this.panelNavTransition.isActive) {\n this.scheduleOverflowCheck();\n }\n return;\n }\n if (source === 'panel-tools') {\n this.panelToolsTransition.exit();\n this.scheduleOverflowCheck();\n }\n };\n\n /** Re-resolve props assigned by the host after componentWillLoad (Angular ngAfterViewInit). */\n private syncHostPropsIfNeeded() {\n if (shouldResyncBarNavProps(this.resolvedTabs, this.tabs)) {\n this.applyHostProps();\n } else if (this.currentUrl && this.basePath) {\n this.syncValueFromUrl();\n }\n }\n\n /** Poll across animation frames — host props may land without triggering @Watch. */\n private scheduleDeferredHostPropSync() {\n let remaining = BarNav.HOST_PROP_SYNC_BUDGET;\n const tick = () => {\n this.syncHostPropsIfNeeded();\n if (--remaining > 0) {\n requestAnimationFrame(tick);\n }\n };\n queueMicrotask(tick);\n }\n\n private setupOverflowObserver() {\n if (typeof ResizeObserver === 'undefined' || !this.headerEl) return;\n this.resizeObserver?.disconnect();\n this.resizeObserver = new ResizeObserver(() => {\n if (this.chromeOverflowPaused()) return;\n this.scheduleOverflowCheck();\n });\n this.resizeObserver.observe(this.headerEl);\n }\n\n private scheduleOverflowCheck() {\n if (this.chromeOverflowPaused()) return;\n this.overflowCoalescer.schedule();\n }\n\n /** Width available for the tab row or collapsed trigger. */\n private getLeftZoneAvailableWidth(): number {\n if (!this.headerEl) return 0;\n\n const headerStyle = getComputedStyle(this.headerEl);\n const horizontalPadding =\n (parseFloat(headerStyle.paddingLeft) || 0) + (parseFloat(headerStyle.paddingRight) || 0);\n\n return Math.max(0, this.headerEl.clientWidth - horizontalPadding);\n }\n\n private getTabsIntrinsicWidth(): number {\n return this.probeTabListEl?.scrollWidth ?? 0;\n }\n\n private getHeaderGap(): number {\n if (!this.headerEl) return 0;\n const style = getComputedStyle(this.headerEl);\n return parseFloat(style.columnGap || style.gap) || 0;\n }\n\n private getOverflowTriggerReserveWidth(): number {\n if (!this.triggerEl) {\n return 40;\n }\n return this.triggerEl.getBoundingClientRect().width + this.getHeaderGap();\n }\n\n private getProbeTabMetrics(): {\n itemWidths: number[];\n itemGap: number;\n listExtraWidth: number;\n } | null {\n const tabList = this.probeTabListEl;\n if (!tabList) return null;\n\n const children = Array.from(tabList.children) as HTMLElement[];\n const itemWidths = children.map(child => child.getBoundingClientRect().width);\n if (itemWidths.length === 0 || itemWidths.some(width => width === 0)) return null;\n\n const style = getComputedStyle(tabList);\n const itemGap = parseFloat(style.columnGap || style.gap) || 0;\n const childrenWidth = itemWidths.reduce((sum, width) => sum + width, 0);\n const gapWidth = itemGap * Math.max(0, itemWidths.length - 1);\n const listExtraWidth = Math.max(0, tabList.scrollWidth - childrenWidth - gapWidth);\n\n return { itemWidths, itemGap, listExtraWidth };\n }\n\n private setOverflowTabLayout(visibleTabs: BarNavTab[], overflowTabs: BarNavTab[]) {\n const nextCollapsed = overflowTabs.length > 0;\n const visibleChanged =\n this.digestTabsConfig(visibleTabs) !== this.digestTabsConfig(this.visibleTabs);\n const overflowChanged =\n this.digestTabsConfig(overflowTabs) !== this.digestTabsConfig(this.overflowTabs);\n\n if (visibleChanged) {\n this.visibleTabs = visibleTabs;\n }\n if (overflowChanged) {\n this.overflowTabs = overflowTabs;\n }\n if (nextCollapsed !== this.tabsCollapsed) {\n this.tabsCollapsed = nextCollapsed;\n if (!nextCollapsed) {\n this.menuOpen = false;\n this.menuTriggerActive = false;\n }\n }\n this.syncFocusedTabId(\n this.effectiveValue,\n getSelectableTabs(nextCollapsed ? visibleTabs : this.resolvedTabs)\n );\n }\n\n private scheduleIntrinsicWidthRetry() {\n if (this.intrinsicWidthRetryCount >= BarNav.INTRINSIC_WIDTH_RETRY_MAX) return;\n this.intrinsicWidthRetryCount++;\n requestAnimationFrame(() => this.scheduleOverflowCheck());\n }\n\n private forceTabLayoutCommit(fallbackCollapsed: boolean) {\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n this.setOverflowTabLayout(\n fallbackCollapsed ? [] : this.resolvedTabs,\n fallbackCollapsed ? this.resolvedTabs : []\n );\n this.tabLayoutCommitted = true;\n }\n\n private updateTabsCollapsed() {\n if (!this.headerEl || this.resolvedTabs.length === 0 || this.hideTabsForDetailRoute) {\n if (this.tabsCollapsed) {\n this.setOverflowTabLayout([], []);\n }\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n this.tabLayoutCommitted = true;\n return;\n }\n\n const metrics = this.getProbeTabMetrics();\n const intrinsicWidth = this.getTabsIntrinsicWidth();\n if (!metrics || intrinsicWidth === 0) {\n this.tabLayoutPendingFrames += 1;\n if (this.intrinsicWidthRetryCount >= BarNav.INTRINSIC_WIDTH_RETRY_MAX) {\n this.forceTabLayoutCommit(false);\n } else if (this.tabLayoutPendingFrames >= BarNav.TAB_LAYOUT_COMMIT_MAX_FRAMES) {\n this.forceTabLayoutCommit(false);\n } else {\n this.scheduleIntrinsicWidthRetry();\n }\n return;\n }\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n\n const shouldCollapse = tabsOverflowContainer(\n intrinsicWidth,\n this.getLeftZoneAvailableWidth(),\n this.tabsCollapsed,\n BarNav.OVERFLOW_HYSTERESIS_PX\n );\n\n if (!shouldCollapse) {\n this.setOverflowTabLayout(this.resolvedTabs, []);\n this.tabLayoutCommitted = true;\n return;\n }\n\n const visibleCount = visibleTabCountForWidth(\n metrics.itemWidths,\n this.getLeftZoneAvailableWidth(),\n this.getOverflowTriggerReserveWidth(),\n metrics.itemGap,\n metrics.listExtraWidth\n );\n const visibleTabs = trimTrailingDividers(this.resolvedTabs.slice(0, visibleCount));\n const overflowTabs = this.resolvedTabs.slice(visibleTabs.length);\n this.setOverflowTabLayout(visibleTabs, overflowTabs);\n this.tabLayoutCommitted = true;\n }\n\n private syncMenuAnchor() {\n if (!this.menuEl || !this.triggerEl || !this.hasOverflowTabs) return;\n this.menuEl.anchor = this.triggerEl;\n this.syncMenuSections();\n }\n\n private handleMenuSelect(e: Event) {\n const detail = (e as CustomEvent<MenuItemData>).detail;\n if (detail?.value !== undefined) {\n this.selectTab(String(detail.value));\n }\n this.menuOpen = false;\n this.menuInitialFocusVisible = false;\n }\n\n private handleMenuClose() {\n this.menuOpen = false;\n this.menuInitialFocusVisible = false;\n }\n\n private handleMenuAfterClose() {\n if (!this.menuOpen) this.menuTriggerActive = false;\n }\n\n /** Batch tabs/basePath/currentUrl updates so URL derivation never runs with a mixed section. */\n private incomingTabs(): BarNavTab[] {\n return this.tabs ?? [];\n }\n\n private applyHostProps() {\n const nextBasePath = this.basePath;\n const sectionChanged =\n nextBasePath !== '' && this.committedSection !== '' && nextBasePath !== this.committedSection;\n\n if (sectionChanged) {\n this.urlDerivedValue = '';\n this.committedSection = '';\n this.pendingSection = nextBasePath;\n this.resolvedTabs = [];\n this.resetTabOverflowLayout();\n return;\n }\n\n if (this.pendingSection) {\n if (!nextBasePath || nextBasePath !== this.pendingSection) {\n return;\n }\n if (!this.currentUrl.startsWith(this.pendingSection)) {\n return;\n }\n const tabs = this.incomingTabs();\n if (tabs.length === 0) {\n return;\n }\n this.pendingSection = '';\n }\n\n const tabs = this.incomingTabs();\n const tabsConfigChanged =\n this.digestTabsConfig(tabs) !== this.digestTabsConfig(this.resolvedTabs);\n\n this.resolvedTabs = tabs;\n this.syncValueFromUrl();\n this.committedSection = nextBasePath;\n if (tabsConfigChanged) {\n this.resetTabOverflowLayout();\n }\n this.scheduleOverflowCheck();\n }\n\n private syncMenuSections() {\n if (!this.menuEl) return;\n this.menuEl.sections = tabsToOverflowMenuSections(this.overflowTabs, this.effectiveValue);\n }\n\n private syncValueFromUrl() {\n const tabs = this.incomingTabs();\n\n if (!this.currentUrl || !this.basePath) {\n this.urlDerivedValue = '';\n this.hideTabsForDetailRoute = false;\n return;\n }\n\n if (!this.currentUrl.startsWith(this.basePath)) {\n this.urlDerivedValue = '';\n this.hideTabsForDetailRoute = false;\n return;\n }\n\n const { value, hideTabs } = deriveBarNavValueFromUrl(this.currentUrl, this.basePath, tabs);\n this.urlDerivedValue = value;\n this.hideTabsForDetailRoute = hideTabs;\n }\n\n private selectTab(id: string) {\n this.value = id;\n this.dsTabChange.emit(id);\n }\n\n /** Move focus to the selected tab in the visible tab group (after expand). */\n private focusVisibleSelectedTab() {\n const tab = this.visibleTabListEl?.querySelector(\n `[data-tab-id=\"${this.effectiveValue}\"]`\n ) as HTMLElement | null;\n tab?.focus({ preventScroll: true });\n }\n\n private focusVisibleTab(id: string) {\n this.focusedTabId = id;\n const tab = this.visibleTabListEl?.querySelector(`[data-tab-id=\"${id}\"]`) as HTMLElement | null;\n tab?.focus({ preventScroll: true });\n }\n\n private focusLastVisibleTab() {\n const last = [...this.renderedSelectableTabs].reverse().find(tab => !tab.isInactive);\n if (last) this.focusVisibleTab(last.id);\n }\n\n private findEnabledVisibleTab(from: number, step: 1 | -1): number | null {\n const tabs = this.renderedSelectableTabs;\n for (let index = from + step; index >= 0 && index < tabs.length; index += step) {\n if (!tabs[index]?.isInactive) return index;\n }\n return null;\n }\n\n private handleTabKeyDown(e: KeyboardEvent) {\n const tabs = this.renderedSelectableTabs;\n if (!tabs.length) return;\n const targetId = (e.target as HTMLElement | null)?.getAttribute('data-tab-id');\n const focusedId = targetId ?? this.focusedTabId;\n\n if (e.key === 'Enter' || e.key === ' ') {\n const focused = tabs.find(tab => tab.id === focusedId);\n if (!focused || focused.isInactive) return;\n e.preventDefault();\n this.selectTab(focused.id);\n return;\n }\n\n const currentIndex = tabs.findIndex(tab => tab.id === focusedId);\n if (currentIndex < 0) return;\n\n let nextIndex: number | null;\n if (e.key === 'ArrowRight') {\n nextIndex = this.findEnabledVisibleTab(currentIndex, 1);\n if (nextIndex === null && this.hasOverflowTabs) {\n e.preventDefault();\n this.overflowRovingFocused = true;\n void this.triggerEl?.setFocus?.();\n return;\n }\n } else if (e.key === 'ArrowLeft') {\n nextIndex = this.findEnabledVisibleTab(currentIndex, -1);\n } else if (e.key === 'Home') {\n nextIndex = tabs.findIndex(tab => !tab.isInactive);\n } else if (e.key === 'End') {\n const reversedIndex = [...tabs].reverse().findIndex(tab => !tab.isInactive);\n nextIndex = reversedIndex < 0 ? null : tabs.length - 1 - reversedIndex;\n } else {\n return;\n }\n\n if (nextIndex === null || nextIndex < 0 || nextIndex === currentIndex) return;\n e.preventDefault();\n this.focusVisibleTab(tabs[nextIndex].id);\n }\n\n private toggleTabMenu(options?: { focusVisible?: boolean }) {\n if (this.menuOpen) {\n this.menuOpen = false;\n this.menuInitialFocusVisible = false;\n return;\n }\n\n if (this.menuEl && this.triggerEl) {\n this.menuEl.anchor = this.triggerEl;\n this.menuEl.minWidth = '';\n this.syncMenuSections();\n }\n\n this.menuInitialFocusVisible = options?.focusVisible ?? false;\n this.menuTriggerActive = true;\n this.menuOpen = true;\n }\n\n private handleOverflowFocus = () => {\n this.overflowRovingFocused = true;\n };\n\n private handleOverflowBlur = () => {\n this.overflowRovingFocused = false;\n };\n\n private handleTriggerKeyDown(e: KeyboardEvent) {\n if (!this.hasOverflowTabs) return;\n\n if (!this.menuOpen) {\n if (e.key === 'ArrowLeft') {\n e.preventDefault();\n this.overflowRovingFocused = false;\n this.focusLastVisibleTab();\n return;\n }\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n this.toggleTabMenu({ focusVisible: true });\n }\n return;\n }\n\n if (e.key === 'Escape') {\n e.preventDefault();\n this.menuOpen = false;\n this.menuInitialFocusVisible = false;\n void this.triggerEl?.setFocus?.();\n }\n }\n\n private renderTabList(tabs: BarNavTab[], probe: boolean) {\n return (\n <div\n role=\"tablist\"\n class=\"bar-nav__tab-list\"\n aria-label={this.heading}\n ref={el => {\n if (probe) {\n const next = (el as HTMLElement) ?? null;\n if (next === this.probeTabListEl) return;\n this.probeTabListEl = next;\n if (next) {\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n this.scheduleOverflowCheck();\n }\n } else {\n this.visibleTabListEl = (el as HTMLElement) ?? null;\n }\n }}\n onKeyDown={probe ? undefined : (e: KeyboardEvent) => this.handleTabKeyDown(e)}\n onFocusin={\n probe\n ? undefined\n : () => {\n this.overflowRovingFocused = false;\n }\n }\n >\n {tabs.map((tab, index) => {\n if (isTabDivider(tab)) {\n return (\n <div class=\"bar-nav__tab-divider\" key={`divider-${index}`} aria-hidden=\"true\">\n <div class=\"bar-nav__tab-divider-line\" />\n </div>\n );\n }\n\n const isSelected = tab.id === this.effectiveValue;\n return (\n <button\n key={tab.id}\n type=\"button\"\n role=\"tab\"\n data-tab-id={tab.id}\n class={{\n 'bar-nav__tab': true,\n 'bar-nav__tab--selected': isSelected,\n 'ds-control--md': true,\n 'ds-focus-ring-inset': true,\n 'ds-control-inactive': !!tab.isInactive,\n }}\n aria-selected={isSelected ? 'true' : 'false'}\n aria-disabled={tab.isInactive ? 'true' : undefined}\n aria-controls={tab.panelId ?? undefined}\n disabled={tab.isInactive}\n tabIndex={\n !probe && !this.overflowRovingFocused && tab.id === this.focusedTabId ? 0 : -1\n }\n onClick={() => !probe && !tab.isInactive && this.selectTab(tab.id)}\n onFocus={() => {\n if (!probe) this.focusedTabId = tab.id;\n }}\n >\n <span\n class={{\n 'bar-nav__tab-label': true,\n 'ds-control-label-box': true,\n 'ds-control-label-dot': !!tab.dot,\n 'bar-nav__tab-label--dot': !!tab.dot,\n }}\n >\n <ds-text as=\"span\" variant=\"text-body-medium\" emphasis={isSelected} color=\"inherit\">\n {tab.label}\n </ds-text>\n {tab.dot && (\n <ds-badge\n class=\"bar-nav__tab-dot ds-control-label-dot__badge\"\n variant=\"dot\"\n hasRing={false}\n label=\"\"\n aria-hidden=\"true\"\n />\n )}\n </span>\n </button>\n );\n })}\n </div>\n );\n }\n\n render() {\n // Section gating only applies when `basePath` is set (SPA section sync).\n // Tabs without a base path must still render — otherwise a single-tab bar\n // (or any non-routed tabs) silently falls through to an empty header.\n const sectionReady = this.basePath === '' || this.committedSection === this.basePath;\n const hasTabs = sectionReady && this.resolvedTabs.length > 0 && !this.hideTabsForDetailRoute;\n const tabGroupKey = this.basePath || 'no-section';\n const renderedTabs = this.hasOverflowTabs ? this.visibleTabs : this.resolvedTabs;\n\n return (\n <Host>\n <header\n class={{\n 'bar-nav': true,\n 'ds-control--md': true,\n 'ds-chrome-row': true,\n 'ds-chrome-space--md': true,\n 'bar-nav--dashboard': this.navStyle === 'dashboard',\n 'bar-nav--settings': this.navStyle === 'settings',\n 'bar-nav--tabs-collapsed': hasTabs && this.hasOverflowTabs,\n }}\n ref={el => {\n this.headerEl = el as HTMLElement;\n if (el && !this.resizeObserver) {\n this.setupOverflowObserver();\n }\n }}\n >\n {hasTabs && (\n <div class=\"bar-nav__tabs-probe\" aria-hidden=\"true\" inert>\n <div key={`probe-${tabGroupKey}`}>{this.renderTabList(this.resolvedTabs, true)}</div>\n </div>\n )}\n\n {hasTabs && this.tabLayoutCommitted && renderedTabs.length > 0 && (\n <div class=\"bar-nav__left\">\n <div key={`visible-${tabGroupKey}`} class=\"bar-nav__tabs-visible\">\n {this.renderTabList(renderedTabs, false)}\n </div>\n </div>\n )}\n\n {hasTabs && !this.tabLayoutCommitted && (\n <div class=\"bar-nav__tabs-pending\" aria-hidden=\"true\" />\n )}\n\n {!hasTabs && this.heading && (\n <ds-text\n class=\"bar-nav__heading\"\n lineTruncation={1}\n as=\"span\"\n variant=\"text-body-medium\"\n emphasis\n color=\"primary\"\n wrap=\"nowrap\"\n >\n {this.heading}\n </ds-text>\n )}\n\n {hasTabs && this.hasOverflowTabs && (\n <ds-button-unfilled\n variant=\"icon\"\n class={{\n 'bar-nav__overflow-trigger': true,\n }}\n icon=\"ChevronDown\"\n activeFill={false}\n hasBorder={false}\n focusTabIndex={this.overflowRovingFocused ? 0 : -1}\n ref={(el?: HTMLDsButtonUnfilledElement) => {\n this.triggerEl = (el as HTMLElement & { setFocus?: () => Promise<void> }) ?? null;\n }}\n haspopup=\"menu\"\n expanded={this.menuOpen}\n surfaceOpen={this.menuTriggerActive}\n aria-label={this.moreTabsLabel}\n onDsClick={() => this.toggleTabMenu({ focusVisible: false })}\n onFocusin={this.handleOverflowFocus}\n onFocusout={this.handleOverflowBlur}\n onKeyDown={(e: KeyboardEvent) => this.handleTriggerKeyDown(e)}\n />\n )}\n </header>\n\n {hasTabs && this.hasOverflowTabs && (\n <ds-menu\n ref={el => {\n this.menuEl = (el as HTMLDsMenuElement) ?? null;\n }}\n open={this.menuOpen}\n sections={tabsToOverflowMenuSections(this.overflowTabs, this.effectiveValue)}\n side=\"bottom\"\n align=\"end\"\n sideOffset=\"calc(var(--dimension-space-100) + var(--dimension-space-050))\"\n initialFocusVisible={this.menuInitialFocusVisible}\n onDsSelect={(e: Event) => this.handleMenuSelect(e)}\n onDsClose={() => this.handleMenuClose()}\n onDsAfterClose={() => this.handleMenuAfterClose()}\n />\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"names":["panelToolHeaderCss","PanelToolHeader","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","heading","showBack","backIcon","backAriaLabel","showMenu","menuAriaLabel","menuTriggerId","menuExpanded","actions","focusMenuTrigger","trigger","el","querySelector","setFocus","render","authoredActions","length","id","icon","ariaLabel","triggerId","controls","menuControls","expanded","surfaceOpen","menuSurfaceOpen","haspopup","h","Host","key","class","label","side","size","variant","activeFill","hasBorder","onDsClick","event","dsBack","emit","detail","as","emphasis","color","lineTruncation","map","action","undefined","pressed","isInactive","dsMenuToggle","dsAction","originalEvent","anchor","currentTarget"],"sources":["src/wc/components/PanelToolHeader/PanelToolHeader.css?tag=ds-panel-tool-header&encapsulation=scoped","src/wc/components/PanelToolHeader/PanelToolHeader.tsx"],"sourcesContent":["@import '../../utils/radius.css';\n@import '../../utils/control-density.css';\n@import '../../utils/chrome-header.css';\n\n:host {\n display: block;\n flex: 0 0 auto;\n box-sizing: border-box;\n}\n\n.panel-tool-header {\n height: var(--dimension-size-600);\n color: var(--color-foreground-primary);\n -webkit-user-select: none;\n user-select: none;\n}\n\n.panel-tool-header__leading:empty,\n.panel-tool-header__trailing:empty {\n display: none;\n}\n\n.panel-tool-header__trailing {\n gap: var(--dimension-space-050);\n justify-content: flex-end;\n}\n\nds-text.panel-tool-header__heading {\n display: inline-flex;\n flex: 1 1 0;\n align-items: center;\n width: auto;\n min-width: 0;\n height: var(--ds-control-height);\n padding-inline: calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));\n box-sizing: border-box;\n text-align: left;\n -webkit-user-select: none;\n user-select: none;\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core';\nimport type {\n PanelToolHeaderActionDetail,\n PanelToolsHeaderAction,\n} from '../PanelTools/panel-tools-types';\n\n@Component({\n tag: 'ds-panel-tool-header',\n styleUrl: 'PanelToolHeader.css',\n scoped: true,\n})\nexport class PanelToolHeader {\n @Element() el!: HTMLElement;\n\n /** Visible heading for the active tool view. */\n @Prop() heading: string = '';\n /** Show the leading Back action. */\n @Prop() showBack: boolean = false;\n /** Canonical icon for the leading navigation or dismiss action. */\n @Prop() backIcon: string = 'ChevronLeft';\n /** Accessible name for the leading navigation or dismiss action. */\n @Prop() backAriaLabel: string = 'Back';\n /** Show the trailing options-menu trigger. */\n @Prop() showMenu: boolean = true;\n /** Accessible name for the options-menu trigger. */\n @Prop() menuAriaLabel: string = 'More options';\n /** Stable id placed on the menu trigger host for ds-menu anchoring. */\n @Prop() menuTriggerId: string = '';\n /** Id of the menu controlled by the trigger. */\n @Prop() menuControls: string | undefined;\n /** Whether the controlled menu is open. */\n @Prop() menuExpanded: boolean = false;\n /** Associated menu surface is visible, including exit motion. */\n @Prop() menuSurfaceOpen: boolean | undefined;\n /** Trailing application-owned icon actions. When present, these replace the legacy menu action. */\n @Prop() actions: PanelToolsHeaderAction[] = [];\n\n @Event() dsBack!: EventEmitter<MouseEvent>;\n @Event() dsMenuToggle!: EventEmitter<MouseEvent>;\n @Event() dsAction!: EventEmitter<PanelToolHeaderActionDetail>;\n\n @Method()\n async focusMenuTrigger() {\n const trigger = this.el.querySelector(\n 'ds-button-unfilled.panel-tool-header__menu, ds-button-unfilled[data-header-action-id=\"menu\"]'\n ) as (HTMLElement & { setFocus?: () => Promise<void> }) | null;\n await trigger?.setFocus?.();\n }\n\n render() {\n const authoredActions = this.actions.length > 0;\n const actions: PanelToolsHeaderAction[] = authoredActions\n ? this.actions\n : this.showMenu\n ? [\n {\n id: 'menu',\n icon: 'Ellipses',\n ariaLabel: this.menuAriaLabel,\n triggerId: this.menuTriggerId,\n controls: this.menuControls,\n expanded: this.menuExpanded,\n surfaceOpen: this.menuSurfaceOpen,\n haspopup: 'menu',\n },\n ]\n : [];\n\n return (\n <Host>\n <header class=\"panel-tool-header ds-chrome-header ds-chrome-header--bounded\">\n <div class=\"panel-tool-header__leading ds-chrome-header__leading\">\n {this.showBack ? (\n <ds-tooltip label={this.backAriaLabel} side=\"bottom\" size=\"sm\">\n <ds-button-unfilled\n class=\"panel-tool-header__back\"\n variant=\"icon\"\n icon={this.backIcon}\n size=\"md\"\n aria-label={this.backAriaLabel}\n activeFill={false}\n hasBorder={false}\n onDsClick={(event: CustomEvent<MouseEvent>) => this.dsBack.emit(event.detail)}\n />\n </ds-tooltip>\n ) : null}\n </div>\n <ds-text\n class=\"panel-tool-header__heading ds-chrome-header__heading ds-control--md\"\n as=\"h2\"\n variant=\"text-body-medium\"\n emphasis\n color=\"primary\"\n lineTruncation={1}\n >\n {this.heading}\n </ds-text>\n <div class=\"panel-tool-header__trailing ds-chrome-header__trailing\">\n {actions.map(action => (\n <ds-tooltip key={action.id} label={action.ariaLabel} side=\"bottom\" size=\"sm\">\n <ds-button-unfilled\n id={action.triggerId || undefined}\n data-header-action-id={action.id}\n class={{\n 'panel-tool-header__action': true,\n 'panel-tool-header__menu': action.id === 'menu',\n }}\n variant=\"icon\"\n icon={action.icon}\n size=\"md\"\n aria-label={action.ariaLabel}\n haspopup={action.haspopup}\n controls={action.controls}\n expanded={action.expanded}\n surfaceOpen={action.surfaceOpen}\n pressed={action.pressed}\n isInactive={action.isInactive}\n activeFill={false}\n hasBorder={false}\n onDsClick={(event: CustomEvent<MouseEvent>) => {\n if (!authoredActions && action.id === 'menu')\n this.dsMenuToggle.emit(event.detail);\n this.dsAction.emit({\n id: action.id,\n originalEvent: event.detail,\n anchor: event.currentTarget as HTMLElement,\n });\n }}\n />\n </ds-tooltip>\n ))}\n </div>\n </header>\n </Host>\n );\n }\n}\n"],"mappings":"0RAAA,MAAMA,EAAqB,IAAM,ylM,MCWpBC,EAAeC,EAAA,MAAAD,UAAAE,EAL5B,WAAAC,CAAAC,G,yJASUC,KAAAC,QAAkB,GAElBD,KAAAE,SAAoB,MAEpBF,KAAAG,SAAmB,cAEnBH,KAAAI,cAAwB,OAExBJ,KAAAK,SAAoB,KAEpBL,KAAAM,cAAwB,eAExBN,KAAAO,cAAwB,GAIxBP,KAAAQ,aAAwB,MAIxBR,KAAAS,QAAoC,EAqG7C,CA9FC,sBAAMC,GACJ,MAAMC,EAAUX,KAAKY,GAAGC,cACtB,sGAEIF,GAASG,a,CAGjB,MAAAC,GACE,MAAMC,EAAkBhB,KAAKS,QAAQQ,OAAS,EAC9C,MAAMR,EAAoCO,EACtChB,KAAKS,QACLT,KAAKK,SACH,CACE,CACEa,GAAI,OACJC,KAAM,WACNC,UAAWpB,KAAKM,cAChBe,UAAWrB,KAAKO,cAChBe,SAAUtB,KAAKuB,aACfC,SAAUxB,KAAKQ,aACfiB,YAAazB,KAAK0B,gBAClBC,SAAU,SAGd,GAEN,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,UAAAE,IAAA,2CAAQC,MAAM,gEACZH,EAAA,OAAAE,IAAA,2CAAKC,MAAM,wDACR/B,KAAKE,SACJ0B,EAAA,cAAYI,MAAOhC,KAAKI,cAAe6B,KAAK,SAASC,KAAK,MACxDN,EAAA,sBACEG,MAAM,0BACNI,QAAQ,OACRhB,KAAMnB,KAAKG,SACX+B,KAAK,KAAI,aACGlC,KAAKI,cACjBgC,WAAY,MACZC,UAAW,MACXC,UAAYC,GAAmCvC,KAAKwC,OAAOC,KAAKF,EAAMG,WAGxE,MAENd,EAAA,WAAAE,IAAA,2CACEC,MAAM,sEACNY,GAAG,KACHR,QAAQ,mBACRS,SAAQ,KACRC,MAAM,UACNC,eAAgB,GAEf9C,KAAKC,SAER2B,EAAA,OAAAE,IAAA,2CAAKC,MAAM,0DACRtB,EAAQsC,KAAIC,GACXpB,EAAA,cAAYE,IAAKkB,EAAO9B,GAAIc,MAAOgB,EAAO5B,UAAWa,KAAK,SAASC,KAAK,MACtEN,EAAA,sBACEV,GAAI8B,EAAO3B,WAAa4B,UAAS,wBACVD,EAAO9B,GAC9Ba,MAAO,CACL,4BAA6B,KAC7B,0BAA2BiB,EAAO9B,KAAO,QAE3CiB,QAAQ,OACRhB,KAAM6B,EAAO7B,KACbe,KAAK,KAAI,aACGc,EAAO5B,UACnBO,SAAUqB,EAAOrB,SACjBL,SAAU0B,EAAO1B,SACjBE,SAAUwB,EAAOxB,SACjBC,YAAauB,EAAOvB,YACpByB,QAASF,EAAOE,QAChBC,WAAYH,EAAOG,WACnBf,WAAY,MACZC,UAAW,MACXC,UAAYC,IACV,IAAKvB,GAAmBgC,EAAO9B,KAAO,OACpClB,KAAKoD,aAAaX,KAAKF,EAAMG,QAC/B1C,KAAKqD,SAASZ,KAAK,CACjBvB,GAAI8B,EAAO9B,GACXoC,cAAef,EAAMG,OACrBa,OAAQhB,EAAMiB,eACd,S","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- import{h as e}from"./index.js";import{C as o,a as s}from"./p-CGidq1iC.js";const a=({size:s="md",heading:a,ariaLabel:t,className:n},i)=>e("div",{class:`ds-choice-list ds-chrome-column ds-chrome-space--sm ${n??""}`.trim(),role:"listbox","aria-label":t},a?e("ds-text",{class:`ds-choice-section__header ds-control-section-heading ds-control--${s}`,as:"div",variant:o[s],color:"primary",emphasis:true,"aria-hidden":"true"},a):null,i);const t=({size:o="md",hasFocusBoundary:s=true,hasInteractionFill:a=true,value:t,placeholder:n,ariaLabel:i,controls:c,activeDescendant:r,disabled:l=false,inputRef:d,clearLabel:u,onValueChange:f,onClear:m,onKeyDown:p})=>e("div",{class:{"select-search":true,"select-search--without-focus-boundary":!s}},e("ds-input",{class:"select-search__control",ref:e=>d(e??null),type:"search",size:o,width:"fill",value:t,placeholder:n,icon:"MagnifyingGlass",clearLabel:u,isInactive:l,hasBorder:false,hasInteractionFill:a,ariaLabel:i??n,ariaControls:c,ariaActiveDescendant:r,onKeyDown:p,onDsChange:e=>{e.stopPropagation();f(e.detail)},onDsClear:e=>{e.stopPropagation();m?.()}}));const n=({size:o="md",clearLabel:a,summary:t,compactSummary:n,useCompactSummary:i=false,contentRef:c,summaryMeasureRef:r,clearRef:l,onClear:d})=>e("div",{class:"ds-choice-footer"},e("div",{ref:e=>c?.(e??null),class:`ds-choice-footer__content ds-control--${o}`},t&&[e("ds-text",{key:"summary",class:"ds-choice-footer__summary",as:"span",variant:s[o],color:"secondary"},i?n??t:t),e("ds-text",{key:"summary-measure",ref:e=>r?.(e??null),class:"ds-choice-footer__summary-measure",as:"span",variant:s[o],color:"secondary","aria-hidden":"true"},t)],e("button",{ref:e=>l?.(e??null),type:"button",class:"ds-choice-footer__clear ds-text-action ds-focus-ring",onClick:d},e("ds-text",{as:"span",variant:s[o],color:"inherit"},a))));const i=({size:o="md",label:a,onAction:t})=>e("div",{class:"ds-choice-footer"},e("div",{class:`ds-choice-footer__content ds-control--${o}`},e("button",{type:"button",class:"ds-choice-footer__action ds-text-action ds-focus-ring",onClick:t},e("ds-text",{as:"span",variant:s[o],color:"inherit"},a))));const c=({size:a="md",id:t,option:n,selected:i,active:c,focusRingVisible:r,usesSubtext:l,leading:d,supporting:u,action:f,actionOpen:m=false,popupRole:p="listbox",tabIndex:h,onFocus:v,onKeyDown:b,onHover:y,onSelect:_})=>{const x=p==="grid";return e("div",{id:x?t:undefined,role:x?"row":undefined,"aria-selected":x?String(i):undefined,"aria-disabled":x&&n.isInactive?"true":undefined,class:{"select-option-row":true,"select-option-row--has-action":!!f,"select-option-row--action-open":m,"select-option-row--keyboard-active":!!f&&c&&r}},e("div",{id:x?undefined:t,class:{"select-option":true,"ds-choice-item":true,"ds-control-frame":true,[`ds-control--${a}`]:true,"ds-focus-ring-inset":true,"ds-focus-ring--visible":c&&r,"ds-interaction-fill":!n.isInactive,"ds-interaction-fill--selected":i&&!n.isInactive,"ds-control-inactive":!!n.isInactive,"select-option--active":c},role:x?"gridcell":"option",tabIndex:h,"aria-selected":x?undefined:String(i),"aria-disabled":!x&&n.isInactive?"true":undefined,onMouseDown:e=>e.preventDefault(),onFocus:v,onKeyDown:b,onMouseMove:()=>{if(!n.isInactive)y()},onClick:_},d,e("div",{class:"ds-choice-item__content ds-interaction-fill__content"},e("ds-text",{class:"ds-choice-item__label ds-control-label-box",as:"span",variant:s[a],color:i?"primary":"secondary"},n.label),u??(l?e("ds-text",{class:"ds-choice-item__subtext ds-control-label-box",as:"span",variant:o[a],color:"secondary"},n.subtext?.trim()||"—"):null))),f&&e("div",{class:"select-option-row__action ds-control-elevation ds-control-elevation--md ds-control-elevation--press-scale",role:x?"gridcell":undefined},f))};export{c as C,t as a,a as b,i as c,n as d};
2
- //# sourceMappingURL=p-xtGGIZmU.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["ChoiceListSection","size","heading","ariaLabel","className","children","h","class","trim","role","as","variant","CONTROL_SUPPORTING_TEXT_VARIANT","color","emphasis","ChoiceSearch","hasFocusBoundary","hasInteractionFill","value","placeholder","controls","activeDescendant","disabled","inputRef","clearLabel","onValueChange","onClear","onKeyDown","ref","element","type","width","icon","isInactive","hasBorder","ariaControls","ariaActiveDescendant","onDsChange","event","stopPropagation","detail","onDsClear","ChoiceFooter","summary","compactSummary","useCompactSummary","contentRef","summaryMeasureRef","clearRef","key","CONTROL_TEXT_VARIANT","onClick","ChoiceActionFooter","label","onAction","ChoiceOptionRow","id","option","selected","active","focusRingVisible","usesSubtext","leading","supporting","action","actionOpen","popupRole","tabIndex","onFocus","onHover","onSelect","grid","undefined","String","onMouseDown","preventDefault","onMouseMove","subtext"],"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\ninterface ChoiceListSectionProps {\n size?: ControlSize;\n heading?: string;\n ariaLabel: string;\n className?: string;\n}\n\n/** Shared listbox anatomy used when an owning surface composes choice lists directly. */\nexport const ChoiceListSection: FunctionalComponent<ChoiceListSectionProps> = (\n { size = 'md', heading, ariaLabel, className },\n children\n) => (\n <div\n class={`ds-choice-list ds-chrome-column ds-chrome-space--sm ${className ?? ''}`.trim()}\n role=\"listbox\"\n aria-label={ariaLabel}\n >\n {heading ? (\n <ds-text\n class={`ds-choice-section__header ds-control-section-heading ds-control--${size}`}\n as=\"div\"\n variant={CONTROL_SUPPORTING_TEXT_VARIANT[size]}\n color=\"primary\"\n emphasis\n aria-hidden=\"true\"\n >\n {heading}\n </ds-text>\n ) : null}\n {children}\n </div>\n);\n\ninterface ChoiceSearchProps {\n size?: ControlSize;\n hasFocusBoundary?: boolean;\n hasInteractionFill?: boolean;\n value: string;\n placeholder: string;\n ariaLabel?: string;\n controls?: string;\n activeDescendant?: string;\n disabled?: boolean;\n inputRef: (element: HTMLDsInputElement | 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 hasFocusBoundary = true,\n hasInteractionFill = true,\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 return (\n <div\n class={{\n 'select-search': true,\n 'select-search--without-focus-boundary': !hasFocusBoundary,\n }}\n >\n <ds-input\n class=\"select-search__control\"\n ref={element => inputRef((element as HTMLDsInputElement) ?? null)}\n type=\"search\"\n size={size}\n width=\"fill\"\n value={value}\n placeholder={placeholder}\n icon=\"MagnifyingGlass\"\n clearLabel={clearLabel}\n isInactive={disabled}\n hasBorder={false}\n hasInteractionFill={hasInteractionFill}\n ariaLabel={ariaLabel ?? placeholder}\n ariaControls={controls}\n ariaActiveDescendant={activeDescendant}\n onKeyDown={onKeyDown}\n onDsChange={(event: CustomEvent<string>) => {\n event.stopPropagation();\n onValueChange(event.detail);\n }}\n onDsClear={(event: CustomEvent<void>) => {\n event.stopPropagation();\n onClear?.();\n }}\n />\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 ??\n (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":"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","ignoreList":[]}