@pine-ds/core 4.8.0 → 4.9.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (555) hide show
  1. package/components/attributes.js +1 -1
  2. package/components/floating-ui.dom.js +1 -1
  3. package/components/index.js +1 -1
  4. package/components/index2.js +1 -1
  5. package/components/keep-hydrated.js +1 -0
  6. package/components/mock-pds-modal.js +1 -1
  7. package/components/pds-alert.js +1 -1
  8. package/components/pds-avatar.js +1 -1
  9. package/components/pds-box2.js +1 -1
  10. package/components/pds-button2.js +1 -1
  11. package/components/pds-checkbox2.js +1 -1
  12. package/components/pds-chip2.js +1 -1
  13. package/components/pds-combobox.js +1 -1
  14. package/components/pds-container.js +1 -1
  15. package/components/pds-copytext.js +1 -1
  16. package/components/pds-datepicker.js +1 -1
  17. package/components/pds-divider.js +1 -1
  18. package/components/pds-drawer-content.js +1 -1
  19. package/components/pds-drawer-footer.js +1 -1
  20. package/components/pds-drawer-header.js +1 -1
  21. package/components/pds-drawer.js +1 -1
  22. package/components/pds-dropdown-menu-item.js +1 -1
  23. package/components/pds-dropdown-menu-separator.js +1 -1
  24. package/components/pds-dropdown-menu.js +1 -1
  25. package/components/pds-filter.js +1 -1
  26. package/components/pds-filters.js +1 -1
  27. package/components/pds-icon2.js +1 -1
  28. package/components/pds-image.js +1 -1
  29. package/components/pds-input2.js +1 -1
  30. package/components/pds-link2.js +1 -1
  31. package/components/pds-loader2.js +1 -1
  32. package/components/pds-modal-content.js +1 -1
  33. package/components/pds-modal-footer.js +1 -1
  34. package/components/pds-modal-header.js +1 -1
  35. package/components/pds-modal2.js +1 -1
  36. package/components/pds-multiselect.js +1 -1
  37. package/components/pds-popover.js +1 -1
  38. package/components/pds-progress.js +1 -1
  39. package/components/pds-property.js +1 -1
  40. package/components/pds-radio-group.js +1 -1
  41. package/components/pds-radio.js +1 -1
  42. package/components/pds-row.js +1 -1
  43. package/components/pds-select.js +1 -1
  44. package/components/pds-sortable-item.js +1 -1
  45. package/components/pds-sortable.js +2 -2
  46. package/components/pds-switch.js +1 -1
  47. package/components/pds-table-body.js +1 -1
  48. package/components/pds-table-cell2.js +1 -1
  49. package/components/pds-table-head-cell2.js +1 -1
  50. package/components/pds-table-head.js +1 -1
  51. package/components/pds-table-row.js +1 -1
  52. package/components/pds-tabpanel.js +1 -1
  53. package/components/pds-tabs.js +1 -1
  54. package/components/pds-text2.js +1 -1
  55. package/components/pds-textarea.js +1 -1
  56. package/components/pds-toast.js +1 -1
  57. package/components/pds-tooltip.js +1 -1
  58. package/components/portal-target.js +1 -0
  59. package/components/tabbable.js +1 -0
  60. package/components/truncation-tooltip.js +1 -1
  61. package/dist/cjs/{attributes-BJ7KBHql.js → attributes-CW49XqaL.js} +1 -1
  62. package/dist/cjs/{floating-ui.dom-Dc8Anyel.js → floating-ui.dom-Dw41zbyY.js} +1 -0
  63. package/dist/cjs/{index-Do70atou.js → index-BDnbr0DK.js} +1 -1
  64. package/dist/cjs/{index-jl_Q819j.js → index-D9iJuJCP.js} +13 -1
  65. package/dist/cjs/index.cjs.js +1 -1
  66. package/dist/cjs/{keep-hydrated-CiXgkEYd.js → keep-hydrated-AKoh0DG4.js} +1 -0
  67. package/dist/cjs/loader.cjs.js +3 -3
  68. package/dist/cjs/mock-pds-modal.cjs.entry.js +4 -4
  69. package/dist/cjs/pds-accordion.cjs.entry.js +3 -3
  70. package/dist/cjs/pds-alert.cjs.entry.js +17 -4
  71. package/dist/cjs/pds-avatar.cjs.entry.js +22 -12
  72. package/dist/cjs/pds-box.cjs.entry.js +4 -4
  73. package/dist/cjs/pds-button.cjs.entry.js +58 -26
  74. package/dist/cjs/pds-checkbox.cjs.entry.js +16 -8
  75. package/dist/cjs/pds-chip.cjs.entry.js +9 -11
  76. package/dist/cjs/pds-combobox.cjs.entry.js +41 -11
  77. package/dist/cjs/pds-container.cjs.entry.js +3 -3
  78. package/dist/cjs/pds-copytext.cjs.entry.js +8 -7
  79. package/dist/cjs/pds-datepicker.cjs.entry.js +8 -45
  80. package/dist/cjs/pds-divider.cjs.entry.js +3 -3
  81. package/dist/cjs/pds-drawer-content.cjs.entry.js +3 -3
  82. package/dist/cjs/pds-drawer-footer.cjs.entry.js +3 -3
  83. package/dist/cjs/pds-drawer-header.cjs.entry.js +3 -3
  84. package/dist/cjs/pds-drawer.cjs.entry.js +4 -4
  85. package/dist/cjs/pds-dropdown-menu-item.cjs.entry.js +4 -4
  86. package/dist/cjs/pds-dropdown-menu-separator.cjs.entry.js +3 -3
  87. package/dist/cjs/pds-dropdown-menu.cjs.entry.js +5 -5
  88. package/dist/cjs/pds-filter.cjs.entry.js +4 -4
  89. package/dist/cjs/pds-filters.cjs.entry.js +3 -3
  90. package/dist/cjs/pds-icon.cjs.entry.js +55 -22
  91. package/dist/cjs/pds-image.cjs.entry.js +4 -4
  92. package/dist/cjs/pds-input.cjs.entry.js +6 -6
  93. package/dist/cjs/pds-link.cjs.entry.js +16 -7
  94. package/dist/cjs/pds-loader.cjs.entry.js +4 -4
  95. package/dist/cjs/pds-modal-content.cjs.entry.js +4 -4
  96. package/dist/cjs/pds-modal-footer.cjs.entry.js +3 -3
  97. package/dist/cjs/pds-modal-header.cjs.entry.js +3 -3
  98. package/dist/cjs/pds-modal.cjs.entry.js +9 -89
  99. package/dist/cjs/pds-multiselect.cjs.entry.js +13 -7
  100. package/dist/cjs/pds-popover.cjs.entry.js +230 -153
  101. package/dist/cjs/pds-progress.cjs.entry.js +4 -4
  102. package/dist/cjs/pds-property.cjs.entry.js +3 -3
  103. package/dist/cjs/pds-radio-group.cjs.entry.js +67 -6
  104. package/dist/cjs/pds-radio.cjs.entry.js +24 -11
  105. package/dist/cjs/pds-row.cjs.entry.js +4 -4
  106. package/dist/cjs/pds-select.cjs.entry.js +132 -21
  107. package/dist/cjs/pds-sortable-item.cjs.entry.js +5 -5
  108. package/dist/cjs/pds-sortable.cjs.entry.js +4 -4
  109. package/dist/cjs/pds-switch.cjs.entry.js +7 -7
  110. package/dist/cjs/pds-tab.cjs.entry.js +3 -3
  111. package/dist/cjs/pds-table-body.cjs.entry.js +3 -3
  112. package/dist/cjs/pds-table-cell.cjs.entry.js +7 -6
  113. package/dist/cjs/pds-table-head-cell.cjs.entry.js +5 -5
  114. package/dist/cjs/pds-table-head.cjs.entry.js +3 -3
  115. package/dist/cjs/pds-table-row.cjs.entry.js +3 -3
  116. package/dist/cjs/pds-table.cjs.entry.js +2 -2
  117. package/dist/cjs/pds-tabpanel.cjs.entry.js +4 -4
  118. package/dist/cjs/pds-tabs.cjs.entry.js +4 -4
  119. package/dist/cjs/pds-text.cjs.entry.js +31 -5
  120. package/dist/cjs/pds-textarea.cjs.entry.js +8 -8
  121. package/dist/cjs/pds-toast.cjs.entry.js +14 -8
  122. package/dist/cjs/pds-tooltip.cjs.entry.js +128 -46
  123. package/dist/cjs/pine-core.cjs.js +3 -3
  124. package/dist/cjs/portal-target-e8WQ6dLx.js +70 -0
  125. package/dist/cjs/tabbable-BrrrGvdG.js +86 -0
  126. package/dist/cjs/{truncation-tooltip-BtuiXLV0.js → truncation-tooltip-DdB78RIe.js} +44 -4
  127. package/dist/collection/components/pds-alert/pds-alert.css +13 -0
  128. package/dist/collection/components/pds-alert/pds-alert.js +36 -1
  129. package/dist/collection/components/pds-alert/stories/pds-alert.stories.js +4 -0
  130. package/dist/collection/components/pds-avatar/pds-avatar.js +41 -9
  131. package/dist/collection/components/pds-avatar/stories/pds-avatar.stories.js +2 -0
  132. package/dist/collection/components/pds-box/pds-box.js +1 -1
  133. package/dist/collection/components/pds-button/pds-button.js +13 -23
  134. package/dist/collection/components/pds-checkbox/pds-checkbox.css +79 -0
  135. package/dist/collection/components/pds-checkbox/pds-checkbox.js +36 -5
  136. package/dist/collection/components/pds-checkbox/stories/pds-checkbox.stories.js +38 -0
  137. package/dist/collection/components/pds-chip/pds-chip.js +2 -5
  138. package/dist/collection/components/pds-combobox/pds-combobox.css +33 -0
  139. package/dist/collection/components/pds-combobox/pds-combobox.js +60 -7
  140. package/dist/collection/components/pds-combobox/stories/pds-combobox.stories.js +44 -0
  141. package/dist/collection/components/pds-container/pds-container.js +1 -1
  142. package/dist/collection/components/pds-copytext/pds-copytext.js +1 -1
  143. package/dist/collection/components/pds-datepicker/calendar-portal.js +1 -38
  144. package/dist/collection/components/pds-datepicker/pds-datepicker.js +2 -2
  145. package/dist/collection/components/pds-divider/pds-divider.js +1 -1
  146. package/dist/collection/components/pds-drawer/pds-drawer-content/pds-drawer-content.js +1 -1
  147. package/dist/collection/components/pds-drawer/pds-drawer-footer/pds-drawer-footer.js +1 -1
  148. package/dist/collection/components/pds-drawer/pds-drawer-header/pds-drawer-header.js +1 -1
  149. package/dist/collection/components/pds-drawer/pds-drawer.js +2 -2
  150. package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-item/pds-dropdown-menu-item.js +24 -2
  151. package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-separator/pds-dropdown-menu-separator.js +1 -1
  152. package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu.js +1 -1
  153. package/dist/collection/components/pds-filters/pds-filter/pds-filter.js +1 -1
  154. package/dist/collection/components/pds-filters/pds-filters.js +1 -1
  155. package/dist/collection/components/pds-image/pds-image.js +2 -2
  156. package/dist/collection/components/pds-input/pds-input.js +2 -2
  157. package/dist/collection/components/pds-input/stories/pds-input.stories.js +6 -6
  158. package/dist/collection/components/pds-link/pds-link.css +1 -1
  159. package/dist/collection/components/pds-link/pds-link.js +34 -3
  160. package/dist/collection/components/pds-link/stories/pds-link.stories.js +51 -2
  161. package/dist/collection/components/pds-loader/pds-loader.js +1 -1
  162. package/dist/collection/components/pds-modal/pds-modal-content/pds-modal-content.js +2 -2
  163. package/dist/collection/components/pds-modal/pds-modal-footer/pds-modal-footer.js +1 -1
  164. package/dist/collection/components/pds-modal/pds-modal-header/pds-modal-header.js +1 -1
  165. package/dist/collection/components/pds-modal/pds-modal.css +1 -1
  166. package/dist/collection/components/pds-modal/pds-modal.js +4 -84
  167. package/dist/collection/components/pds-modal/test/mock-pds-modal.js +1 -1
  168. package/dist/collection/components/pds-multiselect/pds-multiselect.js +9 -3
  169. package/dist/collection/components/pds-popover/pds-popover.css +6 -0
  170. package/dist/collection/components/pds-popover/pds-popover.js +226 -149
  171. package/dist/collection/components/pds-progress/pds-progress.js +1 -1
  172. package/dist/collection/components/pds-property/pds-property.js +1 -1
  173. package/dist/collection/components/pds-radio/pds-radio.css +57 -0
  174. package/dist/collection/components/pds-radio/pds-radio.js +45 -9
  175. package/dist/collection/components/pds-radio/stories/pds-radio.stories.js +15 -0
  176. package/dist/collection/components/pds-radio-group/pds-radio-group.js +65 -4
  177. package/dist/collection/components/pds-radio-group/stories/pds-radio-group.stories.js +45 -0
  178. package/dist/collection/components/pds-row/pds-row.js +1 -1
  179. package/dist/collection/components/pds-select/pds-select.js +128 -17
  180. package/dist/collection/components/pds-select/stories/pds-select.stories.js +2 -2
  181. package/dist/collection/components/pds-sortable/pds-sortable-item/pds-sortable-item.js +1 -1
  182. package/dist/collection/components/pds-sortable/pds-sortable.js +1 -1
  183. package/dist/collection/components/pds-switch/pds-switch.js +3 -3
  184. package/dist/collection/components/pds-table/pds-table-body/pds-table-body.js +1 -1
  185. package/dist/collection/components/pds-table/pds-table-cell/pds-table-cell.js +2 -2
  186. package/dist/collection/components/pds-table/pds-table-head/pds-table-head.js +1 -1
  187. package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.js +2 -2
  188. package/dist/collection/components/pds-table/pds-table-row/pds-table-row.js +1 -1
  189. package/dist/collection/components/pds-table/stories/pds-table.stories.js +3 -3
  190. package/dist/collection/components/pds-tabs/pds-tabpanel/pds-tabpanel.js +1 -1
  191. package/dist/collection/components/pds-tabs/pds-tabs.js +1 -1
  192. package/dist/collection/components/pds-text/pds-text.js +28 -3
  193. package/dist/collection/components/pds-text/stories/pds-text.stories.js +16 -0
  194. package/dist/collection/components/pds-textarea/pds-textarea.js +4 -4
  195. package/dist/collection/components/pds-textarea/stories/pds-textarea.stories.js +2 -2
  196. package/dist/collection/components/pds-toast/pds-toast.css +13 -0
  197. package/dist/collection/components/pds-toast/pds-toast.js +33 -5
  198. package/dist/collection/components/pds-toast/stories/pds-toast.stories.js +4 -1
  199. package/dist/collection/components/pds-tooltip/pds-tooltip.css +11 -0
  200. package/dist/collection/components/pds-tooltip/pds-tooltip.js +125 -42
  201. package/dist/collection/components/pds-tooltip/stories/pds-tooltip.stories.js +30 -0
  202. package/dist/collection/utils/aria-references.js +42 -0
  203. package/dist/collection/utils/portal-target.js +64 -0
  204. package/dist/collection/utils/tabbable.js +82 -0
  205. package/dist/collection/utils/truncation-tooltip.js +42 -3
  206. package/dist/docs.json +245 -8
  207. package/dist/esm/{attributes-WXw_I_uJ.js → attributes-DkeVeN0g.js} +1 -1
  208. package/dist/esm/{floating-ui.dom-BPqJgIq6.js → floating-ui.dom-Cuc0DYlm.js} +1 -1
  209. package/dist/esm/{index-Cw9J31qd.js → index-4_RRPJTO.js} +13 -2
  210. package/dist/esm/{index-BWDu62Mo.js → index-DvN3tyZp.js} +2 -2
  211. package/dist/esm/index.js +1 -1
  212. package/dist/esm/{keep-hydrated-BLG6RDBt.js → keep-hydrated-BgNaWLoS.js} +1 -1
  213. package/dist/esm/loader.js +4 -4
  214. package/dist/esm/mock-pds-modal.entry.js +4 -4
  215. package/dist/esm/pds-accordion.entry.js +3 -3
  216. package/dist/esm/pds-alert.entry.js +17 -4
  217. package/dist/esm/pds-avatar.entry.js +22 -12
  218. package/dist/esm/pds-box.entry.js +4 -4
  219. package/dist/esm/pds-button.entry.js +58 -26
  220. package/dist/esm/pds-checkbox.entry.js +16 -8
  221. package/dist/esm/pds-chip.entry.js +8 -10
  222. package/dist/esm/pds-combobox.entry.js +41 -11
  223. package/dist/esm/pds-container.entry.js +3 -3
  224. package/dist/esm/pds-copytext.entry.js +8 -7
  225. package/dist/esm/pds-datepicker.entry.js +7 -44
  226. package/dist/esm/pds-divider.entry.js +3 -3
  227. package/dist/esm/pds-drawer-content.entry.js +3 -3
  228. package/dist/esm/pds-drawer-footer.entry.js +3 -3
  229. package/dist/esm/pds-drawer-header.entry.js +3 -3
  230. package/dist/esm/pds-drawer.entry.js +4 -4
  231. package/dist/esm/pds-dropdown-menu-item.entry.js +4 -4
  232. package/dist/esm/pds-dropdown-menu-separator.entry.js +3 -3
  233. package/dist/esm/pds-dropdown-menu.entry.js +5 -5
  234. package/dist/esm/pds-filter.entry.js +4 -4
  235. package/dist/esm/pds-filters.entry.js +3 -3
  236. package/dist/esm/pds-icon.entry.js +55 -22
  237. package/dist/esm/pds-image.entry.js +4 -4
  238. package/dist/esm/pds-input.entry.js +6 -6
  239. package/dist/esm/pds-link.entry.js +16 -7
  240. package/dist/esm/pds-loader.entry.js +4 -4
  241. package/dist/esm/pds-modal-content.entry.js +4 -4
  242. package/dist/esm/pds-modal-footer.entry.js +3 -3
  243. package/dist/esm/pds-modal-header.entry.js +3 -3
  244. package/dist/esm/pds-modal.entry.js +7 -87
  245. package/dist/esm/pds-multiselect.entry.js +13 -7
  246. package/dist/esm/pds-popover.entry.js +230 -153
  247. package/dist/esm/pds-progress.entry.js +4 -4
  248. package/dist/esm/pds-property.entry.js +3 -3
  249. package/dist/esm/pds-radio-group.entry.js +67 -6
  250. package/dist/esm/pds-radio.entry.js +24 -11
  251. package/dist/esm/pds-row.entry.js +4 -4
  252. package/dist/esm/pds-select.entry.js +132 -21
  253. package/dist/esm/pds-sortable-item.entry.js +5 -5
  254. package/dist/esm/pds-sortable.entry.js +4 -4
  255. package/dist/esm/pds-switch.entry.js +7 -7
  256. package/dist/esm/pds-tab.entry.js +3 -3
  257. package/dist/esm/pds-table-body.entry.js +3 -3
  258. package/dist/esm/pds-table-cell.entry.js +7 -6
  259. package/dist/esm/pds-table-head-cell.entry.js +5 -5
  260. package/dist/esm/pds-table-head.entry.js +3 -3
  261. package/dist/esm/pds-table-row.entry.js +3 -3
  262. package/dist/esm/pds-table.entry.js +2 -2
  263. package/dist/esm/pds-tabpanel.entry.js +4 -4
  264. package/dist/esm/pds-tabs.entry.js +4 -4
  265. package/dist/esm/pds-text.entry.js +31 -5
  266. package/dist/esm/pds-textarea.entry.js +8 -8
  267. package/dist/esm/pds-toast.entry.js +14 -8
  268. package/dist/esm/pds-tooltip.entry.js +128 -46
  269. package/dist/esm/pine-core.js +4 -4
  270. package/dist/esm/portal-target-CKRzRKdO.js +66 -0
  271. package/dist/esm/tabbable-C6ZWpp3v.js +84 -0
  272. package/dist/esm/{truncation-tooltip-FaW67DiY.js → truncation-tooltip-CRSdYzpA.js} +44 -5
  273. package/dist/esm-es5/{attributes-WXw_I_uJ.js → attributes-DkeVeN0g.js} +1 -1
  274. package/dist/esm-es5/{floating-ui.dom-BPqJgIq6.js → floating-ui.dom-Cuc0DYlm.js} +1 -1
  275. package/dist/esm-es5/{index-Cw9J31qd.js → index-4_RRPJTO.js} +2 -2
  276. package/dist/esm-es5/{index-BWDu62Mo.js → index-DvN3tyZp.js} +1 -1
  277. package/dist/esm-es5/index.js +1 -1
  278. package/dist/esm-es5/{keep-hydrated-BLG6RDBt.js → keep-hydrated-BgNaWLoS.js} +1 -1
  279. package/dist/esm-es5/loader.js +1 -1
  280. package/dist/esm-es5/mock-pds-modal.entry.js +1 -1
  281. package/dist/esm-es5/pds-accordion.entry.js +1 -1
  282. package/dist/esm-es5/pds-alert.entry.js +1 -1
  283. package/dist/esm-es5/pds-avatar.entry.js +1 -1
  284. package/dist/esm-es5/pds-box.entry.js +1 -1
  285. package/dist/esm-es5/pds-button.entry.js +1 -1
  286. package/dist/esm-es5/pds-checkbox.entry.js +1 -1
  287. package/dist/esm-es5/pds-chip.entry.js +1 -1
  288. package/dist/esm-es5/pds-combobox.entry.js +2 -2
  289. package/dist/esm-es5/pds-container.entry.js +1 -1
  290. package/dist/esm-es5/pds-copytext.entry.js +1 -1
  291. package/dist/esm-es5/pds-datepicker.entry.js +1 -1
  292. package/dist/esm-es5/pds-divider.entry.js +1 -1
  293. package/dist/esm-es5/pds-drawer-content.entry.js +1 -1
  294. package/dist/esm-es5/pds-drawer-footer.entry.js +1 -1
  295. package/dist/esm-es5/pds-drawer-header.entry.js +1 -1
  296. package/dist/esm-es5/pds-drawer.entry.js +1 -1
  297. package/dist/esm-es5/pds-dropdown-menu-item.entry.js +1 -1
  298. package/dist/esm-es5/pds-dropdown-menu-separator.entry.js +1 -1
  299. package/dist/esm-es5/pds-dropdown-menu.entry.js +1 -1
  300. package/dist/esm-es5/pds-filter.entry.js +1 -1
  301. package/dist/esm-es5/pds-filters.entry.js +1 -1
  302. package/dist/esm-es5/pds-icon.entry.js +1 -1
  303. package/dist/esm-es5/pds-image.entry.js +1 -1
  304. package/dist/esm-es5/pds-input.entry.js +1 -1
  305. package/dist/esm-es5/pds-link.entry.js +1 -1
  306. package/dist/esm-es5/pds-loader.entry.js +1 -1
  307. package/dist/esm-es5/pds-modal-content.entry.js +1 -1
  308. package/dist/esm-es5/pds-modal-footer.entry.js +1 -1
  309. package/dist/esm-es5/pds-modal-header.entry.js +1 -1
  310. package/dist/esm-es5/pds-modal.entry.js +1 -1
  311. package/dist/esm-es5/pds-multiselect.entry.js +1 -1
  312. package/dist/esm-es5/pds-popover.entry.js +1 -1
  313. package/dist/esm-es5/pds-progress.entry.js +1 -1
  314. package/dist/esm-es5/pds-property.entry.js +1 -1
  315. package/dist/esm-es5/pds-radio-group.entry.js +1 -1
  316. package/dist/esm-es5/pds-radio.entry.js +1 -1
  317. package/dist/esm-es5/pds-row.entry.js +1 -1
  318. package/dist/esm-es5/pds-select.entry.js +1 -1
  319. package/dist/esm-es5/pds-sortable-item.entry.js +1 -1
  320. package/dist/esm-es5/pds-sortable.entry.js +2 -2
  321. package/dist/esm-es5/pds-switch.entry.js +1 -1
  322. package/dist/esm-es5/pds-tab.entry.js +1 -1
  323. package/dist/esm-es5/pds-table-body.entry.js +1 -1
  324. package/dist/esm-es5/pds-table-cell.entry.js +1 -1
  325. package/dist/esm-es5/pds-table-head-cell.entry.js +1 -1
  326. package/dist/esm-es5/pds-table-head.entry.js +1 -1
  327. package/dist/esm-es5/pds-table-row.entry.js +1 -1
  328. package/dist/esm-es5/pds-table.entry.js +1 -1
  329. package/dist/esm-es5/pds-tabpanel.entry.js +1 -1
  330. package/dist/esm-es5/pds-tabs.entry.js +1 -1
  331. package/dist/esm-es5/pds-text.entry.js +1 -1
  332. package/dist/esm-es5/pds-textarea.entry.js +1 -1
  333. package/dist/esm-es5/pds-toast.entry.js +1 -1
  334. package/dist/esm-es5/pds-tooltip.entry.js +1 -1
  335. package/dist/esm-es5/pine-core.js +1 -1
  336. package/dist/esm-es5/portal-target-CKRzRKdO.js +1 -0
  337. package/dist/esm-es5/tabbable-C6ZWpp3v.js +1 -0
  338. package/dist/esm-es5/truncation-tooltip-CRSdYzpA.js +1 -0
  339. package/dist/pine-core/index.esm.js +1 -1
  340. package/dist/pine-core/{p-9880d251.system.entry.js → p-01f1cdaf.system.entry.js} +1 -1
  341. package/dist/pine-core/{p-138b278b.entry.js → p-07323107.entry.js} +1 -1
  342. package/dist/pine-core/p-08b8e941.entry.js +1 -0
  343. package/dist/pine-core/p-0d5f0ab5.system.entry.js +1 -0
  344. package/dist/pine-core/{p-8c8cc079.system.entry.js → p-1415c988.system.entry.js} +1 -1
  345. package/dist/pine-core/{p-9109b90a.entry.js → p-143b33a6.entry.js} +1 -1
  346. package/dist/pine-core/{p-b9d145f8.system.entry.js → p-14dedf01.system.entry.js} +1 -1
  347. package/dist/pine-core/{p-80e6f3a0.system.entry.js → p-19cf1d91.system.entry.js} +1 -1
  348. package/dist/pine-core/p-1ca8d183.entry.js +1 -0
  349. package/dist/pine-core/p-1cc39908.system.entry.js +1 -0
  350. package/dist/pine-core/p-1e3ef425.entry.js +1 -0
  351. package/dist/pine-core/{p-b914dde8.entry.js → p-1f62bb71.entry.js} +2 -2
  352. package/dist/pine-core/p-20079552.system.entry.js +1 -0
  353. package/dist/pine-core/p-2a18852f.entry.js +1 -0
  354. package/dist/pine-core/{p-ca4ee736.system.entry.js → p-2b9622c1.system.entry.js} +1 -1
  355. package/dist/pine-core/p-2dd30d12.entry.js +1 -0
  356. package/dist/pine-core/{p-cccfe60f.system.entry.js → p-3306dc5a.system.entry.js} +1 -1
  357. package/dist/pine-core/{p-BGLP3keB.js → p-35s7h-dk.js} +1 -1
  358. package/dist/pine-core/{p-8c588ca0.entry.js → p-3610cb3b.entry.js} +1 -1
  359. package/dist/pine-core/p-37718637.entry.js +1 -0
  360. package/dist/pine-core/p-383d84f4.entry.js +2 -0
  361. package/dist/pine-core/p-39276663.entry.js +1 -0
  362. package/dist/pine-core/{p-62433f32.entry.js → p-39e57657.entry.js} +1 -1
  363. package/dist/pine-core/p-3c229091.entry.js +1 -0
  364. package/dist/pine-core/p-3d34b967.system.entry.js +1 -0
  365. package/dist/pine-core/p-3e30a761.entry.js +1 -0
  366. package/dist/pine-core/{p-7a5b21d2.system.entry.js → p-3f8bd3fb.system.entry.js} +1 -1
  367. package/dist/pine-core/p-42d43c3f.system.entry.js +1 -0
  368. package/dist/pine-core/{p-f029b7da.system.entry.js → p-42f70f93.system.entry.js} +1 -1
  369. package/dist/pine-core/{p-d3d69ca4.system.entry.js → p-4a90b9c8.system.entry.js} +1 -1
  370. package/dist/pine-core/{p-ca0a8f5c.entry.js → p-4cfe922b.entry.js} +1 -1
  371. package/dist/pine-core/p-4d1a8803.entry.js +1 -0
  372. package/dist/pine-core/p-4d47023c.system.entry.js +1 -0
  373. package/dist/pine-core/p-4d98bc0c.system.entry.js +1 -0
  374. package/dist/pine-core/{p-c97bfac9.entry.js → p-50ddadbf.entry.js} +1 -1
  375. package/dist/pine-core/{p-0913f696.system.entry.js → p-548bce53.system.entry.js} +1 -1
  376. package/dist/pine-core/p-54f1e86f.system.entry.js +1 -0
  377. package/dist/pine-core/{p-631f5bcc.entry.js → p-590df41a.entry.js} +1 -1
  378. package/dist/pine-core/p-5946203c.entry.js +1 -0
  379. package/dist/pine-core/{p-11d98408.system.entry.js → p-5f181694.system.entry.js} +1 -1
  380. package/dist/pine-core/p-60a30975.system.entry.js +1 -0
  381. package/dist/pine-core/{p-9ab95438.entry.js → p-61cfdbb2.entry.js} +1 -1
  382. package/dist/pine-core/p-62aa6a78.system.entry.js +1 -0
  383. package/dist/pine-core/{p-ecc7a531.system.entry.js → p-63f85859.system.entry.js} +1 -1
  384. package/dist/pine-core/p-64bcb378.entry.js +1 -0
  385. package/dist/pine-core/{p-bdac8f2b.entry.js → p-67999353.entry.js} +1 -1
  386. package/dist/pine-core/{p-cb6a3e4c.system.entry.js → p-67f795d5.system.entry.js} +1 -1
  387. package/dist/pine-core/p-6a1aa8d3.entry.js +1 -0
  388. package/dist/pine-core/p-6f4ab1ea.system.entry.js +1 -0
  389. package/dist/pine-core/{p-acca5f7b.system.entry.js → p-724baba3.system.entry.js} +1 -1
  390. package/dist/pine-core/p-72659a0e.system.entry.js +1 -0
  391. package/dist/pine-core/{p-4bfc8b3e.system.entry.js → p-73efb1ed.system.entry.js} +1 -1
  392. package/dist/pine-core/p-7a51f15e.entry.js +1 -0
  393. package/dist/pine-core/p-7b978fff.system.entry.js +1 -0
  394. package/dist/pine-core/p-8436cbfb.entry.js +1 -0
  395. package/dist/pine-core/p-849ec281.system.entry.js +1 -0
  396. package/dist/pine-core/p-87a32ded.system.entry.js +1 -0
  397. package/dist/pine-core/p-89d38a82.system.entry.js +1 -0
  398. package/dist/pine-core/p-8ade17ce.entry.js +1 -0
  399. package/dist/pine-core/{p-4d03d1e2.system.entry.js → p-8afd5f5b.system.entry.js} +1 -1
  400. package/dist/pine-core/p-8e7f75e6.entry.js +1 -0
  401. package/dist/pine-core/{p-8f531063.entry.js → p-8fb520df.entry.js} +1 -1
  402. package/dist/pine-core/{p-9df5e204.entry.js → p-92115e88.entry.js} +1 -1
  403. package/dist/pine-core/p-93fd7dd8.system.entry.js +1 -0
  404. package/dist/pine-core/p-947582e1.entry.js +1 -0
  405. package/dist/pine-core/{p-2ac2457b.system.entry.js → p-94c9b7d1.system.entry.js} +1 -1
  406. package/dist/pine-core/p-973c3ac0.entry.js +1 -0
  407. package/dist/pine-core/p-97653e60.entry.js +1 -0
  408. package/dist/pine-core/{p-55224683.entry.js → p-97b73359.entry.js} +1 -1
  409. package/dist/pine-core/{p-b1548a20.entry.js → p-99530cb5.entry.js} +1 -1
  410. package/dist/pine-core/p-9a776443.entry.js +1 -0
  411. package/dist/pine-core/p-9b32727a.system.entry.js +1 -0
  412. package/dist/pine-core/{p-CGRdQc49.system.js → p-BK1sLRfg.system.js} +2 -2
  413. package/dist/pine-core/{p-COtCa1Md.system.js → p-BNTlHhoO.system.js} +1 -1
  414. package/dist/pine-core/p-BZ1l3LGl.system.js +1 -0
  415. package/dist/pine-core/p-BgNaWLoS.js +1 -0
  416. package/dist/pine-core/p-C6ZWpp3v.js +1 -0
  417. package/dist/pine-core/{p-Cy8cvR7I.system.js → p-CANeE7Ss.system.js} +1 -1
  418. package/dist/pine-core/p-CKRzRKdO.js +1 -0
  419. package/dist/pine-core/{p-XW4H0W6i.system.js → p-CNXspDYs.system.js} +1 -1
  420. package/dist/pine-core/{p-BPqJgIq6.js → p-Cuc0DYlm.js} +1 -1
  421. package/dist/pine-core/p-DQyF6v9Q.system.js +1 -0
  422. package/dist/pine-core/{p-BWDu62Mo.js → p-DvN3tyZp.js} +1 -1
  423. package/dist/pine-core/p-DwQ5Tjis.js +1 -0
  424. package/dist/pine-core/{p-CmSJytt1.js → p-M31tvpDN.js} +2 -2
  425. package/dist/pine-core/p-XK45dzWR.system.js +1 -0
  426. package/dist/pine-core/{p-1dc5a7e0.system.entry.js → p-a09c9c5e.system.entry.js} +1 -1
  427. package/dist/pine-core/p-a4ce12ef.entry.js +1 -0
  428. package/dist/pine-core/{p-57a2f927.entry.js → p-a594c41f.entry.js} +1 -1
  429. package/dist/pine-core/p-a9d96e22.entry.js +1 -0
  430. package/dist/pine-core/{p-047433a4.system.entry.js → p-ad5208a4.system.entry.js} +1 -1
  431. package/dist/pine-core/p-b3d4f97a.system.entry.js +3 -0
  432. package/dist/pine-core/{p-0b71ecb6.system.entry.js → p-bcc378ba.system.entry.js} +2 -2
  433. package/dist/pine-core/p-bd7dc317.system.entry.js +1 -0
  434. package/dist/pine-core/p-beb7a430.entry.js +1 -0
  435. package/dist/pine-core/p-bfa34194.entry.js +1 -0
  436. package/dist/pine-core/{p-5870b092.system.entry.js → p-c2afe4f3.system.entry.js} +1 -1
  437. package/dist/pine-core/p-c5e1eb3c.system.entry.js +1 -0
  438. package/dist/pine-core/p-c7a53c4f.entry.js +1 -0
  439. package/dist/pine-core/{p-5cfd4d41.system.entry.js → p-c8a0b562.system.entry.js} +1 -1
  440. package/dist/pine-core/{p-f1702281.entry.js → p-c9ae7964.entry.js} +1 -1
  441. package/dist/pine-core/{p-db17c626.system.entry.js → p-cb9baf78.system.entry.js} +1 -1
  442. package/dist/pine-core/{p-e5420660.entry.js → p-ce9fa14b.entry.js} +1 -1
  443. package/dist/pine-core/{p-332590c7.system.entry.js → p-d018dc60.system.entry.js} +1 -1
  444. package/dist/pine-core/p-d47b2a6a.system.entry.js +1 -0
  445. package/dist/pine-core/{p-b75b0d09.system.entry.js → p-d48fe5a0.system.entry.js} +1 -1
  446. package/dist/pine-core/p-d6f338e0.entry.js +1 -0
  447. package/dist/pine-core/{p-8191498f.system.entry.js → p-d920d759.system.entry.js} +1 -1
  448. package/dist/pine-core/{p-26642718.entry.js → p-d9719e37.entry.js} +1 -1
  449. package/dist/pine-core/{p-c483997a.entry.js → p-db7fb5a3.entry.js} +1 -1
  450. package/dist/pine-core/{p-9713fb36.entry.js → p-e1d1b5d8.entry.js} +1 -1
  451. package/dist/pine-core/p-e3de6a1d.entry.js +1 -0
  452. package/dist/pine-core/{p-d2c91e7a.entry.js → p-e7002cee.entry.js} +1 -1
  453. package/dist/pine-core/{p-86040cac.system.entry.js → p-e82f758f.system.entry.js} +1 -1
  454. package/dist/pine-core/p-e84fa9ed.entry.js +1 -0
  455. package/dist/pine-core/{p-ee0e30bf.system.entry.js → p-eb4f0daa.system.entry.js} +1 -1
  456. package/dist/pine-core/p-eeYeEogd.system.js +1 -0
  457. package/dist/pine-core/{p-0af0d752.system.entry.js → p-eecd9ad8.system.entry.js} +1 -1
  458. package/dist/pine-core/p-ef0eba9b.system.entry.js +1 -0
  459. package/dist/pine-core/p-ef3a855f.system.entry.js +1 -0
  460. package/dist/pine-core/{p-717323e4.entry.js → p-f018af99.entry.js} +1 -1
  461. package/dist/pine-core/{p-121612a7.system.entry.js → p-f11cce27.system.entry.js} +1 -1
  462. package/dist/pine-core/{p-4fd454f6.entry.js → p-f6f4fd42.entry.js} +1 -1
  463. package/dist/pine-core/{p-a939b471.entry.js → p-f71d71ca.entry.js} +1 -1
  464. package/dist/pine-core/p-f9063262.system.entry.js +1 -0
  465. package/dist/pine-core/p-f99bd77f.entry.js +1 -0
  466. package/dist/pine-core/{p-ClDiSG97.system.js → p-vFsJv75D.system.js} +1 -1
  467. package/dist/pine-core/p-wB2y8gR7.system.js +1 -0
  468. package/dist/pine-core/pine-core.esm.js +1 -1
  469. package/dist/pine-core/pine-core.js +1 -1
  470. package/dist/types/components/pds-alert/pds-alert.d.ts +10 -0
  471. package/dist/types/components/pds-avatar/pds-avatar.d.ts +8 -0
  472. package/dist/types/components/pds-button/pds-button.d.ts +2 -2
  473. package/dist/types/components/pds-checkbox/pds-checkbox.d.ts +7 -1
  474. package/dist/types/components/pds-combobox/pds-combobox.d.ts +9 -0
  475. package/dist/types/components/pds-datepicker/calendar-portal.d.ts +0 -7
  476. package/dist/types/components/pds-dropdown-menu/pds-dropdown-menu-item/pds-dropdown-menu-item.d.ts +7 -0
  477. package/dist/types/components/pds-link/pds-link.d.ts +8 -0
  478. package/dist/types/components/pds-popover/pds-popover.d.ts +44 -20
  479. package/dist/types/components/pds-radio/pds-radio.d.ts +9 -3
  480. package/dist/types/components/pds-radio-group/pds-radio-group.d.ts +8 -0
  481. package/dist/types/components/pds-select/pds-select.d.ts +32 -4
  482. package/dist/types/components/pds-text/pds-text.d.ts +4 -0
  483. package/dist/types/components/pds-toast/pds-toast.d.ts +9 -0
  484. package/dist/types/components/pds-tooltip/pds-tooltip.d.ts +32 -0
  485. package/dist/types/components.d.ts +98 -10
  486. package/dist/types/utils/aria-references.d.ts +24 -0
  487. package/dist/types/utils/portal-target.d.ts +17 -0
  488. package/dist/types/utils/tabbable.d.ts +2 -0
  489. package/dist/types/utils/truncation-tooltip.d.ts +5 -2
  490. package/dist/vscode.html-data.json +82 -10
  491. package/hydrate/index.js +971 -408
  492. package/hydrate/index.mjs +971 -408
  493. package/package.json +2 -2
  494. package/dist/esm-es5/truncation-tooltip-FaW67DiY.js +0 -1
  495. package/dist/pine-core/p-0092444c.system.entry.js +0 -1
  496. package/dist/pine-core/p-00a50de5.system.entry.js +0 -3
  497. package/dist/pine-core/p-049f126a.entry.js +0 -1
  498. package/dist/pine-core/p-089c3e60.entry.js +0 -1
  499. package/dist/pine-core/p-158b2f51.entry.js +0 -1
  500. package/dist/pine-core/p-17f97f1a.entry.js +0 -1
  501. package/dist/pine-core/p-19ba2788.system.entry.js +0 -1
  502. package/dist/pine-core/p-208c7dbf.entry.js +0 -1
  503. package/dist/pine-core/p-25ea48d1.entry.js +0 -1
  504. package/dist/pine-core/p-295f64ea.entry.js +0 -1
  505. package/dist/pine-core/p-29cd4113.system.entry.js +0 -1
  506. package/dist/pine-core/p-2cb5483a.system.entry.js +0 -1
  507. package/dist/pine-core/p-36cb4bf6.entry.js +0 -1
  508. package/dist/pine-core/p-3c977d8d.system.entry.js +0 -1
  509. package/dist/pine-core/p-3d51891a.entry.js +0 -1
  510. package/dist/pine-core/p-432d5ec7.entry.js +0 -1
  511. package/dist/pine-core/p-44f546ae.entry.js +0 -1
  512. package/dist/pine-core/p-5442d983.system.entry.js +0 -1
  513. package/dist/pine-core/p-5833a072.system.entry.js +0 -1
  514. package/dist/pine-core/p-602c197f.entry.js +0 -1
  515. package/dist/pine-core/p-719542e1.system.entry.js +0 -1
  516. package/dist/pine-core/p-73f931a1.entry.js +0 -1
  517. package/dist/pine-core/p-75ee0403.entry.js +0 -1
  518. package/dist/pine-core/p-77395d62.system.entry.js +0 -1
  519. package/dist/pine-core/p-7a287635.system.entry.js +0 -1
  520. package/dist/pine-core/p-875b0436.system.entry.js +0 -1
  521. package/dist/pine-core/p-884cb31d.system.entry.js +0 -1
  522. package/dist/pine-core/p-8987fd45.system.entry.js +0 -1
  523. package/dist/pine-core/p-8cc302aa.system.entry.js +0 -1
  524. package/dist/pine-core/p-8e3ff75d.entry.js +0 -1
  525. package/dist/pine-core/p-90d5edc6.entry.js +0 -1
  526. package/dist/pine-core/p-91f60173.entry.js +0 -1
  527. package/dist/pine-core/p-9265497e.system.entry.js +0 -1
  528. package/dist/pine-core/p-94593f20.system.entry.js +0 -1
  529. package/dist/pine-core/p-99459e27.entry.js +0 -1
  530. package/dist/pine-core/p-99fdf70f.entry.js +0 -1
  531. package/dist/pine-core/p-9aaedded.entry.js +0 -1
  532. package/dist/pine-core/p-9dcd2cdb.entry.js +0 -1
  533. package/dist/pine-core/p-BLG6RDBt.js +0 -1
  534. package/dist/pine-core/p-BR5nujVX.system.js +0 -1
  535. package/dist/pine-core/p-CuSNnuFu.system.js +0 -1
  536. package/dist/pine-core/p-D04W0cAO.system.js +0 -1
  537. package/dist/pine-core/p-a0960b3d.system.entry.js +0 -1
  538. package/dist/pine-core/p-a1230a74.system.entry.js +0 -1
  539. package/dist/pine-core/p-a826f290.entry.js +0 -1
  540. package/dist/pine-core/p-acce8eb2.entry.js +0 -1
  541. package/dist/pine-core/p-aff411d0.entry.js +0 -1
  542. package/dist/pine-core/p-b182f806.entry.js +0 -2
  543. package/dist/pine-core/p-bb68431a.entry.js +0 -1
  544. package/dist/pine-core/p-be9b6e63.system.entry.js +0 -1
  545. package/dist/pine-core/p-bf30dec0.entry.js +0 -1
  546. package/dist/pine-core/p-c4e12f0a.entry.js +0 -1
  547. package/dist/pine-core/p-e0917a26.entry.js +0 -1
  548. package/dist/pine-core/p-e836a041.entry.js +0 -1
  549. package/dist/pine-core/p-ea340c55.system.entry.js +0 -1
  550. package/dist/pine-core/p-ea4d4741.system.entry.js +0 -1
  551. package/dist/pine-core/p-ea8f5d29.entry.js +0 -1
  552. package/dist/pine-core/p-eaf85be6.system.entry.js +0 -1
  553. package/dist/pine-core/p-ef13f665.system.entry.js +0 -1
  554. package/dist/pine-core/p-f3067d90.system.entry.js +0 -1
  555. package/dist/pine-core/p-jrkGLEPe.js +0 -1
package/hydrate/index.mjs CHANGED
@@ -5646,7 +5646,7 @@ var setScopedSSR = (opts) => {
5646
5646
  var needsScopedSSR = () => scopedSSR;
5647
5647
  var scopedSSR = false;
5648
5648
 
5649
- const pdsModalCss$1 = () => `.pds-modal__backdrop{-ms-flex-align:start;align-items:flex-start;background-color:rgba(0, 0, 0, 0.4);border:0;display:-ms-flexbox;display:flex;height:100%;inset:0;-ms-flex-pack:center;justify-content:center;margin:0;max-height:100%;max-width:100%;opacity:0;padding:0;position:fixed;-webkit-transition:opacity var(--pine-motion-duration-base) var(--pine-motion-easing-in), visibility var(--pine-motion-duration-base) var(--pine-motion-easing-in);transition:opacity var(--pine-motion-duration-base) var(--pine-motion-easing-in), visibility var(--pine-motion-duration-base) var(--pine-motion-easing-in);visibility:hidden;width:100%;z-index:var(--pine-z-index-modal)}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}}pds-modal .pds-modal__backdrop{z-index:var(--pine-z-index-priority)}.pds-modal__backdrop::-webkit-backdrop{background:transparent}.pds-modal__backdrop::-ms-backdrop{background:transparent}.pds-modal__backdrop::backdrop{background:transparent}.pds-modal__backdrop[aria-modal=false]{overflow:auto;-ms-scroll-chaining:none;overscroll-behavior:contain}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop[aria-modal=false]{-webkit-backdrop-filter:none;backdrop-filter:none}.pds-modal__backdrop[aria-modal=false]::before{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);content:"";inset:0;position:fixed;z-index:-1}}.pds-modal__backdrop.open{opacity:1;-webkit-transition-timing-function:var(--pine-motion-easing-out);transition-timing-function:var(--pine-motion-easing-out);visibility:visible}.pds-modal{background:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-sm);-webkit-box-shadow:var(--pine-box-shadow-400);box-shadow:var(--pine-box-shadow-400);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:var(--pine-dimension-md);max-height:none;width:100%}.pds-modal.pds-modal--scrollable{max-height:calc(100vh - (5vh + 96px))}@supports (height: 100dvh){.pds-modal.pds-modal--scrollable{max-height:calc(100dvh - (5dvh + 96px))}}@media (min-width: 992px){.pds-modal{-webkit-margin-before:6vh;margin-block-start:6vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:6dvh;margin-block-start:6dvh}}}@media (min-width: 1200px){.pds-modal{-webkit-margin-before:8vh;margin-block-start:8vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:8dvh;margin-block-start:8dvh}}}.pds-modal--sm{max-width:520px}.pds-modal--md{max-width:700px}.pds-modal--lg{max-width:900px}.pds-modal--custom{max-width:var(--pds-modal-max-width, 700px)}.pds-modal--fullscreen{border-radius:0;height:100%;margin:0;max-height:100vh;max-width:100%}@supports (height: 100dvh){.pds-modal--fullscreen{max-height:100dvh}}.pds-modal--fullscreen.pds-modal--scrollable{max-height:100vh}@supports (height: 100dvh){.pds-modal--fullscreen.pds-modal--scrollable{max-height:100dvh}}.pds-modal--fullscreen .pds-modal-content{-ms-flex:1;flex:1}.pds-modal--scrollable pds-modal-content{-webkit-border-after:1px solid transparent;border-block-end:1px solid transparent;-webkit-border-before:1px solid transparent;border-block-start:1px solid transparent;overflow-y:auto}.pds-modal:not(.pds-modal--scrollable) pds-modal-content{overflow-y:visible}`;
5649
+ const pdsModalCss$1 = () => `.pds-modal__backdrop{-ms-flex-align:start;align-items:flex-start;background-color:rgba(0, 0, 0, 0.4);border:0;display:-ms-flexbox;display:flex;height:100%;inset:0;-ms-flex-pack:center;justify-content:center;margin:0;max-height:100%;max-width:100%;opacity:0;padding:0;position:fixed;-webkit-transition:opacity var(--pine-motion-duration-base) var(--pine-motion-easing-in), visibility var(--pine-motion-duration-base) var(--pine-motion-easing-in);transition:opacity var(--pine-motion-duration-base) var(--pine-motion-easing-in), visibility var(--pine-motion-duration-base) var(--pine-motion-easing-in);visibility:hidden;width:100%;z-index:var(--pine-z-index-modal)}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}}pds-modal pds-modal .pds-modal__backdrop{z-index:var(--pine-z-index-priority)}.pds-modal__backdrop::-webkit-backdrop{background:transparent}.pds-modal__backdrop::-ms-backdrop{background:transparent}.pds-modal__backdrop::backdrop{background:transparent}.pds-modal__backdrop[aria-modal=false]{overflow:auto;-ms-scroll-chaining:none;overscroll-behavior:contain}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop[aria-modal=false]{-webkit-backdrop-filter:none;backdrop-filter:none}.pds-modal__backdrop[aria-modal=false]::before{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);content:"";inset:0;position:fixed;z-index:-1}}.pds-modal__backdrop.open{opacity:1;-webkit-transition-timing-function:var(--pine-motion-easing-out);transition-timing-function:var(--pine-motion-easing-out);visibility:visible}.pds-modal{background:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-sm);-webkit-box-shadow:var(--pine-box-shadow-400);box-shadow:var(--pine-box-shadow-400);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:var(--pine-dimension-md);max-height:none;width:100%}.pds-modal.pds-modal--scrollable{max-height:calc(100vh - (5vh + 96px))}@supports (height: 100dvh){.pds-modal.pds-modal--scrollable{max-height:calc(100dvh - (5dvh + 96px))}}@media (min-width: 992px){.pds-modal{-webkit-margin-before:6vh;margin-block-start:6vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:6dvh;margin-block-start:6dvh}}}@media (min-width: 1200px){.pds-modal{-webkit-margin-before:8vh;margin-block-start:8vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:8dvh;margin-block-start:8dvh}}}.pds-modal--sm{max-width:520px}.pds-modal--md{max-width:700px}.pds-modal--lg{max-width:900px}.pds-modal--custom{max-width:var(--pds-modal-max-width, 700px)}.pds-modal--fullscreen{border-radius:0;height:100%;margin:0;max-height:100vh;max-width:100%}@supports (height: 100dvh){.pds-modal--fullscreen{max-height:100dvh}}.pds-modal--fullscreen.pds-modal--scrollable{max-height:100vh}@supports (height: 100dvh){.pds-modal--fullscreen.pds-modal--scrollable{max-height:100dvh}}.pds-modal--fullscreen .pds-modal-content{-ms-flex:1;flex:1}.pds-modal--scrollable pds-modal-content{-webkit-border-after:1px solid transparent;border-block-end:1px solid transparent;-webkit-border-before:1px solid transparent;border-block-start:1px solid transparent;overflow-y:auto}.pds-modal:not(.pds-modal--scrollable) pds-modal-content{overflow-y:visible}`;
5650
5650
 
5651
5651
  /**
5652
5652
  * Mock PdsModal component for testing purposes
@@ -5730,7 +5730,7 @@ class MockPdsModal {
5730
5730
  'pds-modal__backdrop': true,
5731
5731
  'open': this.open,
5732
5732
  };
5733
- return (hAsync("div", { key: '3a526f6883d7e7df35985a145962f656621535c1', class: backdropClasses }, hAsync("div", { key: '3af0487dc8c8831903cd7c22ffbf3e708b067ad7', class: modalClasses, role: "dialog", "aria-modal": "true", "aria-labelledby": this.componentId ? `${this.componentId}-heading` : null, part: "modal" }, hAsync("div", { key: '94e6205042ee91dac0823901cc97b79e93a515f2', class: "pds-modal__header" }, hAsync("slot", { key: 'ca04b575ccceabd431e3f5c57189f17f9aae6089', name: "header" })), hAsync("div", { key: 'f8327a261e70b622add1dd4ee21b5f8e8d91e603', class: "pds-modal-content" }, hAsync("slot", { key: 'a1a9c30d0f5479b0004ace4544e3d96ae87465be' })), hAsync("div", { key: 'af5fa59922047eeec7cbf0a0e1ee4b472b16079c', class: "pds-modal__footer" }, hAsync("slot", { key: '3c469bf94bb3a26dfd8046a5eda481f9d55edca1', name: "footer" })))));
5733
+ return (hAsync("div", { key: '6e165638f8f4699fa242f3045155c392f9f529b2', class: backdropClasses }, hAsync("div", { key: 'f4b8db3093a6fbe24be8035a826e8289815e4afb', class: modalClasses, role: "dialog", "aria-modal": "true", "aria-labelledby": this.componentId ? `${this.componentId}-heading` : null, part: "modal" }, hAsync("div", { key: 'fa846f66e539ea0d1b73820abb991fdb02902499', class: "pds-modal__header" }, hAsync("slot", { key: '0faaa6858fecd9d0c48c7f183d4f2101c1bed785', name: "header" })), hAsync("div", { key: 'a896fba9494fcdee9dde7e0d9f7baf708095ee6f', class: "pds-modal-content" }, hAsync("slot", { key: '4091e70b2a744c36c8249aa8664937d227145c14' })), hAsync("div", { key: 'cbf4bdd80cc3575d8c7e2e0e2078e28c4f185920', class: "pds-modal__footer" }, hAsync("slot", { key: '56ed3a26c36fd70d7ec9f033951d1b1d9e044957', name: "footer" })))));
5734
5734
  }
5735
5735
  get el() { return getElement(this); }
5736
5736
  static get style() { return pdsModalCss$1(); }
@@ -5752,7 +5752,7 @@ class MockPdsModal {
5752
5752
  }; }
5753
5753
  }
5754
5754
 
5755
- /* pds-icons v10.7.0, ES Modules */
5755
+ /* pds-icons v10.8.0, ES Modules */
5756
5756
 
5757
5757
  const addCircle = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' class='pdsicon'><path fill-rule='evenodd' d='M12 3a9 9 0 1 0 0 18 9 9 0 0 0 0-18M1 12C1 5.925 5.925 1 12 1s11 4.925 11 11-4.925 11-11 11S1 18.075 1 12m11-5a1 1 0 0 1 1 1v3h3a1 1 0 1 1 0 2h-3v3a1 1 0 1 1-2 0v-3H8a1 1 0 1 1 0-2h3V8a1 1 0 0 1 1-1'/></svg>";
5758
5758
  const calendarSimple = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' class='pdsicon'><path fill-rule='evenodd' d='M8 1a1 1 0 0 1 1 1v1h6V2a1 1 0 1 1 2 0v1.002c.476.003.891.013 1.252.042.562.046 1.079.145 1.564.392a4 4 0 0 1 1.748 1.748c.247.485.346 1.002.392 1.564C22 7.29 22 7.954 22 8.758v8.483c0 .805 0 1.47-.044 2.01-.046.563-.145 1.08-.392 1.565a4 4 0 0 1-1.748 1.748c-.485.247-1.002.346-1.564.392-.541.044-1.206.044-2.01.044H7.758c-.805 0-1.47 0-2.01-.044-.563-.046-1.08-.145-1.565-.392a4 4 0 0 1-1.748-1.748c-.247-.485-.346-1.002-.392-1.564C2 18.71 2 18.046 2 17.242V8.758c0-.805 0-1.47.044-2.01.046-.563.145-1.08.392-1.565a4 4 0 0 1 1.748-1.748c.485-.247 1.002-.346 1.564-.392.361-.03.777-.04 1.252-.042V2a1 1 0 0 1 1-1M7 5.002c-.446.003-.795.012-1.089.036-.438.035-.663.1-.819.18a2 2 0 0 0-.874.874c-.08.156-.145.38-.18.819C4 7.361 4 7.943 4 8.8V9h16v-.2c0-.857 0-1.439-.038-1.889-.035-.438-.1-.663-.18-.819a2 2 0 0 0-.874-.874c-.156-.08-.38-.145-.819-.18A15 15 0 0 0 17 5.002V6a1 1 0 1 1-2 0V5H9v1a1 1 0 1 1-2 0zM20 11H4v6.2c0 .857 0 1.439.038 1.889.035.438.1.663.18.819a2 2 0 0 0 .874.874c.156.08.38.145.819.18C6.361 21 6.943 21 7.8 21h8.4c.857 0 1.439 0 1.889-.038.438-.035.663-.1.819-.18a2 2 0 0 0 .874-.874c.08-.156.145-.38.18-.819.037-.45.038-1.032.038-1.889z'/></svg>";
@@ -5830,8 +5830,16 @@ class PdsAccordion {
5830
5830
 
5831
5831
  const pdsAlertTokensCss = () => `:host{--pine-alert-color-background:var(--pine-color-grey-150);--pine-alert-color-border:var(--pine-color-grey-300);--pine-alert-color-dismiss:var(--pine-color-grey-900);--pine-alert-color-dismiss-hover:var(--pine-color-grey-300);--pine-alert-color-icon:var(--pine-color-grey-700);--pine-alert-color-link:var(--pine-color-grey-900);--pine-alert-color-link-hover:var(--pine-color-grey-950);--pine-alert-color-text:var(--pine-color-grey-950);--pine-alert-color-danger-background:var(--pine-color-red-150);--pine-alert-color-danger-border:var(--pine-color-red-300);--pine-alert-color-danger-dismiss:var(--pine-color-red-900);--pine-alert-color-danger-dismiss-hover:var(--pine-color-red-300);--pine-alert-color-danger-icon:var(--pine-color-red-700);--pine-alert-color-danger-link:var(--pine-color-red-900);--pine-alert-color-danger-link-hover:var(--pine-color-red-950);--pine-alert-color-danger-text:var(--pine-color-red-950);--pine-alert-color-info-background:var(--pine-color-blue-150);--pine-alert-color-info-border:var(--pine-color-blue-300);--pine-alert-color-info-dismiss:var(--pine-color-blue-900);--pine-alert-color-info-dismiss-hover:var(--pine-color-blue-300);--pine-alert-color-info-icon:var(--pine-color-blue-700);--pine-alert-color-info-link:var(--pine-color-blue-900);--pine-alert-color-info-link-hover:var(--pine-color-blue-950);--pine-alert-color-info-text:var(--pine-color-blue-950);--pine-alert-color-success-background:var(--pine-color-green-150);--pine-alert-color-success-border:var(--pine-color-green-300);--pine-alert-color-success-dismiss:var(--pine-color-green-900);--pine-alert-color-success-dismiss-hover:var(--pine-color-green-300);--pine-alert-color-success-icon:var(--pine-color-green-700);--pine-alert-color-success-link:var(--pine-color-green-900);--pine-alert-color-success-link-hover:var(--pine-color-green-950);--pine-alert-color-success-text:var(--pine-color-green-950);--pine-alert-color-warning-background:var(--pine-color-yellow-150);--pine-alert-color-warning-border:var(--pine-color-yellow-300);--pine-alert-color-warning-dismiss:var(--pine-color-yellow-900);--pine-alert-color-warning-dismiss-hover:var(--pine-color-yellow-300);--pine-alert-color-warning-icon:var(--pine-color-yellow-700);--pine-alert-color-warning-link:var(--pine-color-yellow-900);--pine-alert-color-warning-link-hover:var(--pine-color-yellow-950);--pine-alert-color-warning-text:var(--pine-color-yellow-950)}:host-context([data-theme=dark]){--pine-alert-color-background:var(--pine-color-grey-800);--pine-alert-color-border:var(--pine-color-grey-600);--pine-alert-color-dismiss:var(--pine-color-grey-200);--pine-alert-color-dismiss-hover:var(--pine-color-grey-700);--pine-alert-color-icon:var(--pine-color-grey-300);--pine-alert-color-link:var(--pine-color-grey-300);--pine-alert-color-link-hover:var(--pine-color-grey-050);--pine-alert-color-text:var(--pine-color-grey-100);--pine-alert-color-danger-background:var(--pine-color-red-900);--pine-alert-color-danger-border:var(--pine-color-red-800);--pine-alert-color-danger-dismiss:var(--pine-color-red-200);--pine-alert-color-danger-dismiss-hover:var(--pine-color-red-800);--pine-alert-color-danger-icon:var(--pine-color-red-400);--pine-alert-color-danger-link:var(--pine-color-red-300);--pine-alert-color-danger-link-hover:var(--pine-color-red-200);--pine-alert-color-danger-text:var(--pine-color-red-100);--pine-alert-color-info-background:var(--pine-color-blue-900);--pine-alert-color-info-border:var(--pine-color-blue-800);--pine-alert-color-info-dismiss:var(--pine-color-blue-200);--pine-alert-color-info-dismiss-hover:var(--pine-color-blue-800);--pine-alert-color-info-icon:var(--pine-color-blue-400);--pine-alert-color-info-link:var(--pine-color-blue-300);--pine-alert-color-info-link-hover:var(--pine-color-blue-200);--pine-alert-color-info-text:var(--pine-color-blue-100);--pine-alert-color-success-background:var(--pine-color-green-900);--pine-alert-color-success-border:var(--pine-color-green-800);--pine-alert-color-success-dismiss:var(--pine-color-green-200);--pine-alert-color-success-dismiss-hover:var(--pine-color-green-800);--pine-alert-color-success-icon:var(--pine-color-green-400);--pine-alert-color-success-link:var(--pine-color-green-300);--pine-alert-color-success-link-hover:var(--pine-color-green-200);--pine-alert-color-success-text:var(--pine-color-green-100);--pine-alert-color-warning-background:var(--pine-color-yellow-900);--pine-alert-color-warning-border:var(--pine-color-yellow-800);--pine-alert-color-warning-dismiss:var(--pine-color-yellow-200);--pine-alert-color-warning-dismiss-hover:var(--pine-color-yellow-800);--pine-alert-color-warning-icon:var(--pine-color-yellow-400);--pine-alert-color-warning-link:var(--pine-color-yellow-300);--pine-alert-color-warning-link-hover:var(--pine-color-yellow-200);--pine-alert-color-warning-text:var(--pine-color-yellow-100)}`;
5832
5832
 
5833
- const pdsAlertCss = () => `:host{--pds-context-link-color:var(--pine-alert-color-link);--pds-context-link-color-hover:var(--pine-alert-color-link-hover);display:block;line-height:1;width:100%}:host([variant=danger]){--pds-context-link-color:var(--pine-alert-color-danger-link);--pds-context-link-color-hover:var(--pine-alert-color-danger-link-hover)}:host([variant=info]){--pds-context-link-color:var(--pine-alert-color-info-link);--pds-context-link-color-hover:var(--pine-alert-color-info-link-hover)}:host([variant=success]){--pds-context-link-color:var(--pine-alert-color-success-link);--pds-context-link-color-hover:var(--pine-alert-color-success-link-hover)}:host([variant=warning]){--pds-context-link-color:var(--pine-alert-color-warning-link);--pds-context-link-color-hover:var(--pine-alert-color-warning-link-hover)}.pds-alert__container{--pds-alert-icon-size:var(--pine-dimension-sm);--pds-alert-border-dismiss-outline:2px solid var(--pds-alert-color-dismiss);--pds-alert-background:var(--pine-alert-color-background);--pds-alert-border-color:var(--pine-alert-color-border);--pds-alert-color-icon:var(--pine-alert-color-icon);--pds-alert-color-text:var(--pine-alert-color-text);--pds-alert-color-dismiss:var(--pine-alert-color-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-dismiss-hover);padding:var(--pine-dimension-250)}.pds-alert__container--danger{--pds-alert-background:var(--pine-alert-color-danger-background);--pds-alert-border-color:var(--pine-alert-color-danger-border);--pds-alert-color-icon:var(--pine-alert-color-danger-icon);--pds-alert-color-text:var(--pine-alert-color-danger-text);--pds-alert-color-dismiss:var(--pine-alert-color-danger-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-danger-dismiss-hover)}.pds-alert__container--info{--pds-alert-background:var(--pine-alert-color-info-background);--pds-alert-border-color:var(--pine-alert-color-info-border);--pds-alert-color-icon:var(--pine-alert-color-info-icon);--pds-alert-color-text:var(--pine-alert-color-info-text);--pds-alert-color-dismiss:var(--pine-alert-color-info-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-info-dismiss-hover)}.pds-alert__container--success{--pds-alert-background:var(--pine-alert-color-success-background);--pds-alert-border-color:var(--pine-alert-color-success-border);--pds-alert-color-icon:var(--pine-alert-color-success-icon);--pds-alert-color-text:var(--pine-alert-color-success-text);--pds-alert-color-dismiss:var(--pine-alert-color-success-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-success-dismiss-hover)}.pds-alert__container--warning{--pds-alert-background:var(--pine-alert-color-warning-background);--pds-alert-border-color:var(--pine-alert-color-warning-border);--pds-alert-color-icon:var(--pine-alert-color-warning-icon);--pds-alert-color-text:var(--pine-alert-color-warning-text);--pds-alert-color-dismiss:var(--pine-alert-color-warning-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-warning-dismiss-hover)}.pds-alert__icon{-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-alert__icon--small{-webkit-margin-before:0;margin-block-start:0}.pds-alert__content-wrapper{-ms-flex:1;flex:1;min-width:0;overflow:hidden;width:100%}.pds-alert__dismiss{-ms-flex-align:center;align-items:center;background:none;border:0;border-radius:var(--pine-border-radius-full);cursor:pointer;display:-ms-flexbox;display:flex;height:var(--pine-dimension-250);-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-xs);width:var(--pine-dimension-250)}.pds-alert__dismiss:hover{background:var(--pds-alert-background-dismiss-hover);opacity:0.8}.pds-alert__dismiss:focus-visible{outline:var(--pds-alert-border-dismiss-outline)}.pds-alert__description--small{-ms-flex:1 1 auto;flex:1 1 auto;max-width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-alert__actions{-webkit-margin-before:var(--pine-dimension-sm);margin-block-start:var(--pine-dimension-sm)}.pds-alert__actions--small{-ms-flex-negative:0;flex-shrink:0;-webkit-margin-start:auto;margin-inline-start:auto;white-space:nowrap}`;
5833
+ const pdsAlertCss = () => `:host{--pds-context-link-color:var(--pine-alert-color-link);--pds-context-link-color-hover:var(--pine-alert-color-link-hover);display:block;line-height:1;width:100%}:host([variant=danger]){--pds-context-link-color:var(--pine-alert-color-danger-link);--pds-context-link-color-hover:var(--pine-alert-color-danger-link-hover)}:host([variant=info]){--pds-context-link-color:var(--pine-alert-color-info-link);--pds-context-link-color-hover:var(--pine-alert-color-info-link-hover)}:host([variant=success]){--pds-context-link-color:var(--pine-alert-color-success-link);--pds-context-link-color-hover:var(--pine-alert-color-success-link-hover)}:host([variant=warning]){--pds-context-link-color:var(--pine-alert-color-warning-link);--pds-context-link-color-hover:var(--pine-alert-color-warning-link-hover)}.pds-alert__container{--pds-alert-icon-size:var(--pine-dimension-sm);--pds-alert-border-dismiss-outline:2px solid var(--pds-alert-color-dismiss);--pds-alert-background:var(--pine-alert-color-background);--pds-alert-border-color:var(--pine-alert-color-border);--pds-alert-color-icon:var(--pine-alert-color-icon);--pds-alert-color-text:var(--pine-alert-color-text);--pds-alert-color-dismiss:var(--pine-alert-color-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-dismiss-hover);padding:var(--pine-dimension-250)}.pds-alert__container--danger{--pds-alert-background:var(--pine-alert-color-danger-background);--pds-alert-border-color:var(--pine-alert-color-danger-border);--pds-alert-color-icon:var(--pine-alert-color-danger-icon);--pds-alert-color-text:var(--pine-alert-color-danger-text);--pds-alert-color-dismiss:var(--pine-alert-color-danger-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-danger-dismiss-hover)}.pds-alert__container--info{--pds-alert-background:var(--pine-alert-color-info-background);--pds-alert-border-color:var(--pine-alert-color-info-border);--pds-alert-color-icon:var(--pine-alert-color-info-icon);--pds-alert-color-text:var(--pine-alert-color-info-text);--pds-alert-color-dismiss:var(--pine-alert-color-info-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-info-dismiss-hover)}.pds-alert__container--success{--pds-alert-background:var(--pine-alert-color-success-background);--pds-alert-border-color:var(--pine-alert-color-success-border);--pds-alert-color-icon:var(--pine-alert-color-success-icon);--pds-alert-color-text:var(--pine-alert-color-success-text);--pds-alert-color-dismiss:var(--pine-alert-color-success-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-success-dismiss-hover)}.pds-alert__container--warning{--pds-alert-background:var(--pine-alert-color-warning-background);--pds-alert-border-color:var(--pine-alert-color-warning-border);--pds-alert-color-icon:var(--pine-alert-color-warning-icon);--pds-alert-color-text:var(--pine-alert-color-warning-text);--pds-alert-color-dismiss:var(--pine-alert-color-warning-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-warning-dismiss-hover)}.pds-alert__icon{-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-alert__icon--small{-webkit-margin-before:0;margin-block-start:0}.pds-alert__content-wrapper{-ms-flex:1;flex:1;min-width:0;overflow:hidden;width:100%}.pds-alert__dismiss{-ms-flex-align:center;align-items:center;background:none;border:0;border-radius:var(--pine-border-radius-full);cursor:pointer;display:-ms-flexbox;display:flex;height:var(--pine-dimension-250);-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-xs);width:var(--pine-dimension-250)}.pds-alert__dismiss:hover{background:var(--pds-alert-background-dismiss-hover);opacity:0.8}.pds-alert__dismiss:focus-visible{outline:var(--pds-alert-border-dismiss-outline)}.pds-alert__description--small{-ms-flex:1 1 auto;flex:1 1 auto;max-width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-alert__actions{-webkit-margin-before:var(--pine-dimension-sm);margin-block-start:var(--pine-dimension-sm)}.pds-alert__actions--small{-ms-flex-negative:0;flex-shrink:0;-webkit-margin-start:auto;margin-inline-start:auto;white-space:nowrap}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}`;
5834
5834
 
5835
+ // What each variant announces when `severityLabel` isn't set. The `default`
5836
+ // variant has no severity.
5837
+ const SEVERITY_LABELS = {
5838
+ danger: 'Error',
5839
+ info: 'Info',
5840
+ success: 'Success',
5841
+ warning: 'Warning',
5842
+ };
5835
5843
  /**
5836
5844
  * @slot actions - Slot for alert actions.
5837
5845
  * @part dismiss
@@ -5885,7 +5893,12 @@ class PdsAlert {
5885
5893
  }
5886
5894
  return (hAsync("div", null, hAsync("pds-text", { class: "pds-alert__description", color: "var(--pds-alert-color-text)", tag: "p" }, hAsync("slot", null)), this.hasActionsContent && this.renderActions(false)));
5887
5895
  }
5896
+ severityText() {
5897
+ var _a;
5898
+ return (_a = this.severityLabel) !== null && _a !== void 0 ? _a : SEVERITY_LABELS[this.variant];
5899
+ }
5888
5900
  render() {
5901
+ const severity = this.severityText();
5889
5902
  const iconMap = {
5890
5903
  danger: 'warning-filled',
5891
5904
  default: 'info-circle-filled',
@@ -5895,7 +5908,7 @@ class PdsAlert {
5895
5908
  };
5896
5909
  // Get the icon name based on the current variant
5897
5910
  const iconName = iconMap[this.variant] || iconMap.default;
5898
- return (hAsync(Host, { key: 'b143df0c24c077e412894f5f77f1bd7c0ced1c92', class: "pds-alert", id: this.componentId, variant: this.variant }, hAsync("pds-box", { key: '928e3852507a1776069ee80906443ef650607ce7', class: `pds-alert__container pds-alert__container--${this.variant}`, "background-color": "var(--pds-alert-background)", "border-color": "var(--pds-alert-border-color)", "border-radius": "md", border: true, display: "block" }, hAsync("pds-box", { key: '778046ab1c651a57e910e45fe00944a74a3c32f7', gap: "sm", display: "flex", "align-items": this.small ? "center" : undefined }, !this.hideIcon && (hAsync("pds-icon", { key: '0199ef3e12a8dc9da20006fc8c4e133f83f4caf4', class: `pds-alert__icon ${this.small ? 'pds-alert__icon--small' : ''}`, color: "var(--pds-alert-color-icon)", icon: iconName, size: "var(--pds-alert-icon-size)" })), hAsync("pds-box", { key: 'b7b973c0c6154d72f90a585a116ea76ac48cc6e4', class: "pds-alert__content-wrapper", direction: "column", gap: "xs", flex: "grow" }, this.heading && !this.small && (hAsync("pds-text", { key: 'c969f9a7eabdc31bc2faca247033e89cc15caea0', class: "pds-alert__heading", color: "var(--pds-alert-color-text)", size: "h5", tag: "h3", weight: "medium" }, this.heading)), this.renderContent()), this.dismissible && (hAsync("button", { key: '168c21de5a0112a65b73a854add4393fea9ede6f', class: "pds-alert__dismiss", type: "button", part: "dismiss", "aria-label": this.dismissLabel, onClick: this.handleCloseClick }, hAsync("pds-icon", { key: 'f8e9311a4934c1b8458879cd6244a99e3a730be2', icon: "remove", size: "var(--pds-alert-icon-size)", "aria-hidden": "true", color: "var(--pds-alert-color-dismiss)" })))))));
5911
+ return (hAsync(Host, { key: 'd487419289ef352f63e7861fb21f42aa243ee526', class: "pds-alert", id: this.componentId, variant: this.variant }, hAsync("pds-box", { key: '0ecd6e25d4163d41055be53e88f6d332e56e1ed8', class: `pds-alert__container pds-alert__container--${this.variant}`, "background-color": "var(--pds-alert-background)", "border-color": "var(--pds-alert-border-color)", "border-radius": "md", border: true, display: "block" }, hAsync("pds-box", { key: '4cca87bd3b9758e9830eddec25c9fd3e8c06a44d', gap: "sm", display: "flex", "align-items": this.small ? "center" : undefined }, severity && hAsync("span", { key: 'b076475ed4a0bc2db09df84d6530db0e4e098daf', class: "visually-hidden" }, severity), !this.hideIcon && (hAsync("pds-icon", { key: 'e8efc683c4f84e22fac8729c0c476c817b33f3e6', class: `pds-alert__icon ${this.small ? 'pds-alert__icon--small' : ''}`, color: "var(--pds-alert-color-icon)", icon: iconName, size: "var(--pds-alert-icon-size)", "aria-hidden": "true" })), hAsync("pds-box", { key: 'f3ff29ce778f2e8bfb0d0a3e6a732714ce22e8ad', class: "pds-alert__content-wrapper", direction: "column", gap: "xs", flex: "grow" }, this.heading && !this.small && (hAsync("pds-text", { key: 'c00d44fe496e8aae699ac740428e6e523c0c8d0a', class: "pds-alert__heading", color: "var(--pds-alert-color-text)", size: "h5", tag: "h3", weight: "medium" }, this.heading)), this.renderContent()), this.dismissible && (hAsync("button", { key: 'd770590cecc3b27e1dd2750bbdfa07209dbb017d', class: "pds-alert__dismiss", type: "button", part: "dismiss", "aria-label": this.dismissLabel, onClick: this.handleCloseClick }, hAsync("pds-icon", { key: '9d79c27c829662dbeecb30dfad806f345eeb6c67', icon: "remove", size: "var(--pds-alert-icon-size)", "aria-hidden": "true", color: "var(--pds-alert-color-dismiss)" })))))));
5899
5912
  }
5900
5913
  get el() { return getElement(this); }
5901
5914
  static get style() { return pdsAlertTokensCss() + pdsAlertCss(); }
@@ -5910,6 +5923,7 @@ class PdsAlert {
5910
5923
  "hideIcon": [4, "hide-icon"],
5911
5924
  "variant": [1],
5912
5925
  "dismissLabel": [1, "dismiss-label"],
5926
+ "severityLabel": [1, "severity-label"],
5913
5927
  "hasActionsContent": [32]
5914
5928
  },
5915
5929
  "$listeners$": undefined,
@@ -5961,6 +5975,8 @@ function restoreReflectedDefault(el, attr, value, defaultValue) {
5961
5975
 
5962
5976
  const pdsAvatarCss = () => `:host{display:inline-block}div{--color-background-container:var(--pine-color-background-container-hover);-ms-flex-align:center;align-items:center;background-color:var(--color-background-container);border-radius:var(--border-radius-admin-round, var(--pine-border-radius-full));display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;position:relative}:host(.pds-avatar--admin) div{--border-radius-admin-round:var(--pine-dimension-150);border-radius:var(--border-radius-admin-round)}:host(.pds-avatar--has-image) div{background:transparent}@supports selector(:has){div:has(img){background-color:transparent}}.pds-avatar__button{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:var(--pine-dimension-none);border-radius:var(--pine-border-radius-full);cursor:pointer;display:-ms-flexbox;display:flex;padding:var(--pine-dimension-none)}.pds-avatar__button:focus-visible{outline:var(--pine-outline-focus)}.pds-avatar__badge{background-color:transparent;border:var(--pine-dimension-none);border-color:transparent;border-radius:var(--pine-border-radius-round);inset-block-end:var(--pine-dimension-none);inset-inline-end:var(--pine-dimension-none);position:absolute}:host([status=online]){--pds-avatar-status-color:var(--pine-color-green-500)}:host([status=away]){--pds-avatar-status-color:var(--pine-color-yellow-500)}:host([status=offline]){--pds-avatar-status-color:var(--pine-color-background-inset-emphasized)}.pds-avatar__status{background-color:var(--pds-avatar-status-color, var(--pine-color-background-inset-emphasized));block-size:28%;border-radius:var(--pine-border-radius-full);-webkit-box-shadow:0 0 0 var(--pine-border-width-thick) var(--pine-color-background-container);box-shadow:0 0 0 var(--pine-border-width-thick) var(--pine-color-background-container);inline-size:28%;inset-block-end:var(--pine-dimension-none);inset-inline-end:var(--pine-dimension-none);min-block-size:var(--pine-dimension-100);min-inline-size:var(--pine-dimension-100);position:absolute}:host(.pds-avatar--status-ring) div{-webkit-box-shadow:0 0 0 var(--pine-border-width-thick) var(--pds-avatar-status-color, var(--pine-color-background-inset-emphasized));box-shadow:0 0 0 var(--pine-border-width-thick) var(--pds-avatar-status-color, var(--pine-color-background-inset-emphasized))}img{border-radius:var(--border-radius-admin-round, var(--pine-border-radius-full));height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.pds-avatar__initials{color:var(--pine-color-brand);fill:var(--pine-color-brand);font-size:var(--pine-font-size-085);font-weight:var(--pine-font-weight-semi-bold);height:100%;text-align:center;width:100%}.pds-avatar__initials text{text-anchor:middle}`;
5963
5977
 
5978
+ // Used when `badgeLabel` is unset; an empty string hides the badge instead.
5979
+ const DEFAULT_BADGE_LABEL = 'Verified';
5964
5980
  /**
5965
5981
  * @part asset-wrapper
5966
5982
  * @part button
@@ -6040,14 +6056,22 @@ class PdsAvatar {
6040
6056
  :
6041
6057
  this.renderAssetWrapper());
6042
6058
  };
6043
- this.renderBadge = () => (
6044
- // `badge` and `status` share the bottom-end corner; `status` wins so the
6045
- // presence dot is never painted over the badge.
6046
- this.badge && !this.status
6047
- // Percentage is average size of icon in relation to total avatar size
6048
- // of all preset sizes found in Figma.
6049
- // Used to allow icons to scale to container size
6050
- && hAsync("pds-icon", { color: "var(--pine-color-purple-600)", class: "pds-avatar__badge", icon: checkCircleFilled, size: "33.53%" }));
6059
+ this.renderBadge = () => {
6060
+ var _a;
6061
+ // Inside the dropdown trigger the button's aria-label is the name, so the
6062
+ // badge is decorative there, as the status dot is. An empty label is
6063
+ // decorative too, rather than an image with no name.
6064
+ const badgeLabel = (_a = this.badgeLabel) !== null && _a !== void 0 ? _a : DEFAULT_BADGE_LABEL;
6065
+ const label = this.dropdown || badgeLabel === '' ? undefined : badgeLabel;
6066
+ return (
6067
+ // `badge` and `status` share the bottom-end corner; `status` wins so the
6068
+ // presence dot is never painted over the badge.
6069
+ this.badge && !this.status
6070
+ // Percentage is average size of icon in relation to total avatar size
6071
+ // of all preset sizes found in Figma.
6072
+ // Used to allow icons to scale to container size
6073
+ && hAsync("pds-icon", { color: "var(--pine-color-purple-600)", class: "pds-avatar__badge", icon: checkCircleFilled, size: "33.53%", "aria-label": label, "aria-hidden": label === undefined ? 'true' : undefined }));
6074
+ };
6051
6075
  this.renderStatus = () => {
6052
6076
  var _a;
6053
6077
  if (!this.status)
@@ -6102,7 +6126,7 @@ class PdsAvatar {
6102
6126
  }
6103
6127
  }
6104
6128
  render() {
6105
- return (hAsync(Host, { key: 'bd60a3273eaa4e2f5fa4d0f5d0d27babd7674e09', id: this.componentId, class: Object.assign({}, this.classNames()) }, this.renderAvatar()));
6129
+ return (hAsync(Host, { key: '0942c1fff94d0d8138143cbddf80aea1d09e34a9', id: this.componentId, class: Object.assign({}, this.classNames()) }, this.renderAvatar()));
6106
6130
  }
6107
6131
  get el() { return getElement(this); }
6108
6132
  static get watchers() { return {
@@ -6120,6 +6144,7 @@ class PdsAvatar {
6120
6144
  "$members$": {
6121
6145
  "alt": [1],
6122
6146
  "badge": [4],
6147
+ "badgeLabel": [1, "badge-label"],
6123
6148
  "componentId": [1, "component-id"],
6124
6149
  "dropdown": [4],
6125
6150
  "image": [1],
@@ -6582,7 +6607,7 @@ class PdsBox {
6582
6607
  const normalizedBorder = normalizeColorValue$1(this.borderColor);
6583
6608
  const boxInlineStyles = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (normalizedBackground && { '--color-background-box': normalizedBackground })), (normalizedBorder && { '--color-border-box': normalizedBorder })), (this.minHeight && { '--sizing-min-height-box': this.minHeight })), (this.minWidth && { '--sizing-min-width-box': this.minWidth })), (this.flex && !['none', 'grow', 'shrink'].includes(this.flex) && { 'flex': this.flex }));
6584
6609
  this.hostKeeper.record(boxClasses, boxInlineStyles);
6585
- return (hAsync(Host, { key: '8a1348247b5a4c546759232f0f155721798797e5', class: boxClasses, style: boxInlineStyles }));
6610
+ return (hAsync(Host, { key: 'c791a8d413b47629c619424bebf9d9c4acc4d9f3', class: boxClasses, style: boxInlineStyles }));
6586
6611
  }
6587
6612
  get el() { return getElement(this); }
6588
6613
  static get style() { return pdsBoxCss(); }
@@ -6719,6 +6744,49 @@ class PdsBox {
6719
6744
  }; }
6720
6745
  }
6721
6746
 
6747
+ /**
6748
+ * The ARIA attributes that take ID references, and the element-reflection property each is forwarded
6749
+ * through. An ID on a host can't reach an element inside its shadow root, so a component that
6750
+ * delegates focus forwards the elements the IDs point at instead. A browser without ARIA element
6751
+ * reflection gets none of them.
6752
+ */
6753
+ const ARIA_REFERENCE_PROPERTIES = {
6754
+ 'aria-controls': 'ariaControlsElements',
6755
+ 'aria-describedby': 'ariaDescribedByElements',
6756
+ 'aria-labelledby': 'ariaLabelledByElements',
6757
+ };
6758
+ const ARIA_REFERENCE_ATTRIBUTES = Object.keys(ARIA_REFERENCE_PROPERTIES);
6759
+ /**
6760
+ * Finds an element by ID in the host's tree, then in each shadow root that contains it, so a host
6761
+ * inside another component's shadow root still reaches, say, a popover portal on document.body.
6762
+ * The closest root wins when an ID repeats.
6763
+ */
6764
+ const findInAncestorRoots = (host, id) => {
6765
+ let root = host.getRootNode();
6766
+ while (root instanceof ShadowRoot) {
6767
+ const found = root.getElementById(id);
6768
+ if (found)
6769
+ return found;
6770
+ root = root.host.getRootNode();
6771
+ }
6772
+ return root instanceof Document ? root.getElementById(id) : null;
6773
+ };
6774
+ /**
6775
+ * Points the target's reflected ARIA properties at the elements the host's ID-reference attributes
6776
+ * name, or clears them. Run it again whenever the attributes or the referenced elements may have
6777
+ * changed: element references don't follow an ID to a node added or replaced later.
6778
+ */
6779
+ const forwardAriaReferences = (host, target) => {
6780
+ Object.entries(ARIA_REFERENCE_PROPERTIES).forEach(([attribute, property]) => {
6781
+ var _a, _b;
6782
+ if (!(property in target))
6783
+ return;
6784
+ const ids = (_b = (_a = host.getAttribute(attribute)) === null || _a === void 0 ? void 0 : _a.split(/\s+/).filter(Boolean)) !== null && _b !== void 0 ? _b : [];
6785
+ const referenced = ids.map((id) => findInAncestorRoots(host, id)).filter((el) => el !== null);
6786
+ target[property] = referenced.length > 0 ? referenced : null;
6787
+ });
6788
+ };
6789
+
6722
6790
  const pdsButtonCss = () => `:host{--pds-button-background:var(--pds-button-color-background-default);--pds-button-border:var(--pine-border);--pds-button-border-radius:var(--pine-border-radius-full);--pds-button-border-radius-start-end:var(--pine-border-radius-full);--pds-button-border-radius-start-start:var(--pine-border-radius-full);--pds-button-border-radius-end-end:var(--pine-border-radius-full);--pds-button-border-radius-end-start:var(--pine-border-radius-full);--pds-button-min-height:var(--pine-dimension-450);--pds-button-outline-offset:var(--pine-border-width);--pds-button-color-border-default:transparent;--pds-button-color-border-disabled:transparent;--pds-button-color-border-focus:transparent;--pds-button-color-border-hover:transparent;--button-loader-color:var(--pds-button-color-text-default);display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle}:host([full-width=true]){display:-ms-flexbox;display:flex;width:100%}:host([full-width=true]) a,:host([full-width=true]) button{-ms-flex-pack:center;justify-content:center;width:100%}:host([full-width=true]) .pds-button__content{-ms-flex-pack:center;justify-content:center;text-align:center}:host([loading=true]){cursor:wait;pointer-events:none}:host([aria-disabled=true]){pointer-events:none}.pds-button{--pds-loader-color:var(--pds-button-color-text-default);-ms-flex-align:center;align-items:center;background-color:var(--pds-button-background, var(--pds-button-color-background-default));border:var(--pds-button-border);border-color:var(--pds-button-color-border-default);border-radius:var(--pds-button-border-radius);border-end-end-radius:var(--pds-button-border-radius-end-end, var(--pds-button-border-radius));border-end-start-radius:var(--pds-button-border-radius-end-start, var(--pds-button-border-radius));border-start-end-radius:var(--pds-button-border-radius-start-end, var(--pds-button-border-radius));border-start-start-radius:var(--pds-button-border-radius-start-start, var(--pds-button-border-radius));-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pds-button-color-text-default);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-brand-label);letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-button-min-height);padding:calc(var(--pine-dimension-xs) - var(--pine-border-width)) var(--pine-dimension-sm);position:relative;text-decoration:none}.pds-button pds-icon{color:currentColor;fill:currentColor}.pds-button:hover{background-color:var(--pds-button-color-background-hover);border-color:var(--pds-button-color-border-hover)}.pds-button:focus-visible{border-color:var(--pds-button-color-border-focus);-webkit-box-shadow:var(--pds-button-box-shadow-focus, none);box-shadow:var(--pds-button-box-shadow-focus, none);outline:var(--pds-button-outline-focus, var(--pine-outline-focus));outline-offset:var(--pds-button-outline-offset)}.pds-button:disabled{background-color:var(--pds-button-color-background-disabled);border-color:var(--pds-button-color-border-disabled);color:var(--pds-button-color-text-disabled);pointer-events:none}.pds-button--primary{--pds-button-color-background-default:var(--pine-color-primary);--pds-button-color-background-hover:var(--pine-color-primary-hover);--pds-button-color-background-disabled:var(--pine-color-primary-disabled);--pds-button-color-border-default:var(--pine-color-primary);--pds-button-color-border-hover:var(--pine-color-primary-hover);--pds-button-color-text-default:var(--pine-color-text-primary);--pds-button-color-text-disabled:var(--pine-color-text-primary-disabled);--pds-button-color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-primary)}.pds-button--accent{--pds-button-color-background-default:var(--pine-color-accent);--pds-button-color-background-hover:var(--pine-color-accent-hover);--pds-button-color-background-disabled:var(--pine-color-accent-disabled);--pds-button-color-border-default:var(--pine-color-accent);--pds-button-color-border-hover:var(--pine-color-accent-hover);--pds-button-color-text-default:var(--pine-color-text-primary);--pds-button-color-text-disabled:var(--pine-color-text-accent-disabled);--pds-button-color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-primary)}.pds-button--destructive{--pds-button-color-background-default:var(--pine-color-danger);--pds-button-color-background-hover:var(--pine-color-danger-hover);--pds-button-color-background-disabled:var(--pine-color-danger-disabled);--pds-button-color-border-default:var(--pine-color-danger);--pds-button-color-border-hover:var(--pine-color-danger-hover);--pds-button-color-text-default:var(--pine-color-white);--pds-button-color-text-disabled:var(--pine-color-text-danger-disabled);--pds-button-color-outline:var(--pine-color-focus-ring-danger);--button-loader-color:var(--pine-color-text-primary)}.pds-button--destructive:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-button--secondary,.pds-button--disclosure{--pds-button-color-background-default:var(--pine-color-secondary);--pds-button-color-background-hover:var(--pine-color-secondary-hover);--pds-button-color-background-disabled:var(--pine-color-secondary-disabled);--pds-button-color-border-disabled:var(--pine-color-border-disabled);--pds-button-color-border-focus:var(--pine-color-border);--pds-button-color-border-hover:var(--pine-color-border-hover);--pds-button-color-border-default:var(--pine-color-border);--pds-button-color-text-default:var(--pine-color-text-secondary);--pds-button-color-text-disabled:var(--pine-color-text-secondary-disabled);--pds-button-color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-secondary)}.pds-button--secondary:hover,.pds-button--disclosure:hover{background-color:var(--pine-color-secondary-hover)}.pds-button--tertiary{--pds-button-color-background-default:transparent;--pds-button-color-background-hover:var(--pine-color-background-muted);--pds-button-color-background-disabled:transparent;--pds-button-color-border-default:transparent;--pds-button-color-border-hover:var(--pine-color-background-muted);--pds-button-color-border-disabled:transparent;--pds-button-color-text-default:var(--pine-color-text-secondary);--pds-button-color-text-disabled:var(--pine-color-text-secondary-disabled);--pds-button-color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-secondary)}.pds-button--filter{--pds-button-color-background-default:var(--pine-color-background-container);--pds-button-color-background-hover:var(--pine-color-background-subtle);--pds-button-color-background-disabled:var(--pine-color-white);--pds-button-color-border-default:transparent;--pds-button-color-border-hover:transparent;--pds-button-color-border-focus:transparent;--pds-button-color-text-default:var(--pine-color-text-secondary);--pds-button-color-text-hover:var(--pine-color-text-hover);--pds-button-color-text-disabled:var(--pine-color-text-disabled);--pds-button-color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-secondary);--pds-button-border-radius:var(--pine-dimension-125);--pds-button-border-radius-start-end:var(--pine-dimension-125);--pds-button-border-radius-start-start:var(--pine-dimension-125);--pds-button-border-radius-end-end:var(--pine-dimension-125);--pds-button-border-radius-end-start:var(--pine-dimension-125);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-button--filter:disabled{background-color:var(--pine-color-background-container)}.pds-button--filter:hover{color:var(--pds-button-color-text-hover)}.pds-button--unstyled{--pds-button-color-background-default:transparent;--pds-button-color-background-hover:transparent;--pds-button-color-background-disabled:transparent;--pds-button-color-text-default:var(--pine-color-text);--button-loader-color:var(--pine-color-text);border-width:var(--pine-dimension-none);margin:var(--pine-dimension-none);min-height:auto;padding:var(--pine-dimension-none);width:inherit}.pds-button__content{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;gap:var(--pine-dimension-xs);position:relative;width:100%}.pds-button__icon{display:-ms-inline-flexbox;display:inline-flex}.pds-button__icon--empty{display:none}.pds-button__text{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;white-space:nowrap}.pds-button__icon--hidden,.pds-button__text--hidden{opacity:0}.pds-button__loader{height:var(--pine-dimension-250);left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:var(--pine-dimension-250)}.pds-button--loading{cursor:wait;pointer-events:none}.pds-button--loading .pds-button__loader pds-loader{--loader-color:var(--button-loader-color)}.pds-button--small{min-height:var(--pine-dimension-400);padding:calc(var(--pine-dimension-2xs) - var(--pine-border-width)) var(--pine-dimension-sm)}.pds-button--micro{font-size:var(--pine-font-size-085);min-height:var(--pine-dimension-300);padding:var(--pine-dimension-025) var(--pine-dimension-xs)}.pds-button--icon-only{-ms-flex-align:center;align-items:center;border-radius:var(--pine-border-radius-full);height:var(--button-dimension);-ms-flex-pack:center;justify-content:center;min-height:var(--button-dimension);min-width:var(--button-dimension);padding:var(--pine-dimension-xs);width:var(--button-dimension)}.pds-button--icon-only .pds-button__content{height:100%;-ms-flex-pack:center;justify-content:center;width:100%}.pds-button--icon-only .pds-button__text--hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-button--icon-only.pds-button--small{height:var(--pine-dimension-400);min-height:var(--pine-dimension-400);min-width:var(--pine-dimension-400);padding:var(--pine-dimension-2xs);width:var(--pine-dimension-400)}.pds-button--icon-only.pds-button--micro{height:var(--pine-dimension-300);min-height:var(--pine-dimension-300);min-width:var(--pine-dimension-300);padding:var(--pine-dimension-3xs);width:var(--pine-dimension-300)}`;
6723
6791
 
6724
6792
  const FORWARDED_ARIA_ATTRIBUTES = ['aria-current', 'aria-expanded', 'aria-haspopup', 'aria-label', 'aria-pressed'];
@@ -6790,7 +6858,12 @@ class PdsButton {
6790
6858
  if (FORWARDED_ARIA_ATTRIBUTES.some((name) => forwarded[name] !== this.forwardedAria[name])) {
6791
6859
  this.forwardedAria = forwarded;
6792
6860
  }
6793
- this.forwardAriaControls();
6861
+ this.forwardAriaReferences();
6862
+ };
6863
+ // A hint added after the button, or replaced by a framework or a DOM morph, is picked up by the
6864
+ // time focus reaches the button and it's announced.
6865
+ this.handleFocusIn = () => {
6866
+ this.forwardAriaReferences();
6794
6867
  };
6795
6868
  this.handleStartSlotChange = (event) => {
6796
6869
  this.hasStartContent = event.target.assignedElements({ flatten: true }).length > 0;
@@ -6833,7 +6906,7 @@ class PdsButton {
6833
6906
  // Consumers, popovers and menus set these on the host, often after render, but only the inner element is announced.
6834
6907
  this.hostAriaObserver = new MutationObserver(this.syncHostAria);
6835
6908
  this.hostAriaObserver.observe(this.el, {
6836
- attributeFilter: FORWARDED_ARIA_ATTRIBUTES.concat('aria-controls'),
6909
+ attributeFilter: FORWARDED_ARIA_ATTRIBUTES.concat(ARIA_REFERENCE_ATTRIBUTES),
6837
6910
  });
6838
6911
  }
6839
6912
  disconnectedCallback() {
@@ -6842,7 +6915,7 @@ class PdsButton {
6842
6915
  this.hostAriaObserver = undefined;
6843
6916
  }
6844
6917
  componentDidRender() {
6845
- this.forwardAriaControls();
6918
+ this.forwardAriaReferences();
6846
6919
  }
6847
6920
  /**
6848
6921
  * Listen for Enter key presses on form inputs to trigger submit
@@ -6893,25 +6966,9 @@ class PdsButton {
6893
6966
  }
6894
6967
  }
6895
6968
  }
6896
- // ID references can't cross the shadow boundary, so aria-controls is forwarded as element references.
6897
- forwardAriaControls() {
6898
- var _a, _b;
6899
- if (!this.contentEl || !('ariaControlsElements' in this.contentEl))
6900
- return;
6901
- const ids = (_b = (_a = this.el.getAttribute('aria-controls')) === null || _a === void 0 ? void 0 : _a.split(/\s+/).filter(Boolean)) !== null && _b !== void 0 ? _b : [];
6902
- const controlled = ids.map((id) => this.findInAncestorRoots(id)).filter((el) => el !== null);
6903
- this.contentEl.ariaControlsElements = controlled.length > 0 ? controlled : null;
6904
- }
6905
- // A trigger inside another component's shadow root still controls a popover portal on document.body.
6906
- findInAncestorRoots(id) {
6907
- let root = this.el.getRootNode();
6908
- while (root instanceof ShadowRoot) {
6909
- const found = root.getElementById(id);
6910
- if (found)
6911
- return found;
6912
- root = root.host.getRootNode();
6913
- }
6914
- return root instanceof Document ? root.getElementById(id) : null;
6969
+ forwardAriaReferences() {
6970
+ if (this.contentEl)
6971
+ forwardAriaReferences(this.el, this.contentEl);
6915
6972
  }
6916
6973
  classNames() {
6917
6974
  const classNames = ['pds-button'];
@@ -6971,7 +7028,7 @@ class PdsButton {
6971
7028
  // Hide text when loading or iconOnly is true
6972
7029
  const hideText = this.loading || this.iconOnly;
6973
7030
  const content = (hAsync("div", { class: "pds-button__content", part: "button-content" }, this.renderStartContent(), hAsync("span", { class: `pds-button__text ${hideText ? 'pds-button__text--hidden' : ''}`, part: "button-text" }, hAsync("slot", null)), this.loading && (hAsync("span", { class: "pds-button__loader" }, hAsync("pds-loader", { "is-loading": true, size: "var(--pine-font-size-body-2xl)", variant: "spinner", exportparts: "loader-svg" }, "Loading..."))), this.renderEndContent()));
6974
- return (hAsync(Host, Object.assign({ "aria-disabled": this.disabled ? 'true' : null }, (this.componentId != null ? { id: this.componentId } : {}), { onClick: this.handleClick, variant: this.variant }), hAsync(ContentElement, Object.assign({}, attributes()), content)));
7031
+ return (hAsync(Host, Object.assign({ "aria-disabled": this.disabled ? 'true' : null }, (this.componentId != null ? { id: this.componentId } : {}), { onClick: this.handleClick, onFocusin: this.handleFocusIn, variant: this.variant }), hAsync(ContentElement, Object.assign({}, attributes()), content)));
6975
7032
  }
6976
7033
  static get delegatesFocus() { return true; }
6977
7034
  get el() { return getElement(this); }
@@ -7068,7 +7125,7 @@ const isSpecTest = () => {
7068
7125
 
7069
7126
  const labelCss$5 = () => `:host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}`;
7070
7127
 
7071
- const pdsCheckboxCss = () => `:host{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap}:host(.is-invalid) input{border-color:var(--pine-color-border-danger)}:host(.is-invalid) input:checked{background:var(--pine-color-danger)}:host(.is-invalid) input:checked::after{border-color:var(--pine-color-white)}:host(.is-invalid) input:checked:hover{background:var(--pine-color-danger-hover);border-color:var(--pine-color-border-danger-hover)}:host(.is-invalid) input:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host(.is-invalid) label,:host(.is-invalid) .pds-checkbox__message--error{color:var(--pine-color-text-message-danger)}:host(.is-indeterminate) input{background:var(--pine-color-accent);border-color:var(--pine-color-accent)}:host(.is-indeterminate) input:hover{background:var(--pine-color-accent);border-color:var(--pine-color-accent-hover)}:host(.is-indeterminate) input::after{border:1px solid var(--pine-color-text-primary);-webkit-border-after:var(--pine-border-width-none);border-block-end:var(--pine-border-width-none);-webkit-border-before:var(--pine-border-width-none);border-block-start:var(--pine-border-width-none);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);content:"";display:block;height:7px;inset-block-start:50%;inset-inline-start:50%;position:absolute;-webkit-transform:translate(-50%, -50%) rotate(90deg);transform:translate(-50%, -50%) rotate(90deg);width:4px}input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-2xs);-ms-flex:none;flex:none;height:var(--pine-dimension-sm);margin:0;-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025);position:relative;width:var(--pine-dimension-sm)}input:hover{background:var(--pine-color-background-container-hover);border:var(--pine-border-hover)}input:checked{background:var(--pine-color-accent);border-color:var(--pine-color-accent)}input:checked:hover{background:var(--pine-color-accent-hover);border-color:var(--pine-color-accent-hover)}input:checked::after{border:1px solid var(--pine-color-text-primary);-webkit-border-before:var(--pine-border-width-none);border-block-start:var(--pine-border-width-none);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);content:"";display:block;height:7px;inset-block-start:50%;inset-inline-start:50%;position:absolute;-webkit-transform:translate(-50%, -60%) rotate(43deg);transform:translate(-50%, -60%) rotate(43deg);width:4px}input:disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}input:disabled:checked{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled)}input:disabled:checked::after{border-color:var(--pine-color-border)}input:disabled+label{cursor:not-allowed}input:disabled~.pds-checkbox__message{color:var(--pine-color-text-disabled)}input:focus-visible{outline:var(--pine-outline-focus)}:host-context([dir=rtl]) input:checked::after{-webkit-transform:translate(-50%, -60%) rotate(-43deg);transform:translate(-50%, -60%) rotate(-43deg)}label{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs)}:host(.has-label-slot) label{-ms-flex-align:center;align-items:center}:host(.has-label-slot) label,:host(.has-label-slot) label>span{min-width:0}:host(.has-label-slot) input{-webkit-margin-before:0;margin-block-start:0}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-checkbox__message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-before:6px;margin-block-start:6px;-webkit-margin-start:var(--pine-dimension-md);margin-inline-start:var(--pine-dimension-md);width:100%}.pds-checkbox__message--error{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-checkbox__message--error pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}`;
7128
+ const pdsCheckboxCss = () => `:host{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap}:host(.is-invalid) input{border-color:var(--pine-color-border-danger)}:host(.is-invalid) input:checked{background:var(--pine-color-danger)}:host(.is-invalid) input:checked::after{border-color:var(--pine-color-white)}:host(.is-invalid) input:checked:hover{background:var(--pine-color-danger-hover);border-color:var(--pine-color-border-danger-hover)}:host(.is-invalid) input:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host(.is-invalid) label,:host(.is-invalid) .pds-checkbox__message--error{color:var(--pine-color-text-message-danger)}:host(.is-indeterminate) input{background:var(--pine-color-accent);border-color:var(--pine-color-accent)}:host(.is-indeterminate) input:hover{background:var(--pine-color-accent);border-color:var(--pine-color-accent-hover)}:host(.is-indeterminate) input::after{border:1px solid var(--pine-color-text-primary);-webkit-border-after:var(--pine-border-width-none);border-block-end:var(--pine-border-width-none);-webkit-border-before:var(--pine-border-width-none);border-block-start:var(--pine-border-width-none);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);content:"";display:block;height:7px;inset-block-start:50%;inset-inline-start:50%;position:absolute;-webkit-transform:translate(-50%, -50%) rotate(90deg);transform:translate(-50%, -50%) rotate(90deg);width:4px}input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-2xs);-ms-flex:none;flex:none;height:var(--pine-dimension-sm);margin:0;-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025);position:relative;width:var(--pine-dimension-sm)}input:hover{background:var(--pine-color-background-container-hover);border:var(--pine-border-hover)}input:checked{background:var(--pine-color-accent);border-color:var(--pine-color-accent)}input:checked:hover{background:var(--pine-color-accent-hover);border-color:var(--pine-color-accent-hover)}input:checked::after{border:1px solid var(--pine-color-text-primary);-webkit-border-before:var(--pine-border-width-none);border-block-start:var(--pine-border-width-none);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);content:"";display:block;height:7px;inset-block-start:50%;inset-inline-start:50%;position:absolute;-webkit-transform:translate(-50%, -60%) rotate(43deg);transform:translate(-50%, -60%) rotate(43deg);width:4px}input:disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}input:disabled:checked{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled)}input:disabled:checked::after{border-color:var(--pine-color-border)}input:disabled+label{cursor:not-allowed}input:disabled~.pds-checkbox__message{color:var(--pine-color-text-disabled)}input:focus-visible{outline:var(--pine-outline-focus)}:host-context([dir=rtl]) input:checked::after{-webkit-transform:translate(-50%, -60%) rotate(-43deg);transform:translate(-50%, -60%) rotate(-43deg)}label{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs)}:host(.has-label-slot) label{-ms-flex-align:center;align-items:center}:host(.has-label-slot) label,:host(.has-label-slot) label>span{min-width:0}:host(.has-label-slot) input{-webkit-margin-before:0;margin-block-start:0}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-checkbox__message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-before:6px;margin-block-start:6px;-webkit-margin-start:var(--pine-dimension-md);margin-inline-start:var(--pine-dimension-md);width:100%}.pds-checkbox__message--error{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-checkbox__message--error pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}:host(.pds-checkbox--pill){position:relative}:host(.pds-checkbox--pill) label{-ms-flex-align:center;align-items:center;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-border-radius-full);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pine-color-text-active);cursor:pointer;font:var(--pine-typography-body);min-block-size:var(--pine-dimension-xl);padding:0 var(--pine-dimension-sm);-webkit-transition:border-color var(--pine-motion-duration-fast) ease;transition:border-color var(--pine-motion-duration-fast) ease}:host(.pds-checkbox--pill) label span{min-width:0;overflow-wrap:anywhere}:host(.pds-checkbox--pill) label:hover{border-color:var(--pine-color-text)}:host(.pds-checkbox--pill) label:has(input:checked){border-color:var(--pine-color-text-active);-webkit-box-shadow:inset 0 0 0 var(--pine-border-width) var(--pine-color-text-active);box-shadow:inset 0 0 0 var(--pine-border-width) var(--pine-color-text-active)}:host(.pds-checkbox--pill) label:has(input:focus-visible){outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width-thick)}:host(.pds-checkbox--pill) label:has(input:disabled){background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}:host(.pds-checkbox--pill) label:has(input:disabled:checked){border-color:var(--pine-color-text-disabled);-webkit-box-shadow:inset 0 0 0 var(--pine-border-width) var(--pine-color-text-disabled);box-shadow:inset 0 0 0 var(--pine-border-width) var(--pine-color-text-disabled)}@media (forced-colors: active){:host(.pds-checkbox--pill) label:has(input:disabled){border-color:GrayText}:host(.pds-checkbox--pill) label:has(input:checked){border-color:Highlight;border-width:var(--pine-border-width-thick);padding-inline:calc(var(--pine-dimension-sm) - (var(--pine-border-width-thick) - var(--pine-border-width)))}:host(.pds-checkbox--pill) label:has(input:disabled:checked){border-color:GrayText;border-width:var(--pine-border-width-thick);padding-inline:calc(var(--pine-dimension-sm) - (var(--pine-border-width-thick) - var(--pine-border-width)))}}:host(.pds-checkbox--pill) .pds-checkbox__message{-webkit-margin-start:0;margin-inline-start:0}:host(.pds-checkbox--pill.is-invalid:not(.is-disabled)) label{border-color:var(--pine-color-border-danger);color:var(--pine-color-text-active)}:host(.pds-checkbox--pill.is-invalid:not(.is-disabled)) label:has(input:checked){border-color:var(--pine-color-border-danger);-webkit-box-shadow:inset 0 0 0 var(--pine-border-width) var(--pine-color-border-danger);box-shadow:inset 0 0 0 var(--pine-border-width) var(--pine-color-border-danger)}:host(.pds-checkbox--pill.is-invalid:not(.is-disabled)) label:has(input:focus-visible){outline:var(--pine-outline-focus-danger)}@media (forced-colors: active){:host(.pds-checkbox--pill.is-invalid:not(.is-disabled)) label:has(input:checked){border-color:Highlight;border-width:var(--pine-border-width-thick);padding-inline:calc(var(--pine-dimension-sm) - (var(--pine-border-width-thick) - var(--pine-border-width)))}}`;
7072
7129
 
7073
7130
  /**
7074
7131
  * @slot label - Content displayed as the checkbox label in place of the `label` text. Clicking it toggles the checkbox.
@@ -7086,6 +7143,11 @@ class PdsCheckbox {
7086
7143
  * It determines whether or not the checkbox is checked.
7087
7144
  */
7088
7145
  this.checked = false;
7146
+ /**
7147
+ * Sets the style variant of the checkbox. `pill` renders the label as a pill-shaped choice; the native input still handles keyboard, form, and screen reader behavior.
7148
+ * @defaultValue default
7149
+ */
7150
+ this.variant = 'default';
7089
7151
  this.handleCheckboxChange = (e) => {
7090
7152
  if (this.disabled) {
7091
7153
  return;
@@ -7125,6 +7187,9 @@ class PdsCheckbox {
7125
7187
  if (this.hasLabelSlot) {
7126
7188
  classNames.push('has-label-slot');
7127
7189
  }
7190
+ if (this.variant === 'pill') {
7191
+ classNames.push('pds-checkbox--pill');
7192
+ }
7128
7193
  return classNames.join(' ');
7129
7194
  }
7130
7195
  connectedCallback() {
@@ -7187,9 +7252,9 @@ class PdsCheckbox {
7187
7252
  render() {
7188
7253
  const hostClass = this.classNames();
7189
7254
  this.hostKeeper.record(hostClass);
7190
- return (hAsync(Host, { key: 'bbe09a5e9eb55f62b2921b09a04ddc9476a871ae', class: hostClass }, hAsync("label", { key: 'fa1856d9306eb8c0c19618ea5e2619ea20c3c51d', htmlFor: this.componentId }, hAsync("input", Object.assign({ key: '8537d97a8e69a17d0d563306dac179e393885dda', type: "checkbox", "aria-describedby": assignDescription(this.componentId, this.invalid, this.helperMessage, this.errorMessage), "aria-invalid": this.invalid ? "true" : undefined, id: this.componentId, indeterminate: this.indeterminate, name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, onChange: this.handleCheckboxChange, onInput: this.handleInput }, this.inheritedAttributes)), hAsync("span", { key: 'e523922889c80a2d18243cb560cd855bab95803d', class: this.hideLabel ? 'visually-hidden' : '' }, hAsync("slot", { key: 'b6ff34ecbc346d254a0211bfa610823feedb486b', name: "label", onSlotchange: this.updateHasLabelSlot }), !this.hasLabelSlot && this.label)), this.helperMessage &&
7191
- hAsync("div", { key: '55dcca850dff0aa93d9ba63d6827d9155ac35dab', class: 'pds-checkbox__message', id: messageId(this.componentId, 'helper') }, this.helperMessage), this.errorMessage &&
7192
- hAsync("div", { key: '5af843679994d29f084d41e90e41e0939c951063', class: `pds-checkbox__message pds-checkbox__message--error`, id: messageId(this.componentId, 'error'), "aria-live": "assertive" }, hAsync("pds-icon", { key: '88a46a17abc1c7b3b3e90543ce8dcf38a14c878c', "aria-hidden": "true", icon: danger, size: "small" }), this.errorMessage)));
7255
+ return (hAsync(Host, { key: '8e9185653796f250ad425350b9adc1f65fd047c1', class: hostClass }, hAsync("label", { key: 'e17bab4b96b4ffc716e311ecea488a3025e1551c', htmlFor: this.componentId }, hAsync("input", Object.assign({ key: '8af9bbc3dbe18409532e95b4b490eab4aabc8762', type: "checkbox", "aria-describedby": assignDescription(this.componentId, this.invalid, this.helperMessage, this.errorMessage), "aria-invalid": this.invalid ? "true" : undefined, id: this.componentId, indeterminate: this.indeterminate, name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, onChange: this.handleCheckboxChange, onInput: this.handleInput, class: this.variant === 'pill' ? 'visually-hidden' : undefined }, this.inheritedAttributes)), hAsync("span", { key: '1e4d9a826b6b5ec429ae47096d4aede3af43d110', class: this.hideLabel && this.variant !== 'pill' ? 'visually-hidden' : '' }, hAsync("slot", { key: '7b10c7d1e018be4afe019cb56e82a5ec7a638de8', name: "label", onSlotchange: this.updateHasLabelSlot }), !this.hasLabelSlot && this.label)), this.helperMessage &&
7256
+ hAsync("div", { key: 'c5455322eb07bf73805a17c28bf6acc1b5384337', class: 'pds-checkbox__message', id: messageId(this.componentId, 'helper') }, this.helperMessage), this.errorMessage &&
7257
+ hAsync("div", { key: '0f7c8ec00362c31b1c5bd11c185c6e7bfc177f22', class: `pds-checkbox__message pds-checkbox__message--error`, id: messageId(this.componentId, 'error'), "aria-live": "assertive" }, hAsync("pds-icon", { key: 'f6eccfaac90505903aee379f2fc28b5735d8c4a9', "aria-hidden": "true", icon: danger, size: "small" }), this.errorMessage)));
7193
7258
  }
7194
7259
  static get formAssociated() { return true; }
7195
7260
  get el() { return getElement(this); }
@@ -7217,6 +7282,7 @@ class PdsCheckbox {
7217
7282
  "name": [1],
7218
7283
  "required": [4],
7219
7284
  "value": [1],
7285
+ "variant": [1],
7220
7286
  "hasLabelSlot": [32]
7221
7287
  },
7222
7288
  "$listeners$": undefined,
@@ -8930,6 +8996,74 @@ const computePosition = (reference, floating, options) => {
8930
8996
  });
8931
8997
  };
8932
8998
 
8999
+ /**
9000
+ * The native `<dialog>` or open `popover` (as pds-filter's) an element sits in, so a popup portaled
9001
+ * there shares its top layer and a click in it isn't outside it; otherwise `document.body`.
9002
+ * `closest()` stops at shadow boundaries and misses one that only wraps slotted content, so this
9003
+ * walks assigned slots and shadow hosts, as pds-combobox does. `isHost` picks which ancestor counts.
9004
+ */
9005
+ function findPortalTarget(from, isHost = isOpenDialogOrPopover) {
9006
+ const seen = new Set();
9007
+ let current = from;
9008
+ while (current && !seen.has(current)) {
9009
+ seen.add(current);
9010
+ if (current.nodeType === Node.ELEMENT_NODE && isHost(current)) {
9011
+ return current;
9012
+ }
9013
+ const assigned = current.nodeType === Node.ELEMENT_NODE ? current.assignedSlot : null;
9014
+ if (assigned) {
9015
+ current = assigned;
9016
+ continue;
9017
+ }
9018
+ const parent = current.parentNode;
9019
+ current = parent instanceof ShadowRoot ? parent.host : parent;
9020
+ }
9021
+ return document.body;
9022
+ }
9023
+ /**
9024
+ * A modal dialog or open popover, which paints in the top layer above anything in the body, that
9025
+ * sits in the document itself: the document's stylesheets don't reach into a shadow root.
9026
+ */
9027
+ function isTopLayerInDocument(el) {
9028
+ if (el.getRootNode() !== el.ownerDocument)
9029
+ return false;
9030
+ return matchesSafely(el, ':modal') || matchesSafely(el, ':popover-open');
9031
+ }
9032
+ /**
9033
+ * Calls `onClose` once `host` leaves the top layer (its dialog closes or its popover hides), and
9034
+ * returns a function that stops listening.
9035
+ */
9036
+ function onTopLayerClose(host, onClose) {
9037
+ const check = () => {
9038
+ if (!isTopLayerInDocument(host))
9039
+ onClose();
9040
+ };
9041
+ host.addEventListener('close', check);
9042
+ host.addEventListener('toggle', check);
9043
+ return () => {
9044
+ host.removeEventListener('close', check);
9045
+ host.removeEventListener('toggle', check);
9046
+ };
9047
+ }
9048
+ function isOpenDialogOrPopover(el) {
9049
+ // Only an open dialog: inside a closed one, the popup would be hidden with it.
9050
+ if (el.localName === 'dialog')
9051
+ return el.open;
9052
+ return el.hasAttribute('popover') && matchesSafely(el, ':popover-open');
9053
+ }
9054
+ function matchesSafely(el, selector) {
9055
+ try {
9056
+ return el.matches(selector);
9057
+ }
9058
+ catch (_a) {
9059
+ // A browser without the selector (no Popover API, or no :modal): no top layer to share.
9060
+ return false;
9061
+ }
9062
+ }
9063
+
9064
+ // Controls that clipped text can sit inside that already take focus, so the text adds no tab stop of its own.
9065
+ // Not any `[tabindex]`: a focusable scroll region full of chips would show every chip's tooltip at once.
9066
+ const FOCUSABLE_WRAPPER = 'a[href], button, summary, pds-button, pds-link, pds-tab, pds-dropdown-menu-item, [role="option"]';
8933
9067
  /** CSS class prefix used for truncation tooltip portal elements */
8934
9068
  const TOOLTIP_CLASS = 'pds-truncation-tooltip';
8935
9069
  /**
@@ -8939,7 +9073,8 @@ const TOOLTIP_CLASS = 'pds-truncation-tooltip';
8939
9073
  *
8940
9074
  * Z-Index Strategy:
8941
9075
  * Uses --pine-z-index-nuclear (9999) to ensure tooltips appear above all other UI elements.
8942
- * This is necessary because tooltips are portaled to document.body and must overlay:
9076
+ * This is necessary because tooltips are portaled to document.body, or into the modal dialog or
9077
+ * open popover around the host (the top layer, which no z-index reaches from the body), and must overlay:
8943
9078
  * - Modal dialogs
8944
9079
  * - Dropdown menus
8945
9080
  * - Other floating UI elements
@@ -8979,6 +9114,15 @@ function injectStyles() {
8979
9114
  opacity: 1;
8980
9115
  visibility: visible;
8981
9116
  }
9117
+ :is(dialog, [popover]) > .${TOOLTIP_CLASS} {
9118
+ font-style: normal;
9119
+ font-weight: normal;
9120
+ text-align: start;
9121
+ text-indent: 0;
9122
+ text-transform: none;
9123
+ white-space: normal;
9124
+ word-spacing: normal;
9125
+ }
8982
9126
  `;
8983
9127
  document.head.appendChild(style);
8984
9128
  }
@@ -9005,7 +9149,8 @@ function isFocusVisible(el) {
9005
9149
  *
9006
9150
  * When the element's text overflows, hovering the host element or giving it
9007
9151
  * keyboard focus will display a tooltip showing the full text content. The
9008
- * tooltip is rendered as a portal on document.body and positioned with Floating UI.
9152
+ * tooltip is rendered as a portal on document.body, or in the modal dialog or open popover around
9153
+ * the host, and positioned with Floating UI.
9009
9154
  *
9010
9155
  * Also owns the element's `tabindex` while it is clipped — see syncTabIndex.
9011
9156
  *
@@ -9015,6 +9160,7 @@ function setupTruncationTooltip(options) {
9015
9160
  const { hostEl, contentEl, getTooltipText, placement = 'top', reference = hostEl, manageTabIndex = true, focusEl = hostEl } = options;
9016
9161
  injectStyles();
9017
9162
  let portalEl = null;
9163
+ let stopWatchingPortalHost = null;
9018
9164
  let isHovering = false;
9019
9165
  let isHoveringPortal = false;
9020
9166
  let isFocused = false;
@@ -9093,7 +9239,11 @@ function setupTruncationTooltip(options) {
9093
9239
  contentDiv.className = `${TOOLTIP_CLASS}__content`;
9094
9240
  contentDiv.textContent = text.trim();
9095
9241
  portalEl.appendChild(contentDiv);
9096
- document.body.appendChild(portalEl);
9242
+ const portalHost = findPortalTarget(hostEl, isTopLayerInDocument);
9243
+ portalHost.appendChild(portalEl);
9244
+ // Closing that host moves no pointer, so a tooltip opened by touch would outlive it unseen.
9245
+ if (portalHost !== document.body)
9246
+ stopWatchingPortalHost = onTopLayerClose(portalHost, closeWithPortalHost);
9097
9247
  // Allow the user to hover into the tooltip to select/copy text
9098
9248
  portalEl.addEventListener('mouseenter', handlePortalMouseEnter);
9099
9249
  portalEl.addEventListener('mouseleave', handlePortalMouseLeave);
@@ -9132,6 +9282,10 @@ function setupTruncationTooltip(options) {
9132
9282
  }
9133
9283
  }
9134
9284
  function removePortal() {
9285
+ if (stopWatchingPortalHost !== null) {
9286
+ stopWatchingPortalHost();
9287
+ stopWatchingPortalHost = null;
9288
+ }
9135
9289
  if (portalEl) {
9136
9290
  portalEl.removeEventListener('mouseenter', handlePortalMouseEnter);
9137
9291
  portalEl.removeEventListener('mouseleave', handlePortalMouseLeave);
@@ -9165,6 +9319,14 @@ function setupTruncationTooltip(options) {
9165
9319
  return;
9166
9320
  removePortal();
9167
9321
  }
9322
+ // Hover and focus can't outlast a host that's no longer shown, so none of them keeps it open.
9323
+ function closeWithPortalHost() {
9324
+ isHovering = false;
9325
+ isHoveringPortal = false;
9326
+ isFocused = false;
9327
+ cancelHideTimeout();
9328
+ removePortal();
9329
+ }
9168
9330
  /**
9169
9331
  * Schedules tooltip removal after a short delay.
9170
9332
  *
@@ -9196,11 +9358,18 @@ function setupTruncationTooltip(options) {
9196
9358
  isHoveringPortal = false;
9197
9359
  scheduleHide();
9198
9360
  }
9361
+ // A second tab stop inside focusEl, such as another clipped text, bubbles its focus here too. Its event.target is
9362
+ // retargeted to the stop's outermost element in focusEl's tree, which sits beside hostEl rather than around or in it.
9363
+ function isFocusForHost(target) {
9364
+ return focusEl === hostEl || target === focusEl || target.contains(hostEl) || hostEl.contains(target);
9365
+ }
9199
9366
  // Keyboard focus only: focus from a click would pin the tooltip open after the pointer leaves.
9200
9367
  // Events from inside a shadow root arrive retargeted to its host, so test the innermost target.
9201
9368
  function showForVisibleFocus(event) {
9202
9369
  if (!isFocusVisible(event.composedPath()[0]))
9203
9370
  return;
9371
+ if (!isFocusForHost(event.target))
9372
+ return;
9204
9373
  isFocused = true;
9205
9374
  showTooltip();
9206
9375
  }
@@ -9260,9 +9429,6 @@ const SENTIMENT_DOT_COLORS = {
9260
9429
  success: 'var(--pine-chip-color-success-dot)',
9261
9430
  warning: 'var(--pine-chip-color-warning-dot)',
9262
9431
  };
9263
- // Controls a chip can sit inside that already take focus, so a clipped label adds no tab stop of its own.
9264
- // Not any `[tabindex]`: a focusable scroll region full of chips would show every chip's tooltip at once.
9265
- const FOCUSABLE_WRAPPER = 'a[href], button, summary, pds-button, pds-link, pds-tab, pds-dropdown-menu-item, [role="option"]';
9266
9432
  // Beside the listbox and level with the option, so the tooltip never covers the other options.
9267
9433
  function besideListbox(wrapper) {
9268
9434
  const option = (wrapper === null || wrapper === void 0 ? void 0 : wrapper.matches('[role="option"]')) ? wrapper : null;
@@ -9489,7 +9655,7 @@ class PdsChip {
9489
9655
  const hostClass = this.classNames();
9490
9656
  const hostStyles = this.hostStyles;
9491
9657
  this.hostKeeper.record(hostClass, hostStyles);
9492
- return (hAsync(Host, { key: 'fa432fa987afb5b856e5e7d3894a88be043805d2', class: hostClass, id: this.componentId, style: hostStyles }, this.setChipContent(), this.effectiveVariant === 'tag' && this.renderCloseButton()));
9658
+ return (hAsync(Host, { key: 'b5afded680c3fa09523a7928d13c2a566a8a504c', class: hostClass, id: this.componentId, style: hostStyles }, this.setChipContent(), this.effectiveVariant === 'tag' && this.renderCloseButton()));
9493
9659
  }
9494
9660
  get el() { return getElement(this); }
9495
9661
  static get style() { return pdsChipTokensCss() + pdsChipCss(); }
@@ -11199,7 +11365,7 @@ class FlyoutController {
11199
11365
  }
11200
11366
  }
11201
11367
 
11202
- const pdsComboboxCss = () => `:host{display:block}:host([aria-disabled=true]) .pds-combobox__input-icon{color:var(--pine-color-text-disabled);pointer-events:none}.pds-combobox{position:relative}.pds-combobox__label{color:var(--pine-color-text-label);display:block;font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-combobox__input-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;position:relative;width:100%}.pds-combobox__input{background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-125);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pine-color-text-strong);-ms-flex:1;flex:1;font:var(--pine-typography-body-medium);padding:var(--pine-dimension-xs) var(--pine-dimension-450) var(--pine-dimension-xs) var(--pine-dimension-150);-webkit-transition:border-color var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease;width:100%}.pds-combobox__input:hover:not(:disabled){border-color:var(--pine-color-border-hover)}.pds-combobox__input:disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-combobox__input:disabled::-webkit-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-combobox__input:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-combobox__input:disabled:-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-combobox__input:disabled::-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-combobox__input:disabled::placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-combobox__input:focus-visible{border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-combobox__input::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__input::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__input:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__input::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__input::placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__input.pds-combobox__input--invalid{background:var(--pine-color-red-050);border-color:var(--pine-color-border-danger)}:host-context([data-theme=dark]) .pds-combobox__input.pds-combobox__input--invalid{background:var(--pine-color-red-950)}.pds-combobox__input.pds-combobox__input--invalid:hover:not(:disabled){border-color:var(--pine-color-border-danger)}.pds-combobox__input.pds-combobox__input--invalid:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-combobox__input-icon{color:var(--pine-color-text-secondary);inset-inline-end:var(--pine-dimension-150);pointer-events:none;position:absolute;z-index:calc(var(--pine-z-index-raised) - 1)}.pds-combobox__helper{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-combobox__error{-ms-flex-align:start;align-items:flex-start;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-sm-medium);gap:var(--pine-dimension-2xs);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-combobox__error pds-icon{-ms-flex-negative:0;flex-shrink:0;-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.pds-combobox__listbox{background:var(--pine-color-background-overlay);border:0;border-radius:var(--pine-dimension-125);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);list-style:none;margin:0;min-width:220px;overflow-y:auto;padding:var(--pine-dimension-xs);position:absolute;z-index:var(--pine-z-index-raised)}.pds-combobox__option{-ms-flex-align:center;align-items:center;background:transparent;border-radius:var(--pine-dimension-125);color:var(--pine-color-text-secondary);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-medium);-ms-flex-pack:justify;justify-content:space-between;padding:var(--pine-dimension-xs) var(--pine-dimension-sm);position:relative;-webkit-transition:background 0.15s;transition:background 0.15s}.pds-combobox__option[aria-selected=true]{background:var(--pine-color-background-muted)}.pds-combobox__option:focus-visible{outline:0}.pds-combobox__option.pds-combobox__option--layout .pds-combobox__option-layout-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;width:100%}.pds-combobox__option.pds-combobox__option--chip .pds-combobox__option-chip{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;width:100%}.pds-combobox__option:last-child{-webkit-margin-after:0;margin-block-end:0}.pds-combobox__option--highlighted,.pds-combobox__option[selected],.pds-combobox__option--selected{background:var(--pine-color-background-muted)}.pds-combobox__option--disabled,.pds-combobox__group-row--disabled>.pds-combobox__group-row-trigger,.pds-combobox__group-back--disabled>.pds-combobox__group-back-trigger,.pds-combobox__group--disabled>.pds-combobox__group-label{color:var(--pine-color-text-disabled)}.pds-combobox__option--disabled{cursor:not-allowed}.pds-combobox__option--disabled .pds-combobox__option-chip,.pds-combobox__option--disabled .pds-combobox__option-layout-wrapper{opacity:0.5}.pds-combobox__option-label{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);min-width:0;overflow-wrap:anywhere}.pds-combobox__option-icon{-ms-flex-negative:0;flex-shrink:0}.pds-combobox__option-check{color:currentColor;font-size:var(--pine-dimension-150);-webkit-margin-start:var(--pine-dimension-150);margin-inline-start:var(--pine-dimension-150)}.pds-combobox__group-label{color:var(--pine-color-text-tertiary);cursor:default;font:var(--pine-typography-heading-caption);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs);-webkit-margin-before:var(--pine-dimension-150);margin-block-start:var(--pine-dimension-150);padding:var(--pine-dimension-2xs) var(--pine-dimension-sm);text-transform:uppercase}.pds-combobox__group-label:first-child{-webkit-margin-before:0;margin-block-start:0}.pds-combobox__group{list-style:none;-webkit-margin-before:var(--pine-dimension-150);margin-block-start:var(--pine-dimension-150)}.pds-combobox__group:first-child{-webkit-margin-before:0;margin-block-start:0}.pds-combobox__group-list{list-style:none;margin:0;padding:0}.pds-combobox__listbox--grouped .pds-combobox__group-list{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-2xs)}.pds-combobox__group-label--with-icon{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs)}.pds-combobox__group-icon{-ms-flex-negative:0;flex-shrink:0}.pds-combobox__group-row{list-style:none;position:relative}.pds-combobox__group-row-trigger{-ms-flex-align:center;align-items:center;border-radius:var(--pine-dimension-125);color:var(--pine-color-text-secondary);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-medium);gap:var(--pine-dimension-xs);-ms-flex-pack:justify;justify-content:space-between;padding:var(--pine-dimension-xs) var(--pine-dimension-sm);-webkit-transition:background 0.15s;transition:background 0.15s}.pds-combobox__group-row--open>.pds-combobox__group-row-trigger,.pds-combobox__group-row--has-selection>.pds-combobox__group-row-trigger,.pds-combobox__group-row--highlighted>.pds-combobox__group-row-trigger,.pds-combobox__group-back--highlighted>.pds-combobox__group-row-trigger{background:var(--pine-color-background-muted)}.pds-combobox__listbox--pointer-hover .pds-combobox__group-row-trigger:hover{background:var(--pine-color-background-muted)}.pds-combobox__listbox--drill-in,.pds-combobox__listbox--drill-out{overflow-x:hidden}.pds-combobox__listbox--drill-in,.pds-combobox__listbox--drill-out:dir(rtl){--pds-combobox-drill-from:var(--pine-dimension-sm)}.pds-combobox__listbox--drill-out,.pds-combobox__listbox--drill-in:dir(rtl){--pds-combobox-drill-from:calc(var(--pine-dimension-sm) * -1)}.pds-combobox__listbox--drill-in .pds-combobox__drill-in-options>li,.pds-combobox__listbox--drill-in .pds-combobox__group-back-trigger,.pds-combobox__listbox--drill-out>li{-webkit-animation:pds-combobox-drill var(--pine-motion-duration-base) var(--pine-motion-easing-out);animation:pds-combobox-drill var(--pine-motion-duration-base) var(--pine-motion-easing-out)}@-webkit-keyframes pds-combobox-drill{from{opacity:0;-webkit-transform:translateX(var(--pds-combobox-drill-from));transform:translateX(var(--pds-combobox-drill-from))}}@keyframes pds-combobox-drill{from{opacity:0;-webkit-transform:translateX(var(--pds-combobox-drill-from));transform:translateX(var(--pds-combobox-drill-from))}}.pds-combobox__group-row--keyboard>.pds-combobox__group-row-trigger,.pds-combobox__group-back--keyboard>.pds-combobox__group-row-trigger{outline:var(--pine-outline-focus);outline-offset:calc(var(--pine-border-width) * -2)}.pds-combobox__group-row-label{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);min-width:0}.pds-combobox__group-row-caret{-ms-flex-negative:0;flex-shrink:0}.pds-combobox__listbox--grouped,.pds-combobox__flyout{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-2xs);padding:var(--pine-dimension-2xs)}.pds-combobox__flyout{background:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-125);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);list-style:none;margin:0;overflow-y:auto;position:fixed;visibility:hidden;width:-webkit-max-content;width:-moz-max-content;width:max-content;z-index:1}.pds-combobox__listbox--with-search{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;overflow:hidden;padding:0}.pds-combobox__listbox-options{-ms-flex:1;flex:1;list-style:none;margin:0;min-height:0;overflow-y:auto;padding:var(--pine-dimension-xs)}.pds-combobox__listbox-options.pds-combobox__listbox--grouped{padding:var(--pine-dimension-2xs)}.pds-combobox__panel-search{-ms-flex-align:center;align-items:center;-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-subtle);display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;gap:var(--pine-dimension-xs);padding:var(--pine-dimension-sm)}.pds-combobox__panel-search pds-icon{color:var(--pine-color-text-muted);-ms-flex-negative:0;flex-shrink:0}.pds-combobox__panel-search:focus-within{border-block-end-color:var(--pine-color-border-active)}.pds-combobox__panel-search-input{background:transparent;border:0;color:var(--pine-color-text-strong);-ms-flex:1;flex:1;font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);min-width:0;outline:none;padding:0}.pds-combobox__panel-search-input::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__panel-search-input::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__panel-search-input:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__panel-search-input::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__panel-search-input::placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__group-back{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-2xs);list-style:none}.pds-combobox__group-back-trigger{-ms-flex-pack:start;justify-content:flex-start}.pds-combobox__listbox-options--drilled-in.pds-combobox__listbox--grouped{-webkit-padding-before:0;padding-block-start:0}.pds-combobox__listbox-options--drilled-in:focus{outline:none}.pds-combobox__listbox-options--drilled-in:focus .pds-combobox__group-back-trigger{border-block-end-color:var(--pine-color-border-active)}:where(.pds-combobox__listbox-options--drilled-in) .pds-combobox__group-back-trigger{background-color:var(--pine-color-background-overlay);-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-subtle);border-radius:0;color:var(--pine-color-text-strong);font:var(--pine-typography-body);inset-block-start:0;letter-spacing:var(--pine-letter-spacing);margin-inline:calc(var(--pine-dimension-2xs) * -1);padding:var(--pine-dimension-sm);position:-webkit-sticky;position:sticky;z-index:1}.pds-combobox__drill-in-options{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-2xs);list-style:none;margin:0;padding:0}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-combobox__loading{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-150)}.pds-combobox__empty{color:var(--pine-color-text-tertiary);padding:var(--pine-dimension-150) var(--pine-dimension-sm);text-align:center}.pds-combobox__load-more{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-150)}:host(.pds-combobox-dropdown-portal) .pds-combobox__listbox{position:fixed;z-index:var(--pine-z-index-priority)}.pds-combobox__button-trigger{-ms-flex-align:center;align-items:center;background:var(--color-background-default, var(--pine-color-secondary));border:var(--pine-border);border-radius:var(--pine-border-radius-full);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--color-text-default, var(--pine-color-text-inverse-emphasis));cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-medium);-ms-flex-pack:justify;justify-content:space-between;min-height:var(--pine-dimension-450);outline:none;padding:0 var(--pine-dimension-sm);-webkit-transition:border-color 0.15s, background 0.15s, -webkit-box-shadow 0.15s;transition:border-color 0.15s, background 0.15s, -webkit-box-shadow 0.15s;transition:border-color 0.15s, box-shadow 0.15s, background 0.15s;transition:border-color 0.15s, box-shadow 0.15s, background 0.15s, -webkit-box-shadow 0.15s;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.pds-combobox__button-trigger .pds-combobox__button-trigger-layout-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1}.pds-combobox__button-trigger .trigger-content{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;width:100%}.pds-combobox__button-trigger:focus-visible{border-color:var(--color-border-focus, var(--pine-color-border));-webkit-box-shadow:0 0 0 2px var(--color-outline, var(--pine-color-focus-ring));box-shadow:0 0 0 2px var(--color-outline, var(--pine-color-focus-ring))}.pds-combobox__button-trigger:hover{background:var(--color-background-hover, var(--pine-color-secondary-hover));border-color:var(--color-border-hover, var(--pine-color-border-hover))}.pds-combobox__button-trigger[aria-disabled=true],.pds-combobox__button-trigger:disabled{background:var(--color-background-disabled, var(--pine-color-secondary-disabled));border-color:var(--color-border-disabled, var(--pine-color-border-disabled));color:var(--color-text-disabled, var(--pine-color-text-secondary-disabled));cursor:not-allowed;opacity:0.6}.pds-combobox__button-trigger-label{color:inherit;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;overflow-wrap:anywhere;text-align:start}.pds-combobox__button-trigger-label--with-icon{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs)}.pds-combobox__button-trigger-icon{-ms-flex-negative:0;flex-shrink:0}.pds-combobox__button-trigger--input-shape{border-radius:var(--pine-dimension-125);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);min-height:var(--pine-dimension-450);padding:calc(var(--pine-dimension-xs) - var(--pine-border-width)) var(--pine-dimension-150)}.pds-combobox__button-trigger--secondary.pds-combobox__button-trigger--input-shape:not([aria-disabled=true]) .pds-combobox__button-trigger-label--placeholder{color:var(--pine-color-text-muted)}.pds-combobox__button-trigger-chevron{color:currentColor;-webkit-margin-start:var(--pine-dimension-150);margin-inline-start:var(--pine-dimension-150)}.pds-combobox__button-trigger--primary{--color-background-default:var(--pine-color-primary);--color-background-hover:var(--pine-color-primary-hover);--color-background-disabled:var(--pine-color-primary-disabled);--color-border-default:var(--pine-color-primary);--color-border-hover:var(--pine-color-primary-hover);--color-border-disabled:var(--pine-color-primary-disabled);--color-border-focus:var(--pine-color-primary);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-primary-disabled);--color-outline:var(--pine-color-focus-ring)}.pds-combobox__button-trigger--accent{--color-background-default:var(--pine-color-accent);--color-background-hover:var(--pine-color-accent-hover);--color-background-disabled:var(--pine-color-accent-disabled);--color-border-default:var(--pine-color-accent);--color-border-hover:var(--pine-color-accent-hover);--color-border-disabled:var(--pine-color-accent-disabled);--color-border-focus:var(--pine-color-accent);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-accent-disabled);--color-outline:var(--pine-color-focus-ring)}.pds-combobox__button-trigger--secondary{--color-background-default:var(--pine-color-secondary);--color-background-hover:var(--pine-color-secondary-hover);--color-background-disabled:var(--pine-color-secondary-disabled);--color-border-default:var(--pine-color-border);--color-border-hover:var(--pine-color-border-hover);--color-border-disabled:var(--pine-color-border-disabled);--color-border-focus:var(--pine-color-border);--color-text-default:var(--pine-color-text-secondary);--color-text-disabled:var(--pine-color-text-secondary-disabled);--color-outline:var(--pine-color-focus-ring)}.pds-combobox__button-trigger--destructive{--color-background-default:var(--pine-color-danger);--color-background-hover:var(--pine-color-danger-hover);--color-background-disabled:var(--pine-color-danger-disabled);--color-border-default:var(--pine-color-danger);--color-border-hover:var(--pine-color-danger-hover);--color-border-disabled:var(--pine-color-danger-disabled);--color-border-focus:var(--pine-color-danger);--color-text-default:var(--pine-color-white);--color-text-disabled:var(--pine-color-text-danger-disabled);--color-outline:var(--pine-color-focus-ring-danger)}[data-layout]{border-radius:var(--pine-dimension-125);padding-block:var(--pine-dimension-xs)}.pds-combobox__chip-trigger{-ms-flex-align:center;align-items:center;border-radius:var(--pine-dimension-sm);-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;font:var(--pine-typography-body-medium);-ms-flex-pack:justify;justify-content:space-between;outline:none;padding-block:var(--pine-dimension-025);padding-inline:var(--pine-dimension-150);-webkit-transition:all 0.15s ease;transition:all 0.15s ease;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.pds-combobox__chip-trigger .pds-combobox__chip-trigger-layout-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1}.pds-combobox__chip-trigger .trigger-content{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;width:100%}.pds-combobox__chip-trigger:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-combobox__chip-trigger[aria-disabled=true]{cursor:not-allowed;opacity:0.6}.pds-combobox__chip-trigger-label{color:inherit;-ms-flex:1 1 auto;flex:1 1 auto;text-align:start}.pds-combobox__chip-trigger-chevron{color:currentColor;-webkit-margin-start:var(--pine-dimension-150);margin-inline-start:var(--pine-dimension-150)}.pds-combobox__chip-trigger-icon{-webkit-margin-end:var(--pine-dimension-2xs);margin-inline-end:var(--pine-dimension-2xs)}.pds-combobox__chip-trigger--neutral,.pds-combobox__chip-trigger--accent,.pds-combobox__chip-trigger--success,.pds-combobox__chip-trigger--warning,.pds-combobox__chip-trigger--danger,.pds-combobox__chip-trigger--info{background:var(--chip-bg);border:var(--pine-border-width) solid var(--chip-border);color:var(--chip-text)}.pds-combobox__chip-trigger--neutral:hover:not([aria-disabled=true]),.pds-combobox__chip-trigger--accent:hover:not([aria-disabled=true]),.pds-combobox__chip-trigger--success:hover:not([aria-disabled=true]),.pds-combobox__chip-trigger--warning:hover:not([aria-disabled=true]),.pds-combobox__chip-trigger--danger:hover:not([aria-disabled=true]),.pds-combobox__chip-trigger--info:hover:not([aria-disabled=true]){background:var(--chip-bg-hover)}.pds-combobox__chip-trigger--neutral:focus-visible,.pds-combobox__chip-trigger--accent:focus-visible,.pds-combobox__chip-trigger--success:focus-visible,.pds-combobox__chip-trigger--warning:focus-visible,.pds-combobox__chip-trigger--danger:focus-visible,.pds-combobox__chip-trigger--info:focus-visible{border-color:var(--chip-border)}.pds-combobox__chip-trigger--neutral{--chip-bg:var(--pine-chip-color-neutral);--chip-bg-hover:var(--pine-chip-color-neutral-hover);--chip-border:var(--pine-chip-color-neutral-hover);--chip-text:var(--pine-color-text-neutral)}.pds-combobox__chip-trigger--accent{--chip-bg:var(--pine-chip-color-accent);--chip-bg-hover:var(--pine-chip-color-accent-hover);--chip-border:var(--pine-chip-color-accent-hover);--chip-text:var(--pine-color-text-accent)}.pds-combobox__chip-trigger--success{--chip-bg:var(--pine-chip-color-success);--chip-bg-hover:var(--pine-chip-color-success-hover);--chip-border:var(--pine-chip-color-success-hover);--chip-text:var(--pine-color-text-success)}.pds-combobox__chip-trigger--warning{--chip-bg:var(--pine-chip-color-warning);--chip-bg-hover:var(--pine-chip-color-warning-hover);--chip-border:var(--pine-chip-color-warning-hover);--chip-text:var(--pine-color-text-warning)}.pds-combobox__chip-trigger--danger{--chip-bg:var(--pine-chip-color-danger);--chip-bg-hover:var(--pine-chip-color-danger-hover);--chip-border:var(--pine-chip-color-danger-hover);--chip-text:var(--pine-color-text-danger)}.pds-combobox__chip-trigger--info{--chip-bg:var(--pine-chip-color-info);--chip-bg-hover:var(--pine-chip-color-info-hover);--chip-border:var(--pine-chip-color-info-hover);--chip-text:var(--pine-color-text-info)}.pds-combobox__chip-trigger--brand{background:-webkit-gradient(linear, left top, right top, from(#FF3E14), to(#6B62F2));background:linear-gradient(90deg, #FF3E14 0%, #6B62F2 100%);border:0;color:var(--pine-color-text-neutral);padding:1px;position:relative}.pds-combobox__chip-trigger--brand .pds-combobox__chip-trigger-label{background:rgba(255, 255, 255, 0.9);border-radius:calc(var(--pine-dimension-sm) - 1px);color:var(--pine-color-text-neutral);font-weight:var(--pine-font-weight-medium);padding:var(--pine-dimension-025) var(--pine-dimension-150);position:relative;z-index:1}.pds-combobox__chip-trigger--brand .pds-combobox__chip-trigger-chevron{position:relative;z-index:1}.pds-combobox__chip-trigger--brand:hover:not([aria-disabled=true]) .pds-combobox__chip-trigger-label{background:rgba(255, 255, 255, 0.8)}.pds-combobox__chip-trigger--dropdown:not(.pds-combobox__chip-trigger--brand){padding:var(--pine-dimension-none)}.pds-combobox__chip-trigger--dropdown:not(.pds-combobox__chip-trigger--brand) .pds-combobox__chip-trigger-label{padding:var(--pine-dimension-025) var(--pine-dimension-150)}.pds-combobox__chip-trigger--large .pds-combobox__chip-trigger-label{font-family:var(--pine-font-family-heading);font-size:var(--pine-font-size-heading-6);font-weight:var(--pine-font-weight-medium);letter-spacing:var(--pine-letter-spacing-heading-6)}.pds-combobox__chip-trigger--dot .pds-combobox__chip-trigger-label::before{border:var(--pine-border-width) solid transparent;border-radius:var(--pine-border-radius-full);content:"";display:inline-block;height:var(--pine-dimension-2xs);-webkit-margin-end:var(--pine-dimension-2xs);margin-inline-end:var(--pine-dimension-2xs);width:var(--pine-dimension-2xs)}`;
11368
+ const pdsComboboxCss = () => `:host{display:block}:host([truncate]){display:block;min-width:0}:host([aria-disabled=true]) .pds-combobox__input-icon{color:var(--pine-color-text-disabled);pointer-events:none}.pds-combobox{position:relative}.pds-combobox__label{color:var(--pine-color-text-label);display:block;font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-combobox__input-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;position:relative;width:100%}.pds-combobox__input{background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-125);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pine-color-text-strong);-ms-flex:1;flex:1;font:var(--pine-typography-body-medium);padding:var(--pine-dimension-xs) var(--pine-dimension-450) var(--pine-dimension-xs) var(--pine-dimension-150);-webkit-transition:border-color var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease;width:100%}.pds-combobox__input:hover:not(:disabled){border-color:var(--pine-color-border-hover)}.pds-combobox__input:disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-combobox__input:disabled::-webkit-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-combobox__input:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-combobox__input:disabled:-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-combobox__input:disabled::-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-combobox__input:disabled::placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-combobox__input:focus-visible{border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-combobox__input::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__input::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__input:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__input::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__input::placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__input.pds-combobox__input--invalid{background:var(--pine-color-red-050);border-color:var(--pine-color-border-danger)}:host-context([data-theme=dark]) .pds-combobox__input.pds-combobox__input--invalid{background:var(--pine-color-red-950)}.pds-combobox__input.pds-combobox__input--invalid:hover:not(:disabled){border-color:var(--pine-color-border-danger)}.pds-combobox__input.pds-combobox__input--invalid:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-combobox__input-icon{color:var(--pine-color-text-secondary);inset-inline-end:var(--pine-dimension-150);pointer-events:none;position:absolute;z-index:calc(var(--pine-z-index-raised) - 1)}.pds-combobox__helper{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-combobox__error{-ms-flex-align:start;align-items:flex-start;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-sm-medium);gap:var(--pine-dimension-2xs);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-combobox__error pds-icon{-ms-flex-negative:0;flex-shrink:0;-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.pds-combobox__listbox{background:var(--pine-color-background-overlay);border:0;border-radius:var(--pine-dimension-125);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);list-style:none;margin:0;min-width:220px;overflow-y:auto;padding:var(--pine-dimension-xs);position:absolute;z-index:var(--pine-z-index-raised)}.pds-combobox__option{-ms-flex-align:center;align-items:center;background:transparent;border-radius:var(--pine-dimension-125);color:var(--pine-color-text-secondary);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-medium);-ms-flex-pack:justify;justify-content:space-between;padding:var(--pine-dimension-xs) var(--pine-dimension-sm);position:relative;-webkit-transition:background 0.15s;transition:background 0.15s}.pds-combobox__option[aria-selected=true]{background:var(--pine-color-background-muted)}.pds-combobox__option:focus-visible{outline:0}.pds-combobox__option.pds-combobox__option--layout .pds-combobox__option-layout-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;width:100%}.pds-combobox__option.pds-combobox__option--chip .pds-combobox__option-chip{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;width:100%}.pds-combobox__option:last-child{-webkit-margin-after:0;margin-block-end:0}.pds-combobox__option--highlighted,.pds-combobox__option[selected],.pds-combobox__option--selected{background:var(--pine-color-background-muted)}.pds-combobox__option--disabled,.pds-combobox__group-row--disabled>.pds-combobox__group-row-trigger,.pds-combobox__group-back--disabled>.pds-combobox__group-back-trigger,.pds-combobox__group--disabled>.pds-combobox__group-label{color:var(--pine-color-text-disabled)}.pds-combobox__option--disabled{cursor:not-allowed}.pds-combobox__option--disabled .pds-combobox__option-chip,.pds-combobox__option--disabled .pds-combobox__option-layout-wrapper{opacity:0.5}.pds-combobox__option-label{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);min-width:0;overflow-wrap:anywhere}.pds-combobox__option-icon{-ms-flex-negative:0;flex-shrink:0}.pds-combobox__listbox--truncate .pds-combobox__option-label{-ms-flex:1 1 auto;flex:1 1 auto;overflow-wrap:normal}.pds-combobox__listbox--truncate .pds-combobox__option-check{-ms-flex-negative:0;flex-shrink:0}.pds-combobox__option-check{color:currentColor;font-size:var(--pine-dimension-150);-webkit-margin-start:var(--pine-dimension-150);margin-inline-start:var(--pine-dimension-150)}.pds-combobox__group-label{color:var(--pine-color-text-tertiary);cursor:default;font:var(--pine-typography-heading-caption);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs);-webkit-margin-before:var(--pine-dimension-150);margin-block-start:var(--pine-dimension-150);padding:var(--pine-dimension-2xs) var(--pine-dimension-sm);text-transform:uppercase}.pds-combobox__group-label:first-child{-webkit-margin-before:0;margin-block-start:0}.pds-combobox__group{list-style:none;-webkit-margin-before:var(--pine-dimension-150);margin-block-start:var(--pine-dimension-150)}.pds-combobox__group:first-child{-webkit-margin-before:0;margin-block-start:0}.pds-combobox__group-list{list-style:none;margin:0;padding:0}.pds-combobox__listbox--grouped .pds-combobox__group-list{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-2xs)}.pds-combobox__group-label--with-icon{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs)}.pds-combobox__group-icon{-ms-flex-negative:0;flex-shrink:0}.pds-combobox__group-row{list-style:none;position:relative}.pds-combobox__group-row-trigger{-ms-flex-align:center;align-items:center;border-radius:var(--pine-dimension-125);color:var(--pine-color-text-secondary);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-medium);gap:var(--pine-dimension-xs);-ms-flex-pack:justify;justify-content:space-between;padding:var(--pine-dimension-xs) var(--pine-dimension-sm);-webkit-transition:background 0.15s;transition:background 0.15s}.pds-combobox__group-row--open>.pds-combobox__group-row-trigger,.pds-combobox__group-row--has-selection>.pds-combobox__group-row-trigger,.pds-combobox__group-row--highlighted>.pds-combobox__group-row-trigger,.pds-combobox__group-back--highlighted>.pds-combobox__group-row-trigger{background:var(--pine-color-background-muted)}.pds-combobox__listbox--pointer-hover .pds-combobox__group-row-trigger:hover{background:var(--pine-color-background-muted)}.pds-combobox__listbox--drill-in,.pds-combobox__listbox--drill-out{overflow-x:hidden}.pds-combobox__listbox--drill-in,.pds-combobox__listbox--drill-out:dir(rtl){--pds-combobox-drill-from:var(--pine-dimension-sm)}.pds-combobox__listbox--drill-out,.pds-combobox__listbox--drill-in:dir(rtl){--pds-combobox-drill-from:calc(var(--pine-dimension-sm) * -1)}.pds-combobox__listbox--drill-in .pds-combobox__drill-in-options>li,.pds-combobox__listbox--drill-in .pds-combobox__group-back-trigger,.pds-combobox__listbox--drill-out>li{-webkit-animation:pds-combobox-drill var(--pine-motion-duration-base) var(--pine-motion-easing-out);animation:pds-combobox-drill var(--pine-motion-duration-base) var(--pine-motion-easing-out)}@-webkit-keyframes pds-combobox-drill{from{opacity:0;-webkit-transform:translateX(var(--pds-combobox-drill-from));transform:translateX(var(--pds-combobox-drill-from))}}@keyframes pds-combobox-drill{from{opacity:0;-webkit-transform:translateX(var(--pds-combobox-drill-from));transform:translateX(var(--pds-combobox-drill-from))}}.pds-combobox__group-row--keyboard>.pds-combobox__group-row-trigger,.pds-combobox__group-back--keyboard>.pds-combobox__group-row-trigger{outline:var(--pine-outline-focus);outline-offset:calc(var(--pine-border-width) * -2)}.pds-combobox__group-row-label{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);min-width:0}.pds-combobox__group-row-caret{-ms-flex-negative:0;flex-shrink:0}.pds-combobox__listbox--grouped,.pds-combobox__flyout{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-2xs);padding:var(--pine-dimension-2xs)}.pds-combobox__flyout{background:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-125);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);list-style:none;margin:0;overflow-y:auto;position:fixed;visibility:hidden;width:-webkit-max-content;width:-moz-max-content;width:max-content;z-index:1}.pds-combobox__listbox--with-search{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;overflow:hidden;padding:0}.pds-combobox__listbox-options{-ms-flex:1;flex:1;list-style:none;margin:0;min-height:0;overflow-y:auto;padding:var(--pine-dimension-xs)}.pds-combobox__listbox-options.pds-combobox__listbox--grouped{padding:var(--pine-dimension-2xs)}.pds-combobox__panel-search{-ms-flex-align:center;align-items:center;-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-subtle);display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;gap:var(--pine-dimension-xs);padding:var(--pine-dimension-sm)}.pds-combobox__panel-search pds-icon{color:var(--pine-color-text-muted);-ms-flex-negative:0;flex-shrink:0}.pds-combobox__panel-search:focus-within{border-block-end-color:var(--pine-color-border-active)}.pds-combobox__panel-search-input{background:transparent;border:0;color:var(--pine-color-text-strong);-ms-flex:1;flex:1;font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);min-width:0;outline:none;padding:0}.pds-combobox__panel-search-input::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__panel-search-input::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__panel-search-input:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__panel-search-input::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__panel-search-input::placeholder{color:var(--pine-color-text-placeholder)}.pds-combobox__group-back{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-2xs);list-style:none}.pds-combobox__group-back-trigger{-ms-flex-pack:start;justify-content:flex-start}.pds-combobox__listbox-options--drilled-in.pds-combobox__listbox--grouped{-webkit-padding-before:0;padding-block-start:0}.pds-combobox__listbox-options--drilled-in:focus{outline:none}.pds-combobox__listbox-options--drilled-in:focus .pds-combobox__group-back-trigger{border-block-end-color:var(--pine-color-border-active)}:where(.pds-combobox__listbox-options--drilled-in) .pds-combobox__group-back-trigger{background-color:var(--pine-color-background-overlay);-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-subtle);border-radius:0;color:var(--pine-color-text-strong);font:var(--pine-typography-body);inset-block-start:0;letter-spacing:var(--pine-letter-spacing);margin-inline:calc(var(--pine-dimension-2xs) * -1);padding:var(--pine-dimension-sm);position:-webkit-sticky;position:sticky;z-index:1}.pds-combobox__drill-in-options{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-2xs);list-style:none;margin:0;padding:0}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-combobox__loading{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-150)}.pds-combobox__empty{color:var(--pine-color-text-tertiary);padding:var(--pine-dimension-150) var(--pine-dimension-sm);text-align:center}.pds-combobox__load-more{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-150)}:host(.pds-combobox-dropdown-portal) .pds-combobox__listbox{position:fixed;z-index:var(--pine-z-index-priority)}.pds-combobox__button-trigger{-ms-flex-align:center;align-items:center;background:var(--color-background-default, var(--pine-color-secondary));border:var(--pine-border);border-radius:var(--pine-border-radius-full);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--color-text-default, var(--pine-color-text-inverse-emphasis));cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-medium);-ms-flex-pack:justify;justify-content:space-between;min-height:var(--pine-dimension-450);outline:none;padding:0 var(--pine-dimension-sm);-webkit-transition:border-color 0.15s, background 0.15s, -webkit-box-shadow 0.15s;transition:border-color 0.15s, background 0.15s, -webkit-box-shadow 0.15s;transition:border-color 0.15s, box-shadow 0.15s, background 0.15s;transition:border-color 0.15s, box-shadow 0.15s, background 0.15s, -webkit-box-shadow 0.15s;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.pds-combobox__button-trigger .pds-combobox__button-trigger-layout-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1}.pds-combobox__button-trigger .trigger-content{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;width:100%}.pds-combobox__button-trigger:focus-visible{border-color:var(--color-border-focus, var(--pine-color-border));-webkit-box-shadow:0 0 0 2px var(--color-outline, var(--pine-color-focus-ring));box-shadow:0 0 0 2px var(--color-outline, var(--pine-color-focus-ring))}.pds-combobox__button-trigger:hover{background:var(--color-background-hover, var(--pine-color-secondary-hover));border-color:var(--color-border-hover, var(--pine-color-border-hover))}.pds-combobox__button-trigger[aria-disabled=true],.pds-combobox__button-trigger:disabled{background:var(--color-background-disabled, var(--pine-color-secondary-disabled));border-color:var(--color-border-disabled, var(--pine-color-border-disabled));color:var(--color-text-disabled, var(--pine-color-text-secondary-disabled));cursor:not-allowed;opacity:0.6}.pds-combobox__button-trigger-label{color:inherit;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;overflow-wrap:anywhere;text-align:start}.pds-combobox__button-trigger-label--with-icon{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs)}.pds-combobox__button-trigger-icon{-ms-flex-negative:0;flex-shrink:0}.pds-combobox__button-trigger--truncate{max-width:100%}.pds-combobox__button-trigger--truncate .pds-combobox__button-trigger-label{overflow-wrap:normal}.pds-combobox__button-trigger--truncate .pds-combobox__button-trigger-chevron{-ms-flex-negative:0;flex-shrink:0}.pds-combobox__button-trigger-text,.pds-combobox__listbox--truncate .pds-combobox__option-text{display:block;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-combobox__button-trigger--input-shape{border-radius:var(--pine-dimension-125);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);min-height:var(--pine-dimension-450);padding:calc(var(--pine-dimension-xs) - var(--pine-border-width)) var(--pine-dimension-150)}.pds-combobox__button-trigger--secondary.pds-combobox__button-trigger--input-shape:not([aria-disabled=true]) .pds-combobox__button-trigger-label--placeholder{color:var(--pine-color-text-muted)}.pds-combobox__button-trigger-chevron{color:currentColor;-webkit-margin-start:var(--pine-dimension-150);margin-inline-start:var(--pine-dimension-150)}.pds-combobox__button-trigger--primary{--color-background-default:var(--pine-color-primary);--color-background-hover:var(--pine-color-primary-hover);--color-background-disabled:var(--pine-color-primary-disabled);--color-border-default:var(--pine-color-primary);--color-border-hover:var(--pine-color-primary-hover);--color-border-disabled:var(--pine-color-primary-disabled);--color-border-focus:var(--pine-color-primary);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-primary-disabled);--color-outline:var(--pine-color-focus-ring)}.pds-combobox__button-trigger--accent{--color-background-default:var(--pine-color-accent);--color-background-hover:var(--pine-color-accent-hover);--color-background-disabled:var(--pine-color-accent-disabled);--color-border-default:var(--pine-color-accent);--color-border-hover:var(--pine-color-accent-hover);--color-border-disabled:var(--pine-color-accent-disabled);--color-border-focus:var(--pine-color-accent);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-accent-disabled);--color-outline:var(--pine-color-focus-ring)}.pds-combobox__button-trigger--secondary{--color-background-default:var(--pine-color-secondary);--color-background-hover:var(--pine-color-secondary-hover);--color-background-disabled:var(--pine-color-secondary-disabled);--color-border-default:var(--pine-color-border);--color-border-hover:var(--pine-color-border-hover);--color-border-disabled:var(--pine-color-border-disabled);--color-border-focus:var(--pine-color-border);--color-text-default:var(--pine-color-text-secondary);--color-text-disabled:var(--pine-color-text-secondary-disabled);--color-outline:var(--pine-color-focus-ring)}.pds-combobox__button-trigger--destructive{--color-background-default:var(--pine-color-danger);--color-background-hover:var(--pine-color-danger-hover);--color-background-disabled:var(--pine-color-danger-disabled);--color-border-default:var(--pine-color-danger);--color-border-hover:var(--pine-color-danger-hover);--color-border-disabled:var(--pine-color-danger-disabled);--color-border-focus:var(--pine-color-danger);--color-text-default:var(--pine-color-white);--color-text-disabled:var(--pine-color-text-danger-disabled);--color-outline:var(--pine-color-focus-ring-danger)}[data-layout]{border-radius:var(--pine-dimension-125);padding-block:var(--pine-dimension-xs)}.pds-combobox__chip-trigger{-ms-flex-align:center;align-items:center;border-radius:var(--pine-dimension-sm);-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;font:var(--pine-typography-body-medium);-ms-flex-pack:justify;justify-content:space-between;outline:none;padding-block:var(--pine-dimension-025);padding-inline:var(--pine-dimension-150);-webkit-transition:all 0.15s ease;transition:all 0.15s ease;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.pds-combobox__chip-trigger .pds-combobox__chip-trigger-layout-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1}.pds-combobox__chip-trigger .trigger-content{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;width:100%}.pds-combobox__chip-trigger:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-combobox__chip-trigger[aria-disabled=true]{cursor:not-allowed;opacity:0.6}.pds-combobox__chip-trigger-label{color:inherit;-ms-flex:1 1 auto;flex:1 1 auto;text-align:start}.pds-combobox__chip-trigger-chevron{color:currentColor;-webkit-margin-start:var(--pine-dimension-150);margin-inline-start:var(--pine-dimension-150)}.pds-combobox__chip-trigger-icon{-webkit-margin-end:var(--pine-dimension-2xs);margin-inline-end:var(--pine-dimension-2xs)}.pds-combobox__chip-trigger--neutral,.pds-combobox__chip-trigger--accent,.pds-combobox__chip-trigger--success,.pds-combobox__chip-trigger--warning,.pds-combobox__chip-trigger--danger,.pds-combobox__chip-trigger--info{background:var(--chip-bg);border:var(--pine-border-width) solid var(--chip-border);color:var(--chip-text)}.pds-combobox__chip-trigger--neutral:hover:not([aria-disabled=true]),.pds-combobox__chip-trigger--accent:hover:not([aria-disabled=true]),.pds-combobox__chip-trigger--success:hover:not([aria-disabled=true]),.pds-combobox__chip-trigger--warning:hover:not([aria-disabled=true]),.pds-combobox__chip-trigger--danger:hover:not([aria-disabled=true]),.pds-combobox__chip-trigger--info:hover:not([aria-disabled=true]){background:var(--chip-bg-hover)}.pds-combobox__chip-trigger--neutral:focus-visible,.pds-combobox__chip-trigger--accent:focus-visible,.pds-combobox__chip-trigger--success:focus-visible,.pds-combobox__chip-trigger--warning:focus-visible,.pds-combobox__chip-trigger--danger:focus-visible,.pds-combobox__chip-trigger--info:focus-visible{border-color:var(--chip-border)}.pds-combobox__chip-trigger--neutral{--chip-bg:var(--pine-chip-color-neutral);--chip-bg-hover:var(--pine-chip-color-neutral-hover);--chip-border:var(--pine-chip-color-neutral-hover);--chip-text:var(--pine-color-text-neutral)}.pds-combobox__chip-trigger--accent{--chip-bg:var(--pine-chip-color-accent);--chip-bg-hover:var(--pine-chip-color-accent-hover);--chip-border:var(--pine-chip-color-accent-hover);--chip-text:var(--pine-color-text-accent)}.pds-combobox__chip-trigger--success{--chip-bg:var(--pine-chip-color-success);--chip-bg-hover:var(--pine-chip-color-success-hover);--chip-border:var(--pine-chip-color-success-hover);--chip-text:var(--pine-color-text-success)}.pds-combobox__chip-trigger--warning{--chip-bg:var(--pine-chip-color-warning);--chip-bg-hover:var(--pine-chip-color-warning-hover);--chip-border:var(--pine-chip-color-warning-hover);--chip-text:var(--pine-color-text-warning)}.pds-combobox__chip-trigger--danger{--chip-bg:var(--pine-chip-color-danger);--chip-bg-hover:var(--pine-chip-color-danger-hover);--chip-border:var(--pine-chip-color-danger-hover);--chip-text:var(--pine-color-text-danger)}.pds-combobox__chip-trigger--info{--chip-bg:var(--pine-chip-color-info);--chip-bg-hover:var(--pine-chip-color-info-hover);--chip-border:var(--pine-chip-color-info-hover);--chip-text:var(--pine-color-text-info)}.pds-combobox__chip-trigger--brand{background:-webkit-gradient(linear, left top, right top, from(#FF3E14), to(#6B62F2));background:linear-gradient(90deg, #FF3E14 0%, #6B62F2 100%);border:0;color:var(--pine-color-text-neutral);padding:1px;position:relative}.pds-combobox__chip-trigger--brand .pds-combobox__chip-trigger-label{background:rgba(255, 255, 255, 0.9);border-radius:calc(var(--pine-dimension-sm) - 1px);color:var(--pine-color-text-neutral);font-weight:var(--pine-font-weight-medium);padding:var(--pine-dimension-025) var(--pine-dimension-150);position:relative;z-index:1}.pds-combobox__chip-trigger--brand .pds-combobox__chip-trigger-chevron{position:relative;z-index:1}.pds-combobox__chip-trigger--brand:hover:not([aria-disabled=true]) .pds-combobox__chip-trigger-label{background:rgba(255, 255, 255, 0.8)}.pds-combobox__chip-trigger--dropdown:not(.pds-combobox__chip-trigger--brand){padding:var(--pine-dimension-none)}.pds-combobox__chip-trigger--dropdown:not(.pds-combobox__chip-trigger--brand) .pds-combobox__chip-trigger-label{padding:var(--pine-dimension-025) var(--pine-dimension-150)}.pds-combobox__chip-trigger--large .pds-combobox__chip-trigger-label{font-family:var(--pine-font-family-heading);font-size:var(--pine-font-size-heading-6);font-weight:var(--pine-font-weight-medium);letter-spacing:var(--pine-letter-spacing-heading-6)}.pds-combobox__chip-trigger--dot .pds-combobox__chip-trigger-label::before{border:var(--pine-border-width) solid transparent;border-radius:var(--pine-border-radius-full);content:"";display:inline-block;height:var(--pine-dimension-2xs);-webkit-margin-end:var(--pine-dimension-2xs);margin-inline-end:var(--pine-dimension-2xs);width:var(--pine-dimension-2xs)}`;
11203
11369
 
11204
11370
  /**
11205
11371
  * @slot option - Option elements for the combobox dropdown
@@ -11340,6 +11506,13 @@ class PdsCombobox {
11340
11506
  * @default 'pill'
11341
11507
  */
11342
11508
  this.triggerShape = 'pill';
11509
+ /**
11510
+ * Determines whether the button trigger's label and the option labels should truncate and display with an ellipsis.
11511
+ * When a label overflows, a `title` showing the full label will appear on hover.
11512
+ * Chip options, custom layouts and group rows aren't affected.
11513
+ * @defaultValue false
11514
+ */
11515
+ this.truncate = false;
11343
11516
  /**
11344
11517
  * The sentiment for the chip trigger. Matches Pine chip sentiments.
11345
11518
  * @default 'neutral'
@@ -11636,10 +11809,15 @@ class PdsCombobox {
11636
11809
  if (this.usesPanelSearch)
11637
11810
  this.restoreFocusToTrigger();
11638
11811
  };
11812
+ this.onButtonTriggerMouseEnter = (event) => {
11813
+ this.syncTitle(event.currentTarget, '.pds-combobox__button-trigger-text');
11814
+ };
11639
11815
  // Event handler for mouse enter on option
11640
11816
  this.onOptionMouseEnter = (event) => {
11641
- const idx = Number(event.currentTarget.getAttribute('data-option-index'));
11642
- this.highlightedIndex = idx;
11817
+ const row = event.currentTarget;
11818
+ if (this.truncate)
11819
+ this.syncTitle(row, '.pds-combobox__option-text');
11820
+ this.highlightedIndex = Number(row.getAttribute('data-option-index'));
11643
11821
  this.keyboardNavigating = false;
11644
11822
  };
11645
11823
  this.onGroupRowMouseEnter = (event) => {
@@ -11929,6 +12107,19 @@ class PdsCombobox {
11929
12107
  this.focusPanel(panelFocusEl);
11930
12108
  }
11931
12109
  }
12110
+ // A `title` only while the text is cut, measured on hover. On the span, not the option or trigger,
12111
+ // so it isn't read again as their description.
12112
+ syncTitle(el, selector) {
12113
+ const text = el.querySelector(selector);
12114
+ if (!text)
12115
+ return;
12116
+ if (text.scrollWidth > text.clientWidth) {
12117
+ text.title = text.textContent || '';
12118
+ }
12119
+ else {
12120
+ text.removeAttribute('title');
12121
+ }
12122
+ }
11932
12123
  /**
11933
12124
  * Scrolls just enough to show `el`, as `scrollIntoView({ block: 'nearest' })` does. In the drill-in
11934
12125
  * panel it scrolls the list alone, and never sideways: while a drill-in slide offsets a row past
@@ -13330,6 +13521,7 @@ class PdsCombobox {
13330
13521
  'pds-combobox__listbox--drill-in': this.drillDirection === 'in',
13331
13522
  'pds-combobox__listbox--drill-out': this.drillDirection === 'out',
13332
13523
  'pds-combobox__listbox--pointer-hover': this.pointerCanHover,
13524
+ 'pds-combobox__listbox--truncate': this.truncate,
13333
13525
  }, onAnimationEnd: this.onDrillAnimationEnd, onPointerMove: this.onPanelPointer, onPointerDown: this.onPanelPointer, role: this.showsGroupedPanel ? 'tree' : 'listbox', id: this.listboxId, "aria-label": this.label || 'Options', "aria-multiselectable": "false",
13334
13526
  // Focusable but out of the tab order with panel search, so it can take focus when a
13335
13527
  // drilled-in group hides the field. Dropping it while focused would blur the list and close.
@@ -13501,9 +13693,10 @@ class PdsCombobox {
13501
13693
  /** An option's text, after its `data-icon` when it has one. */
13502
13694
  renderOptionLabel(option) {
13503
13695
  const icon = optionIconOf(option);
13696
+ const label = this.truncate ? (hAsync("span", { key: this.getOptionLabel(option), class: "pds-combobox__option-text" }, this.getOptionLabel(option))) : this.getOptionLabel(option);
13504
13697
  if (icon === null)
13505
- return this.getOptionLabel(option);
13506
- return (hAsync("span", { class: "pds-combobox__option-label" }, hAsync("pds-icon", { name: icon, size: "regular", "aria-hidden": "true", class: "pds-combobox__option-icon" }), this.getOptionLabel(option)));
13698
+ return label;
13699
+ return (hAsync("span", { class: "pds-combobox__option-label" }, hAsync("pds-icon", { name: icon, size: "regular", "aria-hidden": "true", class: "pds-combobox__option-icon" }), label));
13507
13700
  }
13508
13701
  /** The grouped panel's rows, in the order the panel draws them and the keyboard moves through. */
13509
13702
  panelEntries() {
@@ -13591,7 +13784,9 @@ class PdsCombobox {
13591
13784
  'pds-combobox__button-trigger-label--with-icon': icon !== null,
13592
13785
  } }, icon !== null && (
13593
13786
  // `name`, not `icon`: `icon` also loads URLs and data: SVGs, unsanitized.
13594
- hAsync("pds-icon", { name: icon, size: "regular", "aria-hidden": "true", class: "pds-combobox__button-trigger-icon" })), this.selectedLabel || this.placeholder));
13787
+ hAsync("pds-icon", { name: icon, size: "regular", "aria-hidden": "true", class: "pds-combobox__button-trigger-icon" })), this.truncate ? (
13788
+ // Keyed so a new label drops a stale `title`.
13789
+ hAsync("span", { key: this.selectedLabel || this.placeholder, class: "pds-combobox__button-trigger-text" }, this.selectedLabel || this.placeholder)) : (this.selectedLabel || this.placeholder)));
13595
13790
  }
13596
13791
  /** The selection's icon for the button trigger: the option's own, or else its group's. */
13597
13792
  get selectedIcon() {
@@ -13723,16 +13918,17 @@ class PdsCombobox {
13723
13918
  'pds-combobox__button-trigger',
13724
13919
  `pds-combobox__button-trigger--${this.triggerVariant}`,
13725
13920
  this.triggerShape === 'input' && 'pds-combobox__button-trigger--input-shape',
13921
+ this.truncate && 'pds-combobox__button-trigger--truncate',
13726
13922
  ]
13727
13923
  .filter(Boolean)
13728
13924
  .join(' ');
13729
- return (hAsync(Host, { key: 'c4bc64f28f6f8f2170d199bd89ba02b3fbe41bad', "aria-disabled": this.disabled ? 'true' : null }, hAsync("div", { key: '7648c513d133e11376e50a9a15bc9a227b8fe1d2', class: "pds-combobox", tabIndex: -1, onFocusout: this.onComboboxFocusOut, part: "combobox" }, this.hasVisibleLabel && (hAsync("label", { key: '1be4dce04b943119265b99c2b14002e5faba337f', htmlFor: this.trigger === 'input' ? this.componentId : undefined, id: this.labelId, class: "pds-combobox__label", onClick: this.onLabelClick }, this.label)), this.trigger === 'input' ? (hAsync("div", { class: "pds-combobox__input-wrapper", style: { width: this.triggerWidth } }, hAsync("input", { ref: el => {
13925
+ return (hAsync(Host, { key: '2786062989bc490e87ea382b5c80f7e2758c1a8a', "aria-disabled": this.disabled ? 'true' : null }, hAsync("div", { key: 'b3b272a99528d725a52d3092a3650efacaf54b34', class: "pds-combobox", tabIndex: -1, onFocusout: this.onComboboxFocusOut, part: "combobox" }, this.hasVisibleLabel && (hAsync("label", { key: '8e2e0021e1f60cddfe41b918406c7d76659fbff1', htmlFor: this.trigger === 'input' ? this.componentId : undefined, id: this.labelId, class: "pds-combobox__label", onClick: this.onLabelClick }, this.label)), this.trigger === 'input' ? (hAsync("div", { class: "pds-combobox__input-wrapper", style: { width: this.triggerWidth } }, hAsync("input", { ref: el => {
13730
13926
  this.inputEl = el;
13731
13927
  this.triggerEl = el;
13732
13928
  }, class: {
13733
13929
  'pds-combobox__input': true,
13734
13930
  'pds-combobox__input--invalid': this.isInvalid(),
13735
- }, type: "text", role: "combobox", "aria-autocomplete": "list", "aria-haspopup": this.inputPopupRole === 'tree' ? 'tree' : undefined, "aria-controls": this.listboxId, "aria-describedby": assignDescription(this.componentId, this.isInvalid(), this.helperMessage, this.errorMessage), "aria-invalid": this.isInvalid() ? 'true' : undefined, "aria-activedescendant": this.usesPanelSearch ? undefined : this.activeDescendantId, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.hideLabel ? this.label : undefined, id: this.componentId, value: this.displayText, placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleInput, onClick: this.handleInputClick, onKeyDown: this.handleKeyDown, autocomplete: "off", part: "input" }), hAsync("pds-icon", { icon: "enlarge", "aria-hidden": "true", class: "pds-combobox__input-icon" }))) : this.trigger === 'chip' ? (hAsync("div", { class: this.getChipTriggerClass(), style: { width: this.triggerWidth }, role: this.usesPanelSearch ? 'button' : 'combobox', "aria-haspopup": this.triggerPopupRole, "aria-controls": this.listboxId, "aria-describedby": assignDescription(this.componentId, this.isInvalid(), this.helperMessage, this.errorMessage), "aria-invalid": this.isInvalid() ? 'true' : undefined, "aria-activedescendant": this.usesPanelSearch ? undefined : this.activeDescendantId, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.triggerAriaLabel, "aria-labelledby": this.triggerLabelledBy, id: this.componentId, tabIndex: this.disabled ? -1 : 0, onClick: this.onButtonTriggerClick, "data-layout": this.customTriggerContent, onKeyDown: this.onButtonTriggerKeyDown, onKeyUp: this.onButtonTriggerKeyUp, ref: el => (this.triggerEl = el), part: "chip-trigger" }, this.renderChipTriggerContent())) : (hAsync("div", { class: triggerClass, style: { width: this.triggerWidth }, role: this.usesPanelSearch ? 'button' : 'combobox', "aria-haspopup": this.triggerPopupRole, "aria-controls": this.listboxId, "aria-describedby": assignDescription(this.componentId, this.isInvalid(), this.helperMessage, this.errorMessage), "aria-invalid": this.isInvalid() ? 'true' : undefined, "aria-activedescendant": this.usesPanelSearch ? undefined : this.activeDescendantId, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.triggerAriaLabel, "aria-labelledby": this.triggerLabelledBy, id: this.componentId, tabIndex: this.disabled ? -1 : 0, onClick: this.onButtonTriggerClick, "data-layout": this.customTriggerContent, onKeyDown: this.onButtonTriggerKeyDown, onKeyUp: this.onButtonTriggerKeyUp, ref: el => (this.triggerEl = el), part: "button-trigger" }, this.renderButtonTriggerContent())), this.renderMessages(), hAsync("div", { key: 'f9aca483c67dd0cdf2fcbdc651a13cfb8fcfe7f1', style: { display: 'none' } }, hAsync("slot", { key: '7a0dc5718ccf377b41bd1716030f16a135700518', onSlotchange: () => this.updateOptions() })), this.renderDropdown(), this.groupDisplay !== 'inline' && [
13931
+ }, type: "text", role: "combobox", "aria-autocomplete": "list", "aria-haspopup": this.inputPopupRole === 'tree' ? 'tree' : undefined, "aria-controls": this.listboxId, "aria-describedby": assignDescription(this.componentId, this.isInvalid(), this.helperMessage, this.errorMessage), "aria-invalid": this.isInvalid() ? 'true' : undefined, "aria-activedescendant": this.usesPanelSearch ? undefined : this.activeDescendantId, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.hideLabel ? this.label : undefined, id: this.componentId, value: this.displayText, placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleInput, onClick: this.handleInputClick, onKeyDown: this.handleKeyDown, autocomplete: "off", part: "input" }), hAsync("pds-icon", { icon: "enlarge", "aria-hidden": "true", class: "pds-combobox__input-icon" }))) : this.trigger === 'chip' ? (hAsync("div", { class: this.getChipTriggerClass(), style: { width: this.triggerWidth }, role: this.usesPanelSearch ? 'button' : 'combobox', "aria-haspopup": this.triggerPopupRole, "aria-controls": this.listboxId, "aria-describedby": assignDescription(this.componentId, this.isInvalid(), this.helperMessage, this.errorMessage), "aria-invalid": this.isInvalid() ? 'true' : undefined, "aria-activedescendant": this.usesPanelSearch ? undefined : this.activeDescendantId, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.triggerAriaLabel, "aria-labelledby": this.triggerLabelledBy, id: this.componentId, tabIndex: this.disabled ? -1 : 0, onClick: this.onButtonTriggerClick, "data-layout": this.customTriggerContent, onKeyDown: this.onButtonTriggerKeyDown, onKeyUp: this.onButtonTriggerKeyUp, ref: el => (this.triggerEl = el), part: "chip-trigger" }, this.renderChipTriggerContent())) : (hAsync("div", { class: triggerClass, style: { width: this.triggerWidth }, role: this.usesPanelSearch ? 'button' : 'combobox', "aria-haspopup": this.triggerPopupRole, "aria-controls": this.listboxId, "aria-describedby": assignDescription(this.componentId, this.isInvalid(), this.helperMessage, this.errorMessage), "aria-invalid": this.isInvalid() ? 'true' : undefined, "aria-activedescendant": this.usesPanelSearch ? undefined : this.activeDescendantId, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.triggerAriaLabel, "aria-labelledby": this.triggerLabelledBy, id: this.componentId, tabIndex: this.disabled ? -1 : 0, onClick: this.onButtonTriggerClick, "data-layout": this.customTriggerContent, onKeyDown: this.onButtonTriggerKeyDown, onKeyUp: this.onButtonTriggerKeyUp, onMouseEnter: this.truncate ? this.onButtonTriggerMouseEnter : undefined, ref: el => (this.triggerEl = el), part: "button-trigger" }, this.renderButtonTriggerContent())), this.renderMessages(), hAsync("div", { key: '2216779564fa3f4efd1b4d0972ac045fa0851078', style: { display: 'none' } }, hAsync("slot", { key: '77b344d7301193f435949cbe2be2b28e1d7f6602', onSlotchange: () => this.updateOptions() })), this.renderDropdown(), this.groupDisplay !== 'inline' && [
13736
13932
  hAsync("span", { key: "drill-status", class: "visually-hidden", role: "status", "aria-live": "polite" }, this.isOpen && this.effectiveGroupDisplay === 'drill-in' && this.openGroup !== null ? this.openGroup.label : ''),
13737
13933
  // Its own region: sharing one, revealing a row then opening it would leave the text the
13738
13934
  // same, and opening the group would go unannounced.
@@ -13803,6 +13999,7 @@ class PdsCombobox {
13803
13999
  "triggerWidth": [1, "trigger-width"],
13804
14000
  "triggerVariant": [1, "trigger-variant"],
13805
14001
  "triggerShape": [1, "trigger-shape"],
14002
+ "truncate": [516],
13806
14003
  "chipSentiment": [1, "chip-sentiment"],
13807
14004
  "chipLarge": [4, "chip-large"],
13808
14005
  "chipIcon": [1, "chip-icon"],
@@ -13839,7 +14036,7 @@ class PdsCombobox {
13839
14036
  },
13840
14037
  "$listeners$": undefined,
13841
14038
  "$lazyBundleId$": "-",
13842
- "$attrsToReflect$": [["name", "name"]]
14039
+ "$attrsToReflect$": [["name", "name"], ["truncate", "truncate"]]
13843
14040
  }; }
13844
14041
  }
13845
14042
 
@@ -13872,7 +14069,7 @@ class PdsContainer {
13872
14069
  hostStyle['--pine-container-max-width'] = customSize;
13873
14070
  if (!this.centered)
13874
14071
  hostStyle['margin-inline'] = '0';
13875
- return (hAsync(Host, { key: '8a9b10b5d0e348b73f8a6bd7933083c596df10d8', class: { [`pds-container--${this.size}`]: isNamed }, style: Object.keys(hostStyle).length ? hostStyle : undefined }, hAsync(Tag, { key: '55fb22be49377c4cccf08381e7cf954a3f097d08', part: "container" }, hAsync("slot", { key: '4cd9c4fa74a2c6a056e076ab67a0279c395b5c79' }))));
14072
+ return (hAsync(Host, { key: '8a01369c4d1817dd083b1ac714ff7c02920f817e', class: { [`pds-container--${this.size}`]: isNamed }, style: Object.keys(hostStyle).length ? hostStyle : undefined }, hAsync(Tag, { key: '7428cb0040896dc11004065cf91ae9d3c3a99c49', part: "container" }, hAsync("slot", { key: '5a5b5bbc87c03afc23f1c9a0523fced8c0795efb' }))));
13876
14073
  }
13877
14074
  static get style() { return pdsContainerCss(); }
13878
14075
  static get cmpMeta() { return {
@@ -13997,7 +14194,7 @@ class PdsCopytext {
13997
14194
  render() {
13998
14195
  const hostClass = this.classNames();
13999
14196
  this.hostKeeper.record(hostClass);
14000
- return (hAsync(Host, { key: 'a3517b135fc3e3677e30b6ad5811c1170a819b65', class: hostClass, id: this.componentId }, hAsync("pds-button", { key: '02f56bed02ed3963a3d80a92148d6619a845224a', type: "button", variant: "unstyled", onClick: this.handleClick }, hAsync("span", { key: '95fd1284e3d227b74dab613eb71f5385c3a0be29', ref: (el) => this.valueSpanEl = el }, this.value), hAsync("pds-icon", { key: '21af67a8c9165e56d2d2b0cf19df7c7e3f290c72', "aria-hidden": "true", icon: copy, size: "16px" }))));
14197
+ return (hAsync(Host, { key: '35d74eaecedd432f7852545522f9ce72396f9ab9', class: hostClass, id: this.componentId }, hAsync("pds-button", { key: '9550ce2fb21166e9726b08b5928036244c7b729e', type: "button", variant: "unstyled", onClick: this.handleClick }, hAsync("span", { key: '47af45448759c911ca4ca03d0158088289b622e0', ref: (el) => this.valueSpanEl = el }, this.value), hAsync("pds-icon", { key: '3ddab7c3e7063843cd606ffb19481cae3792db43', "aria-hidden": "true", icon: copy, size: "16px" }))));
14001
14198
  }
14002
14199
  get el() { return getElement(this); }
14003
14200
  static get watchers() { return {
@@ -14318,44 +14515,6 @@ class CalendarPortal {
14318
14515
  }
14319
14516
  }
14320
14517
  CalendarPortal.className = 'pds-datepicker-calendar-portal';
14321
- /**
14322
- * The native `<dialog>` or open `popover` (as pds-filter's) the datepicker sits in, so the
14323
- * calendar shares its top layer and a click in it isn't outside it; otherwise `document.body`.
14324
- * `closest()` stops at shadow boundaries and misses one that only wraps slotted content, so this
14325
- * walks assigned slots and shadow hosts, as pds-combobox does.
14326
- */
14327
- function findPortalTarget(from) {
14328
- const seen = new Set();
14329
- let current = from;
14330
- while (current && !seen.has(current)) {
14331
- seen.add(current);
14332
- if (current.nodeType === Node.ELEMENT_NODE && isTopLayerHost(current)) {
14333
- return current;
14334
- }
14335
- const assigned = current.nodeType === Node.ELEMENT_NODE ? current.assignedSlot : null;
14336
- if (assigned) {
14337
- current = assigned;
14338
- continue;
14339
- }
14340
- const parent = current.parentNode;
14341
- current = parent instanceof ShadowRoot ? parent.host : parent;
14342
- }
14343
- return document.body;
14344
- }
14345
- function isTopLayerHost(el) {
14346
- // Only an open dialog: inside a closed one, the calendar would be hidden with it.
14347
- if (el.localName === 'dialog')
14348
- return el.open;
14349
- if (!el.hasAttribute('popover'))
14350
- return false;
14351
- try {
14352
- return el.matches(':popover-open');
14353
- }
14354
- catch (_a) {
14355
- // A browser without the Popover API: no top layer to share.
14356
- return false;
14357
- }
14358
- }
14359
14518
 
14360
14519
  const DEFAULT_LABELS = {
14361
14520
  'today': 'Today',
@@ -15999,14 +16158,14 @@ class PdsDatepicker {
15999
16158
  }
16000
16159
  render() {
16001
16160
  const locale = this.resolvedLocale;
16002
- return (hAsync(Host, { key: '82ffd88b7741a90edc28b66a7384178eb2a9a86c', class: { 'pds-datepicker--range': this.range, 'pds-datepicker--time': this.timePicker }, "full-width": this.fullWidth ? 'true' : null, onFocusin: this.onHostFocusIn, onFocusout: this.onHostFocusOut }, hAsync("pds-input", { key: 'f2b9aad64d1fe8d94327cc3d4f87cd6904eb3076', ref: (el) => (this.inputEl = el), componentId: this.baseId, label: this.label, hideLabel: this.hideLabel, helperMessage: this.helperMessage, errorMessage: this.errorMessage, invalid: this.invalid || !!this.textError || !!this.valueError(), disabled: this.disabled, readonly: this.readonly, required: this.required, placeholder: this.fieldPlaceholder, fullWidth: this.fullWidth, autocomplete: "off", value: this.text, onClick: this.onFieldClick, onPdsInput: this.onTextInput, onPdsChange: this.onTextChange, onPdsKeyDown: this.onTextKeyDown, onPdsFocus: this.stopInnerEvent, onPdsBlur: this.stopInnerEvent }, this.clearable && !!this.value && this.isInteractive && (hAsync("button", {
16161
+ return (hAsync(Host, { key: 'a761f0ca6eeedcac3e4bd90760aa9781cd37dcdc', class: { 'pds-datepicker--range': this.range, 'pds-datepicker--time': this.timePicker }, "full-width": this.fullWidth ? 'true' : null, onFocusin: this.onHostFocusIn, onFocusout: this.onHostFocusOut }, hAsync("pds-input", { key: '2eb04f9fd4e2f7a2437145d250c629c2cc8a0bf6', ref: (el) => (this.inputEl = el), componentId: this.baseId, label: this.label, hideLabel: this.hideLabel, helperMessage: this.helperMessage, errorMessage: this.errorMessage, invalid: this.invalid || !!this.textError || !!this.valueError(), disabled: this.disabled, readonly: this.readonly, required: this.required, placeholder: this.fieldPlaceholder, fullWidth: this.fullWidth, autocomplete: "off", value: this.text, onClick: this.onFieldClick, onPdsInput: this.onTextInput, onPdsChange: this.onTextChange, onPdsKeyDown: this.onTextKeyDown, onPdsFocus: this.stopInnerEvent, onPdsBlur: this.stopInnerEvent }, this.clearable && !!this.value && this.isInteractive && (hAsync("button", {
16003
16162
  // Keyed, as is the calendar button: when Clear appears after a pick, the focused
16004
16163
  // calendar button must stay that button rather than be reused as Clear.
16005
16164
  key: "clear", slot: "suffix", type: "button", class: "pds-datepicker__clear", ref: (el) => (this.clearEl = el), "aria-label": this.label ? `${this.clearLabel} ${this.label}` : this.clearLabel,
16006
16165
  // Out of the tab order, as a native search field's clear button is: Tab from a field
16007
16166
  // just emptied would land on it as the change removes it, dropping focus to the page.
16008
16167
  tabindex: "-1", onMouseDown: this.onClearMouseDown, onClick: this.onClearClick
16009
- }, hAsync("pds-icon", { key: 'f2c784e9d6577d4900b7641ee58aa43f5922fc75', icon: remove, "aria-hidden": "true" }))), hAsync("button", { key: "trigger", slot: "suffix", type: "button", class: "pds-datepicker__trigger", ref: (el) => (this.triggerEl = el), "aria-label": this.triggerAccessibleName(locale), "aria-haspopup": "dialog", "aria-expanded": this.isOpen ? 'true' : 'false', disabled: !this.isInteractive, onClick: this.onTriggerClick, onKeyDown: this.onTriggerKeyDown }, hAsync("pds-icon", { key: '98b2e773240c8ea2bbd5a1acfa3c9ba74cb7917b', icon: calendarSimple, "aria-hidden": "true" }))), this.isOpen && this.renderCalendar(locale)));
16168
+ }, hAsync("pds-icon", { key: '98c325fbba8ea78b2d409bc77099db3206738508', icon: remove, "aria-hidden": "true" }))), hAsync("button", { key: "trigger", slot: "suffix", type: "button", class: "pds-datepicker__trigger", ref: (el) => (this.triggerEl = el), "aria-label": this.triggerAccessibleName(locale), "aria-haspopup": "dialog", "aria-expanded": this.isOpen ? 'true' : 'false', disabled: !this.isInteractive, onClick: this.onTriggerClick, onKeyDown: this.onTriggerKeyDown }, hAsync("pds-icon", { key: 'cb8483febe1b485058b7bb4271b749981a7747a1', icon: calendarSimple, "aria-hidden": "true" }))), this.isOpen && this.renderCalendar(locale)));
16010
16169
  }
16011
16170
  static get formAssociated() { return true; }
16012
16171
  get el() { return getElement(this); }
@@ -16148,7 +16307,7 @@ class PdsDivider {
16148
16307
  return classNames.join(' ');
16149
16308
  }
16150
16309
  render() {
16151
- return (hAsync(Host, { key: 'ef2a5ee85e8f37036be5b8df490683636ffb66f0', id: this.componentId }, this.hasLabel ? (hAsync("div", { class: this.classNames(), role: "separator", "aria-label": this.label }, hAsync("span", { class: "pds-divider__label", part: "label", "aria-hidden": "true" }, this.label))) : (hAsync("hr", { class: this.classNames() }))));
16310
+ return (hAsync(Host, { key: '072cc8552bd33c4a00d216f15a5a848cfc97fd92', id: this.componentId }, this.hasLabel ? (hAsync("div", { class: this.classNames(), role: "separator", "aria-label": this.label }, hAsync("span", { class: "pds-divider__label", part: "label", "aria-hidden": "true" }, this.label))) : (hAsync("hr", { class: this.classNames() }))));
16152
16311
  }
16153
16312
  static get style() { return pdsDividerCss(); }
16154
16313
  static get cmpMeta() { return {
@@ -16344,11 +16503,11 @@ class PdsDrawer {
16344
16503
  this.open = false;
16345
16504
  }
16346
16505
  render() {
16347
- return (hAsync(Host, { key: '287bf043c991209488eb1b617031acffb59ff9af', class: {
16506
+ return (hAsync(Host, { key: '7cf13256457914e48e8fde422832a2a52ee0c13b', class: {
16348
16507
  'pds-drawer': true,
16349
16508
  [`pds-drawer--${this.side}`]: true,
16350
16509
  [`pds-drawer--${this.size}`]: true,
16351
- } }, hAsync("pds-modal", { key: 'cd86fb552353f5cc12fb36fc956033432a91847c', class: { 'pds-drawer__modal': true, 'pds-drawer__modal--modal': this.modal }, ref: (el) => (this.modalEl = el), componentId: this.componentId, open: this.open, scrollable: this.scrollable, disableTopLayer: !this.modal, backdropDismiss: this.lightDismiss, disableInitialFocus: !this.modal && this.initialFocus === 'none' }, hAsync("slot", { key: '56bbe9b5c26b10b07c0f503ba147899a57a5de85' }))));
16510
+ } }, hAsync("pds-modal", { key: 'd4ceb5b4c0b03930aa3d001ae1bbbfbf449bde33', class: { 'pds-drawer__modal': true, 'pds-drawer__modal--modal': this.modal }, ref: (el) => (this.modalEl = el), componentId: this.componentId, open: this.open, scrollable: this.scrollable, disableTopLayer: !this.modal, backdropDismiss: this.lightDismiss, disableInitialFocus: !this.modal && this.initialFocus === 'none' }, hAsync("slot", { key: '41bfdea76282b333ca6950048999cb9d94e69438' }))));
16352
16511
  }
16353
16512
  get el() { return getElement(this); }
16354
16513
  static get style() { return pdsDrawerCss(); }
@@ -16389,7 +16548,7 @@ class PdsDrawerContent {
16389
16548
  unwrapReconnectedContent(this.el.querySelector('.pds-drawer-content'), '.pds-drawer-content');
16390
16549
  }
16391
16550
  render() {
16392
- return (hAsync("div", { key: 'f307939ab0a94f6a0d8a3675c658def0ded68b98', class: "pds-drawer-content" }, hAsync("slot", { key: 'dadac08ac15bb8ded98ea982511e2d57bea9bdca' })));
16551
+ return (hAsync("div", { key: 'b15b087506c1292f9d67e531e8d935069749c09d', class: "pds-drawer-content" }, hAsync("slot", { key: '9c60ca75c7905e7e994f9c41eee213b962afb833' })));
16393
16552
  }
16394
16553
  get el() { return getElement(this); }
16395
16554
  static get style() { return pdsDrawerContentCss(); }
@@ -16417,7 +16576,7 @@ class PdsDrawerFooter {
16417
16576
  unwrapReconnectedContent(this.el.querySelector('.pds-drawer__footer'), '.pds-drawer__footer');
16418
16577
  }
16419
16578
  render() {
16420
- return (hAsync("footer", { key: 'b58c68d88b467e8baa3682d16f97076d06ea2414', class: "pds-drawer__footer" }, hAsync("slot", { key: 'ff2306202c14029b397d40b5bb3d672a8aa571c0' })));
16579
+ return (hAsync("footer", { key: 'a4eec0aff617c605b94f8d3b9ec1e2d98cded6fb', class: "pds-drawer__footer" }, hAsync("slot", { key: '6dc379c940e37edfd05d99728be9dff58ca1d717' })));
16421
16580
  }
16422
16581
  get el() { return getElement(this); }
16423
16582
  static get style() { return pdsDrawerFooterCss(); }
@@ -16445,7 +16604,7 @@ class PdsDrawerHeader {
16445
16604
  unwrapReconnectedContent(this.el.querySelector('.pds-drawer__header'), '.pds-drawer__header');
16446
16605
  }
16447
16606
  render() {
16448
- return (hAsync("header", { key: '280e6ca734317d5733e4c595431c8070eff13d58', class: "pds-drawer__header" }, hAsync("slot", { key: 'cc6af6084600c4dc60d7bd99e040376abdf5ffe3' })));
16607
+ return (hAsync("header", { key: '6b9338e5dbf7a7e580c11b28c95ca53693528382', class: "pds-drawer__header" }, hAsync("slot", { key: '0990fbcf94c0c438b98cf1e8945f1e2fd9aa33dc' })));
16449
16608
  }
16450
16609
  get el() { return getElement(this); }
16451
16610
  static get style() { return pdsDrawerHeaderCss(); }
@@ -16817,7 +16976,7 @@ class PdsDropdownMenu {
16817
16976
  }
16818
16977
  }
16819
16978
  render() {
16820
- return (hAsync(Host, { key: '1765909c8c3c140e52dc3f6b50693c97d6bcc003', id: this.componentId }, hAsync("slot", { key: '0b566cd288428a0694a2d61d4a73bd79def4bfad', name: "trigger", onSlotchange: this.handleTriggerSlotChange }), hAsync("pds-box", { key: '16cdfc208cfe7f6e074289c30aa0e1188a34876d', "border-radius": "sm", display: "flex", direction: "column", class: "pds-dropdown-menu--panel is-hidden", shadow: "100", part: "menu-panel" }, hAsync("div", { key: 'a28c1736ad02e8ac3d82c0fe1933606a7216989b', class: { 'pds-dropdown-menu__header': true, 'is-hidden': !this.hasHeader } }, hAsync("slot", { key: '9c6dfddefb266083f68aa27d6cc01127a69cd1cf', name: "header", onSlotchange: this.handleHeaderSlotChange })), hAsync("div", { key: '8cfe85c10f92d4a4ec6b5d2d0264d054a74ba29b', class: "pds-dropdown-menu__items", role: "menu", "aria-orientation": "vertical" }, hAsync("slot", { key: '1a5b4aa406d2706ca8cef49deb05140a5763be1c', onSlotchange: this.handleSlotChange })))));
16979
+ return (hAsync(Host, { key: '0ed3d8ee889a5423ca9de66a86791d084f75abf0', id: this.componentId }, hAsync("slot", { key: '6bab71652d6afe094075623d3a48641a4d89b232', name: "trigger", onSlotchange: this.handleTriggerSlotChange }), hAsync("pds-box", { key: 'fcef0667f999ae5b8cd03eb94a0db0be7be502cb', "border-radius": "sm", display: "flex", direction: "column", class: "pds-dropdown-menu--panel is-hidden", shadow: "100", part: "menu-panel" }, hAsync("div", { key: 'c78d5bd7e48c5483b12171341271f9132f4b2ff9', class: { 'pds-dropdown-menu__header': true, 'is-hidden': !this.hasHeader } }, hAsync("slot", { key: '6464994260720d6046da548f4aad0896965cc47c', name: "header", onSlotchange: this.handleHeaderSlotChange })), hAsync("div", { key: '3e97dfc4e1911f91ce8917faf981d436e71e5c24', class: "pds-dropdown-menu__items", role: "menu", "aria-orientation": "vertical" }, hAsync("slot", { key: 'dfd77a8b73df5ce9eef3e661d3f9501cb8bfdba2', onSlotchange: this.handleSlotChange })))));
16821
16980
  }
16822
16981
  get host() { return getElement(this); }
16823
16982
  static get style() { return pdsDropdownMenuCss(); }
@@ -16924,7 +17083,7 @@ class PdsDropdownMenuItem {
16924
17083
  }, role: "menuitem", "aria-disabled": "true", part: "button", tabIndex: this.disabled ? -1 : 0, onKeyDown: this.handleInformationalKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur }, hAsync("slot", null)));
16925
17084
  }
16926
17085
  if (this.href != null) {
16927
- return (hAsync("pds-link", { download: this.download, href: this.disabled ? null : this.href, external: this.external, target: this.target, class: {
17086
+ return (hAsync("pds-link", { download: this.download, href: this.disabled ? null : this.href, external: this.external, externalLabel: this.externalLabel, target: this.target, class: {
16928
17087
  'pds-dropdown-menu-item__content': true,
16929
17088
  'has-focus': this.hasFocus
16930
17089
  }, tabIndex: this.disabled ? -1 : 0, onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur, "aria-disabled": this.disabled ? 'true' : null }, hAsync("slot", null)));
@@ -16935,7 +17094,7 @@ class PdsDropdownMenuItem {
16935
17094
  }, tabIndex: this.disabled ? -1 : 0, type: "button", part: "button", onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur, disabled: this.disabled, "aria-disabled": this.disabled ? 'true' : null }, hAsync("slot", null)));
16936
17095
  }
16937
17096
  render() {
16938
- return (hAsync(Host, { key: '47a62550fde33f892d7af4f4e71b67ebf7aa2c3f', id: this.componentId, class: {
17097
+ return (hAsync(Host, { key: 'a69947d99160783919f711d7c53e0592694f9565', id: this.componentId, class: {
16939
17098
  'is-disabled': this.disabled,
16940
17099
  'is-informational': this.informational,
16941
17100
  'destructive': !this.disabled && !this.informational && this.destructive
@@ -16957,6 +17116,7 @@ class PdsDropdownMenuItem {
16957
17116
  "href": [1],
16958
17117
  "informational": [516],
16959
17118
  "external": [516],
17119
+ "externalLabel": [1, "external-label"],
16960
17120
  "target": [513],
16961
17121
  "hasFocus": [32],
16962
17122
  "clickItem": [64]
@@ -16979,7 +17139,7 @@ class PdsDropdownMenuSeparator {
16979
17139
  this.disabled = false;
16980
17140
  }
16981
17141
  render() {
16982
- return (hAsync(Host, { key: '60407a2edc8b4667d39cbd1ba9a859d09b0b8ff1', id: this.componentId }, hAsync("hr", { key: '8485d1c8508c5fe5e3635505f25e278f45f45b82' })));
17142
+ return (hAsync(Host, { key: '72f29c5015d2379d9986c90ec966f34f41298226', id: this.componentId }, hAsync("hr", { key: '72c2155d0fbee6346f3f38997009a7d9e14ad0c8' })));
16983
17143
  }
16984
17144
  static get style() { return pdsDropdownMenuSeparatorCss(); }
16985
17145
  static get cmpMeta() { return {
@@ -17559,7 +17719,7 @@ class PdsFilter {
17559
17719
  return null;
17560
17720
  }
17561
17721
  render() {
17562
- return (hAsync(Host, { key: '3cae951aee1f9c75f3e207cf6c68633a23f8f6dc', id: this.componentId }, hAsync("button", { key: 'f4c644710dc936248995be9a49cef8ad13031d61', class: this.getTriggerClasses(), type: "button", popoverTarget: this.variant !== 'clear' ? `${this.componentId}-popover` : undefined, popoverTargetAction: this.variant !== 'clear' ? 'toggle' : undefined, onKeyDown: this.variant === 'clear' ? this.handleKeyDown : undefined, onClick: (event) => this.handleClick(event), part: "button", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": this.variant !== 'clear' ? 'true' : undefined, "aria-controls": this.variant !== 'clear' ? `${this.componentId}-popover` : undefined }, hAsync("span", { key: '2dd87e53f363118becc762051ea1be664258b8b6', class: "pds-filter__button-content", part: "button-content" }, this.renderIcon(), this.text && (hAsync("span", { key: '733ceb5e07198e844fbdc1af294d2046c4c571d8', class: "pds-filter__button-text", part: "button-text" }, this.text)), this.renderDropdownIcon())), this.variant !== 'clear' && (hAsync("div", { key: 'beb65a21192c6f5c16703aec7ab9a92ea378ef3c', ref: el => this.popoverEl = el, id: `${this.componentId}-popover`, class: "pds-filter__popover", popover: "auto", part: "popover" }, hAsync("slot", { key: '5a481cc6b143b059a5fc33d377abe5ab79aefb4e' })))));
17722
+ return (hAsync(Host, { key: '9b2286e9a0d7f88b7f6bc90f8444185cfec832c8', id: this.componentId }, hAsync("button", { key: '968953600d615f2739757a91422dafdb817c9a6f', class: this.getTriggerClasses(), type: "button", popoverTarget: this.variant !== 'clear' ? `${this.componentId}-popover` : undefined, popoverTargetAction: this.variant !== 'clear' ? 'toggle' : undefined, onKeyDown: this.variant === 'clear' ? this.handleKeyDown : undefined, onClick: (event) => this.handleClick(event), part: "button", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": this.variant !== 'clear' ? 'true' : undefined, "aria-controls": this.variant !== 'clear' ? `${this.componentId}-popover` : undefined }, hAsync("span", { key: 'ee479f7e510ffcb54f7857cb7d1345f2a5c1d76a', class: "pds-filter__button-content", part: "button-content" }, this.renderIcon(), this.text && (hAsync("span", { key: 'e98aa8b915a2460f3c7d49e20ec7d43853ee5f9f', class: "pds-filter__button-text", part: "button-text" }, this.text)), this.renderDropdownIcon())), this.variant !== 'clear' && (hAsync("div", { key: '3084babfba2d96880b2829a60d2ef00140a6813b', ref: el => this.popoverEl = el, id: `${this.componentId}-popover`, class: "pds-filter__popover", popover: "auto", part: "popover" }, hAsync("slot", { key: 'e901488be75a18bedc6b2c42be5c398fd2cf2a29' })))));
17563
17723
  }
17564
17724
  get el() { return getElement(this); }
17565
17725
  static get style() { return pdsFilterCss(); }
@@ -17591,7 +17751,7 @@ class PdsFilters {
17591
17751
  registerInstance(this, hostRef);
17592
17752
  }
17593
17753
  render() {
17594
- return (hAsync(Host, { key: '8688235fe7cdea1b4fc540156ff21bb9711b41b6', id: this.componentId }, hAsync("div", { key: 'e51a37977df8c31f99b28d8c7e4bedb0d63e53c6', class: "pds-filters" }, hAsync("slot", { key: '8ce936da4d3f0213408090bc3eeb011920f9aa6c' }))));
17754
+ return (hAsync(Host, { key: '6f785fc222e3b5b7cf932f704b56aa7f1f52ead3', id: this.componentId }, hAsync("div", { key: '0ffd2894cdeb1e632228b4c3fa523069dcffa4b2', class: "pds-filters" }, hAsync("slot", { key: 'a3f42dedcda1b0fec78a33793d085791d9b9fc5c' }))));
17595
17755
  }
17596
17756
  static get style() { return pdsFiltersCss(); }
17597
17757
  static get cmpMeta() { return {
@@ -17842,12 +18002,16 @@ const pdsIconContent = new Map();
17842
18002
 
17843
18003
  const pdsIconCss = () => `:host{--dimension-icon-height:16px;--dimension-icon-width:16px;--color-icon-fill:currentColor;contain:strict;display:inline-block;fill:var(--color-icon-fill);-ms-flex-negative:0;flex-shrink:0;height:var(--dimension-icon-height);width:var(--dimension-icon-width)}:host .pdsicon{fill:var(--color-icon-fill)}.pds-icon-fill-none{fill:none}.icon-inner,.pds-icon,svg{display:block;height:100%;width:100%}:host(.flip-rtl):host-context([dir=rtl]) .icon-inner{-webkit-transform:scaleX(-1);transform:scaleX(-1)}:host(.flip-rtl:dir(rtl)) .icon-inner{-webkit-transform:scaleX(-1);transform:scaleX(-1)}:host(.flip-rtl:dir(ltr)) .icon-inner{-webkit-transform:scaleX(1);transform:scaleX(1)}`;
17844
18004
 
18005
+ // The attributes that give an icon its own accessible name.
18006
+ const NAMING_ATTRIBUTES = ['aria-label', 'aria-labelledby'];
17845
18007
  class PdsIcon {
17846
18008
  constructor(hostRef) {
17847
18009
  registerInstance(this, hostRef);
17848
18010
  this.didLoadIcon = false;
17849
18011
  this.iconName = null;
18012
+ this.warnedUnnamedFocusable = false;
17850
18013
  this.inheritedAttributes = {}; // eslint-disable-line @typescript-eslint/no-explicit-any
18014
+ this.isFocusable = false;
17851
18015
  this.isVisible = false;
17852
18016
  /**
17853
18017
  * The size of the icon. This can be
@@ -17856,10 +18020,6 @@ class PdsIcon {
17856
18020
  *
17857
18021
  */
17858
18022
  this.size = 'regular';
17859
- this.hasAriaHidden = () => {
17860
- const { el } = this;
17861
- return el.hasAttribute('aria-hidden') && el.getAttribute('aria-hidden') === 'true';
17862
- };
17863
18023
  }
17864
18024
  iconSize() {
17865
18025
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -17898,9 +18058,9 @@ class PdsIcon {
17898
18058
  }, 500);
17899
18059
  }
17900
18060
  componentWillLoad() {
17901
- this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);
18061
+ this.inheritedAttributes = inheritAttributes(this.el, NAMING_ATTRIBUTES);
18062
+ this.isFocusable = this.el.hasAttribute('tabindex');
17902
18063
  this.setCSSVariables();
17903
- this.setupInitialAriaLabel();
17904
18064
  }
17905
18065
  setCSSVariables() {
17906
18066
  var _a;
@@ -17909,6 +18069,7 @@ class PdsIcon {
17909
18069
  this.el.style.setProperty(`--color-icon-fill`, (_a = normalizeColorValue(this.color)) !== null && _a !== void 0 ? _a : 'currentColor');
17910
18070
  }
17911
18071
  connectedCallback() {
18072
+ this.observeNamingAttributes();
17912
18073
  // Handle re-connection during client-side navigation
17913
18074
  if (!this.isVisible && !this.svgContent) {
17914
18075
  this.waitUntilVisible(this.el, '50px', () => {
@@ -17927,14 +18088,16 @@ class PdsIcon {
17927
18088
  this.io.disconnect();
17928
18089
  this.io = undefined;
17929
18090
  }
18091
+ if (this.mo) {
18092
+ this.mo.disconnect();
18093
+ this.mo = undefined;
18094
+ }
17930
18095
  }
17931
18096
  updateStyles() {
17932
18097
  this.setCSSVariables();
17933
18098
  }
17934
18099
  onIconPropertyChange() {
17935
18100
  this.loadIcon();
17936
- // Update aria-label when icon properties change
17937
- this.setupInitialAriaLabel();
17938
18101
  }
17939
18102
  loadIcon() {
17940
18103
  // Reset load state when URL changes
@@ -17944,26 +18107,34 @@ class PdsIcon {
17944
18107
  this.iconName = getName(this.name, this.icon);
17945
18108
  }
17946
18109
  render() {
17947
- const { ariaLabel, flipRtl, iconName, inheritedAttributes } = this;
18110
+ const { flipRtl, iconName, inheritedAttributes } = this;
17948
18111
  const shouldIconAutoFlip = iconName
17949
18112
  ? shouldRtlFlipIcon(iconName, this.el) && flipRtl !== false
17950
18113
  : false;
17951
18114
  const shouldFlip = flipRtl || shouldIconAutoFlip;
17952
- // Use inherited aria-label if provided, otherwise fall back to auto-generated one
17953
- const finalAriaLabel = inheritedAttributes['aria-label'] || ariaLabel;
17954
- return (hAsync(Host, Object.assign({ key: '3af1c02235a2645bc3bb300831b19779cca78827', "aria-label": finalAriaLabel !== undefined && !this.hasAriaHidden() ? finalAriaLabel : null, alt: "", role: "img", class: Object.assign(Object.assign({}, createColorClasses(this.color)), { 'flip-rtl': shouldFlip, 'icon-rtl': shouldFlip && isRTL(this.el) }) }, inheritedAttributes), (hAsync("div", { class: "icon-inner" }))));
18115
+ // An icon is decorative unless the author names it. A decorative icon is hidden
18116
+ // from assistive technology, so it contributes nothing to the accessible name of
18117
+ // the button or link it sits inside. Naming it from `name` instead would put an
18118
+ // icon id ("rocket-tone") into that control's name, where neither a screen reader
18119
+ // nor a page-inspecting agent can tell it apart from the real label.
18120
+ //
18121
+ // A focusable icon stays exposed even without a name: hiding something that
18122
+ // takes focus leaves keyboard users on an element a screen reader can't see.
18123
+ const isNamed = NAMING_ATTRIBUTES.some((attr) => inheritedAttributes[attr] !== undefined);
18124
+ const isDecorative = !isNamed && !this.isFocusable;
18125
+ return (hAsync(Host
18126
+ // undefined, not null: null would strip an aria-hidden the author set on a
18127
+ // named icon once the component re-renders.
18128
+ , Object.assign({ key: '6597475535756e7174072dc25c982137724d439d', "aria-hidden": isDecorative ? 'true' : undefined, alt: "", role: isDecorative ? null : 'img', class: Object.assign(Object.assign({}, createColorClasses(this.color)), { 'flip-rtl': shouldFlip, 'icon-rtl': shouldFlip && isRTL(this.el) }) }, inheritedAttributes), (hAsync("div", { class: "icon-inner" }))));
17955
18129
  }
17956
18130
  /*****
17957
18131
  * Private Methods
17958
18132
  ****/
17959
- setupInitialAriaLabel() {
17960
- // Only set aria-label during initial load if one isn't already provided
17961
- if (!this.inheritedAttributes['aria-label']) {
17962
- const iconName = getName(this.name, this.icon);
17963
- if (iconName) {
17964
- this.ariaLabel = iconName.replace(/\-/g, ' ');
17965
- }
17966
- }
18133
+ // The hide/expose decision reads the naming attributes and tabindex, which can
18134
+ // change after load (a React prop going from undefined to a string, or
18135
+ // setAttribute from script). Re-read them when they do.
18136
+ observeNamingAttributes() {
18137
+ return;
17967
18138
  }
17968
18139
  waitUntilVisible(el, rootMargin, cb) {
17969
18140
  {
@@ -18050,7 +18221,8 @@ class PdsIcon {
18050
18221
  "name": [513],
18051
18222
  "size": [513],
18052
18223
  "src": [1],
18053
- "ariaLabel": [32],
18224
+ "inheritedAttributes": [32],
18225
+ "isFocusable": [32],
18054
18226
  "isVisible": [32],
18055
18227
  "svgContent": [32]
18056
18228
  },
@@ -18087,9 +18259,9 @@ class PdsImage {
18087
18259
  this.loading = 'eager';
18088
18260
  }
18089
18261
  render() {
18090
- return (hAsync(Host, { key: '1e8bb3882c2a629004ce1441e85d5c5a75a84e98', class: {
18262
+ return (hAsync(Host, { key: '6d2d48c468c39f53d67e63999dd83f3ad61053b5', class: {
18091
18263
  'pds-image': true,
18092
- }, id: this.componentId }, hAsync("img", { key: 'b50b19d51431d45027c7a918a4ba4c38493741d5', alt: this.alt, height: this.height, loading: this.loading, sizes: this.sizes, src: this.src, srcset: this.srcset, width: this.width })));
18264
+ }, id: this.componentId }, hAsync("img", { key: '393cc584586e37e8d5b602fbdcda1783bf80cf9b', alt: this.alt, height: this.height, loading: this.loading, sizes: this.sizes, src: this.src, srcset: this.srcset, width: this.width })));
18093
18265
  }
18094
18266
  static get style() { return pdsImageCss(); }
18095
18267
  static get cmpMeta() { return {
@@ -18409,10 +18581,10 @@ class PdsInput {
18409
18581
  'has-prepend': this.hasPrepend,
18410
18582
  'has-append': this.hasAppend,
18411
18583
  };
18412
- return (hAsync(Host, { key: '75eb8bc6cda5e947f8677ebefe7995688f03f947', "aria-disabled": this.disabled ? 'true' : null, "aria-readonly": this.readonly ? 'true' : null, "has-prefix": this.hasPrefix ? 'true' : null, "has-suffix": this.hasSuffix ? 'true' : null, "has-prepend": this.hasPrepend ? 'true' : null, "has-append": this.hasAppend ? 'true' : null, "has-action": this.hasAction && !this.hideLabel ? 'true' : null, "full-width": this.fullWidth ? 'true' : null }, hAsync("div", { key: '93d7f90b9a64daccea1533abc08a8cb18825b828', class: "pds-input" }, label && (hAsync("div", { key: '948109b3bfa1a1b8171572da9160425e3e35a7a6', class: {
18584
+ return (hAsync(Host, { key: '1706e29a68d25a8bb83c36d6bddace04a448f6f5', "aria-disabled": this.disabled ? 'true' : null, "aria-readonly": this.readonly ? 'true' : null, "has-prefix": this.hasPrefix ? 'true' : null, "has-suffix": this.hasSuffix ? 'true' : null, "has-prepend": this.hasPrepend ? 'true' : null, "has-append": this.hasAppend ? 'true' : null, "has-action": this.hasAction && !this.hideLabel ? 'true' : null, "full-width": this.fullWidth ? 'true' : null }, hAsync("div", { key: '1488b6ea995c4ffc4068757f566494c0ac073950', class: "pds-input" }, label && (hAsync("div", { key: 'e2fe4e461e626648ec51882e92e02fea179e3e13', class: {
18413
18585
  'pds-input__label-wrapper': true,
18414
18586
  'visually-hidden': this.hideLabel,
18415
- } }, hAsync("label", { key: 'bb0e6c6febb97ad4aa3942ac5e67ac42dc1bde0a', htmlFor: componentId, class: "pds-input__label" }, hAsync("span", { key: 'c6a122f829aa3b92ccb715c3f3975f6baadb3028' }, label, this.required && hAsync("span", { key: 'dce7d1a9c010a545992734bd238e9f6a4ca7b4ce', class: "pds-input__required-indicator" }, " *"))), !this.hideLabel && this.renderAction())), hAsync("div", { key: '1b92ab5d649a4a9cf8112ea9b8a8a1095714f6d0', class: inputWrapperClasses }, this.renderPrepend(), this.renderPrefix(), hAsync("input", Object.assign({ key: 'bc3c4b907312149d375bb78f9912e4501da59348', ref: (input) => (this.nativeInput = input), class: "pds-input__field", "aria-describedby": assignDescription(componentId, invalid, helperMessage, errorMessage), "aria-invalid": invalid ? "true" : undefined, autocomplete: this.autocomplete, disabled: disabled, id: componentId, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, step: this.step, type: this.type, value: value, onInput: this.onInputEvent, onChange: this.onChangeEvent, onBlur: this.onBlurEvent, onFocus: this.onFocusEvent, onKeyDown: this.onKeyDownEvent, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd }, this.inheritedAttributes)), this.renderSuffix(), this.renderAppend()), helperMessage && (hAsync("p", { key: 'f7bcbafc17a20310d602fce14a0adad522acbcb1', class: "pds-input__helper-message", id: messageId(componentId, 'helper') }, helperMessage)), errorMessage && (hAsync("p", { key: 'bbbd6dc3203b89e5759587147de74d2ce3ce6177', class: "pds-input__error-message", id: messageId(componentId, 'error') }, hAsync("pds-icon", { key: '68a6a92c82c1756ad99f431e0cb56756e3cdf75c', "aria-hidden": "true", icon: danger, size: "small" }), errorMessage)))));
18587
+ } }, hAsync("label", { key: 'c926a6fbb3130afdc6c86d509b92fb6650391c4b', htmlFor: componentId, class: "pds-input__label" }, hAsync("span", { key: 'dbbaf9d0db49f949f69f1faf848e7c6193e32793' }, label, this.required && hAsync("span", { key: '42e6325a0f5ee276ed92cf2eb71942c268c3d1aa', class: "pds-input__required-indicator" }, " *"))), !this.hideLabel && this.renderAction())), hAsync("div", { key: '4715743733f2d7d3e4edf9ac4ab6d69ffde04d00', class: inputWrapperClasses }, this.renderPrepend(), this.renderPrefix(), hAsync("input", Object.assign({ key: '438ac0fc6d497a8227c83e628d29d4633ffc208a', ref: (input) => (this.nativeInput = input), class: "pds-input__field", "aria-describedby": assignDescription(componentId, invalid, helperMessage, errorMessage), "aria-invalid": invalid ? "true" : undefined, autocomplete: this.autocomplete, disabled: disabled, id: componentId, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, step: this.step, type: this.type, value: value, onInput: this.onInputEvent, onChange: this.onChangeEvent, onBlur: this.onBlurEvent, onFocus: this.onFocusEvent, onKeyDown: this.onKeyDownEvent, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd }, this.inheritedAttributes)), this.renderSuffix(), this.renderAppend()), helperMessage && (hAsync("p", { key: '43b5c3a332072f19a38be316565602932c61504d', class: "pds-input__helper-message", id: messageId(componentId, 'helper') }, helperMessage)), errorMessage && (hAsync("p", { key: '54fd4fc2dcbc645377edbe4d04cfd82c7d1591e8', class: "pds-input__error-message", id: messageId(componentId, 'error') }, hAsync("pds-icon", { key: '2bd509a575ec5c7a548955dd7f706d7c1d42557e', "aria-hidden": "true", icon: danger, size: "small" }), errorMessage)))));
18416
18588
  }
18417
18589
  static get formAssociated() { return true; }
18418
18590
  get el() { return getElement(this); }
@@ -18466,8 +18638,10 @@ class PdsInput {
18466
18638
  }; }
18467
18639
  }
18468
18640
 
18469
- const pdsLinkCss = () => `:host{display:inline}:host pds-icon{-webkit-margin-start:var(--pine-dimension-2xs);margin-inline-start:var(--pine-dimension-2xs)}.pds-link{-ms-flex-align:center;align-items:center;color:var(--color, var(--pds-context-link-color, var(--pine-color-text)));display:-ms-inline-flexbox;display:inline-flex;font-weight:var(--pine-font-weight-medium)}.pds-link:focus-visible{border-radius:var(--pine-dimension-2xs);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width-thick);position:relative}.pds-link:hover{color:var(--color, var(--pds-context-link-color-hover, var(--pine-color-text-hover)));text-decoration:none}:host([color=secondary]) .pds-link{color:var(--pine-color-text-primary)}:host([color=secondary]) .pds-link:hover{color:var(--pine-color-text-inverse-secondary)}:host([color=accent]) .pds-link{color:var(--pine-color-accent)}:host([color=accent]) .pds-link:hover{color:var(--pine-color-accent-hover)}:host([color=danger]) .pds-link{color:var(--pine-color-danger)}:host([color=danger]) .pds-link:hover{color:var(--pine-color-danger-hover)}.pds-link--sm{font-size:var(--pine-font-size-body-xs)}.pds-link--sm pds-icon{height:var(--pine-dimension-xs);width:var(--pine-dimension-xs)}.pds-link--md{font-size:var(--pine-font-size-body-sm)}.pds-link--md pds-icon{height:var(--pine-dimension-xs);width:var(--pine-dimension-xs)}.pds-link--lg{font-size:var(--pine-font-size-body-md)}.pds-link--lg pds-icon{height:var(--pine-dimension-sm);width:var(--pine-dimension-sm)}.pds-link--plain{text-decoration:none}.pds-link--plain:hover{color:var(--color, var(--pds-context-link-color-hover, var(--pine-color-text-hover)));text-decoration:underline}:host([active]) .pds-link{color:var(--pds-context-link-color, var(--pine-color-text-strong));text-decoration:underline}:host([active]) .pds-link:hover{color:var(--pds-context-link-color-hover, var(--pine-color-text-strong));text-decoration:underline}`;
18641
+ const pdsLinkCss = () => `:host{display:inline}:host pds-icon{-webkit-margin-start:var(--pine-dimension-2xs);margin-inline-start:var(--pine-dimension-2xs)}.pds-link{-ms-flex-align:center;align-items:center;color:var(--color, var(--pds-context-link-color, var(--pine-color-text)));display:-ms-inline-flexbox;display:inline-flex;font-weight:var(--pine-font-weight-medium)}.pds-link:focus-visible{border-radius:var(--pine-dimension-2xs);isolation:isolate;outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width-thick)}.pds-link:hover{color:var(--color, var(--pds-context-link-color-hover, var(--pine-color-text-hover)));text-decoration:none}:host([color=secondary]) .pds-link{color:var(--pine-color-text-primary)}:host([color=secondary]) .pds-link:hover{color:var(--pine-color-text-inverse-secondary)}:host([color=accent]) .pds-link{color:var(--pine-color-accent)}:host([color=accent]) .pds-link:hover{color:var(--pine-color-accent-hover)}:host([color=danger]) .pds-link{color:var(--pine-color-danger)}:host([color=danger]) .pds-link:hover{color:var(--pine-color-danger-hover)}.pds-link--sm{font-size:var(--pine-font-size-body-xs)}.pds-link--sm pds-icon{height:var(--pine-dimension-xs);width:var(--pine-dimension-xs)}.pds-link--md{font-size:var(--pine-font-size-body-sm)}.pds-link--md pds-icon{height:var(--pine-dimension-xs);width:var(--pine-dimension-xs)}.pds-link--lg{font-size:var(--pine-font-size-body-md)}.pds-link--lg pds-icon{height:var(--pine-dimension-sm);width:var(--pine-dimension-sm)}.pds-link--plain{text-decoration:none}.pds-link--plain:hover{color:var(--color, var(--pds-context-link-color-hover, var(--pine-color-text-hover)));text-decoration:underline}:host([active]) .pds-link{color:var(--pds-context-link-color, var(--pine-color-text-strong));text-decoration:underline}:host([active]) .pds-link:hover{color:var(--pds-context-link-color-hover, var(--pine-color-text-strong));text-decoration:underline}`;
18470
18642
 
18643
+ // Used when `externalLabel` is unset; an empty string hides the icon instead.
18644
+ const DEFAULT_EXTERNAL_LABEL = '(opens in a new tab)';
18471
18645
  /**
18472
18646
  * @part link - Link element styles.
18473
18647
  * @slot (default) - Text content placed between the opening and closing tags. If no text is provided, the **href** will be used as a fallback.
@@ -18521,11 +18695,18 @@ class PdsLink {
18521
18695
  return linkStyles;
18522
18696
  }
18523
18697
  render() {
18698
+ var _a;
18524
18699
  const targetValue = this.target || (this.external ? '_blank' : undefined);
18525
18700
  const showExternalIcon = this.external;
18526
- const relValue = targetValue === '_blank' ? 'noopener noreferrer' : undefined;
18527
- return (hAsync("a", { key: '3b6f9d19d7f50d0606cf5f3c3a97b85ee4aa63b0', class: this.classNames(), download: this.download, href: this.href, id: this.componentId, part: "link", "aria-current": this.active ? 'page' : undefined, target: targetValue, rel: relValue, style: this.setLinkStyles(), "data-turbo": this.turbo || undefined, "data-turbo-frame": this.turboFrame || undefined, "data-turbo-action": this.turboAction || undefined, "data-turbo-method": this.turboMethod || undefined, "data-turbo-confirm": this.turboConfirm || undefined, "data-turbo-stream": this.turboStream || undefined, "data-turbo-prefetch": this.turboPrefetch || undefined, "data-turbo-preload": this.turboPreload || undefined }, hAsync("slot", { key: 'a265f1c4c9b6ff089b23906d8f650bfd65b25013' }, this.href), showExternalIcon &&
18528
- hAsync("pds-icon", { key: '9553a8256b6811296ea4b762e32662c1a2f4aecf', icon: launch, size: this.fontSize })));
18701
+ const opensInNewTab = targetValue === '_blank';
18702
+ const relValue = opensInNewTab ? 'noopener noreferrer' : undefined;
18703
+ // A `target` other than _blank overrides `external`, and then the label
18704
+ // would be false, so the icon is decorative there, as it is when the
18705
+ // label is empty.
18706
+ const externalLabel = (_a = this.externalLabel) !== null && _a !== void 0 ? _a : DEFAULT_EXTERNAL_LABEL;
18707
+ const externalIconLabel = opensInNewTab && externalLabel !== '' ? externalLabel : undefined;
18708
+ return (hAsync("a", { key: 'ae7928aa6dce42657545a1d17581818d3724746f', class: this.classNames(), download: this.download, href: this.href, id: this.componentId, part: "link", "aria-current": this.active ? 'page' : undefined, target: targetValue, rel: relValue, style: this.setLinkStyles(), "data-turbo": this.turbo || undefined, "data-turbo-frame": this.turboFrame || undefined, "data-turbo-action": this.turboAction || undefined, "data-turbo-method": this.turboMethod || undefined, "data-turbo-confirm": this.turboConfirm || undefined, "data-turbo-stream": this.turboStream || undefined, "data-turbo-prefetch": this.turboPrefetch || undefined, "data-turbo-preload": this.turboPreload || undefined }, hAsync("slot", { key: 'e61374c58fddec869f2f5dda54634a0b1ba9f345' }, this.href), showExternalIcon &&
18709
+ hAsync("pds-icon", { key: '161657146e5f3ce360480c573ea8f14c9012cb1f', icon: launch, size: this.fontSize, "aria-label": externalIconLabel, "aria-hidden": externalIconLabel === undefined ? 'true' : undefined })));
18529
18710
  }
18530
18711
  static get style() { return pdsLinkCss(); }
18531
18712
  static get cmpMeta() { return {
@@ -18537,6 +18718,7 @@ class PdsLink {
18537
18718
  "download": [1],
18538
18719
  "componentId": [1, "component-id"],
18539
18720
  "external": [4],
18721
+ "externalLabel": [1, "external-label"],
18540
18722
  "target": [1],
18541
18723
  "variant": [1],
18542
18724
  "fontSize": [1, "font-size"],
@@ -18624,7 +18806,7 @@ class PdsLoader {
18624
18806
  'aria-live': 'polite',
18625
18807
  };
18626
18808
  this.hostKeeper.record(hostClass, {}, hostAttributes);
18627
- return (hAsync(Host, Object.assign({ key: 'c42c1aeec5c8db9a1065f35492734a8cb265f3ce', class: hostClass }, hostAttributes), this.variant === 'spinner' && (hAsync("div", { key: 'dc1b7943709d03e02467cca0817fb6a7ad5ed10a', class: "pds-loader--spinner" }, hAsync("svg", { key: 'db38e607541ac1eb91be87b2cd0240341c8fb51d', style: this.getSvgStyle(), viewBox: "0 0 200 200", fill: "none", part: "loader-svg" }, hAsync("defs", { key: 'd734ef70b0039758a25881c22bb3e6453ac40012' }, hAsync("linearGradient", { key: '697627f516c5f7b4cd5351dd39de231c0cb9e429', id: "spinner-secondHalf" }, hAsync("stop", { key: '03082c0ec354685eebf7d0132202d54b083d26df', offset: "0%", "stop-opacity": "0", "stop-color": "currentColor" }), hAsync("stop", { key: '181b661b36aeb44943e20dec513f7265a9487004', offset: "100%", "stop-opacity": "0.5", "stop-color": "currentColor" })), hAsync("linearGradient", { key: '67f6c51aefe99bcbfdb741290337364501fc4fcb', id: "spinner-firstHalf" }, hAsync("stop", { key: 'cb6adf27ecb06b42ba572a702153de960491b0b6', offset: "0%", "stop-opacity": "1", "stop-color": "currentColor" }), hAsync("stop", { key: 'aeebabfa1ac00391937388feefa120bd0bb4d26c', offset: "100%", "stop-opacity": "0.5", "stop-color": "currentColor" }))), hAsync("g", { key: 'f06ca75e4df171b6db426fce9bc34076cfee5bca', class: "pds-loader__spinner-path" }, hAsync("path", { key: 'a278b37de8f77a1000efecb62b89e3f751712a98', stroke: "url(#spinner-secondHalf)", d: "M 4 100 A 96 96 0 0 1 196 100" }), hAsync("path", { key: 'a035add4d01b60bcebf7625c8730d6a41ddf40ff', stroke: "url(#spinner-firstHalf)", d: "M 196 100 A 96 96 0 0 1 4 100" }), hAsync("path", { key: '1189c8299d33a2a6bb6a8345b60f22bf4ad9beee', stroke: "currentColor", "stroke-linecap": "round", d: "M 4 100 A 96 96 0 0 1 4 98" }))))), this.variant === 'typing' && (hAsync("div", { key: '39826fae20e8826d9c73cf57ba938583d610e1ea', class: "pds-loader--typing" }, hAsync("span", { key: '8f2b837c79548a1080710a7cc30c3be3a051e1dd' }), hAsync("span", { key: '8efb1193ef51f110950861767eccc3896e90b81e' }), hAsync("span", { key: '366f2d205adbb043691c253cff17d2d29d56a2cc' }))), hAsync("div", { key: 'aeaa4aa12863b34088e84fd2791c2ce32dc05248', class: `pds-loader__label ${this.showLabel ? '' : 'pds-loader--hidden'}` }, hAsync("slot", { key: '7a8ec45aed1cd6f9e60f4db2ec5376439fa41c81', name: "label" }, "Loading..."))));
18809
+ return (hAsync(Host, Object.assign({ key: 'eaf8a64d5c2e37349ed2d2426a6c6bf1df68005f', class: hostClass }, hostAttributes), this.variant === 'spinner' && (hAsync("div", { key: '216143117aabd29ca52c56cd7951a27f9742e466', class: "pds-loader--spinner" }, hAsync("svg", { key: '9c9db37e883fb3a4ba5e0c7c173a5d7a76cdadda', style: this.getSvgStyle(), viewBox: "0 0 200 200", fill: "none", part: "loader-svg" }, hAsync("defs", { key: '8f65f537290ea2dd96b66343324851d243fec3dd' }, hAsync("linearGradient", { key: '8b1a53bcc9401b98dafa805cae8e417af7646bfd', id: "spinner-secondHalf" }, hAsync("stop", { key: 'f06605f7180e9c07d5eb4c9dbadcdb87cee0dd70', offset: "0%", "stop-opacity": "0", "stop-color": "currentColor" }), hAsync("stop", { key: '0bf492e4d5578bd0d98a2f7570a1dd21ca2ecf3d', offset: "100%", "stop-opacity": "0.5", "stop-color": "currentColor" })), hAsync("linearGradient", { key: '6c7038c158d786866a408063b07b236bf17cefc1', id: "spinner-firstHalf" }, hAsync("stop", { key: '916502c73bc4b78368bb210aed318537841917b9', offset: "0%", "stop-opacity": "1", "stop-color": "currentColor" }), hAsync("stop", { key: '2d20708106bb3a685fbaf4bdcf099684a36359c0', offset: "100%", "stop-opacity": "0.5", "stop-color": "currentColor" }))), hAsync("g", { key: '93165f80e7d5155b3dc8f2fc62e326bec7604c57', class: "pds-loader__spinner-path" }, hAsync("path", { key: '4b1e39a899aadf9d4b4cbf954c783c1103c43c24', stroke: "url(#spinner-secondHalf)", d: "M 4 100 A 96 96 0 0 1 196 100" }), hAsync("path", { key: '0aa1683dc97e2a01cc076a52a4883388c1d09c6f', stroke: "url(#spinner-firstHalf)", d: "M 196 100 A 96 96 0 0 1 4 100" }), hAsync("path", { key: '9839fb9e0b473814d3b10eb27f7be87990b6c088', stroke: "currentColor", "stroke-linecap": "round", d: "M 4 100 A 96 96 0 0 1 4 98" }))))), this.variant === 'typing' && (hAsync("div", { key: 'd83e4625ea2d41a545a98e08edb3033b83e7eb5b', class: "pds-loader--typing" }, hAsync("span", { key: '2e793f3f5b17cb7709c8fc89e2054d7cd77fafd4' }), hAsync("span", { key: 'c266ad3b8edf6c1cc392c544027f7cfd543b711c' }), hAsync("span", { key: '061f9e3030cce603e50e8d86d3aa5036800c1324' }))), hAsync("div", { key: '747c1c6c28136cfb9ba9dac0d4944bc6281af075', class: `pds-loader__label ${this.showLabel ? '' : 'pds-loader--hidden'}` }, hAsync("slot", { key: '5eb5a5710deafa10bd269429edff0ac677546cf5', name: "label" }, "Loading..."))));
18628
18810
  }
18629
18811
  get el() { return getElement(this); }
18630
18812
  static get watchers() { return {
@@ -18648,12 +18830,6 @@ class PdsLoader {
18648
18830
  }; }
18649
18831
  }
18650
18832
 
18651
- const pdsModalCss = () => `.pds-modal__backdrop{-ms-flex-align:start;align-items:flex-start;background-color:rgba(0, 0, 0, 0.4);border:0;display:-ms-flexbox;display:flex;height:100%;inset:0;-ms-flex-pack:center;justify-content:center;margin:0;max-height:100%;max-width:100%;opacity:0;padding:0;position:fixed;-webkit-transition:opacity var(--pine-motion-duration-base) var(--pine-motion-easing-in), visibility var(--pine-motion-duration-base) var(--pine-motion-easing-in);transition:opacity var(--pine-motion-duration-base) var(--pine-motion-easing-in), visibility var(--pine-motion-duration-base) var(--pine-motion-easing-in);visibility:hidden;width:100%;z-index:var(--pine-z-index-modal)}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}}pds-modal .pds-modal__backdrop{z-index:var(--pine-z-index-priority)}.pds-modal__backdrop::-webkit-backdrop{background:transparent}.pds-modal__backdrop::-ms-backdrop{background:transparent}.pds-modal__backdrop::backdrop{background:transparent}.pds-modal__backdrop[aria-modal=false]{overflow:auto;-ms-scroll-chaining:none;overscroll-behavior:contain}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop[aria-modal=false]{-webkit-backdrop-filter:none;backdrop-filter:none}.pds-modal__backdrop[aria-modal=false]::before{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);content:"";inset:0;position:fixed;z-index:-1}}.pds-modal__backdrop.open{opacity:1;-webkit-transition-timing-function:var(--pine-motion-easing-out);transition-timing-function:var(--pine-motion-easing-out);visibility:visible}.pds-modal{background:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-sm);-webkit-box-shadow:var(--pine-box-shadow-400);box-shadow:var(--pine-box-shadow-400);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:var(--pine-dimension-md);max-height:none;width:100%}.pds-modal.pds-modal--scrollable{max-height:calc(100vh - (5vh + 96px))}@supports (height: 100dvh){.pds-modal.pds-modal--scrollable{max-height:calc(100dvh - (5dvh + 96px))}}@media (min-width: 992px){.pds-modal{-webkit-margin-before:6vh;margin-block-start:6vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:6dvh;margin-block-start:6dvh}}}@media (min-width: 1200px){.pds-modal{-webkit-margin-before:8vh;margin-block-start:8vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:8dvh;margin-block-start:8dvh}}}.pds-modal--sm{max-width:520px}.pds-modal--md{max-width:700px}.pds-modal--lg{max-width:900px}.pds-modal--custom{max-width:var(--pds-modal-max-width, 700px)}.pds-modal--fullscreen{border-radius:0;height:100%;margin:0;max-height:100vh;max-width:100%}@supports (height: 100dvh){.pds-modal--fullscreen{max-height:100dvh}}.pds-modal--fullscreen.pds-modal--scrollable{max-height:100vh}@supports (height: 100dvh){.pds-modal--fullscreen.pds-modal--scrollable{max-height:100dvh}}.pds-modal--fullscreen .pds-modal-content{-ms-flex:1;flex:1}.pds-modal--scrollable pds-modal-content{-webkit-border-after:1px solid transparent;border-block-end:1px solid transparent;-webkit-border-before:1px solid transparent;border-block-start:1px solid transparent;overflow-y:auto}.pds-modal:not(.pds-modal--scrollable) pds-modal-content{overflow-y:visible}`;
18652
-
18653
- const PRESET_SIZES = ['sm', 'md', 'lg', 'fullscreen'];
18654
- const isCustomLength = (value) => /^[a-z0-9.%+\-*/(), ]+$/i.test(value) &&
18655
- /\d/.test(value) &&
18656
- (typeof CSS === 'undefined' || CSS.supports('max-width', value));
18657
18833
  const TABBABLE = [
18658
18834
  'a[href]',
18659
18835
  'area[href]',
@@ -18680,7 +18856,8 @@ function collectTabbable(root, found) {
18680
18856
  const isTabStop = (el) => { var _a; return el.tabIndex >= 0 || (el.isContentEditable && !el.hasAttribute('tabindex') && !((_a = el.parentElement) === null || _a === void 0 ? void 0 : _a.isContentEditable)); };
18681
18857
  function visitTabbable(el, found) {
18682
18858
  var _a, _b, _c, _d;
18683
- if (el.hasAttribute('inert'))
18859
+ // A tooltip portaled into a dialog only describes the control that has focus; it's never a stop of its own.
18860
+ if (el.hasAttribute('inert') || el.getAttribute('role') === 'tooltip')
18684
18861
  return;
18685
18862
  if (el.localName === 'slot') {
18686
18863
  const slot = el;
@@ -18735,6 +18912,13 @@ function tabbableIn(root) {
18735
18912
  });
18736
18913
  return oneRadioPerGroup(visible);
18737
18914
  }
18915
+
18916
+ const pdsModalCss = () => `.pds-modal__backdrop{-ms-flex-align:start;align-items:flex-start;background-color:rgba(0, 0, 0, 0.4);border:0;display:-ms-flexbox;display:flex;height:100%;inset:0;-ms-flex-pack:center;justify-content:center;margin:0;max-height:100%;max-width:100%;opacity:0;padding:0;position:fixed;-webkit-transition:opacity var(--pine-motion-duration-base) var(--pine-motion-easing-in), visibility var(--pine-motion-duration-base) var(--pine-motion-easing-in);transition:opacity var(--pine-motion-duration-base) var(--pine-motion-easing-in), visibility var(--pine-motion-duration-base) var(--pine-motion-easing-in);visibility:hidden;width:100%;z-index:var(--pine-z-index-modal)}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}}pds-modal pds-modal .pds-modal__backdrop{z-index:var(--pine-z-index-priority)}.pds-modal__backdrop::-webkit-backdrop{background:transparent}.pds-modal__backdrop::-ms-backdrop{background:transparent}.pds-modal__backdrop::backdrop{background:transparent}.pds-modal__backdrop[aria-modal=false]{overflow:auto;-ms-scroll-chaining:none;overscroll-behavior:contain}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop[aria-modal=false]{-webkit-backdrop-filter:none;backdrop-filter:none}.pds-modal__backdrop[aria-modal=false]::before{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);content:"";inset:0;position:fixed;z-index:-1}}.pds-modal__backdrop.open{opacity:1;-webkit-transition-timing-function:var(--pine-motion-easing-out);transition-timing-function:var(--pine-motion-easing-out);visibility:visible}.pds-modal{background:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-sm);-webkit-box-shadow:var(--pine-box-shadow-400);box-shadow:var(--pine-box-shadow-400);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:var(--pine-dimension-md);max-height:none;width:100%}.pds-modal.pds-modal--scrollable{max-height:calc(100vh - (5vh + 96px))}@supports (height: 100dvh){.pds-modal.pds-modal--scrollable{max-height:calc(100dvh - (5dvh + 96px))}}@media (min-width: 992px){.pds-modal{-webkit-margin-before:6vh;margin-block-start:6vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:6dvh;margin-block-start:6dvh}}}@media (min-width: 1200px){.pds-modal{-webkit-margin-before:8vh;margin-block-start:8vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:8dvh;margin-block-start:8dvh}}}.pds-modal--sm{max-width:520px}.pds-modal--md{max-width:700px}.pds-modal--lg{max-width:900px}.pds-modal--custom{max-width:var(--pds-modal-max-width, 700px)}.pds-modal--fullscreen{border-radius:0;height:100%;margin:0;max-height:100vh;max-width:100%}@supports (height: 100dvh){.pds-modal--fullscreen{max-height:100dvh}}.pds-modal--fullscreen.pds-modal--scrollable{max-height:100vh}@supports (height: 100dvh){.pds-modal--fullscreen.pds-modal--scrollable{max-height:100dvh}}.pds-modal--fullscreen .pds-modal-content{-ms-flex:1;flex:1}.pds-modal--scrollable pds-modal-content{-webkit-border-after:1px solid transparent;border-block-end:1px solid transparent;-webkit-border-before:1px solid transparent;border-block-start:1px solid transparent;overflow-y:auto}.pds-modal:not(.pds-modal--scrollable) pds-modal-content{overflow-y:visible}`;
18917
+
18918
+ const PRESET_SIZES = ['sm', 'md', 'lg', 'fullscreen'];
18919
+ const isCustomLength = (value) => /^[a-z0-9.%+\-*/(), ]+$/i.test(value) &&
18920
+ /\d/.test(value) &&
18921
+ (typeof CSS === 'undefined' || CSS.supports('max-width', value));
18738
18922
  /** Whether `node` is `ancestor` or inside it, crossing shadow roots, which `Node.contains` doesn't. */
18739
18923
  function containsComposed(ancestor, node) {
18740
18924
  for (let current = node; current; current = current instanceof ShadowRoot ? current.host : current.parentNode) {
@@ -19297,14 +19481,14 @@ class PdsModal {
19297
19481
  }
19298
19482
  render() {
19299
19483
  const [sizeClass = 'md', customSize] = this.resolveSize();
19300
- return (hAsync("dialog", { key: '0a3ea92246b5ae704bc7dcbadf4f4e0d5a54e9e6', class: {
19484
+ return (hAsync("dialog", { key: 'cd574868a46b69185e2058c60374dbec34677732', class: {
19301
19485
  'pds-modal__backdrop': true,
19302
19486
  'open': this.open
19303
- }, "aria-modal": this.disableTopLayer ? 'false' : 'true', "aria-labelledby": `${this.componentId}-heading`, onClick: this.handleBackdropClick, onCancel: this.handleCancel }, hAsync("div", { key: 'a38029c2284ed345bec2ce7638fc3415818cd609', class: {
19487
+ }, "aria-modal": this.disableTopLayer ? 'false' : 'true', "aria-labelledby": `${this.componentId}-heading`, onClick: this.handleBackdropClick, onCancel: this.handleCancel }, hAsync("div", { key: '8c50fb4810b4bb07d62348fed44df30b14a52acd', class: {
19304
19488
  'pds-modal': true,
19305
19489
  [`pds-modal--${sizeClass}`]: true,
19306
19490
  'pds-modal--scrollable': this.scrollable
19307
- }, style: customSize !== undefined ? { '--pds-modal-max-width': customSize } : undefined, part: "modal" }, hAsync("slot", { key: '396da81af42685f5c083f853afa207a6844e444e' }))));
19491
+ }, style: customSize !== undefined ? { '--pds-modal-max-width': customSize } : undefined, part: "modal" }, hAsync("slot", { key: '25a71c95dfeff4648a28edef21bf510b1743ed7c' }))));
19308
19492
  }
19309
19493
  get el() { return getElement(this); }
19310
19494
  static get watchers() { return {
@@ -19523,10 +19707,10 @@ class PdsModalContent {
19523
19707
  render() {
19524
19708
  // Only apply max-height style if it's not 'none'
19525
19709
  const styleObj = this.contentMaxHeight !== 'none' ? { maxHeight: this.contentMaxHeight } : {};
19526
- return (hAsync(Host, { key: 'c83e230d23444e3d5358d995170e2b8386884fe8' }, hAsync("div", { key: 'b91de2c71e693b5a1ba2b257d741e7b0418c2d76', class: {
19710
+ return (hAsync(Host, { key: 'b4200778f186c45a1917646ba2e0e4e623959951' }, hAsync("div", { key: '39eaaf228e5441f5c0fd628c47be079fb4e07e0f', class: {
19527
19711
  'pds-modal-content': true,
19528
19712
  [`pds-modal-content--border-${this.border}`]: true
19529
- }, style: styleObj, tabindex: "-1" }, hAsync("slot", { key: '971cbd44ffeac4bb13a651948a119c603bed9e4f' }))));
19713
+ }, style: styleObj, tabindex: "-1" }, hAsync("slot", { key: 'ac31a9b81941b8b3abbac3a67c25bacaa54e6840' }))));
19530
19714
  }
19531
19715
  get el() { return getElement(this); }
19532
19716
  static get style() { return pdsModalContentCss(); }
@@ -19557,7 +19741,7 @@ class PdsModalFooter {
19557
19741
  unwrapReconnectedContent(this.el.querySelector('.pds-modal__footer'), '.pds-modal__footer');
19558
19742
  }
19559
19743
  render() {
19560
- return (hAsync("footer", { key: '030153b84f1ea1cb133c9ccec3ad86583995974f', class: "pds-modal__footer" }, hAsync("slot", { key: '3a479e7047f3e845a65c37d60539648c8ff78602' })));
19744
+ return (hAsync("footer", { key: 'c0d50408471355d80759112e63f58c8a34fb7906', class: "pds-modal__footer" }, hAsync("slot", { key: '6566d446457be8b57e37bf1542a5863b0018d233' })));
19561
19745
  }
19562
19746
  get el() { return getElement(this); }
19563
19747
  static get style() { return pdsModalFooterCss(); }
@@ -19585,7 +19769,7 @@ class PdsModalHeader {
19585
19769
  unwrapReconnectedContent(this.el.querySelector('.pds-modal__header'), '.pds-modal__header');
19586
19770
  }
19587
19771
  render() {
19588
- return (hAsync("header", { key: 'ee3ac5fb9b00a943aa86c3434ea07291b74d776c', class: "pds-modal__header" }, hAsync("slot", { key: '0b0f7ff257635723099c536648a826be8dcc05e7' })));
19772
+ return (hAsync("header", { key: 'eb295ff36fd23b7965296b6dfcfcf783a32079a0', class: "pds-modal__header" }, hAsync("slot", { key: '9c97566ff79f8d9b233d814395d5a7e893751a06' })));
19589
19773
  }
19590
19774
  get el() { return getElement(this); }
19591
19775
  static get style() { return pdsModalHeaderCss(); }
@@ -19906,6 +20090,12 @@ class PdsMultiselect {
19906
20090
  }
19907
20091
  else {
19908
20092
  this.closeDropdown();
20093
+ // Tab would move on to an option's checkbox, which closing removes, dropping focus to the page.
20094
+ // Land on the trigger instead, as Escape does; Shift+Tab already reaches it.
20095
+ const trigger = e.shiftKey ? undefined : this.activeTriggerEl;
20096
+ trigger === null || trigger === void 0 ? void 0 : trigger.focus();
20097
+ if (trigger === null || trigger === void 0 ? void 0 : trigger.matches(':focus'))
20098
+ e.preventDefault();
19909
20099
  }
19910
20100
  break;
19911
20101
  }
@@ -20864,10 +21054,10 @@ class PdsMultiselect {
20864
21054
  }
20865
21055
  render() {
20866
21056
  const hasSelections = this.selectedItems.length > 0;
20867
- return (hAsync(Host, { key: 'd0879469e6ff943374c2f035c0a8d6d57c25dc5f', "aria-disabled": this.disabled ? 'true' : null }, hAsync("div", { key: '80caa694099218561b85c93d547ec9208def0ec7', class: "pds-multiselect", onFocusout: this.handleContainerFocusOut }, this.label && (hAsync("label", { key: 'b4eaa2c9e2901c28ecb0b8f55e63e33ad899e945', id: `${this.componentId}-label`, htmlFor: this.componentId, class: {
21057
+ return (hAsync(Host, { key: '8f1ce5ef092285ce7c0855643fae76a4ec86ee17', "aria-disabled": this.disabled ? 'true' : null }, hAsync("div", { key: 'c14c3d52c1d55fb33a89f1a25055728215a1e4ab', class: "pds-multiselect", onFocusout: this.handleContainerFocusOut }, this.label && (hAsync("label", { key: 'aacd3339b0db2048b31fbc5963f7232bbff78efe', id: `${this.componentId}-label`, htmlFor: this.componentId, class: {
20868
21058
  'pds-multiselect__label': true,
20869
21059
  'visually-hidden': this.hideLabel,
20870
- } }, this.label)), hAsync("div", { key: '404ed58aa6bfb2248ffad5e56ebabfe65149b9a4', class: "pds-multiselect__wrapper", ref: el => (this.containerEl = el), style: { width: this.triggerWidth } }, this.slottedTriggerEl ? (hAsync("slot", { name: "trigger" })) : this.selectedDisplay === 'pill' && this.pillPosition === 'inline' ? (hAsync("div", { ref: el => (this.pillInlineTriggerEl = el || undefined), part: "trigger", class: {
21060
+ } }, this.label)), hAsync("div", { key: '5e1ef76aa5d46798519e5ac885bfa1c8d7c7106c', class: "pds-multiselect__wrapper", ref: el => (this.containerEl = el), style: { width: this.triggerWidth } }, this.slottedTriggerEl ? (hAsync("slot", { name: "trigger" })) : this.selectedDisplay === 'pill' && this.pillPosition === 'inline' ? (hAsync("div", { ref: el => (this.pillInlineTriggerEl = el || undefined), part: "trigger", class: {
20871
21061
  'pds-multiselect__trigger': true,
20872
21062
  'pds-multiselect__trigger--open': this.isOpen,
20873
21063
  'pds-multiselect__trigger--disabled': this.disabled,
@@ -20883,7 +21073,7 @@ class PdsMultiselect {
20883
21073
  }, id: this.componentId, disabled: this.disabled, "aria-required": this.required ? 'true' : undefined, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": "listbox", "aria-describedby": assignDescription(this.componentId, this.invalid || !!this.errorMessage, this.helperMessage, this.errorMessage), "aria-invalid": this.invalid || !!this.errorMessage ? 'true' : undefined, onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown }, hAsync("span", { class: {
20884
21074
  'pds-multiselect__trigger-text': true,
20885
21075
  'pds-multiselect__trigger-text--placeholder': !hasSelections || (this.selectedDisplay === 'pill' && this.pillPosition === 'below'),
20886
- } }, this.getTriggerText()), hAsync("pds-icon", { "aria-hidden": "true", class: "pds-multiselect__icon", icon: enlarge }))), this.renderDropdown()), this.selectedDisplay === 'pill' && this.pillPosition === 'below' && this.renderBelowPills(), hAsync("span", { key: '73f17916a37722fefebd6b5a184a7b3dca6f4a9d', class: "visually-hidden", "aria-live": "polite", "aria-atomic": "true" }, this.removalAnnouncement), this.helperMessage && !(this.errorMessage && this.errorMessage.length > 0) && (hAsync("p", { key: '1a987562b21da6f8d2f8c9f94e93e8c99a7abd74', class: "pds-multiselect__helper", id: messageId(this.componentId, 'helper') }, this.helperMessage)), this.errorMessage && (hAsync("p", { key: 'ce1f7f48d6f8dee320d87cb7088f084e68cb3ab5', class: "pds-multiselect__error", id: messageId(this.componentId, 'error') }, hAsync("pds-icon", { key: '8347dfdec6ef1b81d4cf9f72cba3d9ec965dcf08', "aria-hidden": "true", icon: danger, size: "small" }), this.errorMessage)), hAsync("div", { key: '74cd840e102ad635d2f4bc23cf3bcfaa61d5cea1', style: { display: 'none' } }, hAsync("slot", { key: 'c2fd9e71363a9661062c8d88be0dd78fc98b964d' })))));
21076
+ } }, this.getTriggerText()), hAsync("pds-icon", { "aria-hidden": "true", class: "pds-multiselect__icon", icon: enlarge }))), this.renderDropdown()), this.selectedDisplay === 'pill' && this.pillPosition === 'below' && this.renderBelowPills(), hAsync("span", { key: '590045e4769812a1a2f7a97580d21d95dbe4e872', class: "visually-hidden", "aria-live": "polite", "aria-atomic": "true" }, this.removalAnnouncement), this.helperMessage && !(this.errorMessage && this.errorMessage.length > 0) && (hAsync("p", { key: '419f4349b7cb17260f03d2bdcfd777561a62de42', class: "pds-multiselect__helper", id: messageId(this.componentId, 'helper') }, this.helperMessage)), this.errorMessage && (hAsync("p", { key: 'b922af14c83348607aa9aaaefe9b03b39e71bd42', class: "pds-multiselect__error", id: messageId(this.componentId, 'error') }, hAsync("pds-icon", { key: 'bd08726adf14a42f2ecf0cdfcd390e5639f9fd96', "aria-hidden": "true", icon: danger, size: "small" }), this.errorMessage)), hAsync("div", { key: '42ad7905fb1816ccdd29b6aa438779929804b368', style: { display: 'none' } }, hAsync("slot", { key: '4f3bf380e93d216790efb0a5de85d6479862350e' })))));
20887
21077
  }
20888
21078
  static get formAssociated() { return true; }
20889
21079
  get el() { return getElement(this); }
@@ -21021,7 +21211,7 @@ const cssEscape = (value) => {
21021
21211
  return result;
21022
21212
  };
21023
21213
 
21024
- const pdsPopoverCss = () => `:host{--sizing-max-width-default:352px;display:inline-block}:host .pds-popover__trigger-wrapper{display:inline-block}:host .pds-popover__content-slot-wrapper{display:none}`;
21214
+ const pdsPopoverCss = () => `:host{--sizing-max-width-default:352px;display:inline-block}:host .pds-popover__trigger-wrapper{display:inline-block}:host .pds-popover__tab-guard{opacity:0;outline:none;pointer-events:none;position:fixed}:host .pds-popover__content-slot-wrapper{display:none}`;
21025
21215
 
21026
21216
  /** Open popovers that close on Escape, in the order they opened: Escape goes to the last one it applies to. */
21027
21217
  const popoversTakingEscape = [];
@@ -21029,6 +21219,24 @@ const popoversTakingEscape = [];
21029
21219
  const HOVER_OPEN_DELAY_MS = 120;
21030
21220
  /** Leaving the trigger and panel waits this long before closing, which covers the gap between them. */
21031
21221
  const HOVER_CLOSE_DELAY_MS = 200;
21222
+ /**
21223
+ * floating-ui reporting viewport coordinates, as `position: fixed` uses without a containing block. Its own
21224
+ * containing-block check misses a backdrop filter in WebKit, so handlePopoverPositioning corrects for one itself.
21225
+ */
21226
+ const viewportPlatform = Object.assign(Object.assign({}, platform), { getOffsetParent: () => window });
21227
+ /**
21228
+ * Where `top: 0; left: 0` puts a fixed element beside the given one. An empty probe is measured instead of the
21229
+ * element, whose own transforms, such as an entrance animation, would otherwise read as part of the offset.
21230
+ */
21231
+ const containingBlockOrigin = (element) => {
21232
+ var _a;
21233
+ const probe = document.createElement('div');
21234
+ probe.style.cssText = 'all: initial; position: fixed; top: 0; left: 0;';
21235
+ (_a = element.parentNode) === null || _a === void 0 ? void 0 : _a.insertBefore(probe, element);
21236
+ const { top, left } = probe.getBoundingClientRect();
21237
+ probe.remove();
21238
+ return { top, left };
21239
+ };
21032
21240
  /** The focused element, followed down through shadow roots to the control that has focus. */
21033
21241
  function deepActiveElement() {
21034
21242
  var _a;
@@ -21037,6 +21245,27 @@ function deepActiveElement() {
21037
21245
  active = active.shadowRoot.activeElement;
21038
21246
  return active;
21039
21247
  }
21248
+ /** `node`, or the shadow host it sits in, lifted until it shares a tree with `other` or reaches the document. */
21249
+ function liftToTreeOf(node, other) {
21250
+ let current = node;
21251
+ while (current.getRootNode() !== other.getRootNode() && current.getRootNode() instanceof ShadowRoot) {
21252
+ current = current.getRootNode().host;
21253
+ }
21254
+ return current;
21255
+ }
21256
+ /**
21257
+ * Where `node` sits relative to `ref`, as `compareDocumentPosition` reports it. Whichever of the two
21258
+ * is inside a shadow root is lifted to its host first, so a control inside a component compares too.
21259
+ */
21260
+ function positionAcrossTrees(ref, node) {
21261
+ const lifted = liftToTreeOf(node, ref);
21262
+ return liftToTreeOf(ref, lifted).compareDocumentPosition(lifted);
21263
+ }
21264
+ const isPosition = (position, flag) => (position & Node.DOCUMENT_POSITION_DISCONNECTED) === 0 && (position & flag) !== 0;
21265
+ /** The popover each panel belongs to, so a popover inside another one's panel can find it. */
21266
+ const panelOwners = new WeakMap();
21267
+ /** Floating layers Pine components put at the end of the page or of a dialog, as a popover does its panel. */
21268
+ const FLOATING_LAYERS = '.pds-popover, .pds-datepicker-calendar-portal, .pds-combobox-dropdown-portal';
21040
21269
  /**
21041
21270
  * @slot trigger - The trigger element for the popover
21042
21271
  * @slot (default) - The content to display inside the popover
@@ -21076,14 +21305,21 @@ class PdsPopover {
21076
21305
  */
21077
21306
  this.portalEl = null;
21078
21307
  /**
21079
- * Guard to prevent repositioning loops
21308
+ * Stops floating-ui's autoUpdate, which repositions the open panel as its trigger or the page moves or resizes
21309
+ */
21310
+ this.stopAutoUpdate = null;
21311
+ /**
21312
+ * Counts positioning runs, so a run that resolves after a newer one started is dropped
21313
+ */
21314
+ this.positioningRun = 0;
21315
+ /**
21316
+ * The latest positioning run, which pdsPopoverOpen waits for so the panel's side is set when it fires
21080
21317
  */
21081
- this.isRepositioning = false;
21318
+ this.positioning = Promise.resolve();
21082
21319
  /**
21083
- * Debounce timers for performance optimization
21320
+ * Set while show() waits to emit pdsPopoverOpen, so a hide() in the meantime emits it first
21084
21321
  */
21085
- this.scrollDebounceTimer = null;
21086
- this.resizeDebounceTimer = null;
21322
+ this.openEventPending = false;
21087
21323
  /**
21088
21324
  * Track moved nodes and their placeholders for restoration
21089
21325
  */
@@ -21104,6 +21340,18 @@ class PdsPopover {
21104
21340
  * How far the pointer was from the panel at its last move after leaving the trigger
21105
21341
  */
21106
21342
  this.panelDistance = Infinity;
21343
+ /**
21344
+ * Stands in for the panel in the Tab order, right after the trigger, while the popover is open
21345
+ */
21346
+ this.tabGuardEl = null;
21347
+ /**
21348
+ * Set while focus passes through the guard on its way out of the panel
21349
+ */
21350
+ this.leavingPanel = false;
21351
+ /**
21352
+ * The direction of the Tab key being handled, until its default action has run
21353
+ */
21354
+ this.tabDirection = null;
21107
21355
  /**
21108
21356
  * Determines the action that triggers the popover. For manual popovers, the consumer is responsible for toggling this value.
21109
21357
  * @defaultValue "show"
@@ -21157,6 +21405,9 @@ class PdsPopover {
21157
21405
  else {
21158
21406
  this.triggerEl = null;
21159
21407
  }
21408
+ // autoUpdate watches the trigger it started with, so an open popover starts it again on the new one.
21409
+ if (this.active)
21410
+ this.addScrollAndResizeListeners();
21160
21411
  this.observeTrigger();
21161
21412
  };
21162
21413
  /**
@@ -21274,6 +21525,59 @@ class PdsPopover {
21274
21525
  event.stopPropagation();
21275
21526
  }
21276
21527
  };
21528
+ // At the end of the body or of a dialog, the panel would come last in the Tab order. The guard
21529
+ // after the trigger takes its place there, while the panel has a control for it to lead to.
21530
+ this.syncTabGuard = (event) => {
21531
+ if (event.key !== 'Tab')
21532
+ return;
21533
+ this.releasePanel();
21534
+ this.tabDirection = event.shiftKey ? 'backward' : 'forward';
21535
+ setTimeout(this.endTabKey);
21536
+ // Read on each Tab, as the panel's content can arrive after it opens.
21537
+ const guarding = this.guardedTabbables().length > 0;
21538
+ if (this.tabGuardEl != null)
21539
+ this.tabGuardEl.tabIndex = guarding ? 0 : -1;
21540
+ // Inert for this key press, the panel is reached only through the guard, either way round. A
21541
+ // control in another floating layer, such as a nested popover's panel, may move focus back into it.
21542
+ const focused = deepActiveElement();
21543
+ if (guarding && !containsComposed$1(this.portalEl, focused) && !closest$1(FLOATING_LAYERS, focused !== null && focused !== void 0 ? focused : document)) {
21544
+ this.portalEl.inert = true;
21545
+ }
21546
+ };
21547
+ this.endTabKey = () => {
21548
+ this.tabDirection = null;
21549
+ this.releasePanel();
21550
+ };
21551
+ this.handleTabGuardFocus = (event) => {
21552
+ if (this.leavingPanel)
21553
+ return;
21554
+ // An inert panel's controls aren't tabbable, so the guard would find none to send focus to.
21555
+ this.releasePanel();
21556
+ const tabbables = this.guardedTabbables();
21557
+ // A Tab press says which end of the panel focus comes in at; without one, where it came from does.
21558
+ const from = event.relatedTarget;
21559
+ const backward = this.tabDirection != null ? this.tabDirection === 'backward' : from != null && this.isAfterPopover(from);
21560
+ const target = backward ? tabbables[tabbables.length - 1] : tabbables[0];
21561
+ // Focus can reach the guard without a Tab keydown here (from a frame, or assistive tech) after
21562
+ // the panel's controls are gone. The trigger is the nearest visible place for it.
21563
+ if (target == null)
21564
+ this.returnFocusToTrigger();
21565
+ else
21566
+ target.focus();
21567
+ };
21568
+ this.handleTabFromPanel = (event) => {
21569
+ if (event.key !== 'Tab' || event.defaultPrevented || this.tabGuardEl == null)
21570
+ return;
21571
+ const tabbables = this.guardedTabbables();
21572
+ const edge = event.shiftKey ? tabbables[0] : tabbables[tabbables.length - 1];
21573
+ if (edge == null || deepActiveElement() !== edge)
21574
+ return;
21575
+ this.leavePanel(edge, event.shiftKey);
21576
+ };
21577
+ this.releasePanel = () => {
21578
+ if (this.portalEl != null)
21579
+ this.portalEl.inert = false;
21580
+ };
21277
21581
  }
21278
21582
  openOnChanged() {
21279
21583
  this.pin();
@@ -21309,8 +21613,6 @@ class PdsPopover {
21309
21613
  // Bind event handlers for cleanup
21310
21614
  this.boundClickOutsideHandler = this.handleClickOutside.bind(this);
21311
21615
  this.boundEscapeKeyHandler = this.handleEscapeKey.bind(this);
21312
- this.boundScrollHandler = this.handleScroll.bind(this);
21313
- this.boundResizeHandler = this.handleResize.bind(this);
21314
21616
  // Create portal element
21315
21617
  this.createPortal();
21316
21618
  this.hasLoaded = true;
@@ -21409,11 +21711,12 @@ class PdsPopover {
21409
21711
  // is in now, if any.
21410
21712
  if (this.active) {
21411
21713
  this.placePortal();
21412
- requestAnimationFrame(() => this.handlePopoverPositioning());
21714
+ // autoUpdate listens to the scroll containers around where the trigger was, so it starts again.
21715
+ this.addScrollAndResizeListeners();
21413
21716
  }
21414
21717
  }
21415
21718
  disconnectedCallback() {
21416
- var _a;
21719
+ var _a, _b;
21417
21720
  // Moved in one operation (a DOM morph, or a framework reparenting it), the popover is
21418
21721
  // already back in the page. Its portal is outside the popover, so it stays open, with focus
21419
21722
  // where it was; connectedCallback moves it to follow the popover.
@@ -21428,6 +21731,7 @@ class PdsPopover {
21428
21731
  this.restorePortalContent();
21429
21732
  this.active = false;
21430
21733
  this.linkTriggerToPortal();
21734
+ this.emitOpenEvent();
21431
21735
  this.pdsPopoverClose.emit({
21432
21736
  componentId: this.componentId,
21433
21737
  popoverType: this.popoverType,
@@ -21444,32 +21748,20 @@ class PdsPopover {
21444
21748
  this.removeLightDismissListeners();
21445
21749
  this.removeScrollAndResizeListeners();
21446
21750
  document.removeEventListener('submit', this.handleSubmitFromPanel, true);
21447
- // Clear any pending debounce timers
21448
- this.clearDebounceTimers();
21751
+ document.removeEventListener('keydown', this.syncTabGuard, true);
21752
+ (_b = this.tabGuardEl) === null || _b === void 0 ? void 0 : _b.removeAttribute('tabindex');
21449
21753
  this.clearHoverTimers();
21450
21754
  this.hoverOpened = false;
21451
21755
  // Remove portal from DOM
21452
21756
  this.removePortal();
21453
21757
  }
21454
- /**
21455
- * Clears any pending debounce timers
21456
- */
21457
- clearDebounceTimers() {
21458
- if (this.scrollDebounceTimer !== null) {
21459
- clearTimeout(this.scrollDebounceTimer);
21460
- this.scrollDebounceTimer = null;
21461
- }
21462
- if (this.resizeDebounceTimer !== null) {
21463
- clearTimeout(this.resizeDebounceTimer);
21464
- this.resizeDebounceTimer = null;
21465
- }
21466
- }
21467
21758
  createPortal() {
21468
21759
  var _a;
21469
21760
  if (this.portalEl !== null)
21470
21761
  return;
21471
21762
  this.portalEl = document.createElement('div');
21472
21763
  this.portalEl.className = 'pds-popover';
21764
+ panelOwners.set(this.portalEl, this);
21473
21765
  // Apply all styles inline since portal is outside shadow DOM
21474
21766
  this.portalEl.style.position = 'fixed';
21475
21767
  this.portalEl.style.zIndex = 'var(--pine-z-index-raised)';
@@ -21496,6 +21788,7 @@ class PdsPopover {
21496
21788
  // This is done after appending to ensure it's part of the document and can access CSS variables
21497
21789
  this.addPortalFocusStyles();
21498
21790
  this.listenForHover(this.portalEl);
21791
+ this.portalEl.addEventListener('keydown', this.handleTabFromPanel);
21499
21792
  }
21500
21793
  /**
21501
21794
  * Adds Pine design system focus styles and dark mode border to the portal element
@@ -21629,15 +21922,10 @@ class PdsPopover {
21629
21922
  this.portalEl.style.display = 'block';
21630
21923
  this.portalEl.style.opacity = '1';
21631
21924
  this.portalEl.style.visibility = 'visible';
21632
- // Position the popover
21633
- requestAnimationFrame(() => {
21634
- if (!this.isComponentMounted)
21635
- return;
21636
- this.handlePopoverPositioning();
21637
- });
21638
- // Add scroll and resize listeners for repositioning (always)
21925
+ // Position the popover now, and again whenever its trigger or the page moves or resizes
21639
21926
  this.addScrollAndResizeListeners();
21640
21927
  document.addEventListener('submit', this.handleSubmitFromPanel, true);
21928
+ document.addEventListener('keydown', this.syncTabGuard, true);
21641
21929
  // Add document listeners for light dismiss and escape key (auto type only), or for the escape
21642
21930
  // key alone while hover holds a manual popover open
21643
21931
  if (this.popoverType === 'auto') {
@@ -21648,7 +21936,20 @@ class PdsPopover {
21648
21936
  popoversTakingEscape.push(this);
21649
21937
  document.addEventListener('keydown', this.boundEscapeKeyHandler);
21650
21938
  }
21651
- // Emit open event
21939
+ // Emit open event once the panel is positioned, with the side it took already on it. A reconnect, a
21940
+ // trigger swap or another show() can start a newer run meanwhile, which drops this one, so wait for the latest.
21941
+ this.openEventPending = true;
21942
+ let positioning;
21943
+ do {
21944
+ positioning = this.positioning;
21945
+ await positioning;
21946
+ } while (positioning !== this.positioning);
21947
+ this.emitOpenEvent();
21948
+ }
21949
+ emitOpenEvent() {
21950
+ if (!this.openEventPending)
21951
+ return;
21952
+ this.openEventPending = false;
21652
21953
  this.pdsPopoverOpen.emit({
21653
21954
  componentId: this.componentId,
21654
21955
  popoverType: this.popoverType,
@@ -21658,6 +21959,7 @@ class PdsPopover {
21658
21959
  * Closes the popover programmatically
21659
21960
  */
21660
21961
  async hide() {
21962
+ var _a;
21661
21963
  this.clearHoverTimers();
21662
21964
  if (!this.active || !this.portalEl)
21663
21965
  return;
@@ -21673,6 +21975,7 @@ class PdsPopover {
21673
21975
  // Hide portal. The dark-mode border set in a shadow root is worked out again on the next open.
21674
21976
  this.portalEl.style.border = '';
21675
21977
  this.portalEl.removeAttribute('data-pds-popover-open');
21978
+ this.portalEl.removeAttribute('data-pds-popover-placement');
21676
21979
  this.portalEl.style.display = 'none';
21677
21980
  this.portalEl.style.opacity = '0';
21678
21981
  this.portalEl.style.visibility = 'hidden';
@@ -21686,8 +21989,11 @@ class PdsPopover {
21686
21989
  this.removeLightDismissListeners();
21687
21990
  this.removeScrollAndResizeListeners();
21688
21991
  document.removeEventListener('submit', this.handleSubmitFromPanel, true);
21689
- // Clear any pending timers
21690
- this.clearDebounceTimers();
21992
+ document.removeEventListener('keydown', this.syncTabGuard, true);
21993
+ (_a = this.tabGuardEl) === null || _a === void 0 ? void 0 : _a.removeAttribute('tabindex');
21994
+ this.releasePanel();
21995
+ // Closed before its first position resolved, it still announces the open before the close.
21996
+ this.emitOpenEvent();
21691
21997
  // Emit close event
21692
21998
  this.pdsPopoverClose.emit({
21693
21999
  componentId: this.componentId,
@@ -21699,10 +22005,10 @@ class PdsPopover {
21699
22005
  */
21700
22006
  async toggle() {
21701
22007
  if (this.active) {
21702
- this.hide();
22008
+ await this.hide();
21703
22009
  }
21704
22010
  else {
21705
- this.show();
22011
+ await this.show();
21706
22012
  }
21707
22013
  }
21708
22014
  /**
@@ -21786,19 +22092,62 @@ class PdsPopover {
21786
22092
  document.removeEventListener('click', this.boundClickOutsideHandler, true);
21787
22093
  document.removeEventListener('keydown', this.boundEscapeKeyHandler);
21788
22094
  }
22095
+ /**
22096
+ * The panel's controls that Tab reaches through the guard. None when the panel sits right after
22097
+ * the popover, in a dialog, where it's already next in the Tab order.
22098
+ */
22099
+ guardedTabbables() {
22100
+ if (this.portalEl == null || this.el.nextElementSibling === this.portalEl)
22101
+ return [];
22102
+ return tabbableIn(this.portalEl);
22103
+ }
22104
+ isAfterPopover(node) {
22105
+ if (containsComposed$1(this.el, node))
22106
+ return false;
22107
+ return isPosition(positionAcrossTrees(this.el, node), Node.DOCUMENT_POSITION_FOLLOWING);
22108
+ }
22109
+ /**
22110
+ * Moves focus to the guard without preventing the Tab, so the browser's Tab carries on from there.
22111
+ * Inert until then, the panel can't be where it lands.
22112
+ */
22113
+ leavePanel(edge, backward) {
22114
+ var _a, _b;
22115
+ this.leavingPanel = true;
22116
+ (_a = this.tabGuardEl) === null || _a === void 0 ? void 0 : _a.focus();
22117
+ this.leavingPanel = false;
22118
+ this.portalEl.inert = true;
22119
+ setTimeout(() => this.finishLeavingPanel(edge));
22120
+ // Last in another popover's panel, the guard hands the Tab on to that popover's own guard.
22121
+ const outer = panelOwners.get(closest$1('.pds-popover', this.el));
22122
+ const outerTabbables = (_b = outer === null || outer === void 0 ? void 0 : outer.guardedTabbables()) !== null && _b !== void 0 ? _b : [];
22123
+ if (!backward && outerTabbables[outerTabbables.length - 1] === this.tabGuardEl)
22124
+ outer.leavePanel(edge, false);
22125
+ }
22126
+ // With nowhere for the browser's Tab to go, focus would stay on the invisible guard.
22127
+ finishLeavingPanel(edge) {
22128
+ var _a;
22129
+ this.releasePanel();
22130
+ if (this.active && ((_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.activeElement) === this.tabGuardEl)
22131
+ edge.focus();
22132
+ }
21789
22133
  /**
21790
22134
  * Adds scroll and resize listeners for repositioning
21791
22135
  */
21792
22136
  addScrollAndResizeListeners() {
21793
- window.addEventListener('scroll', this.boundScrollHandler, true);
21794
- window.addEventListener('resize', this.boundResizeHandler);
22137
+ this.removeScrollAndResizeListeners();
22138
+ if (this.triggerEl == null || this.portalEl == null)
22139
+ return;
22140
+ this.stopAutoUpdate = autoUpdate(this.triggerEl, this.portalEl, () => {
22141
+ this.positioning = this.handlePopoverPositioning().catch(error => console.warn('pds-popover: failed to position the panel', error));
22142
+ });
21795
22143
  }
21796
22144
  /**
21797
22145
  * Removes scroll and resize listeners
21798
22146
  */
21799
22147
  removeScrollAndResizeListeners() {
21800
- window.removeEventListener('scroll', this.boundScrollHandler, true);
21801
- window.removeEventListener('resize', this.boundResizeHandler);
22148
+ var _a;
22149
+ (_a = this.stopAutoUpdate) === null || _a === void 0 ? void 0 : _a.call(this);
22150
+ this.stopAutoUpdate = null;
21802
22151
  }
21803
22152
  /**
21804
22153
  * Handles clicks outside the popover for light dismiss (auto type only)
@@ -21862,122 +22211,38 @@ class PdsPopover {
21862
22211
  this.hide();
21863
22212
  }
21864
22213
  /**
21865
- * Handles scroll events to reposition the popover (debounced for performance)
22214
+ * Positions the popover relative to its trigger element, flipping to the opposite side when only that side has
22215
+ * room and shifting to stay 8px inside the viewport. The side it takes goes on the panel's `data-pds-popover-placement`.
21866
22216
  */
21867
- handleScroll() {
21868
- if (!this.active)
21869
- return;
21870
- if (this.scrollDebounceTimer !== null) {
21871
- clearTimeout(this.scrollDebounceTimer);
21872
- }
21873
- this.scrollDebounceTimer = setTimeout(() => {
21874
- this.handlePopoverPositioning();
21875
- this.scrollDebounceTimer = null;
21876
- }, 10); // 10ms debounce for smooth repositioning
21877
- }
21878
- /**
21879
- * Handles resize events to reposition the popover (debounced for performance)
21880
- */
21881
- handleResize() {
21882
- if (!this.active)
21883
- return;
21884
- if (this.resizeDebounceTimer !== null) {
21885
- clearTimeout(this.resizeDebounceTimer);
21886
- }
21887
- this.resizeDebounceTimer = setTimeout(() => {
21888
- this.handlePopoverPositioning();
21889
- this.resizeDebounceTimer = null;
21890
- }, 100); // 100ms debounce for resize
21891
- }
21892
- /**
21893
- * Positions the popover relative to its trigger element
21894
- */
21895
- handlePopoverPositioning() {
21896
- // Prevent repositioning loops
21897
- if (this.isRepositioning) {
21898
- return;
21899
- }
21900
- this.isRepositioning = true;
21901
- if (this.triggerEl == null || this.portalEl == null) {
21902
- this.isRepositioning = false;
22217
+ async handlePopoverPositioning() {
22218
+ // Counted before the guards, so a run still in flight is dropped even when this one can't position.
22219
+ const run = ++this.positioningRun;
22220
+ if (this.triggerEl == null || this.portalEl == null)
21903
22221
  return;
21904
- }
21905
- const triggerRect = this.triggerEl.getBoundingClientRect();
21906
- const popoverRect = this.portalEl.getBoundingClientRect();
21907
22222
  // Safety check: ensure trigger has valid dimensions (is rendered and visible)
21908
- if (triggerRect.width === 0 || triggerRect.height === 0) {
21909
- this.isRepositioning = false;
22223
+ const triggerRect = this.triggerEl.getBoundingClientRect();
22224
+ if (triggerRect.width === 0 || triggerRect.height === 0)
21910
22225
  return;
21911
- }
21912
- let top = 0;
21913
- let left = 0;
21914
- const offset = 8;
21915
- switch (this.placement) {
21916
- case 'top':
21917
- top = triggerRect.top - popoverRect.height - offset;
21918
- left = triggerRect.left + (triggerRect.width - popoverRect.width) / 2;
21919
- break;
21920
- case 'top-start':
21921
- top = triggerRect.top - popoverRect.height - offset;
21922
- left = triggerRect.left;
21923
- break;
21924
- case 'top-end':
21925
- top = triggerRect.top - popoverRect.height - offset;
21926
- left = triggerRect.right - popoverRect.width;
21927
- break;
21928
- case 'right':
21929
- top = triggerRect.top + (triggerRect.height - popoverRect.height) / 2;
21930
- left = triggerRect.right + offset;
21931
- break;
21932
- case 'right-start':
21933
- top = triggerRect.top;
21934
- left = triggerRect.right + offset;
21935
- break;
21936
- case 'right-end':
21937
- top = triggerRect.bottom - popoverRect.height;
21938
- left = triggerRect.right + offset;
21939
- break;
21940
- case 'bottom':
21941
- top = triggerRect.bottom + offset;
21942
- left = triggerRect.left + (triggerRect.width - popoverRect.width) / 2;
21943
- break;
21944
- case 'bottom-start':
21945
- top = triggerRect.bottom + offset;
21946
- left = triggerRect.left;
21947
- break;
21948
- case 'bottom-end':
21949
- top = triggerRect.bottom + offset;
21950
- left = triggerRect.right - popoverRect.width;
21951
- break;
21952
- case 'left':
21953
- top = triggerRect.top + (triggerRect.height - popoverRect.height) / 2;
21954
- left = triggerRect.left - popoverRect.width - offset;
21955
- break;
21956
- case 'left-start':
21957
- top = triggerRect.top;
21958
- left = triggerRect.left - popoverRect.width - offset;
21959
- break;
21960
- case 'left-end':
21961
- top = triggerRect.bottom - popoverRect.height;
21962
- left = triggerRect.left - popoverRect.width - offset;
21963
- break;
21964
- }
21965
- this.portalEl.style.top = `${top}px`;
21966
- this.portalEl.style.left = `${left}px`;
22226
+ const portal = this.portalEl;
22227
+ const { x: left, y: top, placement } = await computePosition(this.triggerEl, portal, {
22228
+ placement: this.placement,
22229
+ strategy: 'fixed',
22230
+ // With no room on either side, stay on the preferred side: the side that overflows less can still push
22231
+ // a tall panel's start above the viewport.
22232
+ middleware: [offset(8), flip({ fallbackStrategy: 'initialPlacement' }), shift({ padding: 8 })],
22233
+ platform: viewportPlatform,
22234
+ });
22235
+ if (!this.active || run !== this.positioningRun || portal !== this.portalEl)
22236
+ return;
22237
+ portal.setAttribute('data-pds-popover-placement', placement);
21967
22238
  // `position: fixed` measures from the viewport unless an ancestor becomes its containing block,
21968
- // as a modal dialog does with its backdrop filter. Shift by however far it landed from the spot.
21969
- const placed = this.portalEl.getBoundingClientRect();
21970
- if (Math.abs(placed.top - top) > 0.5 || Math.abs(placed.left - left) > 0.5) {
21971
- this.portalEl.style.top = `${2 * top - placed.top}px`;
21972
- this.portalEl.style.left = `${2 * left - placed.left}px`;
21973
- }
21974
- // Reset the repositioning guard after a short delay
21975
- setTimeout(() => {
21976
- this.isRepositioning = false;
21977
- }, 16); // ~1 frame at 60fps
22239
+ // as a modal dialog does with its backdrop filter. Offset by however far that block's corner is from the viewport's.
22240
+ const origin = containingBlockOrigin(portal);
22241
+ portal.style.top = `${top - origin.top}px`;
22242
+ portal.style.left = `${left - origin.left}px`;
21978
22243
  }
21979
22244
  render() {
21980
- return (hAsync(Host, { key: 'e48b897acdc9e89f2e6b1449e7a358da7da1060c', id: this.componentId }, hAsync("span", { key: 'b83b2c234b07703c2c850a9991c94939ed2fdaf7', class: "pds-popover__trigger-wrapper" }, hAsync("slot", { key: '0a7f7829ee445fd57cf824ebee1409b3c571f983', name: "trigger", onSlotchange: this.handleTriggerSlotChange })), hAsync("div", { key: '8c1fe2d4d7c4342b4bd5eb4c56e596f17b4e14fa', class: "pds-popover__content-slot-wrapper" }, hAsync("slot", { key: '4ccfce1f335acbc436f7942e497f5d360f849d48', onSlotchange: this.handleContentSlotChange }))));
22245
+ return (hAsync(Host, { key: '85422eb7544a4795ce78b51684b7224a5d856a4e', id: this.componentId }, hAsync("span", { key: '6fe9c827ed4d46ca723d6013f296faf80ba31366', class: "pds-popover__trigger-wrapper" }, hAsync("slot", { key: '970d1974d2be1451e670a36e7d2ccdc5979595bb', name: "trigger", onSlotchange: this.handleTriggerSlotChange })), hAsync("span", { key: '0c76f76286a30d8e6e948bd0abab3317b3673aa6', class: "pds-popover__tab-guard", ref: (el) => (this.tabGuardEl = el !== null && el !== void 0 ? el : null), onFocus: this.handleTabGuardFocus }), hAsync("div", { key: '692c45e93899e74a3d5970f3a3625f6115ab63b0', class: "pds-popover__content-slot-wrapper" }, hAsync("slot", { key: 'f1566e0eb1eb08626f2a8285447702ce96b09f4d', onSlotchange: this.handleContentSlotChange }))));
21981
22246
  }
21982
22247
  get el() { return getElement(this); }
21983
22248
  static get watchers() { return {
@@ -22050,7 +22315,7 @@ class PdsProgress {
22050
22315
  const normalizedFillColor = normalizeColorValue$1(this.fillColor);
22051
22316
  const hostClass = this.animated ? { 'is-animated': this.animated } : '';
22052
22317
  this.hostKeeper.record(hostClass);
22053
- return (hAsync(Host, { key: 'a224e1e9bc50433553ab8bf4b0d772f01148ee76', class: hostClass }, hAsync("div", { key: '261742044f3d68c204cbf640cc4447eb6d74df11', class: "pds-progress" }, hAsync("label", { key: 'd686bdc6ab450bf8c14dd56077525a3139593f46', class: "pds-progress__label", htmlFor: this.componentId }, this.label), hAsync("progress", { key: 'c716e977a952a628aec600fa680aa9c3b8d0e996', id: this.componentId, max: "100", style: normalizedFillColor ? { '--color-progress-fill': normalizedFillColor } : {}, value: this.percent })), this.showPercent && hAsync("div", { key: '44176a580b435f69993be4a60ee2e888b87e10fb', class: "pds-progress__percentage" }, this.percent, "%")));
22318
+ return (hAsync(Host, { key: '6d2151cdd1f65b33a7478e5ac12df711d8252d1f', class: hostClass }, hAsync("div", { key: '4a902c6c7d51fe8e8a778e1fa24bdbf95d625b1f', class: "pds-progress" }, hAsync("label", { key: 'c50955234a7eee05cdf47531e25b4413f206e416', class: "pds-progress__label", htmlFor: this.componentId }, this.label), hAsync("progress", { key: 'c54ad90f7b3fcf3368afca4c5618949f1a370114', id: this.componentId, max: "100", style: normalizedFillColor ? { '--color-progress-fill': normalizedFillColor } : {}, value: this.percent })), this.showPercent && hAsync("div", { key: '6b3e3f42f04a516ef7992d1f8bc967be432f55bb', class: "pds-progress__percentage" }, this.percent, "%")));
22054
22319
  }
22055
22320
  get el() { return getElement(this); }
22056
22321
  static get style() { return pdsProgressCss(); }
@@ -22085,7 +22350,7 @@ class PdsProperty {
22085
22350
  this.icon = 'star';
22086
22351
  }
22087
22352
  render() {
22088
- return (hAsync(Host, { key: 'd599b62be4bacf1d89afcc26b14fc93bdc9bb3a4', id: this.componentId }, hAsync("pds-box", { key: 'd7f80f6598615c761d672893c8acab09bd9ea33f', "align-items": "center", gap: "xs" }, hAsync("pds-icon", { key: '15a6a6545c2cd2332bd830451106b7b08adc39ff', icon: this.icon, size: "var(--pine-dimension-sm)", "aria-hidden": "true" }), hAsync("slot", { key: '4e5661563b99ec56189447faabcdd1ae631159b2' }))));
22353
+ return (hAsync(Host, { key: '198ffd747b7a84a6f58a1b072890fc8bd3ed93aa', id: this.componentId }, hAsync("pds-box", { key: 'be71f3d96efea0a45f357d888f71dbe5ad8b68d6', "align-items": "center", gap: "xs" }, hAsync("pds-icon", { key: '1a52407e00b158d5e6a515ad4b07ed3407d31f75', icon: this.icon, size: "var(--pine-dimension-sm)", "aria-hidden": "true" }), hAsync("slot", { key: '46ac5019b27bdd079c7853abeef8f7c240d19c2c' }))));
22089
22354
  }
22090
22355
  static get style() { return pdsPropertyCss(); }
22091
22356
  static get cmpMeta() { return {
@@ -22103,10 +22368,10 @@ class PdsProperty {
22103
22368
 
22104
22369
  const labelCss$3 = () => `.sc-pds-radio-h{display:inline-block}[aria-disabled=true].sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text-label-disabled)}[aria-readonly=true].sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text-label-readonly)}label.sc-pds-radio{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}`;
22105
22370
 
22106
- const pdsRadioCss = () => `.sc-pds-radio-h{--sizing-check-size:6px;--sizing-input-size:var(--pine-dimension-sm);--sizing-margin-block-start:6px;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap;position:relative}.is-invalid.sc-pds-radio-h .pds-radio__message--error.sc-pds-radio{color:var(--pine-color-text-message-danger)}.has-border.sc-pds-radio-h{-ms-flex-align:start;align-items:flex-start;border:var(--pine-border);border-radius:var(--pine-dimension-125);-webkit-column-gap:var(--pine-dimension-xs);-moz-column-gap:var(--pine-dimension-xs);column-gap:var(--pine-dimension-xs);display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;padding:var(--pine-dimension-md)}@media (max-width: 767px){.has-border.sc-pds-radio-h{-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex:1 1 100%;flex:1 1 100%;max-width:100%;min-width:0}}.has-border.sc-pds-radio-h:hover{border:var(--pine-border-hover)}.has-border.sc-pds-radio-h:has(input:checked){-webkit-box-shadow:0 0 0 2px var(--pine-color-primary-hover);box-shadow:0 0 0 2px var(--pine-color-primary-hover)}.has-border.sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text);font-weight:var(--pine-font-weight-semi-bold)}.has-border.sc-pds-radio-h label.sc-pds-radio::after{content:"";cursor:pointer;height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.has-border.sc-pds-radio-h:has(input:disabled){background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}.has-border.sc-pds-radio-h:has(input:disabled) label.sc-pds-radio{color:var(--pine-color-text-label-disabled);cursor:not-allowed}.has-border.sc-pds-radio-h:has(input:disabled) label.sc-pds-radio::after{cursor:not-allowed}.has-border.is-invalid.sc-pds-radio-h .pds-radio__message--error.sc-pds-radio{color:var(--pine-color-text-message-danger)}input.sc-pds-radio{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-border-radius-full);-ms-flex:none;flex:none;height:var(--sizing-input-size);margin:0;-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025);position:relative;width:var(--sizing-input-size)}input.visually-hidden.sc-pds-radio{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}input.sc-pds-radio:hover{background:var(--pine-color-background-container-hover);border:var(--pine-border-hover)}input.sc-pds-radio:checked{background:var(--pine-color-accent);border-color:var(--pine-color-accent)}input.sc-pds-radio:checked:hover{background:var(--pine-color-accent-hover);border-color:var(--pine-color-accent-hover)}input.sc-pds-radio:checked::after{background:var(--pine-color-text-primary);border-radius:var(--pine-border-radius-full);content:"";display:block;height:var(--sizing-check-size);left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:var(--sizing-check-size)}input.sc-pds-radio:disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}input.sc-pds-radio:disabled:checked{background-color:var(--pine-color-accent-disabled);border-color:var(--pine-color-border-disabled)}input.sc-pds-radio:disabled:checked::after{border-color:var(--pine-color-border-disabled)}input.sc-pds-radio:focus-visible{outline:var(--pine-outline-focus)}label.sc-pds-radio{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs)}label.sc-pds-radio:has(input:disabled){color:var(--pine-color-text-label-disabled);cursor:not-allowed}.sc-pds-radio-h:has(input:disabled) .pds-radio__message.sc-pds-radio{color:var(--pine-color-text-label-disabled)}.visually-hidden.sc-pds-radio{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-radio__message.sc-pds-radio{color:var(--pine-color-text-message);-ms-flex-preferred-size:100%;flex-basis:100%;font:var(--pine-typography-body);-webkit-margin-start:var(--pine-dimension-md);margin-inline-start:var(--pine-dimension-md);width:100%}.pds-radio__message--error.sc-pds-radio{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-radio__message--error.sc-pds-radio pds-icon.sc-pds-radio{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.has-image.sc-pds-radio-h{-ms-flex-align:center;align-items:center;border:var(--pine-border);border-radius:var(--pine-dimension-125);-webkit-column-gap:var(--pine-dimension-xs);-moz-column-gap:var(--pine-dimension-xs);column-gap:var(--pine-dimension-xs);display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:row;flex-direction:row;padding:var(--pine-dimension-md)}@media (max-width: 767px){.has-image.sc-pds-radio-h{-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex:1 1 100%;flex:1 1 100%;max-width:100%;min-width:0}}.has-image.sc-pds-radio-h:hover{border:var(--pine-border-hover)}.has-image.sc-pds-radio-h:has(input:checked){-webkit-box-shadow:0 0 0 2px var(--pine-color-primary-hover);box-shadow:0 0 0 2px var(--pine-color-primary-hover)}.has-image.sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text);display:-ms-flexbox;display:flex;font-weight:var(--pine-font-weight-semi-bold);gap:var(--pine-dimension-xs)}.has-image.sc-pds-radio-h label.sc-pds-radio::after{content:"";cursor:pointer;height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.has-image.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio{-ms-flex-align:center;align-items:center;align-self:center;border:var(--pine-border);border-radius:var(--pine-border-radius-full);cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex:none;flex:none;grid-area:image;-ms-flex-pack:center;justify-content:center;overflow:hidden;position:relative;-webkit-transition:all var(--pine-motion-duration-base) ease;transition:all var(--pine-motion-duration-base) ease}.has-image.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio:hover{border-color:var(--pine-color-border-hover)}.has-image.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio .pds-radio__image.sc-pds-radio{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.has-image.sc-pds-radio-h .pds-radio__content-wrapper.sc-pds-radio{-ms-flex:1;flex:1;min-width:0;overflow-wrap:anywhere}.has-image.sc-pds-radio-h .pds-radio__message.sc-pds-radio{grid-area:message;-webkit-margin-before:0;margin-block-start:0;-webkit-margin-start:0;margin-inline-start:0}.has-image.is-disabled.sc-pds-radio-h{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}.has-image.is-disabled.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio{border-color:var(--pine-color-border-disabled);cursor:not-allowed;opacity:0.5}.has-image.is-disabled.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio:hover{border-color:var(--pine-color-border-disabled)}.has-image.is-disabled.sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text-label-disabled);cursor:not-allowed}.has-image.is-disabled.sc-pds-radio-h label.sc-pds-radio::after{cursor:not-allowed}.has-image.is-disabled.sc-pds-radio-h .pds-radio__message.sc-pds-radio{color:var(--pine-color-text-label-disabled)}.has-image.is-invalid.sc-pds-radio-h .pds-radio__message--error.sc-pds-radio{color:var(--pine-color-text-message-danger)}`;
22371
+ const pdsRadioCss = () => `.sc-pds-radio-h{--sizing-check-size:6px;--sizing-input-size:var(--pine-dimension-sm);--sizing-margin-block-start:6px;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap;position:relative}.is-invalid.sc-pds-radio-h .pds-radio__message--error.sc-pds-radio{color:var(--pine-color-text-message-danger)}.has-border.sc-pds-radio-h{-ms-flex-align:start;align-items:flex-start;border:var(--pine-border);border-radius:var(--pine-dimension-125);-webkit-column-gap:var(--pine-dimension-xs);-moz-column-gap:var(--pine-dimension-xs);column-gap:var(--pine-dimension-xs);display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;padding:var(--pine-dimension-md)}@media (max-width: 767px){.has-border.sc-pds-radio-h{-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex:1 1 100%;flex:1 1 100%;max-width:100%;min-width:0}}.has-border.sc-pds-radio-h:hover{border:var(--pine-border-hover)}.has-border.sc-pds-radio-h:has(input:checked){-webkit-box-shadow:0 0 0 2px var(--pine-color-primary-hover);box-shadow:0 0 0 2px var(--pine-color-primary-hover)}.has-border.sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text);font-weight:var(--pine-font-weight-semi-bold)}.has-border.sc-pds-radio-h label.sc-pds-radio::after{content:"";cursor:pointer;height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.has-border.sc-pds-radio-h:has(input:disabled){background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}.has-border.sc-pds-radio-h:has(input:disabled) label.sc-pds-radio{color:var(--pine-color-text-label-disabled);cursor:not-allowed}.has-border.sc-pds-radio-h:has(input:disabled) label.sc-pds-radio::after{cursor:not-allowed}.has-border.is-invalid.sc-pds-radio-h .pds-radio__message--error.sc-pds-radio{color:var(--pine-color-text-message-danger)}input.sc-pds-radio{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-border-radius-full);-ms-flex:none;flex:none;height:var(--sizing-input-size);margin:0;-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025);position:relative;width:var(--sizing-input-size)}input.visually-hidden.sc-pds-radio{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}input.sc-pds-radio:hover{background:var(--pine-color-background-container-hover);border:var(--pine-border-hover)}input.sc-pds-radio:checked{background:var(--pine-color-accent);border-color:var(--pine-color-accent)}input.sc-pds-radio:checked:hover{background:var(--pine-color-accent-hover);border-color:var(--pine-color-accent-hover)}input.sc-pds-radio:checked::after{background:var(--pine-color-text-primary);border-radius:var(--pine-border-radius-full);content:"";display:block;height:var(--sizing-check-size);left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:var(--sizing-check-size)}input.sc-pds-radio:disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}input.sc-pds-radio:disabled:checked{background-color:var(--pine-color-accent-disabled);border-color:var(--pine-color-border-disabled)}input.sc-pds-radio:disabled:checked::after{border-color:var(--pine-color-border-disabled)}input.sc-pds-radio:focus-visible{outline:var(--pine-outline-focus)}label.sc-pds-radio{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs)}label.sc-pds-radio:has(input:disabled){color:var(--pine-color-text-label-disabled);cursor:not-allowed}.sc-pds-radio-h:has(input:disabled) .pds-radio__message.sc-pds-radio{color:var(--pine-color-text-label-disabled)}.visually-hidden.sc-pds-radio{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-radio__message.sc-pds-radio{color:var(--pine-color-text-message);-ms-flex-preferred-size:100%;flex-basis:100%;font:var(--pine-typography-body);-webkit-margin-start:var(--pine-dimension-md);margin-inline-start:var(--pine-dimension-md);width:100%}.pds-radio__message--error.sc-pds-radio{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-radio__message--error.sc-pds-radio pds-icon.sc-pds-radio{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.has-image.sc-pds-radio-h{-ms-flex-align:center;align-items:center;border:var(--pine-border);border-radius:var(--pine-dimension-125);-webkit-column-gap:var(--pine-dimension-xs);-moz-column-gap:var(--pine-dimension-xs);column-gap:var(--pine-dimension-xs);display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:row;flex-direction:row;padding:var(--pine-dimension-md)}@media (max-width: 767px){.has-image.sc-pds-radio-h{-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex:1 1 100%;flex:1 1 100%;max-width:100%;min-width:0}}.has-image.sc-pds-radio-h:hover{border:var(--pine-border-hover)}.has-image.sc-pds-radio-h:has(input:checked){-webkit-box-shadow:0 0 0 2px var(--pine-color-primary-hover);box-shadow:0 0 0 2px var(--pine-color-primary-hover)}.has-image.sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text);display:-ms-flexbox;display:flex;font-weight:var(--pine-font-weight-semi-bold);gap:var(--pine-dimension-xs)}.has-image.sc-pds-radio-h label.sc-pds-radio::after{content:"";cursor:pointer;height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.has-image.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio{-ms-flex-align:center;align-items:center;align-self:center;border:var(--pine-border);border-radius:var(--pine-border-radius-full);cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex:none;flex:none;grid-area:image;-ms-flex-pack:center;justify-content:center;overflow:hidden;position:relative;-webkit-transition:all var(--pine-motion-duration-base) ease;transition:all var(--pine-motion-duration-base) ease}.has-image.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio:hover{border-color:var(--pine-color-border-hover)}.has-image.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio .pds-radio__image.sc-pds-radio{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.has-image.sc-pds-radio-h .pds-radio__content-wrapper.sc-pds-radio{-ms-flex:1;flex:1;min-width:0;overflow-wrap:anywhere}.has-image.sc-pds-radio-h .pds-radio__message.sc-pds-radio{grid-area:message;-webkit-margin-before:0;margin-block-start:0;-webkit-margin-start:0;margin-inline-start:0}.has-image.is-disabled.sc-pds-radio-h{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}.has-image.is-disabled.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio{border-color:var(--pine-color-border-disabled);cursor:not-allowed;opacity:0.5}.has-image.is-disabled.sc-pds-radio-h .pds-radio__image-container.sc-pds-radio:hover{border-color:var(--pine-color-border-disabled)}.has-image.is-disabled.sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text-label-disabled);cursor:not-allowed}.has-image.is-disabled.sc-pds-radio-h label.sc-pds-radio::after{cursor:not-allowed}.has-image.is-disabled.sc-pds-radio-h .pds-radio__message.sc-pds-radio{color:var(--pine-color-text-label-disabled)}.has-image.is-invalid.sc-pds-radio-h .pds-radio__message--error.sc-pds-radio{color:var(--pine-color-text-message-danger)}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio{-ms-flex-align:center;align-items:center;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-border-radius-full);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pine-color-text-active);cursor:pointer;font:var(--pine-typography-body);min-block-size:var(--pine-dimension-xl);padding:0 var(--pine-dimension-sm);-webkit-transition:border-color var(--pine-motion-duration-fast) ease;transition:border-color var(--pine-motion-duration-fast) ease}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio span.sc-pds-radio{min-width:0;overflow-wrap:anywhere}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:hover{border-color:var(--pine-color-text)}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:has(input:checked){border-color:var(--pine-color-text-active);-webkit-box-shadow:inset 0 0 0 var(--pine-border-width) var(--pine-color-text-active);box-shadow:inset 0 0 0 var(--pine-border-width) var(--pine-color-text-active)}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:has(input:focus-visible){outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width-thick)}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:has(input:disabled){background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-label-disabled);cursor:not-allowed}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:has(input:disabled:checked){border-color:var(--pine-color-text-label-disabled);-webkit-box-shadow:inset 0 0 0 var(--pine-border-width) var(--pine-color-text-label-disabled);box-shadow:inset 0 0 0 var(--pine-border-width) var(--pine-color-text-label-disabled)}@media (forced-colors: active){.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:has(input:disabled){border-color:GrayText}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:has(input:checked){border-color:Highlight;border-width:var(--pine-border-width-thick);padding-inline:calc(var(--pine-dimension-sm) - (var(--pine-border-width-thick) - var(--pine-border-width)))}.pds-radio--pill.sc-pds-radio-h label.sc-pds-radio:has(input:disabled:checked){border-color:GrayText;border-width:var(--pine-border-width-thick);padding-inline:calc(var(--pine-dimension-sm) - (var(--pine-border-width-thick) - var(--pine-border-width)))}}.pds-radio--pill.sc-pds-radio-h .pds-radio__message.sc-pds-radio{-webkit-margin-start:0;margin-inline-start:0}`;
22107
22372
 
22108
22373
  /**
22109
- * @slot image - Custom image content to display instead of the default radio input
22374
+ * @slot image - Custom image content to display instead of the default radio input. Ignored when `variant` is `pill`.
22110
22375
  * @part image-container - The container for the image
22111
22376
  * @lightDom renders-markup
22112
22377
  */
@@ -22128,7 +22393,7 @@ class PdsRadio {
22128
22393
  */
22129
22394
  this.disabled = false;
22130
22395
  /**
22131
- * Adds a border around the radio component for better visual separation.
22396
+ * Adds a border around the radio component for better visual separation. Ignored when `variant` is `pill`.
22132
22397
  * @defaultValue false
22133
22398
  */
22134
22399
  this.hasBorder = false;
@@ -22142,6 +22407,11 @@ class PdsRadio {
22142
22407
  * @defaultValue false
22143
22408
  */
22144
22409
  this.required = false;
22410
+ /**
22411
+ * Sets the style variant of the radio. `pill` renders the label as a pill-shaped choice; the native input still handles keyboard, form, and screen reader behavior.
22412
+ * @defaultValue default
22413
+ */
22414
+ this.variant = 'default';
22145
22415
  this.handleRadioChange = (e) => {
22146
22416
  if (this.disabled) {
22147
22417
  return;
@@ -22163,6 +22433,9 @@ class PdsRadio {
22163
22433
  hasImage() {
22164
22434
  return this._hasImage;
22165
22435
  }
22436
+ isPill() {
22437
+ return this.variant === 'pill';
22438
+ }
22166
22439
  classNames() {
22167
22440
  const classNames = [];
22168
22441
  if (this.invalid) {
@@ -22171,10 +22444,14 @@ class PdsRadio {
22171
22444
  if (this.disabled) {
22172
22445
  classNames.push('is-disabled');
22173
22446
  }
22174
- if (this.hasBorder) {
22447
+ // A pill is its own bordered shape, so has-border doesn't stack a card around it.
22448
+ if (this.hasBorder && !this.isPill()) {
22175
22449
  classNames.push('has-border');
22176
22450
  }
22177
- if (this.hasImage()) {
22451
+ if (this.isPill()) {
22452
+ classNames.push('pds-radio--pill');
22453
+ }
22454
+ if (this.hasImage() && !this.isPill()) {
22178
22455
  classNames.push('has-image');
22179
22456
  }
22180
22457
  return classNames.join(' ');
@@ -22204,13 +22481,14 @@ class PdsRadio {
22204
22481
  }
22205
22482
  render() {
22206
22483
  const renderLabelAndMessages = () => [
22207
- hAsync("label", { htmlFor: this.componentId, key: `${this.componentId}-label` }, hAsync("input", { key: 'ccd618855831bcee309e815f2cd2712fd4e8fe1f', "aria-describedby": assignDescription(this.componentId, this.invalid, this.helperMessage, this.errorMessage), "aria-invalid": this.invalid ? "true" : undefined, type: "radio", id: this.componentId, name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, onChange: this.handleRadioChange, class: this.hasImage() ? 'visually-hidden' : '' }), hAsync("span", { key: '2e372a880c28f48fb804bac2518208082c141fad', class: this.hideLabel ? 'visually-hidden' : '' }, this.label)),
22484
+ hAsync("label", { htmlFor: this.componentId, key: `${this.componentId}-label` }, hAsync("input", { key: 'fdd83248666907fa25c5406cdedcd0e6f8d45f50', "aria-describedby": assignDescription(this.componentId, this.invalid, this.helperMessage, this.errorMessage), "aria-invalid": this.invalid ? "true" : undefined, type: "radio", id: this.componentId, name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, onChange: this.handleRadioChange, class: this.hasImage() || this.isPill() ? 'visually-hidden' : '' }), hAsync("span", { key: '73166ffd57cdb1f3b9e2b61fe880216b23a6510b', class: this.hideLabel && !this.isPill() ? 'visually-hidden' : '' }, this.label)),
22208
22485
  this.helperMessage && (hAsync("div", { key: `${this.componentId}-helper`, class: 'pds-radio__message', id: messageId(this.componentId, 'helper') }, this.helperMessage)),
22209
- this.errorMessage && (hAsync("div", { key: `${this.componentId}-error`, class: `pds-radio__message pds-radio__message--error`, id: messageId(this.componentId, 'error'), "aria-live": "assertive" }, hAsync("pds-icon", { key: '08e7a2319eddc1d314ee9dddd51a5ce88cd4ae48', "aria-hidden": "true", icon: danger, size: "small" }), this.errorMessage))
22486
+ this.errorMessage && (hAsync("div", { key: `${this.componentId}-error`, class: `pds-radio__message pds-radio__message--error`, id: messageId(this.componentId, 'error'), "aria-live": "assertive" }, hAsync("pds-icon", { key: 'e5bca81578382181b6fce61fa6830fd60e54234a', "aria-hidden": "true", icon: danger, size: "small" }), this.errorMessage))
22210
22487
  ];
22211
22488
  const hostClass = this.classNames();
22212
22489
  this.hostKeeper.record(hostClass);
22213
- return (hAsync(Host, { key: '351376552abee90f50c3aceb03ecf8a81ae1b82b', class: hostClass }, this.hasImage() && (hAsync("div", { key: 'fd85fd36b2ebd99b12c3bb2a13cf3d3e3c26530f', class: "pds-radio__image-container", part: "image-container" }, hAsync("slot", { key: 'abe75dbe38d29340b805f70861b084c1b3836be9', name: "image", onSlotchange: () => (this._hasImage = this.hasImageSlot()) }))), this.hasImage() ? (hAsync("div", { class: "pds-radio__content-wrapper" }, renderLabelAndMessages())) : (renderLabelAndMessages())));
22490
+ const showImage = this.hasImage() && !this.isPill();
22491
+ return (hAsync(Host, { key: '4cf39a988cc7642234ff62e7fa2f0d08b09e7d25', class: hostClass }, showImage && (hAsync("div", { key: '7a88d32f896ad4696ea46b13f9ef01e7df0a1c3e', class: "pds-radio__image-container", part: "image-container" }, hAsync("slot", { key: 'eb8399263443d36ab91c0875602d0dc31f036058', name: "image", onSlotchange: () => (this._hasImage = this.hasImageSlot()) }))), showImage ? (hAsync("div", { class: "pds-radio__content-wrapper" }, renderLabelAndMessages())) : (renderLabelAndMessages())));
22214
22492
  }
22215
22493
  get el() { return getElement(this); }
22216
22494
  static get style() { return labelCss$3() + pdsRadioCss(); }
@@ -22230,6 +22508,7 @@ class PdsRadio {
22230
22508
  "name": [1],
22231
22509
  "required": [4],
22232
22510
  "value": [1],
22511
+ "variant": [1],
22233
22512
  "_hasImage": [32]
22234
22513
  },
22235
22514
  "$listeners$": undefined,
@@ -22273,6 +22552,7 @@ class PdsRadioGroup {
22273
22552
  * @defaultValue false
22274
22553
  */
22275
22554
  this.required = false;
22555
+ this.hostKeeper = new HostStylingKeeper();
22276
22556
  }
22277
22557
  handlePropsChange() {
22278
22558
  this.updateChildRadios();
@@ -22324,6 +22604,29 @@ class PdsRadioGroup {
22324
22604
  }
22325
22605
  });
22326
22606
  }
22607
+ connectedCallback() {
22608
+ this.hostKeeper.connect(this.el);
22609
+ // A name set while the group was detached never reaches the observer.
22610
+ this.syncName();
22611
+ if (typeof MutationObserver === 'undefined')
22612
+ return;
22613
+ // Consumers can name the group after render (a prop change, an i18n swap, a morph); re-render so their name wins.
22614
+ this.hostAriaObserver = new MutationObserver(() => this.syncName());
22615
+ this.hostAriaObserver.observe(this.el, { attributeFilter: ['aria-label', 'aria-labelledby'] });
22616
+ }
22617
+ disconnectedCallback() {
22618
+ var _a;
22619
+ this.hostKeeper.disconnect();
22620
+ (_a = this.hostAriaObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
22621
+ this.hostAriaObserver = undefined;
22622
+ }
22623
+ // Re-renders only when the group's name would change, so its own aria-labelledby write doesn't loop back.
22624
+ syncName() {
22625
+ if (this._groupId === undefined)
22626
+ return;
22627
+ if (this.getAriaLabelledBy() !== this.renderedLabelledBy)
22628
+ ;
22629
+ }
22327
22630
  componentWillLoad() {
22328
22631
  // Generate stable group ID once during initialization
22329
22632
  // This ensures DOM stability and accessibility relationships remain consistent across re-renders
@@ -22337,6 +22640,18 @@ class PdsRadioGroup {
22337
22640
  : `${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;
22338
22641
  this._groupId = `radio-group-${uniqueId}`;
22339
22642
  }
22643
+ // A restored or cloned host still carries the id and ARIA references an earlier instance wrote, pointing at
22644
+ // that instance's label and messages. Drop them so this render writes its own: on first load, Stencil keeps a
22645
+ // host attribute that's already there.
22646
+ const previousId = this.el.getAttribute('id');
22647
+ if (previousId && previousId !== this._groupId) {
22648
+ ['aria-labelledby', 'aria-describedby'].forEach((name) => {
22649
+ var _a, _b;
22650
+ const ids = (_b = (_a = this.el.getAttribute(name)) === null || _a === void 0 ? void 0 : _a.split(/\s+/)) !== null && _b !== void 0 ? _b : [];
22651
+ if (ids.some((id) => id.startsWith(`${previousId}__`)))
22652
+ this.el.removeAttribute(name);
22653
+ });
22654
+ }
22340
22655
  }
22341
22656
  componentDidLoad() {
22342
22657
  if (!this.name) {
@@ -22389,6 +22704,20 @@ class PdsRadioGroup {
22389
22704
  // Otherwise, assume it's a dimension token like "100", "200", etc.
22390
22705
  return `var(--pine-dimension-${this.gap})`;
22391
22706
  }
22707
+ get labelId() {
22708
+ return `${this._groupId}__label`;
22709
+ }
22710
+ // Names the group from its visible label, unless the consumer named it with their own aria-label or aria-labelledby.
22711
+ // A blank aria-label (an empty translation, say) names nothing, so it falls back to groupLabel.
22712
+ getAriaLabelledBy() {
22713
+ var _a;
22714
+ const hostLabelledBy = this.el.getAttribute('aria-labelledby');
22715
+ if ((hostLabelledBy === null || hostLabelledBy === void 0 ? void 0 : hostLabelledBy.trim()) && hostLabelledBy !== this.labelId)
22716
+ return hostLabelledBy;
22717
+ if ((_a = this.el.getAttribute('aria-label')) === null || _a === void 0 ? void 0 : _a.trim())
22718
+ return undefined;
22719
+ return this.groupLabel ? this.labelId : undefined;
22720
+ }
22392
22721
  getAriaDescribedBy() {
22393
22722
  const messageIds = [];
22394
22723
  if (this.errorMessage) {
@@ -22402,13 +22731,23 @@ class PdsRadioGroup {
22402
22731
  render() {
22403
22732
  const gapValue = this.getGapValue();
22404
22733
  const ariaDescribedBy = this.getAriaDescribedBy();
22405
- return (hAsync(Host, { key: 'bf8063c1a99e272bb3f6bc647998a6ef103f8a71', class: this.classNames(), id: this._groupId, role: "group", "aria-describedby": ariaDescribedBy, style: {
22734
+ const ariaLabelledBy = this.getAriaLabelledBy();
22735
+ const hostClass = this.classNames();
22736
+ this.renderedLabelledBy = ariaLabelledBy;
22737
+ // A DOM morph strips what the component wrote on its host; put back its role, name and description.
22738
+ // Only its own aria-labelledby, so a consumer's that the server dropped stays dropped.
22739
+ this.hostKeeper.record(hostClass, { '--pds-radio-group-gap': gapValue }, {
22740
+ role: 'radiogroup',
22741
+ 'aria-describedby': ariaDescribedBy,
22742
+ 'aria-labelledby': ariaLabelledBy === this.labelId ? ariaLabelledBy : undefined,
22743
+ });
22744
+ return (hAsync(Host, { key: '0fe381f99dddae0aeb9189a13b0e2195f1c79886', class: hostClass, id: this._groupId, role: "radiogroup", "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, style: {
22406
22745
  '--pds-radio-group-gap': gapValue,
22407
- } }, this.groupLabel && (hAsync("div", { key: '8564ed3f8f99cdc1a0e5b189aacc6960923eb5f7', class: "pds-radio-group__label" }, this.groupLabel)), hAsync("div", { key: '2309c9373790182cde030c1dbda88fa3bdcaaf12', class: {
22746
+ } }, this.groupLabel && (hAsync("div", { key: '4967dc22fa0265dbfbabf94a49b182b8c06d0bd5', class: "pds-radio-group__label", id: this.labelId }, this.groupLabel)), hAsync("div", { key: '7a782a6920de7eda76ab0060c7512f093671ad41', class: {
22408
22747
  'pds-radio-group__radios': true,
22409
22748
  'pds-radio-group__radios--row': this.direction === 'row',
22410
22749
  'pds-radio-group__radios--column': this.direction === 'column',
22411
- } }, hAsync("slot", { key: 'd88dde3c631e25c01bc7b6d3ef5d517255fabd1a', onSlotchange: () => this.updateChildRadios() })), this.helperMessage && (hAsync("div", { key: 'a229214ed01663b0fc34f35e27c7148b4eb412ab', class: "pds-radio-group__message", id: messageId(this._groupId, 'helper') }, this.helperMessage)), this.errorMessage && (hAsync("div", { key: 'dc092f2e6dbef0cb369cf00a6eccf9a095a0313d', class: "pds-radio-group__message pds-radio-group__message--error", id: messageId(this._groupId, 'error'), "aria-live": "assertive" }, hAsync("pds-icon", { key: '83b0129d3d45b74ef1f53acc923387b2de7f079b', "aria-hidden": "true", icon: danger, size: "small" }), this.errorMessage))));
22750
+ } }, hAsync("slot", { key: '48a8d2d74961a402e3a1b053b2f0314e74b4b289', onSlotchange: () => this.updateChildRadios() })), this.helperMessage && (hAsync("div", { key: '58db96d62b8d89f03ab245990d2d6bbd3b1b5f85', class: "pds-radio-group__message", id: messageId(this._groupId, 'helper') }, this.helperMessage)), this.errorMessage && (hAsync("div", { key: 'ad3aafe5f7ed45853c36b537525a8fff68452f55', class: "pds-radio-group__message pds-radio-group__message--error", id: messageId(this._groupId, 'error'), "aria-live": "assertive" }, hAsync("pds-icon", { key: '80ce92868703c5e01434e7e83a7668e320bcbee1', "aria-hidden": "true", icon: danger, size: "small" }), this.errorMessage))));
22412
22751
  }
22413
22752
  get el() { return getElement(this); }
22414
22753
  static get watchers() { return {
@@ -22517,7 +22856,7 @@ class PdsRow {
22517
22856
  'min-height': this.minHeight,
22518
22857
  }));
22519
22858
  this.hostKeeper.record(`pds-row ${rowClasses}`, rowInlineStyles);
22520
- return hAsync(Host, { key: '452882c1105868f5d392e7cb165311b1abc4a243', class: `pds-row ${rowClasses}`, style: rowInlineStyles });
22859
+ return hAsync(Host, { key: '589ee3251a4ee1d7824c8e2fa3e214de5466c3db', class: `pds-row ${rowClasses}`, style: rowInlineStyles });
22521
22860
  }
22522
22861
  get el() { return getElement(this); }
22523
22862
  static get style() { return pdsRowCss(); }
@@ -22547,6 +22886,25 @@ const labelCss$2 = () => `:host{display:inline-block}:host([aria-disabled=true])
22547
22886
 
22548
22887
  const pdsSelectCss = () => `:host{--pds-select-background:var(--pine-color-background-container);--pds-select-border:var(--pine-border);--pds-select-border-radius:var(--pine-dimension-125);--pds-select-border-radius-start-end:var(--pine-dimension-125);--pds-select-border-radius-start-start:var(--pine-dimension-125);--pds-select-border-radius-end-end:var(--pine-dimension-125);--pds-select-border-radius-end-start:var(--pine-dimension-125);--pds-select-min-height:36px;--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger)}:host .hidden,:host :host([hidden]){display:none}.pds-select{color:var(--pine-color-text);display:grid;-ms-flex-direction:column;flex-direction:column;grid-template-areas:"label label" "field field" "message message";grid-template-columns:1fr minmax(2rem, -webkit-min-content);grid-template-columns:1fr minmax(2rem, min-content);grid-template-rows:-webkit-min-content -webkit-min-content -webkit-min-content;grid-template-rows:min-content min-content min-content;position:relative;width:100%}.pds-select__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;grid-area:label;-ms-flex-pack:justify;justify-content:space-between;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-select__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}label{-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-select__label-wrapper label{-webkit-margin-after:0;margin-block-end:0}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--pds-select-background);border:var(--pds-select-border);border-end-end-radius:var(--pds-select-border-radius-end-end, var(--pds-select-border-radius));border-end-start-radius:var(--pds-select-border-radius-end-start, var(--pds-select-border-radius));border-start-end-radius:var(--pds-select-border-radius-start-end, var(--pds-select-border-radius));border-start-start-radius:var(--pds-select-border-radius-start-start, var(--pds-select-border-radius));color:var(--pine-color-text);font:var(--pine-typography-body);grid-area:field;letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-select-min-height);padding:calc(var(--pine-dimension-xs) - var(--pine-border-width)) var(--pine-dimension-150);-webkit-padding-end:var(--pine-dimension-450);padding-inline-end:var(--pine-dimension-450);position:relative}select:hover{border-color:var(--pine-color-border-hover);cursor:pointer}select:focus-visible{border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}select:disabled{background-color:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}select:has(~.pds-select__message .pds-select__error-message){background-color:var(--pine-select-color-background-danger);border-color:var(--pine-color-border-danger)}:host-context([data-theme=dark]) select:has(~.pds-select__message .pds-select__error-message){background-color:var(--pine-color-red-950)}select:has(~.pds-select__message .pds-select__error-message):focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host(.is-disabled) .pds-select__select-icon{color:var(--pine-color-text-disabled)}:host(.is-invalid) select{background-color:var(--pine-select-color-background-danger);border-color:var(--pine-color-border-danger)}:host-context([data-theme=dark]) :host(.is-invalid) select{background-color:var(--pine-color-red-950)}:host(.is-invalid) select:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select{background-color:var(--pine-color-accent-disabled);border-color:var(--pine-color-accent);color:var(--pine-color-text-accent)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select:hover:not(:disabled){border-color:var(--pine-color-accent-hover)}:host([highlight]:not(.is-disabled):not(.is-invalid)) select:focus-visible{outline-color:var(--pine-color-focus-ring)}:host([highlight]:not(.is-disabled):not(.is-invalid)) .pds-select__select-icon{color:var(--pine-color-text-accent)}.pds-select__error-message,.pds-select__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-after:0;margin-block-end:0;-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-select__error-message{color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-select__error-message pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.pds-select__message{grid-area:message}.pds-select__select-icon{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;grid-column:-1/-2;grid-row:2/3;height:var(--pds-select-min-height);pointer-events:none;position:relative;z-index:calc(var(--pine-z-index-raised) - 1)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}`;
22549
22888
 
22889
+ /** The tags of an option list in order, optgroup contents included: equal shapes can be patched in place. */
22890
+ const shapeOf = (items) => items.map((item) => item.tagName + (item.tagName === 'OPTGROUP' ? `(${shapeOf(Array.from(item.children))})` : '')).join();
22891
+ /** Brings an existing option or optgroup up to date with its copy, keeping the element itself. */
22892
+ const patchInPlace = (target, copy) => {
22893
+ Array.from(target.attributes).forEach(({ name }) => {
22894
+ if (!copy.hasAttribute(name))
22895
+ target.removeAttribute(name);
22896
+ });
22897
+ Array.from(copy.attributes).forEach(({ name, value }) => {
22898
+ if (target.getAttribute(name) !== value)
22899
+ target.setAttribute(name, value);
22900
+ });
22901
+ if (copy.tagName === 'OPTGROUP') {
22902
+ Array.from(copy.children).forEach((child, index) => patchInPlace(target.children[index], child));
22903
+ }
22904
+ else if (target.textContent !== copy.textContent) {
22905
+ target.textContent = copy.textContent;
22906
+ }
22907
+ };
22550
22908
  /**
22551
22909
  * @slot action - Content to be displayed in the label area, typically for help icons or links
22552
22910
  */
@@ -22558,6 +22916,9 @@ class PdsSelect {
22558
22916
  this.pdsFocus = createEvent(this, "pdsFocus");
22559
22917
  this.pdsKeyDown = createEvent(this, "pdsKeyDown");
22560
22918
  this._type = 'select-one';
22919
+ this.optionObserver = null;
22920
+ this.optionSyncFrame = null;
22921
+ this.hasHadOptions = false;
22561
22922
  this.hostKeeper = new HostStylingKeeper();
22562
22923
  /**
22563
22924
  * Indicates whether or not the select field is disabled.
@@ -22574,6 +22935,16 @@ class PdsSelect {
22574
22935
  * @defaultValue false
22575
22936
  */
22576
22937
  this.required = false;
22938
+ /**
22939
+ * Whether a mutation is inside an option or optgroup. The host's own attributes and children
22940
+ * (top-level adds and removes reach `slotchange`) and the action slot's content are not.
22941
+ */
22942
+ this.touchesOption = ({ target }) => {
22943
+ // Not just TEXT_NODE: characterData also reports comment nodes, and a Comment has no
22944
+ // .closest() — treating anything non-Element as a Text node crashed on one.
22945
+ const element = target.nodeType === Node.ELEMENT_NODE ? target : target.parentElement;
22946
+ return target !== this.el && (element === null || element === void 0 ? void 0 : element.closest('option, optgroup')) != null;
22947
+ };
22577
22948
  /**
22578
22949
  * Emits an event on input change.
22579
22950
  */
@@ -22600,25 +22971,47 @@ class PdsSelect {
22600
22971
  this.pdsKeyDown.emit(ev);
22601
22972
  };
22602
22973
  /**
22603
- * Handles the change event for the slot element.
22604
- * This method is triggered when the slot content changes.
22605
- * It updates the inner HTML of the select element by cloning and appending
22606
- * the assigned <option> elements from the slot.
22974
+ * Copies the slotted <option> and <optgroup> elements into the inner select, then
22975
+ * reselects the current value. Runs on `slotchange` and when a slotted option changes
22976
+ * (see startOptionSync).
22977
+ *
22978
+ * Nothing happens when the copies match what the select already holds. When only text or
22979
+ * attributes changed, the select's own options are updated in place rather than replaced,
22980
+ * so an open picker keeps its highlight, a multiple select keeps its range anchor, and a
22981
+ * screen reader keeps its place. Selecting programmatically fires no change event, so a
22982
+ * copy never emits `pdsSelectChange`.
22607
22983
  */
22608
22984
  this.handleSlotChange = () => {
22609
- const slot = this.slotContainer.querySelector('slot');
22610
- this.selectEl.innerHTML = '';
22611
- const assignedElements = slot.assignedElements({ flatten: true });
22612
- assignedElements.forEach((item) => {
22613
- if (['OPTION', 'OPTGROUP'].includes(item.tagName)) {
22614
- const clonedItem = item.cloneNode(true);
22615
- if (clonedItem.tagName === 'OPTION' && clonedItem.value === this.value) {
22616
- clonedItem.selected = true;
22617
- }
22618
- this.selectEl.appendChild(clonedItem);
22619
- }
22620
- });
22985
+ var _a;
22986
+ const slot = (_a = this.slotContainer) === null || _a === void 0 ? void 0 : _a.querySelector('slot');
22987
+ if (slot === null || slot === undefined || this.selectEl === undefined)
22988
+ return;
22989
+ const copies = slot.assignedElements({ flatten: true })
22990
+ .filter((item) => ['OPTION', 'OPTGROUP'].includes(item.tagName))
22991
+ .map((item) => item.cloneNode(true));
22992
+ const current = Array.from(this.selectEl.children);
22993
+ // The very first copy populates an empty select, where falling back to the first option (like
22994
+ // a native select) is correct; the no-match blank state is for options changing under a value
22995
+ // that was already showing selected. Tracked separately from the select's current emptiness:
22996
+ // an async reload that clears options before the next set lands would otherwise look like a
22997
+ // first render again, and the no-match state must still apply once that next set arrives.
22998
+ const hadOptions = this.hasHadOptions;
22999
+ if (copies.length > 0)
23000
+ this.hasHadOptions = true;
23001
+ const markup = (items) => items.map((item) => item.outerHTML).join('');
23002
+ if (markup(copies) === markup(current))
23003
+ return;
23004
+ if (shapeOf(copies) === shapeOf(current)) {
23005
+ copies.forEach((copy, index) => patchInPlace(current[index], copy));
23006
+ }
23007
+ else {
23008
+ this.selectEl.innerHTML = '';
23009
+ copies.forEach((copy) => this.selectEl.appendChild(copy));
23010
+ }
22621
23011
  this.updateSelectedOption();
23012
+ if (hadOptions)
23013
+ this.showNoSelectionWithoutMatch();
23014
+ this.updateFormValue();
22622
23015
  };
22623
23016
  }
22624
23017
  /**
@@ -22647,9 +23040,16 @@ class PdsSelect {
22647
23040
  }
22648
23041
  // Expose type property on the element instance to match native form element behavior
22649
23042
  exposeTypeProperty(this.el, () => this._type);
23043
+ // Reconnected after a move: componentDidLoad won't run again, and options may have changed
23044
+ // while it was out of the document.
23045
+ if (this.selectEl !== undefined) {
23046
+ this.startOptionSync();
23047
+ this.scheduleOptionSync();
23048
+ }
22650
23049
  }
22651
23050
  disconnectedCallback() {
22652
23051
  this.hostKeeper.disconnect();
23052
+ this.stopOptionSync();
22653
23053
  }
22654
23054
  componentWillLoad() {
22655
23055
  // Set initial type based on multiple prop
@@ -22659,6 +23059,43 @@ class PdsSelect {
22659
23059
  componentDidLoad() {
22660
23060
  // Set initial form value
22661
23061
  this.updateFormValue();
23062
+ // Stencil holds componentDidLoad until the shadow root's pds-icon has loaded, so options can
23063
+ // change between the first slotchange copy and here with nothing observing yet — the same gap
23064
+ // the reconnect path closes with a catch-up sync.
23065
+ this.startOptionSync();
23066
+ this.scheduleOptionSync();
23067
+ }
23068
+ /**
23069
+ * Keeps the inner select in step with the slotted options. `slotchange` only fires when
23070
+ * top-level options are added or removed, so an option's text, value or disabled state
23071
+ * changing, or an option added inside an optgroup, would otherwise never reach the select.
23072
+ * Changes are batched into one copy per animation frame.
23073
+ */
23074
+ startOptionSync() {
23075
+ if (this.optionObserver !== null || typeof MutationObserver === 'undefined' || !this.el.isConnected)
23076
+ return;
23077
+ this.optionObserver = new MutationObserver((mutations) => {
23078
+ if (mutations.some(this.touchesOption))
23079
+ this.scheduleOptionSync();
23080
+ });
23081
+ this.optionObserver.observe(this.el, { childList: true, subtree: true, attributes: true, characterData: true });
23082
+ }
23083
+ scheduleOptionSync() {
23084
+ if (this.optionSyncFrame !== null)
23085
+ return;
23086
+ this.optionSyncFrame = requestAnimationFrame(() => {
23087
+ this.optionSyncFrame = null;
23088
+ this.handleSlotChange();
23089
+ });
23090
+ }
23091
+ stopOptionSync() {
23092
+ var _a;
23093
+ (_a = this.optionObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
23094
+ this.optionObserver = null;
23095
+ if (this.optionSyncFrame !== null) {
23096
+ cancelAnimationFrame(this.optionSyncFrame);
23097
+ this.optionSyncFrame = null;
23098
+ }
22662
23099
  }
22663
23100
  /**
22664
23101
  * Updates the selected option in the select element based on the current value.
@@ -22684,6 +23121,19 @@ class PdsSelect {
22684
23121
  });
22685
23122
  }
22686
23123
  }
23124
+ /**
23125
+ * After a copy that changes an existing option set, a value whose option was renamed or removed
23126
+ * has nothing to select. Like a native select, show nothing selected rather than the first
23127
+ * option; the value itself is kept, with no change event.
23128
+ */
23129
+ showNoSelectionWithoutMatch() {
23130
+ var _a;
23131
+ const wanted = [].concat((_a = this.value) !== null && _a !== void 0 ? _a : []).filter((value) => value !== '');
23132
+ const options = Array.from(this.selectEl.options);
23133
+ if (wanted.length > 0 && !options.some((option) => wanted.includes(option.value))) {
23134
+ this.selectEl.selectedIndex = -1;
23135
+ }
23136
+ }
22687
23137
  getHelperMessage() {
22688
23138
  return this.helperMessage && (hAsync("p", { class: "pds-select__helper-message", id: messageId(this.componentId, 'helper') }, this.helperMessage));
22689
23139
  }
@@ -22789,7 +23239,7 @@ class PdsSelect {
22789
23239
  'has-action': hasAction && !this.hideLabel ? 'true' : null,
22790
23240
  };
22791
23241
  this.hostKeeper.record(hostClass, {}, hostAttributes);
22792
- return (hAsync(Host, Object.assign({ key: '343ed671e67dd1d6f9eb284b07e06d59877c64e9', class: hostClass }, hostAttributes), hAsync("div", { key: '650aed0869b02f658feb16ee99f17e1cd22e5a8e', class: "pds-select" }, !this.hideLabel && (hAsync("div", { key: '74739461acbea33c92279ec8ec9042d6af1773c1', class: "pds-select__label-wrapper" }, hAsync("label", { key: '1ad96ffd243000358edfbd79054ee770e1ba97d3', htmlFor: this.componentId }, hAsync("span", { key: 'b832868db4f9cd4fd2f8313054d2e96e106189ab', class: this.hideLabel ? 'visually-hidden' : '' }, this.label)), hasAction && this.renderAction())), hAsync("select", { key: 'e83c1a1a0a5646fc8abf9e50bc374f52b56be773', "aria-describedby": assignDescription(this.componentId, this.isInvalid(), this.helperMessage, this.errorMessage), "aria-invalid": this.isInvalid() ? 'true' : undefined, "aria-label": this.hideLabel ? this.label : undefined, autocomplete: this.autocomplete || undefined, class: "pds-select__field", disabled: this.disabled, id: this.componentId, multiple: this.multiple, name: this.name, onBlur: this.onBlur, onChange: this.onSelectUpdate, onFocus: this.onFocus, onKeyDown: this.onKeyDown, part: "select", required: this.required, ref: (el) => (this.selectEl = el) }), hAsync("div", { key: 'a34880120b88124b5122350856d023368f96abf7', "aria-hidden": "true", class: "hidden", ref: (el) => (this.slotContainer = el) }, hAsync("slot", { key: 'df6abaf6a630761a32b263813181ff3453757e0d', onSlotchange: this.handleSlotChange })), this.renderMessages(), !this.multiple && hAsync("pds-icon", { key: 'f9197284ef9965d693242a652b583f48bc3d7097', "aria-hidden": "true", class: "pds-select__select-icon", icon: enlarge }))));
23242
+ return (hAsync(Host, Object.assign({ key: '37c2c3b72c13c3c4e3d81da29ddddc86a7300d70', class: hostClass }, hostAttributes), hAsync("div", { key: 'ff1c311dca6fc25813e5473d0e8daff4dc12e807', class: "pds-select" }, !this.hideLabel && (hAsync("div", { key: '77db17b0beb1fefabb26ffe1df0e5f03a0515996', class: "pds-select__label-wrapper" }, hAsync("label", { key: 'c4dcba3bc148aada4a3afcca0a30c64a630e441f', htmlFor: this.componentId }, hAsync("span", { key: '0fc3424ec1961d3b216c0fabb80cb8acee37f1a2', class: this.hideLabel ? 'visually-hidden' : '' }, this.label)), hasAction && this.renderAction())), hAsync("select", { key: 'ff343a6653ccd081021cb669a428c780d0162e8b', "aria-describedby": assignDescription(this.componentId, this.isInvalid(), this.helperMessage, this.errorMessage), "aria-invalid": this.isInvalid() ? 'true' : undefined, "aria-label": this.hideLabel ? this.label : undefined, autocomplete: this.autocomplete || undefined, class: "pds-select__field", disabled: this.disabled, id: this.componentId, multiple: this.multiple, name: this.name, onBlur: this.onBlur, onChange: this.onSelectUpdate, onFocus: this.onFocus, onKeyDown: this.onKeyDown, part: "select", required: this.required, ref: (el) => (this.selectEl = el) }), hAsync("div", { key: '86fed1916c3b13d079492581a7c6bb621012a4a5', "aria-hidden": "true", class: "hidden", ref: (el) => (this.slotContainer = el) }, hAsync("slot", { key: 'abe06eeef5be13b716573c8a806d6b7795edc65f', onSlotchange: this.handleSlotChange })), this.renderMessages(), !this.multiple && hAsync("pds-icon", { key: '68c958666828f77114f2edeedb667070106046fa', "aria-hidden": "true", class: "pds-select__select-icon", icon: enlarge }))));
22793
23243
  }
22794
23244
  static get formAssociated() { return true; }
22795
23245
  get el() { return getElement(this); }
@@ -25548,7 +25998,7 @@ class PdsSortable {
25548
25998
  render() {
25549
25999
  const classNames = this.classNames();
25550
26000
  this.hostKeeper.record(classNames);
25551
- return (hAsync(Host, { key: 'a0e532d31561748b4632a6be9163562f990af804', class: classNames, id: this.componentId }, hAsync("slot", { key: 'd1b0defb683f841e6708374fff4bf62eb7fd5080' })));
26001
+ return (hAsync(Host, { key: '6e9e7b769f57ebfd81541fbecbe17b3fb4ad3e47', class: classNames, id: this.componentId }, hAsync("slot", { key: 'c9466a216862c0a3e578f3fcfc1ac1e26146722b' })));
25552
26002
  }
25553
26003
  get el() { return getElement(this); }
25554
26004
  static get watchers() { return {
@@ -25623,7 +26073,7 @@ class PdsSortableItem {
25623
26073
  }
25624
26074
  render() {
25625
26075
  this.hostKeeper.record('pds-sortable-item');
25626
- return (hAsync(Host, { key: '2065ccb474ae4b7032edc3c37aa6855f3048909d', class: "pds-sortable-item", id: this.componentId }, this.showHandle && (hAsync("div", { key: '32385cc94837a3d0bc1c496615135c79274afe35', class: "pds-sortable-item__handle" }, hAsync("pds-icon", { key: 'ea94e28b2867aa20622ca073dc31d3b4a11eebbb', "aria-hidden": "true", icon: handle }))), hAsync("slot", { key: 'fb18aa90be0b8fa3832a5dd2b02a7b571205341f' }), this.enableActions && (hAsync("div", { key: '4c6e59d77a7b2183552533a544f4a70ce0cc7011', class: "pds-sortable-item__actions" }, hAsync("slot", { key: '497b1ff88436175d9365a28032e109b6fa118e44', name: "sortable-item-actions" })))));
26076
+ return (hAsync(Host, { key: 'c6b5402a54179d4e7caed3cc81874977d2d6c677', class: "pds-sortable-item", id: this.componentId }, this.showHandle && (hAsync("div", { key: 'cd2d85286bcb3e47f76e4571d609d91f932b717b', class: "pds-sortable-item__handle" }, hAsync("pds-icon", { key: '97e2e155283d86921f40198637abf596d6cc86e0', "aria-hidden": "true", icon: handle }))), hAsync("slot", { key: '99743c8e5be45ca76f276b47688843a621c8ded5' }), this.enableActions && (hAsync("div", { key: '7cb1a8b99658d72067ccae036b2bc0276b8cf02e', class: "pds-sortable-item__actions" }, hAsync("slot", { key: 'f9b3b7d1cc10ac077f65ec2cafac7a372deae511', name: "sortable-item-actions" })))));
25627
26077
  }
25628
26078
  get el() { return getElement(this); }
25629
26079
  static get style() { return pdsSortableItemCss(); }
@@ -25758,9 +26208,9 @@ class PdsSwitch {
25758
26208
  const hostClass = this.switchClassNames();
25759
26209
  const ariaDisabled = this.disabled ? 'true' : null;
25760
26210
  this.hostKeeper.record(hostClass, {}, { 'aria-disabled': ariaDisabled });
25761
- return (hAsync(Host, { key: 'b8bd2870be101081aa8a65cdee45397bc4c21435', class: hostClass, "aria-disabled": ariaDisabled }, hAsync("label", { key: '1e223f22f7fc6c576098353ad67dc11500def8b4', htmlFor: this.componentId }, hAsync("input", Object.assign({ key: 'edf59869e165a65b97465ea9de06f7ea82fbc9a6', "aria-describedby": assignDescription(this.componentId, this.invalid, this.helperMessage, this.errorMessage), "aria-invalid": this.invalid ? "true" : undefined, checked: this.checked, class: "pds-switch__input", disabled: this.disabled, id: this.componentId, name: this.name ? this.name : this.componentId, onChange: this.onSwitchUpdate, required: this.required, type: "checkbox", value: this.value }, this.inheritedAttributes)), hAsync("span", { key: '1c252b9455471069f8c6ea6c13f2e88c99308b41', class: this.hideLabel ? 'visually-hidden' : '' }, hAsync("slot", { key: 'ce0d471918bd3018f5e55d0d1e6c5c2247790f81', name: "label", onSlotchange: this.updateHasLabelSlot }), !this.hasLabelSlot && this.label)), this.helperMessage &&
25762
- hAsync("div", { key: '64874b15403f1f42344715ac34febdfb8d94042a', class: `pds-switch__message`, id: messageId(this.componentId, 'helper') }, this.helperMessage), this.errorMessage &&
25763
- hAsync("div", { key: '560ea486859124bb0ac2f75ab4bd34b0bca7efbc', class: `pds-switch__message pds-switch__message--error`, id: messageId(this.componentId, 'error'), "aria-live": "assertive" }, hAsync("pds-icon", { key: '2ae8dc876745af26fa2418f2265248aeb8f97a2b', "aria-hidden": "true", icon: danger, size: "small" }), this.errorMessage)));
26211
+ return (hAsync(Host, { key: '0fa5beb83232b381ea5cdfa82d143afcb69eb4e1', class: hostClass, "aria-disabled": ariaDisabled }, hAsync("label", { key: 'df5d08344d11cb334ef69a432d1c02557caacc96', htmlFor: this.componentId }, hAsync("input", Object.assign({ key: '6908b328f0e2da2085ffbffe0d1e4d09f2c6fd86', "aria-describedby": assignDescription(this.componentId, this.invalid, this.helperMessage, this.errorMessage), "aria-invalid": this.invalid ? "true" : undefined, checked: this.checked, class: "pds-switch__input", disabled: this.disabled, id: this.componentId, name: this.name ? this.name : this.componentId, onChange: this.onSwitchUpdate, required: this.required, type: "checkbox", value: this.value }, this.inheritedAttributes)), hAsync("span", { key: '1108ab3eae63a371f9e9b80f011211cba8287b67', class: this.hideLabel ? 'visually-hidden' : '' }, hAsync("slot", { key: '8aac1d9b81deab92e1e27c06debf2b87bc697874', name: "label", onSlotchange: this.updateHasLabelSlot }), !this.hasLabelSlot && this.label)), this.helperMessage &&
26212
+ hAsync("div", { key: 'ef829fb6bc66060805a144995f60e2bebb915615', class: `pds-switch__message`, id: messageId(this.componentId, 'helper') }, this.helperMessage), this.errorMessage &&
26213
+ hAsync("div", { key: '42ad678cc2179b4a26ed09151de41c2293b98011', class: `pds-switch__message pds-switch__message--error`, id: messageId(this.componentId, 'error'), "aria-live": "assertive" }, hAsync("pds-icon", { key: '8dc0b29b522247762010edb3b1e8e5fc8c8788fa', "aria-hidden": "true", icon: danger, size: "small" }), this.errorMessage)));
25764
26214
  }
25765
26215
  static get formAssociated() { return true; }
25766
26216
  get el() { return getElement(this); }
@@ -26184,7 +26634,7 @@ class PdsTableBody {
26184
26634
  registerInstance(this, hostRef);
26185
26635
  }
26186
26636
  render() {
26187
- return (hAsync(Host, { key: '817532e93c8f91ef64cd0f90aa6c4372c3b7d83f', role: "rowgroup", part: "body" }, hAsync("slot", { key: '296ba876c6716e85252a06008bd55d59624223e3' })));
26637
+ return (hAsync(Host, { key: '4f1cba9505f56ff1ab0a19f9a88318d66a02eacc', role: "rowgroup", part: "body" }, hAsync("slot", { key: 'ea0c620a15fcbe2915189e870d0815c5cbffdf8c' })));
26188
26638
  }
26189
26639
  static get style() { return pdsTableBodyCss(); }
26190
26640
  static get cmpMeta() { return {
@@ -26342,11 +26792,11 @@ class PdsTableCell {
26342
26792
  return classNames.join(' ');
26343
26793
  }
26344
26794
  render() {
26345
- return (hAsync(Host, { key: 'de70a1002cc46e204f87349069b86ca43aa2129a', class: this.classNames(), role: "gridcell", part: "cell", style: this.tableRef &&
26795
+ return (hAsync(Host, { key: 'fd84150bcb9bd5d2029624394d4f69b0a7234bc0', class: this.classNames(), role: "gridcell", part: "cell", style: this.tableRef &&
26346
26796
  this.tableRef.fixedColumn &&
26347
26797
  this.tableRef.selectable
26348
26798
  ? { '--fixed-cell-position': '40px' }
26349
- : {} }, hAsync("slot", { key: '5e2b3308291e480323d7a1ac0575035758fb3695' })));
26799
+ : {} }, hAsync("slot", { key: '9256f033ec58b9cb2acc74d705acc9726507668b' })));
26350
26800
  }
26351
26801
  get hostElement() { return getElement(this); }
26352
26802
  static get watchers() { return {
@@ -26415,7 +26865,7 @@ class PdsTableHead {
26415
26865
  }
26416
26866
  }
26417
26867
  render() {
26418
- return (hAsync(Host, { key: 'de3faae735e90f5fde1258b5acb826f5f9dbd170', role: "row", part: "head" }, this.tableRef && this.tableRef.selectable && (hAsync("pds-table-head-cell", { key: 'e590e57c8b37ec0ad18e96077401c4692bbd45a4', part: this.tableRef.selectable ? 'checkbox-cell' : '' }, !this.tableRef.disableSelectAll && (hAsync("pds-checkbox", { key: '44ca7eda63185672939909e121a86e6502080a7d', componentId: this.generateUniqueId(), indeterminate: this.indeterminate, onInput: this.handleInput, label: "Select All Rows", hideLabel: true, checked: this.isSelected, part: "select-all-checkbox" })))), hAsync("slot", { key: '0671df85d7989cff7266bfd3d1b4d62b332d2e81' })));
26868
+ return (hAsync(Host, { key: '4fb8d7bf4a9b0bce672208651c0600fbc94214af', role: "row", part: "head" }, this.tableRef && this.tableRef.selectable && (hAsync("pds-table-head-cell", { key: '20b86146540208178bd63bd136e14e5534c7ec76', part: this.tableRef.selectable ? 'checkbox-cell' : '' }, !this.tableRef.disableSelectAll && (hAsync("pds-checkbox", { key: 'fa8054dd7ee36c6401e9eeb9c962a820d3a02558', componentId: this.generateUniqueId(), indeterminate: this.indeterminate, onInput: this.handleInput, label: "Select All Rows", hideLabel: true, checked: this.isSelected, part: "select-all-checkbox" })))), hAsync("slot", { key: 'a0000270ae6ed1cab1c6e802ccc53ba0de3e54c9' })));
26419
26869
  }
26420
26870
  get hostElement() { return getElement(this); }
26421
26871
  static get style() { return pdsTableHeadCss(); }
@@ -26636,11 +27086,11 @@ class PdsTableHeadCell {
26636
27086
  return classNames.join(' ');
26637
27087
  }
26638
27088
  render() {
26639
- return (hAsync(Host, { key: '13de42d136c5b037cd1545cd5b789b4660e23b87', class: this.classNames(), role: "columnheader", onClick: this.toggleSort, part: "head-cell", style: this.tableRef &&
27089
+ return (hAsync(Host, { key: 'd609309180968913315c1428d0403c3974a4bfc0', class: this.classNames(), role: "columnheader", onClick: this.toggleSort, part: "head-cell", style: this.tableRef &&
26640
27090
  this.tableRef.fixedColumn &&
26641
27091
  this.tableRef.selectable
26642
27092
  ? { '--fixed-cell-position': '40px' }
26643
- : {} }, hAsync("slot", { key: '96084d87a34d7b601a8e8325f344f1fe6601204e' }), this.sortable && this.isActive && (hAsync("pds-icon", { key: '79606519d810dc9882a91cbc3b6a199457086631', icon: this.sortingDirection === 'asc' ? upSmall : downSmall, part: "sort-icon", "aria-hidden": "true" }))));
27093
+ : {} }, hAsync("slot", { key: '7aff5994fe4c5250ce83516960183dbd9ffa9c69' }), this.sortable && this.isActive && (hAsync("pds-icon", { key: '0a7b99ab2c56ea0cfb3aa6f810bf802422a29bef', icon: this.sortingDirection === 'asc' ? upSmall : downSmall, part: "sort-icon", "aria-hidden": "true" }))));
26644
27094
  }
26645
27095
  get hostElement() { return getElement(this); }
26646
27096
  static get style() { return pdsTableHeadCellCss(); }
@@ -26806,7 +27256,7 @@ class PdsTableRow {
26806
27256
  }
26807
27257
  }
26808
27258
  render() {
26809
- return (hAsync(Host, { key: '5323521abc5c2464299cf77520fb38ec81297866', class: this.classNames(), role: "row", part: "row" }, this.tableRef && this.tableRef.selectable && (hAsync("pds-table-cell", { key: 'eb94dd282f885d3466b6177b2454cbcc4f932466', part: this.tableRef.fixedColumn ? 'checkbox-cell' : 'checkbox-cell', class: this.tableRef.selectable ? 'has-checkbox' : '' }, hAsync("pds-checkbox", { key: '222eaaedd4bebddc18cebf01bf4da81004773a96', componentId: this.generateUniqueId(), onPdsCheckboxChange: this.handleCheckboxChange, indeterminate: this.indeterminate, label: "Select Row", hideLabel: true, checked: this.isSelected, part: "row-checkbox" }))), hAsync("slot", { key: '010f222fa02b1809ff818f7a030c2a12fc3e3abb' })));
27259
+ return (hAsync(Host, { key: 'dc956e7253971bdadc003448822a83953ed4658f', class: this.classNames(), role: "row", part: "row" }, this.tableRef && this.tableRef.selectable && (hAsync("pds-table-cell", { key: '1f119c5036ab1d27c5138106968a40492222b6f3', part: this.tableRef.fixedColumn ? 'checkbox-cell' : 'checkbox-cell', class: this.tableRef.selectable ? 'has-checkbox' : '' }, hAsync("pds-checkbox", { key: 'f7a3534eceeabe478fb85e6e476f814e03988cfb', componentId: this.generateUniqueId(), onPdsCheckboxChange: this.handleCheckboxChange, indeterminate: this.indeterminate, label: "Select Row", hideLabel: true, checked: this.isSelected, part: "row-checkbox" }))), hAsync("slot", { key: '287c0fe2c39bac5df7a977e31290aeddd0cd46b3' })));
26810
27260
  }
26811
27261
  get hostElement() { return getElement(this); }
26812
27262
  static get style() { return pdsTableRowCss(); }
@@ -26860,7 +27310,7 @@ class PdsTabpanel {
26860
27310
  // The docs show consumers omitting `slot`, so server HTML doesn't carry it — a DOM morph
26861
27311
  // that strips it (and the stretch-active class) leaves this panel unslotted. Put both back.
26862
27312
  this.hostKeeper.record(hostClass, {}, { slot: 'tabpanels' });
26863
- return (hAsync(Host, { key: '5d867e31d0f5f14e18f1c81035991c90bb5fe529', slot: "tabpanels", class: hostClass || undefined }, hAsync("div", { key: '255d37a73089904cfb170cd89f7b829756f6295f', role: "tabpanel", id: this.parentComponentId + "__" + this.name + '-panel', tabindex: "0", "aria-labelledby": this.parentComponentId + "__" + this.name, class: this.selected ? "pds-tabpanel is-active" : "pds-tabpanel" }, hAsync("slot", { key: '714d3d0cf0fc6173e243a2b077d9b9918ae4acf9' }))));
27313
+ return (hAsync(Host, { key: 'b649c0f9e0c103a2d7dad43b7db0a092194b4ba0', slot: "tabpanels", class: hostClass || undefined }, hAsync("div", { key: 'a578722d33f7d04726185e393771838870833984', role: "tabpanel", id: this.parentComponentId + "__" + this.name + '-panel', tabindex: "0", "aria-labelledby": this.parentComponentId + "__" + this.name, class: this.selected ? "pds-tabpanel is-active" : "pds-tabpanel" }, hAsync("slot", { key: '2ebe5745c444563333ee175bb3a1f7401ba77ec1' }))));
26864
27314
  }
26865
27315
  get el() { return getElement(this); }
26866
27316
  static get style() { return pdsTabpanelCss(); }
@@ -27159,7 +27609,7 @@ class PdsTabs {
27159
27609
  // Only the classes: `active-tab-name` backs the mutable activeTabName prop, so a morph that drops
27160
27610
  // it is a prop change, not a strip.
27161
27611
  this.hostKeeper.record(hostClass);
27162
- return (hAsync(Host, { key: '91a9a5cf4348b73ef5ec21430db20468fb67906c', "active-tab-name": this.activeTabName, class: hostClass, id: this.componentId }, tabList, hAsync("slot", { key: 'f0ec002e513f3e91956e905c23e35dae0e6328ad', name: "tabpanels" })));
27612
+ return (hAsync(Host, { key: '08ac02be358bebbd95dd5edca30cd99789445f50', "active-tab-name": this.activeTabName, class: hostClass, id: this.componentId }, tabList, hAsync("slot", { key: '02395c056f80f46f1fa9117eafde68ef170b4188', name: "tabpanels" })));
27163
27613
  }
27164
27614
  get el() { return getElement(this); }
27165
27615
  static get style() { return pdsTabsCss(); }
@@ -27203,6 +27653,9 @@ const TEXT_SIZES = [
27203
27653
 
27204
27654
  const pdsTextCss = () => `:host{display:inline}:host([decoration=underline-dotted])>*{-webkit-text-decoration-color:var(--pine-color-text-tertiary);text-decoration-color:var(--pine-color-text-tertiary);-webkit-text-decoration-line:underline;text-decoration-line:underline;-webkit-text-decoration-style:dotted;text-decoration-style:dotted;text-decoration-thickness:12%;text-underline-offset:0.3rem;text-underline-position:under}:host([decoration=strikethrough])>*{text-decoration:line-through}h1{font:var(--pine-typography-heading-1);letter-spacing:var(--pine-letter-spacing-heading-1)}h2{font:var(--pine-typography-heading-2);letter-spacing:var(--pine-letter-spacing-heading-2)}h3{font:var(--pine-typography-heading-3);letter-spacing:var(--pine-letter-spacing-heading-3)}h4{font:var(--pine-typography-heading-4);letter-spacing:var(--pine-letter-spacing-heading-4)}h5{font:var(--pine-typography-heading-5);letter-spacing:var(--pine-letter-spacing-heading-5)}h6{font:var(--pine-typography-heading-6);letter-spacing:var(--pine-letter-spacing-heading-6)}code,em,p,pre,strong{font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing)}code,pre{font-family:monospace;letter-spacing:0;line-height:1}em{font-style:normal}strong{font-weight:bolder}:host([truncate]){display:block;min-width:0}:host([truncate])>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host([italic])>*{font-style:italic}.pds-text{color:var(--color, var(--pine-color-text));margin:var(--pine-dimension-none)}.pds-text--size-2xl{font-size:var(--pine-font-size-body-2xl)}.pds-text--size-xl{font-size:var(--pine-font-size-body-xl)}.pds-text--size-lg{font-size:var(--pine-font-size-body-lg)}.pds-text--size-md{font-size:var(--pine-font-size-body-md)}.pds-text--size-sm{font-size:var(--pine-font-size-body-sm)}.pds-text--size-xs{font-size:var(--pine-font-size-body-xs)}.pds-text--size-2xs{font-size:var(--pine-font-size-body-2xs)}.pds-text--size-h1{font-size:var(--pine-font-size-heading-1)}.pds-text--size-h2{font-size:var(--pine-font-size-heading-2)}.pds-text--size-h3{font-size:var(--pine-font-size-heading-3)}.pds-text--size-h4{font-size:var(--pine-font-size-heading-4)}.pds-text--size-h5{font-size:var(--pine-font-size-heading-5)}.pds-text--size-h6{font-size:var(--pine-font-size-heading-6)}.pds-text--weight-extra-light{font-weight:var(--pine-font-weight-extra-light)}.pds-text--weight-light{font-weight:var(--pine-font-weight-light)}.pds-text--weight-regular{font-weight:var(--pine-font-weight-regular)}.pds-text--weight-medium{font-weight:var(--pine-font-weight-medium)}.pds-text--weight-semibold{font-weight:var(--pine-font-weight-semi-bold)}.pds-text--weight-bold{font-weight:var(--pine-font-weight-bold)}.pds-text--gutter-2xl{-webkit-margin-after:var(--pine-dimension-2xl);margin-block-end:var(--pine-dimension-2xl)}.pds-text--gutter-xl{-webkit-margin-after:var(--pine-dimension-xl);margin-block-end:var(--pine-dimension-xl)}.pds-text--gutter-lg{-webkit-margin-after:var(--pine-dimension-lg);margin-block-end:var(--pine-dimension-lg)}.pds-text--gutter-md{-webkit-margin-after:var(--pine-dimension-md);margin-block-end:var(--pine-dimension-md)}.pds-text--gutter-sm{-webkit-margin-after:var(--pine-dimension-sm);margin-block-end:var(--pine-dimension-sm)}.pds-text--gutter-xs{-webkit-margin-after:var(--pine-dimension-xs);margin-block-end:var(--pine-dimension-xs)}.pds-text--gutter-2xs{-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-text--align-start{text-align:start}.pds-text--align-center{text-align:center}.pds-text--align-end{text-align:end}.pds-text--align-justify{text-align:justify}`;
27205
27655
 
27656
+ // Re-runs setup for each text bound to its wrapping control, keyed by host, so a truncated
27657
+ // text that joins the same control later can take that control's focus away from it.
27658
+ const textsUsingWrapper = new WeakMap();
27206
27659
  /**
27207
27660
  * @part content - The text content container
27208
27661
  */
@@ -27257,17 +27710,39 @@ class PdsText {
27257
27710
  this.destroyTruncationTooltip();
27258
27711
  }
27259
27712
  initTruncationTooltip() {
27713
+ var _a;
27260
27714
  // Clean up any existing tooltip before setting up a new one
27261
27715
  this.destroyTruncationTooltip();
27262
27716
  if (this.contentEl) {
27717
+ const wrapper = this.el.closest(FOCUSABLE_WRAPPER);
27718
+ // A pds-chip with a max width binds its tooltip to the wrapper too.
27719
+ const others = wrapper === null ? [] : wrapper.querySelectorAll('pds-text, pds-chip');
27720
+ // One focus on a shared wrapper would open every clipped text's tooltip at once, so texts sharing one each keep
27721
+ // their own stop, and a text bound before this one joined lets go: this one's focus bubbles to the wrapper too.
27722
+ let sharesWrapper = false;
27723
+ for (let i = 0; i < others.length; i++) {
27724
+ const other = others[i];
27725
+ // The property counts too: setting `truncate` runs setup before the next render reflects the attribute.
27726
+ if (other !== this.el && (other.truncate || other.maxWidth || other.hasAttribute('truncate') || other.hasAttribute('max-width'))) {
27727
+ sharesWrapper = true;
27728
+ (_a = textsUsingWrapper.get(other)) === null || _a === void 0 ? void 0 : _a();
27729
+ }
27730
+ }
27731
+ const usesWrapper = wrapper !== null && !sharesWrapper;
27263
27732
  this.truncationCleanup = setupTruncationTooltip({
27264
27733
  hostEl: this.el,
27265
27734
  contentEl: this.contentEl,
27266
27735
  getTooltipText: () => this.el.textContent || '',
27736
+ // A wrapping link or button already takes focus, so its focus reveals the text instead of a nested tab stop.
27737
+ manageTabIndex: !usesWrapper,
27738
+ focusEl: usesWrapper ? wrapper : this.el,
27267
27739
  });
27740
+ if (usesWrapper)
27741
+ textsUsingWrapper.set(this.el, () => this.initTruncationTooltip());
27268
27742
  }
27269
27743
  }
27270
27744
  destroyTruncationTooltip() {
27745
+ textsUsingWrapper.delete(this.el);
27271
27746
  if (this.truncationCleanup) {
27272
27747
  this.truncationCleanup();
27273
27748
  this.truncationCleanup = null;
@@ -27293,7 +27768,7 @@ class PdsText {
27293
27768
  ? `pds-text--decoration-${this.decoration}`
27294
27769
  : ''}
27295
27770
  `;
27296
- return (hAsync(Tag, { key: '6460288f1d395080a39aec214e55cab87fdaec9f', ref: (el) => (this.contentEl = el), style: this.color && setColor(this.color), class: typeClasses, part: "content" }, hAsync("slot", { key: 'a8be0d96f72d8ee44288d7c8615155dc68d92663' })));
27771
+ return (hAsync(Tag, { key: '30566c7810d3fd7f76ae281ae6d9a7e66803f0a3', ref: (el) => (this.contentEl = el), style: this.color && setColor(this.color), class: typeClasses, part: "content" }, hAsync("slot", { key: 'f5113458aa9295803fc1c0bc552f9f92602cacba' })));
27297
27772
  }
27298
27773
  get el() { return getElement(this); }
27299
27774
  static get watchers() { return {
@@ -27639,10 +28114,10 @@ class PdsTextarea {
27639
28114
  }
27640
28115
  render() {
27641
28116
  const value = this.getValue();
27642
- return (hAsync(Host, { key: '5933dab0c3cd25b1cf2f6851ece8e8064bc7f3b9', "aria-disabled": this.disabled ? 'true' : null, "aria-readonly": this.readonly ? 'true' : null, "has-action": this.hasAction && !this.hideLabel ? 'true' : null }, hAsync("div", { key: '4f1752514d8e5b0f0e3439515cb9e5f043607da1', class: "pds-textarea" }, this.label &&
27643
- hAsync("div", { key: 'd4e6df0b381d781b70eeae72ff2f0e9428c0d901', class: "pds-textarea__label-wrapper" }, hAsync("label", { key: '747d82067eb571d02840cfd981865821099f288b', htmlFor: this.componentId }, hAsync("span", { key: 'bfab6e8ede66d0169dd020b7dd97e125aba417b0', class: this.hideLabel ? 'visually-hidden' : '' }, this.label)), !this.hideLabel && this.renderAction()), hAsync("div", { key: 'a18611c03270e7491c1af69f931419c832192c06', class: "pds-textarea__field-wrapper" }, hAsync("textarea", Object.assign({ key: '868382c7b04a4e59c0daa9d98afcdc9048f6224f', ref: (el) => this.nativeTextarea = el, "aria-describedby": assignDescription(this.componentId, this.invalid, this.helperMessage, this.errorMessage), "aria-invalid": this.invalid ? "true" : undefined, autocomplete: this.autocomplete, class: this.textareaClassNames(), disabled: this.disabled, id: this.componentId, maxlength: this.maxLength, name: this.name, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, rows: this.rows, onBlur: this.onBlur, onChange: this.onTextareaChange, onFocus: this.onFocus, onInput: this.onInput, onKeyDown: this.onKeyDown }, this.inheritedAttributes), value), this.renderCharacterCounter()), this.helperMessage &&
27644
- hAsync("p", { key: 'dcb36f21443d2a782c25b7c29c4ce6215f3b212b', class: "pds-textarea__helper-message", id: messageId(this.componentId, 'helper') }, this.helperMessage), this.invalid &&
27645
- hAsync("p", { key: 'be30fb1a38453296e26b775955389c0ec569df67', "aria-live": "assertive", class: "pds-textarea__error-message", id: messageId(this.componentId, 'error') }, hAsync("pds-icon", { key: '853f06489ef6ca50205799659d221bd3bea7d8da', "aria-hidden": "true", icon: danger, size: "small" }), this.errorMessage))));
28117
+ return (hAsync(Host, { key: '76e445d135191df3090620f2c2eaf6ed8d7eb9cb', "aria-disabled": this.disabled ? 'true' : null, "aria-readonly": this.readonly ? 'true' : null, "has-action": this.hasAction && !this.hideLabel ? 'true' : null }, hAsync("div", { key: '836815333b0ca925bc205a4b8b25086fe82fcedc', class: "pds-textarea" }, this.label &&
28118
+ hAsync("div", { key: 'e8633457c994d3387ec277fd9945afb2c653d27a', class: "pds-textarea__label-wrapper" }, hAsync("label", { key: '977bb1c171b68242ab06e01ef94ecc4e4cb26880', htmlFor: this.componentId }, hAsync("span", { key: 'ef87433d6524296b3153e8d04e6406c9287e3f2e', class: this.hideLabel ? 'visually-hidden' : '' }, this.label)), !this.hideLabel && this.renderAction()), hAsync("div", { key: '92952c76f5f4a87da4953f792a9a5589d7765451', class: "pds-textarea__field-wrapper" }, hAsync("textarea", Object.assign({ key: 'a61f39d0e299cb6b3e6d1beed37805ad9a71b579', ref: (el) => this.nativeTextarea = el, "aria-describedby": assignDescription(this.componentId, this.invalid, this.helperMessage, this.errorMessage), "aria-invalid": this.invalid ? "true" : undefined, autocomplete: this.autocomplete, class: this.textareaClassNames(), disabled: this.disabled, id: this.componentId, maxlength: this.maxLength, name: this.name, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, rows: this.rows, onBlur: this.onBlur, onChange: this.onTextareaChange, onFocus: this.onFocus, onInput: this.onInput, onKeyDown: this.onKeyDown }, this.inheritedAttributes), value), this.renderCharacterCounter()), this.helperMessage &&
28119
+ hAsync("p", { key: '811065b7ce7b45d902d821dbceb25fef4231db94', class: "pds-textarea__helper-message", id: messageId(this.componentId, 'helper') }, this.helperMessage), this.invalid &&
28120
+ hAsync("p", { key: 'f95f566b79215a4a128fe92c02be244219f843e5', "aria-live": "assertive", class: "pds-textarea__error-message", id: messageId(this.componentId, 'error') }, hAsync("pds-icon", { key: '08f649e4b32551d59d60b978262cd7beaa99e08d', "aria-hidden": "true", icon: danger, size: "small" }), this.errorMessage))));
27646
28121
  }
27647
28122
  static get formAssociated() { return true; }
27648
28123
  get el() { return getElement(this); }
@@ -27690,7 +28165,7 @@ class PdsTextarea {
27690
28165
  }; }
27691
28166
  }
27692
28167
 
27693
- const pdsToastCss = () => `:host{--animation-duration:var(--pine-motion-duration-slow);--animation-timing:var(--pine-motion-easing-in-out);--padding-inline:var(--pine-dimension-md);--padding-inline-desktop:var(--pine-dimension-2xl);--sizing-height-default:68px;--sizing-min-width:calc(var(--sizing-total-width) - (var(--padding-inline) * 2));--sizing-min-width-desktop:calc(var(--sizing-total-width) - (var(--padding-inline-desktop) * 2));--sizing-total-width:350px;-webkit-box-sizing:border-box;box-sizing:border-box;display:block;font:var(--pine-typography-body-medium)}.pds-toast{-ms-flex-align:center;align-items:center;-webkit-animation:pds-toast-animate-in var(--animation-duration) var(--animation-timing);animation:pds-toast-animate-in var(--animation-duration) var(--animation-timing);background-color:var(--pine-color-primary);border-radius:var(--pine-dimension-xs);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);color:var(--pine-color-text-primary);display:-ms-flexbox;display:flex;height:var(--sizing-height-default);-ms-flex-pack:start;justify-content:flex-start;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs);max-width:90vw;min-width:var(--sizing-min-width);padding:0 var(--padding-inline);position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}@media screen and (max-width: 767px){.pds-toast{height:36px;max-width:calc(100vw - var(--pine-dimension-2xs) * 2);min-width:auto;padding-inline:var(--pine-dimension-2xs)}}.pds-toast--danger{background-color:var(--pine-color-danger)}.pds-toast--loading .pds-toast__loader{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-webkit-margin-end:var(--pine-dimension-sm);margin-inline-end:var(--pine-dimension-sm);position:relative}.pds-toast--loading .pds-toast__loader-spinner{-webkit-animation:pds-toast-rotate 2s linear infinite;animation:pds-toast-rotate 2s linear infinite;height:20px;width:20px}.pds-toast--loading .pds-toast__loader-path{-webkit-animation:pds-toast-dash 1.5s ease-in-out infinite;animation:pds-toast-dash 1.5s ease-in-out infinite;stroke-dasharray:1, 200;stroke-dashoffset:0;stroke-linecap:round}.pds-toast__icon{color:var(--pine-color-text-primary);display:-ms-inline-flexbox;display:inline-flex;-webkit-margin-end:var(--pine-dimension-sm);margin-inline-end:var(--pine-dimension-sm)}.pds-toast__message{font:var(--pine-typography-body-sm-medium);-webkit-margin-end:auto;margin-inline-end:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-toast__message ::slotted(a){color:var(--pine-color-text-primary);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs);opacity:0.7;text-decoration:underline}.pds-toast__message ::slotted(a):hover,.pds-toast__message ::slotted(a):focus-visible{opacity:1}.pds-toast__message ::slotted(a):focus-visible{outline:2px solid var(--pine-color-text-primary);outline-offset:2px}.pds-toast__button{-ms-flex-align:center;align-items:center;background:none;border:0;border-radius:var(--pine-border-radius-full);color:inherit;cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;-webkit-margin-start:var(--pine-dimension-md);margin-inline-start:var(--pine-dimension-md);opacity:0.7;padding:0;white-space:nowrap}.pds-toast__button:hover,.pds-toast__button:focus{opacity:1}.pds-toast__button:focus{outline:var(--pine-outline-focus);outline-offset:var(--pine-dimension-2xs)}@-webkit-keyframes pds-toast-animate-in{from{opacity:0;-webkit-transform:translateY(100%);transform:translateY(100%)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes pds-toast-animate-in{from{opacity:0;-webkit-transform:translateY(100%);transform:translateY(100%)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes pds-toast-animate-out{from{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}to{opacity:0;-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes pds-toast-animate-out{from{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}to{opacity:0;-webkit-transform:translateY(100%);transform:translateY(100%)}}@-webkit-keyframes pds-toast-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes pds-toast-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes pds-toast-dash{0%{stroke-dasharray:1, 200;stroke-dashoffset:0}50%{stroke-dasharray:89, 200;stroke-dashoffset:-35}100%{stroke-dasharray:89, 200;stroke-dashoffset:-124}}@keyframes pds-toast-dash{0%{stroke-dasharray:1, 200;stroke-dashoffset:0}50%{stroke-dasharray:89, 200;stroke-dashoffset:-35}100%{stroke-dasharray:89, 200;stroke-dashoffset:-124}}:host([hidden]) .pds-toast,.pds-toast--animating-out{-webkit-animation:pds-toast-animate-out var(--animation-duration) var(--animation-timing) forwards;animation:pds-toast-animate-out var(--animation-duration) var(--animation-timing) forwards;pointer-events:none;}`;
28168
+ const pdsToastCss = () => `:host{--animation-duration:var(--pine-motion-duration-slow);--animation-timing:var(--pine-motion-easing-in-out);--padding-inline:var(--pine-dimension-md);--padding-inline-desktop:var(--pine-dimension-2xl);--sizing-height-default:68px;--sizing-min-width:calc(var(--sizing-total-width) - (var(--padding-inline) * 2));--sizing-min-width-desktop:calc(var(--sizing-total-width) - (var(--padding-inline-desktop) * 2));--sizing-total-width:350px;-webkit-box-sizing:border-box;box-sizing:border-box;display:block;font:var(--pine-typography-body-medium)}.pds-toast{-ms-flex-align:center;align-items:center;-webkit-animation:pds-toast-animate-in var(--animation-duration) var(--animation-timing);animation:pds-toast-animate-in var(--animation-duration) var(--animation-timing);background-color:var(--pine-color-primary);border-radius:var(--pine-dimension-xs);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);color:var(--pine-color-text-primary);display:-ms-flexbox;display:flex;height:var(--sizing-height-default);-ms-flex-pack:start;justify-content:flex-start;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs);max-width:90vw;min-width:var(--sizing-min-width);padding:0 var(--padding-inline);position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}@media screen and (max-width: 767px){.pds-toast{height:36px;max-width:calc(100vw - var(--pine-dimension-2xs) * 2);min-width:auto;padding-inline:var(--pine-dimension-2xs)}}.pds-toast--danger{background-color:var(--pine-color-danger)}.pds-toast--loading .pds-toast__loader{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-webkit-margin-end:var(--pine-dimension-sm);margin-inline-end:var(--pine-dimension-sm);position:relative}.pds-toast--loading .pds-toast__loader-spinner{-webkit-animation:pds-toast-rotate 2s linear infinite;animation:pds-toast-rotate 2s linear infinite;height:20px;width:20px}.pds-toast--loading .pds-toast__loader-path{-webkit-animation:pds-toast-dash 1.5s ease-in-out infinite;animation:pds-toast-dash 1.5s ease-in-out infinite;stroke-dasharray:1, 200;stroke-dashoffset:0;stroke-linecap:round}.pds-toast__icon{color:var(--pine-color-text-primary);display:-ms-inline-flexbox;display:inline-flex;-webkit-margin-end:var(--pine-dimension-sm);margin-inline-end:var(--pine-dimension-sm)}.pds-toast__message{font:var(--pine-typography-body-sm-medium);-webkit-margin-end:auto;margin-inline-end:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-toast__message ::slotted(a){color:var(--pine-color-text-primary);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs);opacity:0.7;text-decoration:underline}.pds-toast__message ::slotted(a):hover,.pds-toast__message ::slotted(a):focus-visible{opacity:1}.pds-toast__message ::slotted(a):focus-visible{outline:2px solid var(--pine-color-text-primary);outline-offset:2px}.pds-toast__button{-ms-flex-align:center;align-items:center;background:none;border:0;border-radius:var(--pine-border-radius-full);color:inherit;cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;-webkit-margin-start:var(--pine-dimension-md);margin-inline-start:var(--pine-dimension-md);opacity:0.7;padding:0;white-space:nowrap}.pds-toast__button:hover,.pds-toast__button:focus{opacity:1}.pds-toast__button:focus{outline:var(--pine-outline-focus);outline-offset:var(--pine-dimension-2xs)}@-webkit-keyframes pds-toast-animate-in{from{opacity:0;-webkit-transform:translateY(100%);transform:translateY(100%)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes pds-toast-animate-in{from{opacity:0;-webkit-transform:translateY(100%);transform:translateY(100%)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes pds-toast-animate-out{from{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}to{opacity:0;-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes pds-toast-animate-out{from{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}to{opacity:0;-webkit-transform:translateY(100%);transform:translateY(100%)}}@-webkit-keyframes pds-toast-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes pds-toast-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes pds-toast-dash{0%{stroke-dasharray:1, 200;stroke-dashoffset:0}50%{stroke-dasharray:89, 200;stroke-dashoffset:-35}100%{stroke-dasharray:89, 200;stroke-dashoffset:-124}}@keyframes pds-toast-dash{0%{stroke-dasharray:1, 200;stroke-dashoffset:0}50%{stroke-dasharray:89, 200;stroke-dashoffset:-35}100%{stroke-dasharray:89, 200;stroke-dashoffset:-124}}:host([hidden]) .pds-toast,.pds-toast--animating-out{-webkit-animation:pds-toast-animate-out var(--animation-duration) var(--animation-timing) forwards;animation:pds-toast-animate-out var(--animation-duration) var(--animation-timing) forwards;pointer-events:none;}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}`;
27694
28169
 
27695
28170
  /** Fallback when computed `--animation-duration` is unavailable (matches `--pine-motion-duration-slow`). */
27696
28171
  const TOAST_DISMISS_ANIMATION_MS = 300;
@@ -27812,17 +28287,23 @@ class PdsToast {
27812
28287
  if (this.type === 'loading') {
27813
28288
  return (hAsync("div", { class: "pds-toast__loader" }, hAsync("svg", { class: "pds-toast__loader-spinner", viewBox: "25 25 50 50", "aria-hidden": "true" }, hAsync("circle", { class: "pds-toast__loader-path", cx: "50", cy: "50", r: "20", fill: "none", stroke: "currentColor", "stroke-width": "4", "stroke-linecap": "round" }))));
27814
28289
  }
27815
- // Return icon if provided, otherwise undefined (which renders as nothing)
27816
- return this.icon && hAsync("pds-icon", { name: this.icon, class: "pds-toast__icon" });
28290
+ // Decorative: inside role="alert" an icon name would be read out with the
28291
+ // message. Severity is announced as text instead (see severityLabel).
28292
+ return this.icon && hAsync("pds-icon", { name: this.icon, class: "pds-toast__icon", "aria-hidden": "true" });
28293
+ }
28294
+ severityText() {
28295
+ var _a;
28296
+ return (_a = this.severityLabel) !== null && _a !== void 0 ? _a : (this.type === 'danger' ? 'Error' : undefined);
27817
28297
  }
27818
28298
  render() {
27819
- return (hAsync(Host, { key: '754a4583cefca47a3d3fea7dab036c06ea8aabcd', hidden: !this.isVisible }, hAsync("div", { key: '8ac294344ca459202c0883e724e09a4218342cc4', class: {
28299
+ const severity = this.severityText();
28300
+ return (hAsync(Host, { key: '4c4077add1843ab84674dfa49fb963df55f1c432', hidden: !this.isVisible }, hAsync("div", { key: '0d819ac123de625604d3b1aa0f9391366b4d0289', class: {
27820
28301
  'pds-toast': true,
27821
28302
  [`pds-toast--${this.type}`]: this.type !== 'default',
27822
28303
  'pds-toast--animating-out': this.isAnimatingOut
27823
- }, role: "alert", "aria-live": "polite" }, this.renderIcon(), hAsync("span", { key: 'eaf615d41c138e2c73088d29bac9349f49a63ba7', class: "pds-toast__message" }, hAsync("slot", { key: '33973447154d80b016f5a7954b0473db03228379' })), this.dismissible && (hAsync("button", { key: 'e189834633e1e648282ee43633fd05e53ce38869', type: "button", part: "dismiss", class: "pds-toast__button", onClick: () => {
28304
+ }, role: "alert", "aria-live": "polite" }, this.renderIcon(), severity && hAsync("span", { key: 'f75fb422797082e99acb85432c1b50cf702d7afc', class: "visually-hidden" }, severity), hAsync("span", { key: '3d9f03d96dbda41c72d2c2cc492b1422928d573f', class: "pds-toast__message" }, hAsync("slot", { key: 'affc7e4cb592735ec396fa90a9405f25b389e4bd' })), this.dismissible && (hAsync("button", { key: '0c4ef459dda09b8a196eed7ee28383995d959b11', type: "button", part: "dismiss", class: "pds-toast__button", onClick: () => {
27824
28305
  this.dismiss();
27825
- }, "aria-label": this.dismissLabel }, hAsync("pds-icon", { key: '913201979e52be743ba933ff173e023b81553362', name: "remove", "aria-hidden": "true" }))))));
28306
+ }, "aria-label": this.dismissLabel }, hAsync("pds-icon", { key: '1b26a6a842868a5b1e55b7110c755edc7f830ba5', name: "remove", "aria-hidden": "true" }))))));
27826
28307
  }
27827
28308
  get el() { return getElement(this); }
27828
28309
  static get watchers() { return {
@@ -27841,6 +28322,7 @@ class PdsToast {
27841
28322
  "icon": [1],
27842
28323
  "type": [1],
27843
28324
  "dismissLabel": [1, "dismiss-label"],
28325
+ "severityLabel": [1, "severity-label"],
27844
28326
  "isVisible": [32],
27845
28327
  "isAnimatingOut": [32],
27846
28328
  "dismiss": [64]
@@ -27851,7 +28333,7 @@ class PdsToast {
27851
28333
  }; }
27852
28334
  }
27853
28335
 
27854
- const pdsTooltipCss = () => `.pds-tooltip{--tooltip-border-width-arrow-down:var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;--tooltip-border-width-arrow-left:var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;--tooltip-border-width-arrow-right:var(--tooltip-sizing-arrow) 0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);--tooltip-border-width-arrow-up:0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);--tooltip-sizing-arrow:6px;--tooltip-sizing-arrow-offset:14px;--tooltip-dimension-max-width:320px}.pds-tooltip__content{background-color:var(--pine-color-primary);border-radius:calc(var(--pine-dimension-xs) * 1.25);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);color:var(--pine-color-text-primary);max-width:var(--tooltip-dimension-max-width);opacity:0;padding:var(--pine-dimension-xs) calc(var(--pine-dimension-md) / 2);position:relative;visibility:hidden;width:-webkit-max-content;width:-moz-max-content;width:max-content}.pds-tooltip--is-open .pds-tooltip__content{opacity:1;visibility:visible;z-index:var(--pine-z-index-raised)}.pds-tooltip.pds-tooltip--has-html-content .pds-tooltip__content{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.pds-tooltip__content::after{border-color:transparent;border-right-color:transparent;border-style:solid;border-width:var(--tooltip-border-width-arrow-left);content:"";height:0;position:absolute;width:0}.pds-tooltip--right .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);left:calc(var(--tooltip-sizing-arrow) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--right-end .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);bottom:var(--tooltip-sizing-arrow-offset);left:calc(var(--tooltip-sizing-arrow) * -1);top:initial}.pds-tooltip--right-start .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);left:calc(var(--tooltip-sizing-arrow) * -1);top:var(--tooltip-sizing-arrow-offset)}.pds-tooltip--top .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:50%;top:initial;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--top-start .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:var(--tooltip-sizing-arrow-offset);top:initial}.pds-tooltip--top-end .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:initial;right:var(--tooltip-sizing-arrow-offset);top:initial}.pds-tooltip--left .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--left-end .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);bottom:var(--tooltip-sizing-arrow-offset);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:initial}.pds-tooltip--left-start .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:var(--tooltip-sizing-arrow-offset)}.pds-tooltip--bottom .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:50%;top:calc(var(--tooltip-sizing-arrow) * -1);-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--bottom-end .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:initial;right:var(--tooltip-sizing-arrow-offset);top:calc(var(--tooltip-sizing-arrow) * -1)}.pds-tooltip--bottom-start .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:var(--tooltip-sizing-arrow-offset);top:calc(var(--tooltip-sizing-arrow) * -1)}.pds-tooltip--no-arrow .pds-tooltip__content::after{border-width:0}`;
28336
+ const pdsTooltipCss = () => `.pds-tooltip{--tooltip-border-width-arrow-down:var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;--tooltip-border-width-arrow-left:var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;--tooltip-border-width-arrow-right:var(--tooltip-sizing-arrow) 0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);--tooltip-border-width-arrow-up:0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);--tooltip-sizing-arrow:6px;--tooltip-sizing-arrow-offset:14px;--tooltip-dimension-max-width:320px}:is(dialog,[popover])>.pds-tooltip{font-style:normal;font-weight:normal;letter-spacing:normal;text-align:start;text-indent:0;text-transform:none;white-space:normal;word-spacing:normal}.pds-tooltip__content{background-color:var(--pine-color-primary);border-radius:calc(var(--pine-dimension-xs) * 1.25);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);color:var(--pine-color-text-primary);max-width:var(--tooltip-dimension-max-width);opacity:0;padding:var(--pine-dimension-xs) calc(var(--pine-dimension-md) / 2);position:relative;visibility:hidden;width:-webkit-max-content;width:-moz-max-content;width:max-content}.pds-tooltip--is-open .pds-tooltip__content{opacity:1;visibility:visible;z-index:var(--pine-z-index-raised)}.pds-tooltip.pds-tooltip--has-html-content .pds-tooltip__content{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.pds-tooltip__content::after{border-color:transparent;border-right-color:transparent;border-style:solid;border-width:var(--tooltip-border-width-arrow-left);content:"";height:0;position:absolute;width:0}.pds-tooltip--right .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);left:calc(var(--tooltip-sizing-arrow) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--right-end .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);bottom:var(--tooltip-sizing-arrow-offset);left:calc(var(--tooltip-sizing-arrow) * -1);top:initial}.pds-tooltip--right-start .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);left:calc(var(--tooltip-sizing-arrow) * -1);top:var(--tooltip-sizing-arrow-offset)}.pds-tooltip--top .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:50%;top:initial;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--top-start .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:var(--tooltip-sizing-arrow-offset);top:initial}.pds-tooltip--top-end .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:initial;right:var(--tooltip-sizing-arrow-offset);top:initial}.pds-tooltip--left .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--left-end .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);bottom:var(--tooltip-sizing-arrow-offset);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:initial}.pds-tooltip--left-start .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:var(--tooltip-sizing-arrow-offset)}.pds-tooltip--bottom .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:50%;top:calc(var(--tooltip-sizing-arrow) * -1);-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--bottom-end .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:initial;right:var(--tooltip-sizing-arrow-offset);top:calc(var(--tooltip-sizing-arrow) * -1)}.pds-tooltip--bottom-start .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:var(--tooltip-sizing-arrow-offset);top:calc(var(--tooltip-sizing-arrow) * -1)}.pds-tooltip--no-arrow .pds-tooltip__content::after{border-width:0}`;
27855
28337
 
27856
28338
  /**
27857
28339
  * @slot (default) - The tooltip's target element
@@ -27870,10 +28352,13 @@ class PdsTooltip {
27870
28352
  this.resolvedPlacement = 'right';
27871
28353
  this.triggerEl = null;
27872
28354
  this.contentDiv = null;
28355
+ this.lastCopiedHtml = null;
27873
28356
  this.slotMutationObserver = null;
28357
+ this.contentSyncFrame = null;
27874
28358
  this.currentPathname = '';
27875
28359
  this.pathnameCheckInterval = null;
27876
28360
  this.stopAutoUpdate = null;
28361
+ this.stopWatchingPortalHost = null;
27877
28362
  /**
27878
28363
  * Determines whether or not the tooltip has an arrow
27879
28364
  * @defaultValue true
@@ -27937,6 +28422,25 @@ class PdsTooltip {
27937
28422
  this.handleSpaNavigation();
27938
28423
  }
27939
28424
  };
28425
+ this.scheduleContentSync = () => {
28426
+ if (this.contentSyncFrame !== null)
28427
+ return;
28428
+ this.contentSyncFrame = requestAnimationFrame(() => {
28429
+ this.contentSyncFrame = null;
28430
+ if (this.portalEl === null || this.contentDiv === null)
28431
+ return;
28432
+ const copy = this.copySlottedContent();
28433
+ const strippedCopy = this.strippedHtml(copy);
28434
+ if (strippedCopy === this.lastCopiedHtml)
28435
+ return;
28436
+ this.lastCopiedHtml = strippedCopy;
28437
+ this.contentDiv.textContent = '';
28438
+ this.contentDiv.append(...Array.from(copy.childNodes));
28439
+ this.repositionPortal().catch(error => {
28440
+ console.warn('Failed to reposition tooltip after a content change:', error);
28441
+ });
28442
+ });
28443
+ };
27940
28444
  }
27941
28445
  handleOpenToggle(newValue, oldValue) {
27942
28446
  if (newValue === false && oldValue === true) {
@@ -27951,16 +28455,6 @@ class PdsTooltip {
27951
28455
  window.addEventListener('pageshow', this.handlePageShow);
27952
28456
  this.currentPathname = window.location.pathname;
27953
28457
  this.triggerEl = this.el.querySelector('.pds-tooltip__trigger');
27954
- const contentSlotWrapper = this.el.querySelector('.pds-tooltip__content-slot-wrapper');
27955
- if (contentSlotWrapper !== null) {
27956
- this.slotMutationObserver = new MutationObserver(() => {
27957
- if (this.opened && this.portalEl !== null) {
27958
- this.removePortal();
27959
- this.createPortal();
27960
- }
27961
- });
27962
- this.slotMutationObserver.observe(contentSlotWrapper, { childList: true, subtree: false });
27963
- }
27964
28458
  // no return; Stencil ignores teardown functions here
27965
28459
  }
27966
28460
  connectedCallback() {
@@ -27968,10 +28462,6 @@ class PdsTooltip {
27968
28462
  }
27969
28463
  disconnectedCallback() {
27970
28464
  window.removeEventListener('pageshow', this.handlePageShow);
27971
- if (this.slotMutationObserver !== null) {
27972
- this.slotMutationObserver.disconnect();
27973
- this.slotMutationObserver = null;
27974
- }
27975
28465
  // Ensure global listeners/intervals are removed if still present
27976
28466
  if (this.portalEl !== null) {
27977
28467
  this.removePortal();
@@ -28114,33 +28604,16 @@ class PdsTooltip {
28114
28604
  this.contentDiv.className = 'pds-tooltip__content';
28115
28605
  this.contentDiv.setAttribute('aria-hidden', this.opened ? 'false' : 'true');
28116
28606
  this.contentDiv.setAttribute('aria-live', this.opened ? 'polite' : 'off');
28117
- const contentSlotWrapper = this.el.querySelector('.pds-tooltip__content-slot-wrapper');
28118
- const slottedContentContainer = contentSlotWrapper === null || contentSlotWrapper === void 0 ? void 0 : contentSlotWrapper.querySelector('[slot="content"]');
28119
- let hasSlottedContent = false;
28120
- if (slottedContentContainer !== null) {
28121
- const childrenToClone = Array.from(slottedContentContainer.childNodes);
28122
- if (childrenToClone.length > 0) {
28123
- const hasMeaningfulNode = childrenToClone.some(node => {
28124
- var _a;
28125
- return node.nodeType === Node.ELEMENT_NODE ||
28126
- (node.nodeType === Node.TEXT_NODE && ((_a = node.textContent) === null || _a === void 0 ? void 0 : _a.trim()) !== '');
28127
- });
28128
- if (hasMeaningfulNode) {
28129
- hasSlottedContent = true;
28130
- childrenToClone.forEach((node /*, index*/) => {
28131
- var _a;
28132
- if (node.nodeType === Node.ELEMENT_NODE || (node.nodeType === Node.TEXT_NODE && ((_a = node.textContent) === null || _a === void 0 ? void 0 : _a.trim()) !== '')) {
28133
- this.contentDiv.appendChild(node.cloneNode(true));
28134
- }
28135
- });
28136
- }
28137
- }
28138
- }
28139
- if (!hasSlottedContent && typeof this.content === 'string' && this.content.trim() !== '') {
28140
- this.contentDiv.textContent = this.content;
28141
- }
28607
+ const initialCopy = this.copySlottedContent();
28608
+ this.lastCopiedHtml = this.strippedHtml(initialCopy);
28609
+ this.contentDiv.append(...Array.from(initialCopy.childNodes));
28142
28610
  this.portalEl.appendChild(this.contentDiv);
28143
- document.body.appendChild(this.portalEl);
28611
+ // Nothing in the body paints above a modal dialog or open popover, so the portal goes inside one.
28612
+ const portalHost = findPortalTarget(this.el, isTopLayerInDocument);
28613
+ portalHost.appendChild(this.portalEl);
28614
+ // Closing that host moves no pointer, so a tooltip opened by touch would outlive it unseen.
28615
+ if (portalHost !== document.body)
28616
+ this.stopWatchingPortalHost = onTopLayerClose(portalHost, this.handleHide);
28144
28617
  this.repositionPortal().catch(error => {
28145
28618
  console.warn('Failed to position tooltip on creation:', error);
28146
28619
  });
@@ -28161,13 +28634,102 @@ class PdsTooltip {
28161
28634
  if (this.triggerEl !== null && this.portalEl.id !== '') {
28162
28635
  this.triggerEl.setAttribute('aria-describedby', this.portalEl.id);
28163
28636
  }
28637
+ this.startContentSync();
28638
+ }
28639
+ /**
28640
+ * The host's own content slot wrapper. Matched among direct children only, so a nested
28641
+ * pds-tooltip inside the trigger slot isn't mistaken for this one's.
28642
+ */
28643
+ get contentSlotWrapper() {
28644
+ return Array.from(this.el.children).find((child) => child.matches('.pds-tooltip__content-slot-wrapper'));
28645
+ }
28646
+ /**
28647
+ * Copies the slotted content (or the `content` prop's text) into a detached container. The
28648
+ * portal holds copies so the framework that owns the slotted nodes keeps them.
28649
+ */
28650
+ copySlottedContent() {
28651
+ var _a, _b;
28652
+ const copy = document.createElement('div');
28653
+ const slottedContentContainer = (_a = this.contentSlotWrapper) === null || _a === void 0 ? void 0 : _a.querySelector('[slot="content"]');
28654
+ const meaningfulNodes = Array.from((_b = slottedContentContainer === null || slottedContentContainer === void 0 ? void 0 : slottedContentContainer.childNodes) !== null && _b !== void 0 ? _b : []).filter(node => {
28655
+ var _a;
28656
+ return node.nodeType === Node.ELEMENT_NODE ||
28657
+ (node.nodeType === Node.TEXT_NODE && ((_a = node.textContent) === null || _a === void 0 ? void 0 : _a.trim()) !== '');
28658
+ });
28659
+ meaningfulNodes.forEach(node => copy.appendChild(node.cloneNode(true)));
28660
+ if (meaningfulNodes.length === 0 && typeof this.content === 'string' && this.content.trim() !== '') {
28661
+ copy.textContent = this.content;
28662
+ }
28663
+ return copy;
28664
+ }
28665
+ /**
28666
+ * While the tooltip is open, keeps the portal's copy in step with the slotted content at any
28667
+ * depth: content that loads or re-renders after opening shows without reopening. Changes are
28668
+ * batched to one re-copy per animation frame, and a re-copy that matches the last one shown is
28669
+ * dropped, so screen readers aren't re-announced, iframes don't reload and the tooltip isn't
28670
+ * repositioned for nothing. Only the hidden slot wrapper is observed, so copying into the portal
28671
+ * can't trigger another sync.
28672
+ */
28673
+ startContentSync() {
28674
+ const contentSlotWrapper = this.contentSlotWrapper;
28675
+ if (contentSlotWrapper === undefined || typeof MutationObserver === 'undefined')
28676
+ return;
28677
+ this.slotMutationObserver = new MutationObserver(this.scheduleContentSync);
28678
+ this.slotMutationObserver.observe(contentSlotWrapper, {
28679
+ childList: true,
28680
+ subtree: true,
28681
+ attributes: true,
28682
+ characterData: true,
28683
+ });
28684
+ }
28685
+ /**
28686
+ * A copy's serialized HTML with Stencil's own hydration and scope classes removed from every
28687
+ * `pds-*` descendant, so a nested component finishing hydration (or re-hydrating once reconnected
28688
+ * inside the portal) isn't mistaken for a real content change. Without this, that class-only
28689
+ * difference fails the equality check above and triggers a recopy that replaces still-loaded
28690
+ * nodes — reloading any iframe or media the slotted content held.
28691
+ */
28692
+ strippedHtml(root) {
28693
+ const clone = root.cloneNode(true);
28694
+ clone.querySelectorAll('*').forEach((el) => {
28695
+ // isStencilClass is host-scoped (its own doc: "another sc- class may be a consumer's"), so it
28696
+ // only applies to pds-* elements — the same check keepPineHydrated makes before using it.
28697
+ if (!el.localName.startsWith('pds-'))
28698
+ return;
28699
+ // Not `el.className`: on an SVG element that's an SVGAnimatedString, not a string,
28700
+ // so classNamesOf would silently drop its classes from the comparison. The `class`
28701
+ // attribute is a plain string on every element, SVG included.
28702
+ const kept = classNamesOf(el.getAttribute('class') || '').filter((name) => !isStencilClass(el, name));
28703
+ if (kept.length === 0) {
28704
+ el.removeAttribute('class');
28705
+ }
28706
+ else {
28707
+ el.setAttribute('class', kept.join(' '));
28708
+ }
28709
+ });
28710
+ return clone.innerHTML;
28711
+ }
28712
+ stopContentSync() {
28713
+ if (this.slotMutationObserver !== null) {
28714
+ this.slotMutationObserver.disconnect();
28715
+ this.slotMutationObserver = null;
28716
+ }
28717
+ if (this.contentSyncFrame !== null) {
28718
+ cancelAnimationFrame(this.contentSyncFrame);
28719
+ this.contentSyncFrame = null;
28720
+ }
28164
28721
  }
28165
28722
  removePortal() {
28723
+ this.stopContentSync();
28166
28724
  // Stop Floating UI's autoUpdate
28167
28725
  if (this.stopAutoUpdate !== null) {
28168
28726
  this.stopAutoUpdate();
28169
28727
  this.stopAutoUpdate = null;
28170
28728
  }
28729
+ if (this.stopWatchingPortalHost !== null) {
28730
+ this.stopWatchingPortalHost();
28731
+ this.stopWatchingPortalHost = null;
28732
+ }
28171
28733
  // Stop pathname change detection
28172
28734
  if (this.pathnameCheckInterval !== null) {
28173
28735
  clearInterval(this.pathnameCheckInterval);
@@ -28194,12 +28756,13 @@ class PdsTooltip {
28194
28756
  this.triggerEl.removeAttribute('aria-describedby');
28195
28757
  }
28196
28758
  this.contentDiv = null;
28759
+ this.lastCopiedHtml = null;
28197
28760
  }
28198
28761
  render() {
28199
28762
  const hostId = this.componentId || undefined;
28200
- return (hAsync(Host, { key: '2e28dff93cd22fd3816d71b67e38883061a8b2bc', id: hostId, class: { 'pds-tooltip--is-open': this.opened } }, hAsync("span", { key: '9e7ea50427587f61dcea1ea97e10d71f4d0c9d92', class: "pds-tooltip__trigger", onMouseEnter: this.handleShow, onMouseLeave: this.handleHide,
28763
+ return (hAsync(Host, { key: '475ff12d4be035e3effa894353e7948b42a23489', id: hostId, class: { 'pds-tooltip--is-open': this.opened } }, hAsync("span", { key: '3375dfb5bb86ba373bc5d617f4a53171505631d1', class: "pds-tooltip__trigger", onMouseEnter: this.handleShow, onMouseLeave: this.handleHide,
28201
28764
  /* focusin/out bubble; ensure keyboard users see tooltips */
28202
- onFocusin: this.handleShow, onFocusout: this.handleHide, ref: el => this.triggerEl = el }, hAsync("slot", { key: '08c1ff63c91b97b4df1362eb9b2e42b6fd556b11' })), hAsync("div", { key: '5cfe25e21d1f096b76335570fbb930a7bc8c95f8', class: "pds-tooltip__content-slot-wrapper", hidden: true }, hAsync("slot", { key: 'e7e8728d7c8a0c74933cef070aa38f88a1f53a32', name: "content" }))));
28765
+ onFocusin: this.handleShow, onFocusout: this.handleHide, ref: el => this.triggerEl = el }, hAsync("slot", { key: 'a3392ad415f5ac7f3883100bf914484ffcc8e536' })), hAsync("div", { key: '774ac2c4808e96649b1536569aaf8cf8a6e3abc2', class: "pds-tooltip__content-slot-wrapper", hidden: true }, hAsync("slot", { key: '672c64b4acdb365623885ac2105a9b90b1dcfa6b', name: "content" }))));
28203
28766
  }
28204
28767
  get el() { return getElement(this); }
28205
28768
  static get watchers() { return {