@wordpress/ui 0.9.1-next.v.202603161435.0 → 0.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (655) hide show
  1. package/CHANGELOG.md +76 -1
  2. package/CONTRIBUTING.md +180 -0
  3. package/README.md +34 -6
  4. package/build/alert-dialog/context.cjs +39 -0
  5. package/build/alert-dialog/context.cjs.map +7 -0
  6. package/build/alert-dialog/index.cjs +37 -0
  7. package/build/alert-dialog/index.cjs.map +7 -0
  8. package/build/alert-dialog/popup.cjs +165 -0
  9. package/build/alert-dialog/popup.cjs.map +7 -0
  10. package/build/alert-dialog/root.cjs +152 -0
  11. package/build/alert-dialog/root.cjs.map +7 -0
  12. package/build/alert-dialog/trigger.cjs +38 -0
  13. package/build/alert-dialog/trigger.cjs.map +7 -0
  14. package/build/alert-dialog/types.cjs +19 -0
  15. package/build/alert-dialog/types.cjs.map +7 -0
  16. package/build/badge/badge.cjs +14 -14
  17. package/build/badge/badge.cjs.map +2 -2
  18. package/build/button/button.cjs +18 -8
  19. package/build/button/button.cjs.map +3 -3
  20. package/build/card/content.cjs +4 -4
  21. package/build/card/content.cjs.map +2 -2
  22. package/build/card/full-bleed.cjs +4 -4
  23. package/build/card/full-bleed.cjs.map +2 -2
  24. package/build/card/header.cjs +4 -4
  25. package/build/card/header.cjs.map +2 -2
  26. package/build/card/root.cjs +6 -6
  27. package/build/card/root.cjs.map +2 -2
  28. package/build/card/title.cjs +14 -21
  29. package/build/card/title.cjs.map +3 -3
  30. package/build/collapsible-card/content.cjs +24 -3
  31. package/build/collapsible-card/content.cjs.map +4 -4
  32. package/build/collapsible-card/context.cjs +35 -0
  33. package/build/collapsible-card/context.cjs.map +7 -0
  34. package/build/collapsible-card/header-description.cjs +52 -0
  35. package/build/collapsible-card/header-description.cjs.map +7 -0
  36. package/build/collapsible-card/header.cjs +39 -18
  37. package/build/collapsible-card/header.cjs.map +2 -2
  38. package/build/collapsible-card/index.cjs +3 -0
  39. package/build/collapsible-card/index.cjs.map +2 -2
  40. package/build/collapsible-card/types.cjs.map +1 -1
  41. package/build/dialog/action.cjs +4 -2
  42. package/build/dialog/action.cjs.map +2 -2
  43. package/build/dialog/close-icon.cjs +2 -1
  44. package/build/dialog/close-icon.cjs.map +2 -2
  45. package/build/dialog/footer.cjs +3 -3
  46. package/build/dialog/footer.cjs.map +2 -2
  47. package/build/dialog/header.cjs +3 -3
  48. package/build/dialog/header.cjs.map +2 -2
  49. package/build/dialog/popup.cjs +24 -6
  50. package/build/dialog/popup.cjs.map +2 -2
  51. package/build/dialog/title.cjs +10 -19
  52. package/build/dialog/title.cjs.map +3 -3
  53. package/build/dialog/types.cjs.map +1 -1
  54. package/build/empty-state/actions.cjs +66 -0
  55. package/build/empty-state/actions.cjs.map +7 -0
  56. package/build/empty-state/description.cjs +69 -0
  57. package/build/empty-state/description.cjs.map +7 -0
  58. package/build/empty-state/icon.cjs +69 -0
  59. package/build/empty-state/icon.cjs.map +7 -0
  60. package/build/empty-state/index.cjs +46 -0
  61. package/build/empty-state/index.cjs.map +7 -0
  62. package/build/empty-state/root.cjs +66 -0
  63. package/build/empty-state/root.cjs.map +7 -0
  64. package/build/empty-state/title.cjs +71 -0
  65. package/build/empty-state/title.cjs.map +7 -0
  66. package/build/empty-state/types.cjs +19 -0
  67. package/build/empty-state/types.cjs.map +7 -0
  68. package/build/empty-state/visual.cjs +66 -0
  69. package/build/empty-state/visual.cjs.map +7 -0
  70. package/build/form/index.cjs +27 -0
  71. package/build/form/index.cjs.map +7 -0
  72. package/build/form/input-control/index.cjs +31 -0
  73. package/build/form/input-control/index.cjs.map +7 -0
  74. package/build/form/input-control/input-control.cjs +50 -0
  75. package/build/form/input-control/input-control.cjs.map +7 -0
  76. package/build/form/input-control/types.cjs +19 -0
  77. package/build/form/input-control/types.cjs.map +7 -0
  78. package/build/form/primitives/field/description.cjs +17 -4
  79. package/build/form/primitives/field/description.cjs.map +3 -3
  80. package/build/form/primitives/field/details.cjs +4 -4
  81. package/build/form/primitives/field/details.cjs.map +2 -2
  82. package/build/form/primitives/field/label.cjs +8 -8
  83. package/build/form/primitives/field/label.cjs.map +2 -2
  84. package/build/form/primitives/field/root.cjs +2 -2
  85. package/build/form/primitives/field/root.cjs.map +1 -1
  86. package/build/form/primitives/fieldset/description.cjs +20 -4
  87. package/build/form/primitives/fieldset/description.cjs.map +3 -3
  88. package/build/form/primitives/fieldset/details.cjs +3 -3
  89. package/build/form/primitives/fieldset/details.cjs.map +2 -2
  90. package/build/form/primitives/fieldset/legend.cjs +8 -7
  91. package/build/form/primitives/fieldset/legend.cjs.map +2 -2
  92. package/build/form/primitives/fieldset/root.cjs +2 -2
  93. package/build/form/primitives/fieldset/root.cjs.map +1 -1
  94. package/build/form/primitives/input/input.cjs +23 -7
  95. package/build/form/primitives/input/input.cjs.map +3 -3
  96. package/build/form/primitives/input-layout/input-layout.cjs +15 -5
  97. package/build/form/primitives/input-layout/input-layout.cjs.map +3 -3
  98. package/build/form/primitives/input-layout/slot.cjs +6 -5
  99. package/build/form/primitives/input-layout/slot.cjs.map +2 -2
  100. package/build/form/primitives/select/item.cjs +5 -5
  101. package/build/form/primitives/select/item.cjs.map +2 -2
  102. package/build/form/primitives/select/popup.cjs +9 -9
  103. package/build/form/primitives/select/popup.cjs.map +2 -2
  104. package/build/form/primitives/select/trigger.cjs +6 -6
  105. package/build/form/primitives/select/trigger.cjs.map +2 -2
  106. package/build/form/primitives/select/types.cjs.map +1 -1
  107. package/build/form/primitives/textarea/textarea.cjs +23 -4
  108. package/build/form/primitives/textarea/textarea.cjs.map +3 -3
  109. package/build/form/types.cjs +19 -0
  110. package/build/form/types.cjs.map +7 -0
  111. package/build/icon-button/icon-button.cjs +2 -2
  112. package/build/icon-button/icon-button.cjs.map +1 -1
  113. package/build/index.cjs +11 -2
  114. package/build/index.cjs.map +2 -2
  115. package/build/link/link.cjs +18 -8
  116. package/build/link/link.cjs.map +3 -3
  117. package/build/notice/action-button.cjs +3 -3
  118. package/build/notice/action-button.cjs.map +2 -2
  119. package/build/notice/action-link.cjs +3 -3
  120. package/build/notice/action-link.cjs.map +2 -2
  121. package/build/notice/actions.cjs +3 -3
  122. package/build/notice/actions.cjs.map +2 -2
  123. package/build/notice/close-icon.cjs +3 -3
  124. package/build/notice/close-icon.cjs.map +2 -2
  125. package/build/notice/description.cjs +3 -3
  126. package/build/notice/description.cjs.map +2 -2
  127. package/build/notice/index.cjs.map +1 -1
  128. package/build/notice/root.cjs +5 -5
  129. package/build/notice/root.cjs.map +2 -2
  130. package/build/notice/title.cjs +3 -3
  131. package/build/notice/title.cjs.map +2 -2
  132. package/build/popover/arrow.cjs +94 -0
  133. package/build/popover/arrow.cjs.map +7 -0
  134. package/build/popover/close.cjs +45 -0
  135. package/build/popover/close.cjs.map +7 -0
  136. package/build/popover/context.cjs +76 -0
  137. package/build/popover/context.cjs.map +7 -0
  138. package/build/popover/description.cjs +70 -0
  139. package/build/popover/description.cjs.map +7 -0
  140. package/build/popover/index.cjs +49 -0
  141. package/build/popover/index.cjs.map +7 -0
  142. package/build/popover/popup.cjs +138 -0
  143. package/build/popover/popup.cjs.map +7 -0
  144. package/build/popover/root.cjs +35 -0
  145. package/build/popover/root.cjs.map +7 -0
  146. package/build/popover/title.cjs +56 -0
  147. package/build/popover/title.cjs.map +7 -0
  148. package/build/popover/trigger.cjs +38 -0
  149. package/build/popover/trigger.cjs.map +7 -0
  150. package/build/popover/types.cjs +19 -0
  151. package/build/popover/types.cjs.map +7 -0
  152. package/build/stack/stack.cjs +2 -2
  153. package/build/stack/stack.cjs.map +1 -1
  154. package/build/tabs/context.cjs +121 -0
  155. package/build/tabs/context.cjs.map +7 -0
  156. package/build/tabs/list.cjs +3 -4
  157. package/build/tabs/list.cjs.map +2 -2
  158. package/build/tabs/panel.cjs +5 -3
  159. package/build/tabs/panel.cjs.map +2 -2
  160. package/build/tabs/root.cjs +2 -1
  161. package/build/tabs/root.cjs.map +2 -2
  162. package/build/tabs/tab.cjs +5 -3
  163. package/build/tabs/tab.cjs.map +2 -2
  164. package/build/text/text.cjs +20 -5
  165. package/build/text/text.cjs.map +3 -3
  166. package/build/tooltip/popup.cjs +7 -6
  167. package/build/tooltip/popup.cjs.map +2 -2
  168. package/build/tooltip/root.cjs.map +2 -2
  169. package/build/tooltip/types.cjs.map +1 -1
  170. package/build/utils/types.cjs.map +1 -1
  171. package/build/utils/use-deprioritized-initial-focus.cjs +64 -0
  172. package/build/utils/use-deprioritized-initial-focus.cjs.map +7 -0
  173. package/build/visually-hidden/visually-hidden.cjs +2 -2
  174. package/build/visually-hidden/visually-hidden.cjs.map +2 -2
  175. package/build-module/alert-dialog/context.mjs +14 -0
  176. package/build-module/alert-dialog/context.mjs.map +7 -0
  177. package/build-module/alert-dialog/index.mjs +10 -0
  178. package/build-module/alert-dialog/index.mjs.map +7 -0
  179. package/build-module/alert-dialog/popup.mjs +132 -0
  180. package/build-module/alert-dialog/popup.mjs.map +7 -0
  181. package/build-module/alert-dialog/root.mjs +133 -0
  182. package/build-module/alert-dialog/root.mjs.map +7 -0
  183. package/build-module/alert-dialog/trigger.mjs +13 -0
  184. package/build-module/alert-dialog/trigger.mjs.map +7 -0
  185. package/build-module/alert-dialog/types.mjs +1 -0
  186. package/build-module/alert-dialog/types.mjs.map +7 -0
  187. package/build-module/badge/badge.mjs +14 -14
  188. package/build-module/badge/badge.mjs.map +2 -2
  189. package/build-module/button/button.mjs +18 -8
  190. package/build-module/button/button.mjs.map +3 -3
  191. package/build-module/card/content.mjs +4 -4
  192. package/build-module/card/content.mjs.map +2 -2
  193. package/build-module/card/full-bleed.mjs +4 -4
  194. package/build-module/card/full-bleed.mjs.map +2 -2
  195. package/build-module/card/header.mjs +4 -4
  196. package/build-module/card/header.mjs.map +2 -2
  197. package/build-module/card/root.mjs +6 -6
  198. package/build-module/card/root.mjs.map +2 -2
  199. package/build-module/card/title.mjs +14 -21
  200. package/build-module/card/title.mjs.map +3 -3
  201. package/build-module/collapsible-card/content.mjs +24 -3
  202. package/build-module/collapsible-card/content.mjs.map +3 -3
  203. package/build-module/collapsible-card/context.mjs +10 -0
  204. package/build-module/collapsible-card/context.mjs.map +7 -0
  205. package/build-module/collapsible-card/header-description.mjs +27 -0
  206. package/build-module/collapsible-card/header-description.mjs.map +7 -0
  207. package/build-module/collapsible-card/header.mjs +40 -19
  208. package/build-module/collapsible-card/header.mjs.map +2 -2
  209. package/build-module/collapsible-card/index.mjs +2 -0
  210. package/build-module/collapsible-card/index.mjs.map +2 -2
  211. package/build-module/dialog/action.mjs +4 -2
  212. package/build-module/dialog/action.mjs.map +2 -2
  213. package/build-module/dialog/close-icon.mjs +2 -1
  214. package/build-module/dialog/close-icon.mjs.map +2 -2
  215. package/build-module/dialog/footer.mjs +3 -3
  216. package/build-module/dialog/footer.mjs.map +2 -2
  217. package/build-module/dialog/header.mjs +3 -3
  218. package/build-module/dialog/header.mjs.map +2 -2
  219. package/build-module/dialog/popup.mjs +24 -6
  220. package/build-module/dialog/popup.mjs.map +2 -2
  221. package/build-module/dialog/title.mjs +10 -9
  222. package/build-module/dialog/title.mjs.map +2 -2
  223. package/build-module/empty-state/actions.mjs +31 -0
  224. package/build-module/empty-state/actions.mjs.map +7 -0
  225. package/build-module/empty-state/description.mjs +34 -0
  226. package/build-module/empty-state/description.mjs.map +7 -0
  227. package/build-module/empty-state/icon.mjs +34 -0
  228. package/build-module/empty-state/icon.mjs.map +7 -0
  229. package/build-module/empty-state/index.mjs +16 -0
  230. package/build-module/empty-state/index.mjs.map +7 -0
  231. package/build-module/empty-state/root.mjs +31 -0
  232. package/build-module/empty-state/root.mjs.map +7 -0
  233. package/build-module/empty-state/title.mjs +36 -0
  234. package/build-module/empty-state/title.mjs.map +7 -0
  235. package/build-module/empty-state/types.mjs +1 -0
  236. package/build-module/empty-state/types.mjs.map +7 -0
  237. package/build-module/empty-state/visual.mjs +31 -0
  238. package/build-module/empty-state/visual.mjs.map +7 -0
  239. package/build-module/form/index.mjs +4 -0
  240. package/build-module/form/index.mjs.map +7 -0
  241. package/build-module/form/input-control/index.mjs +6 -0
  242. package/build-module/form/input-control/index.mjs.map +7 -0
  243. package/build-module/form/input-control/input-control.mjs +25 -0
  244. package/build-module/form/input-control/input-control.mjs.map +7 -0
  245. package/build-module/form/input-control/types.mjs +1 -0
  246. package/build-module/form/input-control/types.mjs.map +7 -0
  247. package/build-module/form/primitives/field/description.mjs +17 -4
  248. package/build-module/form/primitives/field/description.mjs.map +3 -3
  249. package/build-module/form/primitives/field/details.mjs +4 -4
  250. package/build-module/form/primitives/field/details.mjs.map +2 -2
  251. package/build-module/form/primitives/field/label.mjs +8 -8
  252. package/build-module/form/primitives/field/label.mjs.map +2 -2
  253. package/build-module/form/primitives/field/root.mjs +2 -2
  254. package/build-module/form/primitives/field/root.mjs.map +1 -1
  255. package/build-module/form/primitives/fieldset/description.mjs +20 -4
  256. package/build-module/form/primitives/fieldset/description.mjs.map +3 -3
  257. package/build-module/form/primitives/fieldset/details.mjs +3 -3
  258. package/build-module/form/primitives/fieldset/details.mjs.map +2 -2
  259. package/build-module/form/primitives/fieldset/legend.mjs +8 -7
  260. package/build-module/form/primitives/fieldset/legend.mjs.map +2 -2
  261. package/build-module/form/primitives/fieldset/root.mjs +2 -2
  262. package/build-module/form/primitives/fieldset/root.mjs.map +1 -1
  263. package/build-module/form/primitives/input/input.mjs +23 -7
  264. package/build-module/form/primitives/input/input.mjs.map +3 -3
  265. package/build-module/form/primitives/input-layout/input-layout.mjs +15 -5
  266. package/build-module/form/primitives/input-layout/input-layout.mjs.map +3 -3
  267. package/build-module/form/primitives/input-layout/slot.mjs +6 -5
  268. package/build-module/form/primitives/input-layout/slot.mjs.map +2 -2
  269. package/build-module/form/primitives/select/item.mjs +5 -5
  270. package/build-module/form/primitives/select/item.mjs.map +2 -2
  271. package/build-module/form/primitives/select/popup.mjs +9 -9
  272. package/build-module/form/primitives/select/popup.mjs.map +2 -2
  273. package/build-module/form/primitives/select/trigger.mjs +6 -6
  274. package/build-module/form/primitives/select/trigger.mjs.map +2 -2
  275. package/build-module/form/primitives/textarea/textarea.mjs +23 -4
  276. package/build-module/form/primitives/textarea/textarea.mjs.map +3 -3
  277. package/build-module/form/types.mjs +1 -0
  278. package/build-module/form/types.mjs.map +7 -0
  279. package/build-module/icon-button/icon-button.mjs +2 -2
  280. package/build-module/icon-button/icon-button.mjs.map +1 -1
  281. package/build-module/index.mjs +7 -1
  282. package/build-module/index.mjs.map +2 -2
  283. package/build-module/link/link.mjs +18 -8
  284. package/build-module/link/link.mjs.map +3 -3
  285. package/build-module/notice/action-button.mjs +3 -3
  286. package/build-module/notice/action-button.mjs.map +2 -2
  287. package/build-module/notice/action-link.mjs +3 -3
  288. package/build-module/notice/action-link.mjs.map +2 -2
  289. package/build-module/notice/actions.mjs +3 -3
  290. package/build-module/notice/actions.mjs.map +2 -2
  291. package/build-module/notice/close-icon.mjs +3 -3
  292. package/build-module/notice/close-icon.mjs.map +2 -2
  293. package/build-module/notice/description.mjs +3 -3
  294. package/build-module/notice/description.mjs.map +2 -2
  295. package/build-module/notice/index.mjs.map +1 -1
  296. package/build-module/notice/root.mjs +5 -5
  297. package/build-module/notice/root.mjs.map +2 -2
  298. package/build-module/notice/title.mjs +3 -3
  299. package/build-module/notice/title.mjs.map +2 -2
  300. package/build-module/popover/arrow.mjs +59 -0
  301. package/build-module/popover/arrow.mjs.map +7 -0
  302. package/build-module/popover/close.mjs +20 -0
  303. package/build-module/popover/close.mjs.map +7 -0
  304. package/build-module/popover/context.mjs +57 -0
  305. package/build-module/popover/context.mjs.map +7 -0
  306. package/build-module/popover/description.mjs +35 -0
  307. package/build-module/popover/description.mjs.map +7 -0
  308. package/build-module/popover/index.mjs +18 -0
  309. package/build-module/popover/index.mjs.map +7 -0
  310. package/build-module/popover/popup.mjs +105 -0
  311. package/build-module/popover/popup.mjs.map +7 -0
  312. package/build-module/popover/root.mjs +10 -0
  313. package/build-module/popover/root.mjs.map +7 -0
  314. package/build-module/popover/title.mjs +31 -0
  315. package/build-module/popover/title.mjs.map +7 -0
  316. package/build-module/popover/trigger.mjs +13 -0
  317. package/build-module/popover/trigger.mjs.map +7 -0
  318. package/build-module/popover/types.mjs +1 -0
  319. package/build-module/popover/types.mjs.map +7 -0
  320. package/build-module/stack/stack.mjs +2 -2
  321. package/build-module/stack/stack.mjs.map +1 -1
  322. package/build-module/tabs/context.mjs +101 -0
  323. package/build-module/tabs/context.mjs.map +7 -0
  324. package/build-module/tabs/list.mjs +3 -4
  325. package/build-module/tabs/list.mjs.map +2 -2
  326. package/build-module/tabs/panel.mjs +5 -3
  327. package/build-module/tabs/panel.mjs.map +2 -2
  328. package/build-module/tabs/root.mjs +2 -1
  329. package/build-module/tabs/root.mjs.map +2 -2
  330. package/build-module/tabs/tab.mjs +5 -3
  331. package/build-module/tabs/tab.mjs.map +2 -2
  332. package/build-module/text/text.mjs +20 -5
  333. package/build-module/text/text.mjs.map +3 -3
  334. package/build-module/tooltip/popup.mjs +7 -6
  335. package/build-module/tooltip/popup.mjs.map +2 -2
  336. package/build-module/tooltip/root.mjs.map +2 -2
  337. package/build-module/utils/use-deprioritized-initial-focus.mjs +39 -0
  338. package/build-module/utils/use-deprioritized-initial-focus.mjs.map +7 -0
  339. package/build-module/visually-hidden/visually-hidden.mjs +2 -2
  340. package/build-module/visually-hidden/visually-hidden.mjs.map +2 -2
  341. package/build-types/alert-dialog/context.d.ts +11 -0
  342. package/build-types/alert-dialog/context.d.ts.map +1 -0
  343. package/build-types/alert-dialog/index.d.ts +4 -0
  344. package/build-types/alert-dialog/index.d.ts.map +1 -0
  345. package/build-types/alert-dialog/popup.d.ts +4 -0
  346. package/build-types/alert-dialog/popup.d.ts.map +1 -0
  347. package/build-types/alert-dialog/root.d.ts +18 -0
  348. package/build-types/alert-dialog/root.d.ts.map +1 -0
  349. package/build-types/alert-dialog/stories/index.story.d.ts +56 -0
  350. package/build-types/alert-dialog/stories/index.story.d.ts.map +1 -0
  351. package/build-types/alert-dialog/test/index.test.d.ts +2 -0
  352. package/build-types/alert-dialog/test/index.test.d.ts.map +1 -0
  353. package/build-types/alert-dialog/trigger.d.ts +7 -0
  354. package/build-types/alert-dialog/trigger.d.ts.map +1 -0
  355. package/build-types/alert-dialog/types.d.ts +105 -0
  356. package/build-types/alert-dialog/types.d.ts.map +1 -0
  357. package/build-types/badge/badge.d.ts.map +1 -1
  358. package/build-types/button/button.d.ts.map +1 -1
  359. package/build-types/card/stories/index.story.d.ts.map +1 -1
  360. package/build-types/card/title.d.ts.map +1 -1
  361. package/build-types/collapsible/panel.d.ts +2 -1
  362. package/build-types/collapsible/panel.d.ts.map +1 -1
  363. package/build-types/collapsible/root.d.ts +2 -1
  364. package/build-types/collapsible/root.d.ts.map +1 -1
  365. package/build-types/collapsible/trigger.d.ts +2 -1
  366. package/build-types/collapsible/trigger.d.ts.map +1 -1
  367. package/build-types/collapsible-card/content.d.ts.map +1 -1
  368. package/build-types/collapsible-card/context.d.ts +4 -0
  369. package/build-types/collapsible-card/context.d.ts.map +1 -0
  370. package/build-types/collapsible-card/header-description.d.ts +15 -0
  371. package/build-types/collapsible-card/header-description.d.ts.map +1 -0
  372. package/build-types/collapsible-card/header.d.ts.map +1 -1
  373. package/build-types/collapsible-card/index.d.ts +2 -1
  374. package/build-types/collapsible-card/index.d.ts.map +1 -1
  375. package/build-types/collapsible-card/stories/index.story.d.ts +10 -0
  376. package/build-types/collapsible-card/stories/index.story.d.ts.map +1 -1
  377. package/build-types/collapsible-card/types.d.ts +21 -0
  378. package/build-types/collapsible-card/types.d.ts.map +1 -1
  379. package/build-types/dialog/action.d.ts.map +1 -1
  380. package/build-types/dialog/close-icon.d.ts.map +1 -1
  381. package/build-types/dialog/popup.d.ts.map +1 -1
  382. package/build-types/dialog/stories/index.story.d.ts +8 -6
  383. package/build-types/dialog/stories/index.story.d.ts.map +1 -1
  384. package/build-types/dialog/title.d.ts +12 -2
  385. package/build-types/dialog/title.d.ts.map +1 -1
  386. package/build-types/dialog/types.d.ts +13 -6
  387. package/build-types/dialog/types.d.ts.map +1 -1
  388. package/build-types/empty-state/actions.d.ts +7 -0
  389. package/build-types/empty-state/actions.d.ts.map +1 -0
  390. package/build-types/empty-state/description.d.ts +7 -0
  391. package/build-types/empty-state/description.d.ts.map +1 -0
  392. package/build-types/empty-state/icon.d.ts +7 -0
  393. package/build-types/empty-state/icon.d.ts.map +1 -0
  394. package/build-types/empty-state/index.d.ts +8 -0
  395. package/build-types/empty-state/index.d.ts.map +1 -0
  396. package/build-types/empty-state/root.d.ts +6 -0
  397. package/build-types/empty-state/root.d.ts.map +1 -0
  398. package/build-types/empty-state/stories/index.story.d.ts +8 -0
  399. package/build-types/empty-state/stories/index.story.d.ts.map +1 -0
  400. package/build-types/empty-state/test/actions.test.d.ts +2 -0
  401. package/build-types/empty-state/test/actions.test.d.ts.map +1 -0
  402. package/build-types/empty-state/test/description.test.d.ts +2 -0
  403. package/build-types/empty-state/test/description.test.d.ts.map +1 -0
  404. package/build-types/empty-state/test/icon.test.d.ts +2 -0
  405. package/build-types/empty-state/test/icon.test.d.ts.map +1 -0
  406. package/build-types/empty-state/test/root.test.d.ts +2 -0
  407. package/build-types/empty-state/test/root.test.d.ts.map +1 -0
  408. package/build-types/empty-state/test/title.test.d.ts +2 -0
  409. package/build-types/empty-state/test/title.test.d.ts.map +1 -0
  410. package/build-types/empty-state/test/visual.test.d.ts +2 -0
  411. package/build-types/empty-state/test/visual.test.d.ts.map +1 -0
  412. package/build-types/empty-state/title.d.ts +6 -0
  413. package/build-types/empty-state/title.d.ts.map +1 -0
  414. package/build-types/empty-state/types.d.ts +40 -0
  415. package/build-types/empty-state/types.d.ts.map +1 -0
  416. package/build-types/empty-state/visual.d.ts +7 -0
  417. package/build-types/empty-state/visual.d.ts.map +1 -0
  418. package/build-types/form/index.d.ts +3 -0
  419. package/build-types/form/index.d.ts.map +1 -0
  420. package/build-types/form/input-control/index.d.ts +2 -0
  421. package/build-types/form/input-control/index.d.ts.map +1 -0
  422. package/build-types/form/input-control/input-control.d.ts +6 -0
  423. package/build-types/form/input-control/input-control.d.ts.map +1 -0
  424. package/build-types/form/input-control/stories/index.story.d.ts +16 -0
  425. package/build-types/form/input-control/stories/index.story.d.ts.map +1 -0
  426. package/build-types/form/input-control/test/index.test.d.ts +2 -0
  427. package/build-types/form/input-control/test/index.test.d.ts.map +1 -0
  428. package/build-types/form/input-control/types.d.ts +4 -0
  429. package/build-types/form/input-control/types.d.ts.map +1 -0
  430. package/build-types/form/primitives/field/description.d.ts +2 -1
  431. package/build-types/form/primitives/field/description.d.ts.map +1 -1
  432. package/build-types/form/primitives/field/details.d.ts +2 -1
  433. package/build-types/form/primitives/field/details.d.ts.map +1 -1
  434. package/build-types/form/primitives/field/label.d.ts +2 -1
  435. package/build-types/form/primitives/field/label.d.ts.map +1 -1
  436. package/build-types/form/primitives/field/stories/index.story.d.ts.map +1 -1
  437. package/build-types/form/primitives/fieldset/description.d.ts +2 -1
  438. package/build-types/form/primitives/fieldset/description.d.ts.map +1 -1
  439. package/build-types/form/primitives/fieldset/details.d.ts +2 -1
  440. package/build-types/form/primitives/fieldset/details.d.ts.map +1 -1
  441. package/build-types/form/primitives/fieldset/legend.d.ts +2 -1
  442. package/build-types/form/primitives/fieldset/legend.d.ts.map +1 -1
  443. package/build-types/form/primitives/fieldset/root.d.ts +2 -1
  444. package/build-types/form/primitives/fieldset/root.d.ts.map +1 -1
  445. package/build-types/form/primitives/fieldset/stories/index.story.d.ts.map +1 -1
  446. package/build-types/form/primitives/input/input.d.ts.map +1 -1
  447. package/build-types/form/primitives/input/stories/index.story.d.ts +2 -0
  448. package/build-types/form/primitives/input/stories/index.story.d.ts.map +1 -1
  449. package/build-types/form/primitives/input-layout/input-layout.d.ts.map +1 -1
  450. package/build-types/form/primitives/input-layout/slot.d.ts.map +1 -1
  451. package/build-types/form/primitives/input-layout/stories/index.story.d.ts +5 -0
  452. package/build-types/form/primitives/input-layout/stories/index.story.d.ts.map +1 -1
  453. package/build-types/form/primitives/select/item.d.ts +6 -2
  454. package/build-types/form/primitives/select/item.d.ts.map +1 -1
  455. package/build-types/form/primitives/select/popup.d.ts +11 -1
  456. package/build-types/form/primitives/select/popup.d.ts.map +1 -1
  457. package/build-types/form/primitives/select/trigger.d.ts +12 -2
  458. package/build-types/form/primitives/select/trigger.d.ts.map +1 -1
  459. package/build-types/form/primitives/select/types.d.ts +13 -3
  460. package/build-types/form/primitives/select/types.d.ts.map +1 -1
  461. package/build-types/form/primitives/textarea/textarea.d.ts.map +1 -1
  462. package/build-types/form/stories/shared.d.ts +3 -0
  463. package/build-types/form/stories/shared.d.ts.map +1 -0
  464. package/build-types/form/types.d.ts +30 -0
  465. package/build-types/form/types.d.ts.map +1 -0
  466. package/build-types/index.d.ts +4 -1
  467. package/build-types/index.d.ts.map +1 -1
  468. package/build-types/link/link.d.ts.map +1 -1
  469. package/build-types/notice/index.d.ts +0 -1
  470. package/build-types/notice/index.d.ts.map +1 -1
  471. package/build-types/popover/arrow.d.ts +10 -0
  472. package/build-types/popover/arrow.d.ts.map +1 -0
  473. package/build-types/popover/close.d.ts +11 -0
  474. package/build-types/popover/close.d.ts.map +1 -0
  475. package/build-types/popover/context.d.ts +22 -0
  476. package/build-types/popover/context.d.ts.map +1 -0
  477. package/build-types/popover/description.d.ts +10 -0
  478. package/build-types/popover/description.d.ts.map +1 -0
  479. package/build-types/popover/index.d.ts +9 -0
  480. package/build-types/popover/index.d.ts.map +1 -0
  481. package/build-types/popover/popup.d.ts +11 -0
  482. package/build-types/popover/popup.d.ts.map +1 -0
  483. package/build-types/popover/root.d.ts +37 -0
  484. package/build-types/popover/root.d.ts.map +1 -0
  485. package/build-types/popover/stories/index.story.d.ts +211 -0
  486. package/build-types/popover/stories/index.story.d.ts.map +1 -0
  487. package/build-types/popover/stories/utils.d.ts +25 -0
  488. package/build-types/popover/stories/utils.d.ts.map +1 -0
  489. package/build-types/popover/test/index.test.d.ts +2 -0
  490. package/build-types/popover/test/index.test.d.ts.map +1 -0
  491. package/build-types/popover/title.d.ts +20 -0
  492. package/build-types/popover/title.d.ts.map +1 -0
  493. package/build-types/popover/trigger.d.ts +10 -0
  494. package/build-types/popover/trigger.d.ts.map +1 -0
  495. package/build-types/popover/types.d.ts +83 -0
  496. package/build-types/popover/types.d.ts.map +1 -0
  497. package/build-types/tabs/context.d.ts +26 -0
  498. package/build-types/tabs/context.d.ts.map +1 -0
  499. package/build-types/tabs/list.d.ts +2 -1
  500. package/build-types/tabs/list.d.ts.map +1 -1
  501. package/build-types/tabs/panel.d.ts +2 -1
  502. package/build-types/tabs/panel.d.ts.map +1 -1
  503. package/build-types/tabs/root.d.ts +2 -1
  504. package/build-types/tabs/root.d.ts.map +1 -1
  505. package/build-types/tabs/tab.d.ts +2 -1
  506. package/build-types/tabs/tab.d.ts.map +1 -1
  507. package/build-types/text/stories/index.story.d.ts +4 -0
  508. package/build-types/text/stories/index.story.d.ts.map +1 -1
  509. package/build-types/text/text.d.ts.map +1 -1
  510. package/build-types/tooltip/popup.d.ts.map +1 -1
  511. package/build-types/tooltip/root.d.ts +13 -0
  512. package/build-types/tooltip/root.d.ts.map +1 -1
  513. package/build-types/tooltip/stories/index.story.d.ts.map +1 -1
  514. package/build-types/tooltip/stories/usage-guidelines.story.d.ts +21 -0
  515. package/build-types/tooltip/stories/usage-guidelines.story.d.ts.map +1 -0
  516. package/build-types/tooltip/types.d.ts +4 -0
  517. package/build-types/tooltip/types.d.ts.map +1 -1
  518. package/build-types/utils/test/use-deprioritized-initial-focus.test.d.ts +2 -0
  519. package/build-types/utils/test/use-deprioritized-initial-focus.test.d.ts.map +1 -0
  520. package/build-types/utils/types.d.ts +6 -2
  521. package/build-types/utils/types.d.ts.map +1 -1
  522. package/build-types/utils/use-deprioritized-initial-focus.d.ts +36 -0
  523. package/build-types/utils/use-deprioritized-initial-focus.d.ts.map +1 -0
  524. package/build-types/visually-hidden/stories/index.story.d.ts +7 -0
  525. package/build-types/visually-hidden/stories/index.story.d.ts.map +1 -1
  526. package/build-types/visually-hidden/visually-hidden.d.ts +34 -0
  527. package/build-types/visually-hidden/visually-hidden.d.ts.map +1 -1
  528. package/package.json +17 -16
  529. package/src/alert-dialog/context.tsx +22 -0
  530. package/src/alert-dialog/index.ts +3 -0
  531. package/src/alert-dialog/popup.tsx +116 -0
  532. package/src/alert-dialog/root.tsx +226 -0
  533. package/src/alert-dialog/stories/index.story.tsx +305 -0
  534. package/src/alert-dialog/style.module.css +21 -0
  535. package/src/alert-dialog/test/index.test.tsx +1509 -0
  536. package/src/alert-dialog/trigger.tsx +15 -0
  537. package/src/alert-dialog/types.ts +119 -0
  538. package/src/badge/badge.tsx +11 -14
  539. package/src/badge/style.module.css +0 -4
  540. package/src/button/button.tsx +2 -0
  541. package/src/button/style.module.css +9 -3
  542. package/src/card/stories/index.story.tsx +4 -5
  543. package/src/card/style.module.css +4 -10
  544. package/src/card/test/index.test.tsx +17 -1
  545. package/src/card/title.tsx +14 -12
  546. package/src/collapsible-card/content.tsx +16 -3
  547. package/src/collapsible-card/context.ts +7 -0
  548. package/src/collapsible-card/header-description.tsx +43 -0
  549. package/src/collapsible-card/header.tsx +47 -24
  550. package/src/collapsible-card/index.ts +2 -1
  551. package/src/collapsible-card/stories/index.story.tsx +102 -4
  552. package/src/collapsible-card/style.module.css +34 -2
  553. package/src/collapsible-card/test/index.test.tsx +96 -9
  554. package/src/collapsible-card/types.ts +22 -0
  555. package/src/dialog/action.tsx +8 -2
  556. package/src/dialog/close-icon.tsx +1 -0
  557. package/src/dialog/popup.tsx +23 -3
  558. package/src/dialog/stories/index.story.tsx +33 -28
  559. package/src/dialog/style.module.css +18 -14
  560. package/src/dialog/test/index.test.tsx +180 -4
  561. package/src/dialog/title.tsx +21 -9
  562. package/src/dialog/types.ts +20 -6
  563. package/src/empty-state/actions.tsx +24 -0
  564. package/src/empty-state/description.tsx +31 -0
  565. package/src/empty-state/icon.tsx +24 -0
  566. package/src/empty-state/index.ts +8 -0
  567. package/src/empty-state/root.tsx +23 -0
  568. package/src/empty-state/stories/index.story.tsx +64 -0
  569. package/src/empty-state/style.module.css +53 -0
  570. package/src/empty-state/test/actions.test.tsx +18 -0
  571. package/src/empty-state/test/description.test.tsx +26 -0
  572. package/src/empty-state/test/icon.test.tsx +13 -0
  573. package/src/empty-state/test/root.test.tsx +13 -0
  574. package/src/empty-state/test/title.test.tsx +26 -0
  575. package/src/empty-state/test/visual.test.tsx +17 -0
  576. package/src/empty-state/title.tsx +29 -0
  577. package/src/empty-state/types.ts +45 -0
  578. package/src/empty-state/visual.tsx +24 -0
  579. package/src/form/index.ts +3 -0
  580. package/src/form/input-control/index.ts +1 -0
  581. package/src/form/input-control/input-control.tsx +33 -0
  582. package/src/form/input-control/stories/index.story.tsx +163 -0
  583. package/src/form/input-control/test/index.test.tsx +53 -0
  584. package/src/form/input-control/types.ts +5 -0
  585. package/src/form/primitives/field/description.tsx +6 -1
  586. package/src/form/primitives/field/details.tsx +4 -2
  587. package/src/form/primitives/field/label.tsx +9 -5
  588. package/src/form/primitives/field/stories/index.story.tsx +2 -7
  589. package/src/form/primitives/field/test/index.test.tsx +11 -0
  590. package/src/form/primitives/fieldset/description.tsx +9 -1
  591. package/src/form/primitives/fieldset/legend.tsx +9 -4
  592. package/src/form/primitives/fieldset/stories/index.story.tsx +2 -7
  593. package/src/form/primitives/fieldset/test/index.test.tsx +22 -0
  594. package/src/form/primitives/input/input.tsx +6 -1
  595. package/src/form/primitives/input/stories/index.story.tsx +7 -0
  596. package/src/form/primitives/input/style.module.css +4 -0
  597. package/src/form/primitives/input-layout/input-layout.tsx +2 -0
  598. package/src/form/primitives/input-layout/slot.tsx +6 -2
  599. package/src/form/primitives/input-layout/stories/index.story.tsx +22 -1
  600. package/src/form/primitives/input-layout/style.module.css +3 -3
  601. package/src/form/primitives/select/popup.tsx +5 -2
  602. package/src/form/primitives/select/test/index.test.tsx +60 -1
  603. package/src/form/primitives/select/types.ts +14 -4
  604. package/src/form/primitives/stories/overview.mdx +15 -0
  605. package/src/form/primitives/textarea/textarea.tsx +11 -2
  606. package/src/form/stories/shared.tsx +21 -0
  607. package/src/form/types.ts +34 -0
  608. package/src/index.ts +4 -1
  609. package/src/link/link.tsx +2 -0
  610. package/src/link/style.module.css +11 -1
  611. package/src/notice/index.ts +0 -2
  612. package/src/notice/style.module.css +6 -6
  613. package/src/popover/arrow.tsx +49 -0
  614. package/src/popover/close.tsx +24 -0
  615. package/src/popover/context.tsx +100 -0
  616. package/src/popover/description.tsx +29 -0
  617. package/src/popover/index.ts +9 -0
  618. package/src/popover/popup.tsx +106 -0
  619. package/src/popover/root.tsx +41 -0
  620. package/src/popover/stories/index.story.tsx +1315 -0
  621. package/src/popover/stories/utils.tsx +91 -0
  622. package/src/popover/style.module.css +64 -0
  623. package/src/popover/test/index.test.tsx +727 -0
  624. package/src/popover/title.tsx +47 -0
  625. package/src/popover/trigger.tsx +17 -0
  626. package/src/popover/types.ts +113 -0
  627. package/src/tabs/context.tsx +170 -0
  628. package/src/tabs/list.tsx +0 -1
  629. package/src/tabs/panel.tsx +3 -0
  630. package/src/tabs/root.tsx +6 -1
  631. package/src/tabs/style.module.css +3 -3
  632. package/src/tabs/tab.tsx +3 -0
  633. package/src/tabs/test/index.test.tsx +162 -0
  634. package/src/text/stories/index.story.tsx +4 -2
  635. package/src/text/style.module.css +62 -36
  636. package/src/text/test/index.test.tsx +1 -4
  637. package/src/text/text.tsx +8 -1
  638. package/src/tooltip/popup.tsx +2 -1
  639. package/src/tooltip/root.tsx +13 -0
  640. package/src/tooltip/stories/index.story.tsx +20 -15
  641. package/src/tooltip/stories/usage-guidelines.mdx +91 -0
  642. package/src/tooltip/stories/usage-guidelines.story.tsx +119 -0
  643. package/src/tooltip/style.module.css +2 -2
  644. package/src/tooltip/test/index.test.tsx +61 -0
  645. package/src/tooltip/types.ts +5 -0
  646. package/src/utils/css/field.module.css +12 -9
  647. package/src/utils/css/focus.module.css +7 -5
  648. package/src/utils/css/global-css-defense.module.css +117 -0
  649. package/src/utils/css/item-popup.module.css +3 -2
  650. package/src/utils/css/select-trigger.module.css +1 -0
  651. package/src/utils/test/use-deprioritized-initial-focus.test.tsx +230 -0
  652. package/src/utils/types.ts +7 -2
  653. package/src/utils/use-deprioritized-initial-focus.ts +84 -0
  654. package/src/visually-hidden/stories/index.story.tsx +25 -0
  655. package/src/visually-hidden/visually-hidden.tsx +34 -0
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/utils/use-deprioritized-initial-focus.ts"],
4
+ "sourcesContent": ["import type { Popover as _Popover } from '@base-ui/react/popover';\nimport { useMemo, useRef } from '@wordpress/element';\nimport { tabbable } from 'tabbable';\n\n/**\n * The `initialFocus` type shared by Base UI overlay popups (Dialog, Popover,\n * AlertDialog, etc.). We derive it from `Popover.Popup.Props` here, but it\n * is identical across all overlay components.\n */\ntype InitialFocus = _Popover.Popup.Props[ 'initialFocus' ];\n\n/**\n * Options matching Base UI's internal tabbable configuration.\n * @see https://github.com/floating-ui/floating-ui/blob/master/packages/react/src/utils/tabbable.ts\n */\nconst getTabbableOptions = () => ( {\n\tgetShadowRoot: true,\n\tdisplayCheck:\n\t\ttypeof ResizeObserver === 'function' &&\n\t\tResizeObserver.toString().includes( '[native code]' )\n\t\t\t? ( 'full' as const )\n\t\t\t: ( 'none' as const ),\n} );\n\n/**\n * Returns a resolved `initialFocus` value that deprioritizes elements\n * marked with a given data attribute (e.g. a close icon), and an internal\n * ref that must be merged onto the popup element.\n *\n * When `initialFocus` is `undefined` or `true` (the default behavior),\n * the hook replaces it with a callback that:\n * 1. On touch interactions \u2014 focuses the popup element itself (preventing\n * the virtual keyboard on Android), matching Base UI's default.\n * 2. On other interactions \u2014 returns the first tabbable element that does\n * *not* carry `deprioritizedAttribute`. Falls back to Base UI's default\n * when the deprioritized element is the only tabbable element.\n *\n * All other `initialFocus` values (`false`, `RefObject`, callback) pass\n * through unchanged.\n *\n * @param props\n * @param props.initialFocus The consumer-provided `initialFocus` value.\n * @param props.deprioritizedAttribute The data attribute whose elements should be deprioritized.\n */\nexport function useDeprioritizedInitialFocus( {\n\tinitialFocus,\n\tdeprioritizedAttribute,\n}: {\n\tinitialFocus: InitialFocus;\n\tdeprioritizedAttribute: string;\n} ) {\n\tconst popupRef = useRef< HTMLDivElement >( null );\n\n\tconst resolvedInitialFocus = useMemo( (): InitialFocus => {\n\t\tif ( initialFocus !== undefined && initialFocus !== true ) {\n\t\t\treturn initialFocus;\n\t\t}\n\n\t\treturn ( interactionType ): HTMLElement | boolean | null => {\n\t\t\tif ( interactionType === 'touch' ) {\n\t\t\t\treturn popupRef.current ?? true;\n\t\t\t}\n\n\t\t\tconst popup = popupRef.current;\n\t\t\tif ( ! popup ) {\n\t\t\t\treturn true;\n\t\t\t}\n\n\t\t\tconst tabbables = tabbable( popup, getTabbableOptions() );\n\t\t\tfor ( const el of tabbables ) {\n\t\t\t\tif (\n\t\t\t\t\tel instanceof HTMLElement &&\n\t\t\t\t\t! el.hasAttribute( deprioritizedAttribute )\n\t\t\t\t) {\n\t\t\t\t\treturn el;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn true;\n\t\t};\n\t}, [ initialFocus, deprioritizedAttribute ] );\n\n\treturn { resolvedInitialFocus, popupRef };\n}\n"],
5
+ "mappings": ";AACA,SAAS,SAAS,cAAc;AAChC,SAAS,gBAAgB;AAazB,IAAM,qBAAqB,OAAQ;AAAA,EAClC,eAAe;AAAA,EACf,cACC,OAAO,mBAAmB,cAC1B,eAAe,SAAS,EAAE,SAAU,eAAgB,IAC/C,SACA;AACP;AAsBO,SAAS,6BAA8B;AAAA,EAC7C;AAAA,EACA;AACD,GAGI;AACH,QAAM,WAAW,OAA0B,IAAK;AAEhD,QAAM,uBAAuB,QAAS,MAAoB;AACzD,QAAK,iBAAiB,UAAa,iBAAiB,MAAO;AAC1D,aAAO;AAAA,IACR;AAEA,WAAO,CAAE,oBAAmD;AAC3D,UAAK,oBAAoB,SAAU;AAClC,eAAO,SAAS,WAAW;AAAA,MAC5B;AAEA,YAAM,QAAQ,SAAS;AACvB,UAAK,CAAE,OAAQ;AACd,eAAO;AAAA,MACR;AAEA,YAAM,YAAY,SAAU,OAAO,mBAAmB,CAAE;AACxD,iBAAY,MAAM,WAAY;AAC7B,YACC,cAAc,eACd,CAAE,GAAG,aAAc,sBAAuB,GACzC;AACD,iBAAO;AAAA,QACR;AAAA,MACD;AAEA,aAAO;AAAA,IACR;AAAA,EACD,GAAG,CAAE,cAAc,sBAAuB,CAAE;AAE5C,SAAO,EAAE,sBAAsB,SAAS;AACzC;",
6
+ "names": []
7
+ }
@@ -3,9 +3,9 @@ import { mergeProps, useRender } from "@base-ui/react";
3
3
  import { forwardRef } from "@wordpress/element";
4
4
 
5
5
  // packages/ui/src/visually-hidden/style.module.css
6
- if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='171adb58ce']")) {
6
+ if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='c46e8cb841']")) {
7
7
  const style = document.createElement("style");
8
- style.setAttribute("data-wp-hash", "171adb58ce");
8
+ style.setAttribute("data-wp-hash", "c46e8cb841");
9
9
  style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.f37b9e2e191ebd66__visually-hidden{word-wrap:normal;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-break:normal}}"));
10
10
  document.head.appendChild(style);
11
11
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/visually-hidden/visually-hidden.tsx", "../../src/visually-hidden/style.module.css"],
4
- "sourcesContent": ["import { mergeProps, useRender } from '@base-ui/react';\nimport { forwardRef } from '@wordpress/element';\nimport type { VisuallyHiddenProps } from './types';\nimport styles from './style.module.css';\n\n/**\n * Visually hides content while keeping it accessible to screen readers.\n * Useful when providing context that's only meaningful to assistive technology.\n */\nexport const VisuallyHidden = forwardRef< HTMLDivElement, VisuallyHiddenProps >(\n\tfunction VisuallyHidden( { render, ...restProps }, ref ) {\n\t\tconst element = useRender( {\n\t\t\trender,\n\t\t\tref,\n\t\t\tprops: mergeProps< 'div' >(\n\t\t\t\t{ className: styles[ 'visually-hidden' ] },\n\t\t\t\trestProps\n\t\t\t),\n\t\t} );\n\n\t\treturn element;\n\t}\n);\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='171adb58ce']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"171adb58ce\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.f37b9e2e191ebd66__visually-hidden{word-wrap:normal;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-break:normal}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"visually-hidden\":\"f37b9e2e191ebd66__visually-hidden\"};\n"],
5
- "mappings": ";AAAA,SAAS,YAAY,iBAAiB;AACtC,SAAS,kBAAkB;;;ACD3B,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,0RAA0R,CAAC;AACrU,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,mBAAkB,oCAAmC;;;ADG9D,IAAM,iBAAiB;AAAA,EAC7B,SAASA,gBAAgB,EAAE,QAAQ,GAAG,UAAU,GAAG,KAAM;AACxD,UAAM,UAAU,UAAW;AAAA,MAC1B;AAAA,MACA;AAAA,MACA,OAAO;AAAA,QACN,EAAE,WAAW,cAAQ,iBAAkB,EAAE;AAAA,QACzC;AAAA,MACD;AAAA,IACD,CAAE;AAEF,WAAO;AAAA,EACR;AACD;",
4
+ "sourcesContent": ["import { mergeProps, useRender } from '@base-ui/react';\nimport { forwardRef } from '@wordpress/element';\nimport type { VisuallyHiddenProps } from './types';\nimport styles from './style.module.css';\n\n/**\n * Visually hides content while keeping it accessible to screen readers.\n * Useful when providing context that's only meaningful to assistive technology.\n *\n * Renders a `<div>` by default. Use the `render` prop to swap the\n * underlying element while preserving the visually-hidden behavior.\n *\n * ## Composing with other components\n *\n * When composing with another component that uses the `render` prop\n * pattern, there are two directions \u2014 and they produce different results.\n *\n * Most of the time you'll want `VisuallyHidden` as the **host** (outer\n * component) and pass the other component via `render`. This keeps the\n * other component's HTML element and semantics intact, while\n * `VisuallyHidden` only adds its hiding styles:\n *\n * ```jsx\n * // OtherComponent keeps its semantic element (e.g. <h2>).\n * <VisuallyHidden render={ <OtherComponent /> }>\n * Accessible text\n * </VisuallyHidden>\n * ```\n *\n * The opposite direction is also possible, but be aware that it replaces\n * the other component's element with VisuallyHidden's default `<div>`:\n *\n * ```jsx\n * // OtherComponent's element becomes a <div>.\n * <OtherComponent render={ <VisuallyHidden /> }>\n * Accessible text\n * </OtherComponent>\n * ```\n *\n * Choose based on what you need: if the other component's semantic\n * element matters (e.g. `<label>`, `<legend>`, `<h2>`), keep\n * `VisuallyHidden` as the host so the element is preserved.\n */\nexport const VisuallyHidden = forwardRef< HTMLDivElement, VisuallyHiddenProps >(\n\tfunction VisuallyHidden( { render, ...restProps }, ref ) {\n\t\tconst element = useRender( {\n\t\t\trender,\n\t\t\tref,\n\t\t\tprops: mergeProps< 'div' >(\n\t\t\t\t{ className: styles[ 'visually-hidden' ] },\n\t\t\t\trestProps\n\t\t\t),\n\t\t} );\n\n\t\treturn element;\n\t}\n);\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='c46e8cb841']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"c46e8cb841\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.f37b9e2e191ebd66__visually-hidden{word-wrap:normal;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-break:normal}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"visually-hidden\":\"f37b9e2e191ebd66__visually-hidden\"};\n"],
5
+ "mappings": ";AAAA,SAAS,YAAY,iBAAiB;AACtC,SAAS,kBAAkB;;;ACD3B,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,0RAA0R,CAAC;AACrU,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,mBAAkB,oCAAmC;;;ADqC9D,IAAM,iBAAiB;AAAA,EAC7B,SAASA,gBAAgB,EAAE,QAAQ,GAAG,UAAU,GAAG,KAAM;AACxD,UAAM,UAAU,UAAW;AAAA,MAC1B;AAAA,MACA;AAAA,MACA,OAAO;AAAA,QACN,EAAE,WAAW,cAAQ,iBAAkB,EAAE;AAAA,QACzC;AAAA,MACD;AAAA,IACD,CAAE;AAEF,WAAO;AAAA,EACR;AACD;",
6
6
  "names": ["VisuallyHidden"]
7
7
  }
@@ -0,0 +1,11 @@
1
+ type Phase = 'idle' | 'pending' | 'closing';
2
+ interface AlertDialogContextValue {
3
+ phase: Phase;
4
+ showSpinner: boolean;
5
+ errorMessage?: string;
6
+ confirm: () => Promise<void>;
7
+ }
8
+ declare const AlertDialogContext: import("react").Context<AlertDialogContextValue>;
9
+ export { AlertDialogContext };
10
+ export type { Phase };
11
+ //# sourceMappingURL=context.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../src/alert-dialog/context.tsx"],"names":[],"mappings":"AAEA,KAAK,KAAK,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,CAAC;AAE5C,UAAU,uBAAuB;IAChC,KAAK,EAAE,KAAK,CAAC;IACb,WAAW,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,MAAM,OAAO,CAAE,IAAI,CAAE,CAAC;CAC/B;AAID,QAAA,MAAM,kBAAkB,kDAKrB,CAAC;AAEJ,OAAO,EAAE,kBAAkB,EAAE,CAAC;AAC9B,YAAY,EAAE,KAAK,EAAE,CAAC"}
@@ -0,0 +1,4 @@
1
+ export { Root } from './root';
2
+ export { Trigger } from './trigger';
3
+ export { Popup } from './popup';
4
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/alert-dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC"}
@@ -0,0 +1,4 @@
1
+ import type { PopupProps } from './types';
2
+ declare const Popup: import("react").ForwardRefExoticComponent<PopupProps & import("react").RefAttributes<HTMLDivElement>>;
3
+ export { Popup };
4
+ //# sourceMappingURL=popup.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"popup.d.ts","sourceRoot":"","sources":["../../src/alert-dialog/popup.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAK1C,QAAA,MAAM,KAAK,uGA4FV,CAAC;AAEF,OAAO,EAAE,KAAK,EAAE,CAAC"}
@@ -0,0 +1,18 @@
1
+ import type { RootProps } from './types';
2
+ /**
3
+ * A dialog that requires a user response to proceed.
4
+ *
5
+ * Use `AlertDialog.Trigger` to render a button that opens the dialog.
6
+ * Use `AlertDialog.Popup` to render the dialog content.
7
+ * The `AlertDialog.Trigger` is optional — the dialog can also be controlled
8
+ * via `open` / `onOpenChange` props.
9
+ *
10
+ * For use cases outside the standard confirm/cancel pattern, use the lower-level
11
+ * `Dialog` component directly.
12
+ *
13
+ * See the [Destructive Actions guidelines](https://wordpress.github.io/gutenberg/?path=/docs/design-system-patterns-destructive-actions--docs)
14
+ * for more details on when to use each pattern.
15
+ */
16
+ declare function Root({ children, open: openProp, onOpenChange, defaultOpen, onConfirm, }: RootProps): import("react").JSX.Element;
17
+ export { Root };
18
+ //# sourceMappingURL=root.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"root.d.ts","sourceRoot":"","sources":["../../src/alert-dialog/root.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAUzC;;;;;;;;;;;;;GAaG;AACH,iBAAS,IAAI,CAAE,EACd,QAAQ,EACR,IAAI,EAAE,QAAQ,EACd,YAAY,EACZ,WAAW,EACX,SAAS,GACT,EAAE,SAAS,+BAqLX;AAED,OAAO,EAAE,IAAI,EAAE,CAAC"}
@@ -0,0 +1,56 @@
1
+ import type { Meta, StoryObj } from '@storybook/react-vite';
2
+ import { AlertDialog } from '../..';
3
+ declare const meta: Meta<typeof AlertDialog.Root>;
4
+ export default meta;
5
+ type Story = StoryObj<typeof AlertDialog.Root>;
6
+ /**
7
+ * Standard confirmation dialog for reversible actions. The dialog can be
8
+ * dismissed via Escape key or the cancel/confirm buttons. Backdrop click
9
+ * is blocked.
10
+ */
11
+ export declare const Default: Story;
12
+ /**
13
+ * Confirmation dialog for irreversible actions that cannot be undone.
14
+ * The confirm button uses error/danger coloring.
15
+ */
16
+ export declare const Irreversible: Story;
17
+ /**
18
+ * Example with custom button labels for both confirm and cancel buttons.
19
+ */
20
+ export declare const CustomLabels: Story;
21
+ /**
22
+ * Use `children` to render custom content between the description and the
23
+ * action buttons. The `description` should be self-contained for
24
+ * accessibility (`aria-describedby`); `children` adds supplementary detail.
25
+ */
26
+ export declare const WithCustomContent: Story;
27
+ /**
28
+ * Example showing composition with a menu. The `AlertDialog.Trigger` is
29
+ * composed with Base UI's `Menu.Item` using the `render` prop, allowing the
30
+ * menu item to directly trigger the alert dialog.
31
+ *
32
+ * Note: the example currently uses the `Menu` component from BaseUI, although
33
+ * consumers should not use BaseUI directly and instead use the DS `Menu`
34
+ * component (not ready yet).
35
+ */
36
+ export declare const MenuTrigger: Story;
37
+ /**
38
+ * Async confirm flow. The consumer returns a promise from `onConfirm`.
39
+ * The dialog automatically manages the pending state: buttons are disabled
40
+ * and a spinner appears on the confirm button. Toggle between success and
41
+ * failure to test both outcomes.
42
+ *
43
+ * On failure, the consumer catches the error and returns
44
+ * `{ close: false, error: '...' }`. The component displays the message
45
+ * below the action buttons and announces it to screen readers. The error
46
+ * is automatically cleared on the next confirm attempt or when the dialog
47
+ * reopens.
48
+ */
49
+ export declare const AsyncConfirm: Story;
50
+ /**
51
+ * The `AlertDialog.Trigger` element is not necessary when the open state is
52
+ * controlled externally. This is useful when the dialog needs to be opened
53
+ * from code or from a non-standard trigger element.
54
+ */
55
+ export declare const Controlled: Story;
56
+ //# sourceMappingURL=index.story.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/alert-dialog/stories/index.story.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAI5D,OAAO,EAAE,WAAW,EAAQ,MAAM,OAAO,CAAC;AAE1C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,WAAW,CAAC,IAAI,CAWxC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,WAAW,CAAC,IAAI,CAAE,CAAC;AAEjD;;;;GAIG;AACH,eAAO,MAAM,OAAO,EAAE,KAYrB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,YAAY,EAAE,KAc1B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,YAAY,EAAE,KAc1B,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAwB/B,CAAC;AAuBF;;;;;;;;GAQG;AACH,eAAO,MAAM,WAAW,EAAE,KA+CzB,CAAC;AAMF;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,YAAY,EAAE,KAkE1B,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,UAAU,EAAE,KAuBxB,CAAC"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=index.test.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.test.d.ts","sourceRoot":"","sources":["../../../src/alert-dialog/test/index.test.tsx"],"names":[],"mappings":""}
@@ -0,0 +1,7 @@
1
+ import type { TriggerProps } from './types';
2
+ /**
3
+ * Renders a button that opens the alert dialog when clicked.
4
+ */
5
+ declare const Trigger: import("react").ForwardRefExoticComponent<TriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
6
+ export { Trigger };
7
+ //# sourceMappingURL=trigger.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"trigger.d.ts","sourceRoot":"","sources":["../../src/alert-dialog/trigger.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAE5C;;GAEG;AACH,QAAA,MAAM,OAAO,4GAIZ,CAAC;AAEF,OAAO,EAAE,OAAO,EAAE,CAAC"}
@@ -0,0 +1,105 @@
1
+ import type { AlertDialog as _AlertDialog } from '@base-ui/react/alert-dialog';
2
+ import type { ReactNode } from 'react';
3
+ import type { ComponentProps } from '../utils/types';
4
+ /**
5
+ * The return type of `onConfirm`. Return `void` (or nothing) to auto-close
6
+ * the dialog after the confirm handler completes. Return `{ close: false }`
7
+ * to keep the dialog open (e.g. for validation errors).
8
+ *
9
+ * Return `{ error: '...' }` to display a built-in error message below the
10
+ * action buttons. When `error` is provided, the dialog stays open
11
+ * regardless of the `close` value.
12
+ */
13
+ export type ConfirmResult = void | {
14
+ close?: boolean;
15
+ error?: string;
16
+ };
17
+ export interface RootProps extends Pick<_AlertDialog.Root.Props, 'open' | 'onOpenChange' | 'defaultOpen'> {
18
+ /**
19
+ * The content to be rendered inside the component. Typically includes
20
+ * `AlertDialog.Trigger` and `AlertDialog.Popup`.
21
+ */
22
+ children: ReactNode;
23
+ /**
24
+ * Callback fired when the user confirms the action.
25
+ *
26
+ * - Synchronous handlers: the dialog closes immediately after the
27
+ * handler returns.
28
+ * - Async handlers: the dialog enters a "pending" state (buttons
29
+ * disabled, spinner shown on the confirm button) until the promise
30
+ * settles.
31
+ *
32
+ * Return `{ close: false }` to keep the dialog open after the handler
33
+ * completes (e.g. for server-side validation). Return `void` or
34
+ * `{ close: true }` to close the dialog (the default).
35
+ *
36
+ * Return `{ error: '...' }` to show a built-in error message below
37
+ * the action buttons. The dialog stays open regardless of the `close`
38
+ * value. The error is announced to screen readers and is automatically
39
+ * cleared on the next confirm attempt or when the dialog reopens.
40
+ *
41
+ * If the promise rejects (or the handler throws) without returning an
42
+ * `error`, the dialog stays open and returns to idle without showing
43
+ * a visible error message. The error is logged to the console.
44
+ * To show a user-facing message on failure, catch the error and
45
+ * return `{ close: false, error: '...' }`.
46
+ */
47
+ onConfirm?: () => ConfirmResult | Promise<ConfirmResult>;
48
+ }
49
+ export interface TriggerProps extends ComponentProps<'button'> {
50
+ /**
51
+ * The content to be rendered inside the component.
52
+ */
53
+ children?: ReactNode;
54
+ }
55
+ export interface PopupProps extends ComponentProps<'div'>, Pick<_AlertDialog.Popup.Props, 'initialFocus' | 'finalFocus'> {
56
+ /**
57
+ * A parent element to render the portal into.
58
+ */
59
+ container?: _AlertDialog.Portal.Props['container'];
60
+ /**
61
+ * The semantic intent of the dialog, which determines its styling.
62
+ *
63
+ * All intents use `role="alertdialog"`, are always modal, and block
64
+ * backdrop click dismissal. Escape key and the cancel/confirm buttons
65
+ * still dismiss the dialog.
66
+ *
67
+ * - `'default'`: Standard confirmation dialog for reversible actions.
68
+ * - `'irreversible'`: Confirmation dialog for irreversible actions that
69
+ * cannot be undone. The confirm button uses error/danger coloring.
70
+ *
71
+ * @default 'default'
72
+ */
73
+ intent?: 'default' | 'irreversible';
74
+ /**
75
+ * The title displayed in the dialog header. This serves as both the
76
+ * visible heading and the accessible label (`aria-labelledby`) for the
77
+ * dialog. Must be a plain string to ensure a predictable accessible name.
78
+ */
79
+ title: string;
80
+ /**
81
+ * An optional description displayed below the title. Rendered using
82
+ * Base UI's `AlertDialog.Description` for proper `aria-describedby`
83
+ * association with the dialog. Must be a plain string to ensure a
84
+ * predictable accessible description.
85
+ */
86
+ description?: string;
87
+ /**
88
+ * Optional body content displayed between the description and the
89
+ * action buttons. Use for supplementary details or form fields.
90
+ */
91
+ children?: ReactNode;
92
+ /**
93
+ * Custom text for the confirm button.
94
+ *
95
+ * @default 'OK'
96
+ */
97
+ confirmButtonText?: string;
98
+ /**
99
+ * Custom text for the cancel button.
100
+ *
101
+ * @default 'Cancel'
102
+ */
103
+ cancelButtonText?: string;
104
+ }
105
+ //# sourceMappingURL=types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/alert-dialog/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,IAAI,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAC/E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAErD;;;;;;;;GAQG;AACH,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAEvE,MAAM,WAAW,SAChB,SAAQ,IAAI,CACX,YAAY,CAAC,IAAI,CAAC,KAAK,EACvB,MAAM,GAAG,cAAc,GAAG,aAAa,CACvC;IACD;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;;;;;;;;;;;;;;;;;;;OAuBG;IACH,SAAS,CAAC,EAAE,MAAM,aAAa,GAAG,OAAO,CAAE,aAAa,CAAE,CAAC;CAC3D;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAE,QAAQ,CAAE;IAC/D;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,UAChB,SAAQ,cAAc,CAAE,KAAK,CAAE,EAC9B,IAAI,CAAE,YAAY,CAAC,KAAK,CAAC,KAAK,EAAE,cAAc,GAAG,YAAY,CAAE;IAChE;;OAEG;IACH,SAAS,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,KAAK,CAAE,WAAW,CAAE,CAAC;IAErD;;;;;;;;;;;;OAYG;IACH,MAAM,CAAC,EAAE,SAAS,GAAG,cAAc,CAAC;IAEpC;;;;OAIG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;;;OAKG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC1B"}
@@ -1 +1 @@
1
- {"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../src/badge/badge.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAG1C;;GAEG;AACH,eAAO,MAAM,KAAK,wGAmBf,CAAC"}
1
+ {"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../src/badge/badge.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAI1C;;GAEG;AACH,eAAO,MAAM,KAAK,wGAgBf,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/button/button.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,SAAS,CAAC;AAK3C,eAAO,MAAM,MAAM,2GA8ClB,CAAC"}
1
+ {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/button/button.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,SAAS,CAAC;AAM3C,eAAO,MAAM,MAAM,2GA+ClB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/card/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,KAAK,IAAI,MAAM,UAAU,CAAC;AAwBjC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,IAAI,CAAC,IAAI,CASjC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,IAAI,CAAC,IAAI,CAAE,CAAC;AAE1C,eAAO,MAAM,OAAO,EAAE,KAyBrB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,aAAa,EAAE,KAsB3B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,UAAU,EAAE,KAQxB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,eAAe,EAAE,KAe7B,CAAC"}
1
+ {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/card/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,KAAK,IAAI,MAAM,UAAU,CAAC;AAwBjC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,IAAI,CAAC,IAAI,CASjC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,IAAI,CAAC,IAAI,CAAE,CAAC;AAE1C,eAAO,MAAM,OAAO,EAAE,KAyBrB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,aAAa,EAAE,KAsB3B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,UAAU,EAAE,KAQxB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,eAAe,EAAE,KAc7B,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"title.d.ts","sourceRoot":"","sources":["../../src/card/title.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C;;;GAGG;AACH,eAAO,MAAM,KAAK,uGAYjB,CAAC"}
1
+ {"version":3,"file":"title.d.ts","sourceRoot":"","sources":["../../src/card/title.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAI1C;;;GAGG;AACH,eAAO,MAAM,KAAK,uGAajB,CAAC"}
@@ -5,8 +5,9 @@
5
5
  * `Collapsible` is a collection of React components that combine to render
6
6
  * a collapsible panel controlled by a button.
7
7
  */
8
- export declare const Panel: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react").CollapsiblePanelProps, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref">, "className" | "children" | "render"> & {
8
+ export declare const Panel: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react").CollapsiblePanelProps, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref">, "style" | "className" | "children" | "render"> & {
9
9
  className?: string;
10
+ style?: React.CSSProperties;
10
11
  render?: ((props: import("react").HTMLAttributes<any> & {
11
12
  ref?: import("react").Ref<any> | undefined;
12
13
  }) => React.ReactElement<unknown>) | React.ReactElement<Record<string, unknown>>;
@@ -1 +1 @@
1
- {"version":3,"file":"panel.d.ts","sourceRoot":"","sources":["../../src/collapsible/panel.tsx"],"names":[],"mappings":"AAIA;;;;;;GAMG;AACH,eAAO,MAAM,KAAK;;;;;;;kDAIjB,CAAC"}
1
+ {"version":3,"file":"panel.d.ts","sourceRoot":"","sources":["../../src/collapsible/panel.tsx"],"names":[],"mappings":"AAIA;;;;;;GAMG;AACH,eAAO,MAAM,KAAK;;;;;;;;kDAIjB,CAAC"}
@@ -4,8 +4,9 @@
4
4
  * `Collapsible` is a collection of React components that combine to render
5
5
  * a collapsible panel controlled by a button.
6
6
  */
7
- export declare const Root: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react").CollapsibleRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref">, "className" | "children" | "render"> & {
7
+ export declare const Root: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react").CollapsibleRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref">, "style" | "className" | "children" | "render"> & {
8
8
  className?: string;
9
+ style?: React.CSSProperties;
9
10
  render?: ((props: import("react").HTMLAttributes<any> & {
10
11
  ref?: import("react").Ref<any> | undefined;
11
12
  }) => React.ReactElement<unknown>) | React.ReactElement<Record<string, unknown>>;
@@ -1 +1 @@
1
- {"version":3,"file":"root.d.ts","sourceRoot":"","sources":["../../src/collapsible/root.tsx"],"names":[],"mappings":"AAIA;;;;;GAKG;AACH,eAAO,MAAM,IAAI;;;;;;;kDAIhB,CAAC"}
1
+ {"version":3,"file":"root.d.ts","sourceRoot":"","sources":["../../src/collapsible/root.tsx"],"names":[],"mappings":"AAIA;;;;;GAKG;AACH,eAAO,MAAM,IAAI;;;;;;;;kDAIhB,CAAC"}
@@ -4,8 +4,9 @@
4
4
  * `Collapsible` is a collection of React components that combine to render
5
5
  * a collapsible panel controlled by a button.
6
6
  */
7
- export declare const Trigger: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react").CollapsibleTriggerProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>, "ref">, "className" | "children" | "render"> & {
7
+ export declare const Trigger: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react").CollapsibleTriggerProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>, "ref">, "style" | "className" | "children" | "render"> & {
8
8
  className?: string;
9
+ style?: React.CSSProperties;
9
10
  render?: ((props: import("react").HTMLAttributes<any> & {
10
11
  ref?: import("react").Ref<any> | undefined;
11
12
  }) => React.ReactElement<unknown>) | React.ReactElement<Record<string, unknown>>;
@@ -1 +1 @@
1
- {"version":3,"file":"trigger.d.ts","sourceRoot":"","sources":["../../src/collapsible/trigger.tsx"],"names":[],"mappings":"AAIA;;;;;GAKG;AACH,eAAO,MAAM,OAAO;;;;;;;qDAInB,CAAC"}
1
+ {"version":3,"file":"trigger.d.ts","sourceRoot":"","sources":["../../src/collapsible/trigger.tsx"],"names":[],"mappings":"AAIA;;;;;GAKG;AACH,eAAO,MAAM,OAAO;;;;;;;;qDAInB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"content.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/content.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAE5C;;;GAGG;AACH,eAAO,MAAM,OAAO,yGAUnB,CAAC"}
1
+ {"version":3,"file":"content.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/content.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAE5C;;;GAGG;AACH,eAAO,MAAM,OAAO,yGAqBnB,CAAC"}
@@ -0,0 +1,4 @@
1
+ export declare const HeaderDescriptionIdContext: import("react").Context<{
2
+ setDescriptionId: (id: string | undefined) => void;
3
+ }>;
4
+ //# sourceMappingURL=context.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/context.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,0BAA0B;sBACpB,CAAE,EAAE,EAAE,MAAM,GAAG,SAAS,KAAM,IAAI;EAGlD,CAAC"}
@@ -0,0 +1,15 @@
1
+ import type { HeaderDescriptionProps } from './types';
2
+ /**
3
+ * Secondary content placed in the collapsible card header that describes
4
+ * the trigger button via `aria-describedby`. Use it for supplementary
5
+ * information such as status badges or summary values.
6
+ *
7
+ * The content is visually rendered but marked `aria-hidden` so that
8
+ * assistive technologies consume it only through the `aria-describedby`
9
+ * relationship on the trigger, avoiding double announcements.
10
+ *
11
+ * Avoid interactive elements (buttons, links, inputs) inside this
12
+ * component — the entire header is the toggle trigger.
13
+ */
14
+ export declare const HeaderDescription: import("react").ForwardRefExoticComponent<HeaderDescriptionProps & import("react").RefAttributes<HTMLDivElement>>;
15
+ //# sourceMappingURL=header-description.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"header-description.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/header-description.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AAEtD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,iBAAiB,mHA0B3B,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/header.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C;;;;;;;;GAQG;AACH,eAAO,MAAM,MAAM,wGAiClB,CAAC"}
1
+ {"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/header.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C;;;;;;;;GAQG;AACH,eAAO,MAAM,MAAM,wGAuDlB,CAAC"}
@@ -1,5 +1,6 @@
1
1
  import { Root } from './root';
2
2
  import { Header } from './header';
3
+ import { HeaderDescription } from './header-description';
3
4
  import { Content } from './content';
4
- export { Root, Header, Content };
5
+ export { Root, Header, HeaderDescription, Content };
5
6
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,iBAAiB,EAAE,OAAO,EAAE,CAAC"}
@@ -15,6 +15,16 @@ export declare const InitiallyOpened: Story;
15
15
  * A disabled collapsible card cannot be toggled by the user.
16
16
  */
17
17
  export declare const Disabled: Story;
18
+ /**
19
+ * Multiple collapsible cards stacked vertically, simulating a typical
20
+ * settings-panel or FAQ-style layout.
21
+ */
22
+ export declare const Stacked: Story;
23
+ /**
24
+ * A collapsible card with a `HeaderDescription` that provides supplementary
25
+ * information (e.g. status, summary) as an `aria-describedby` relationship.
26
+ */
27
+ export declare const WithHeaderDescription: Story;
18
28
  /**
19
29
  * Visual comparison: a `CollapsibleCard` (open) next to a regular `Card`
20
30
  * to verify identical spacing and layout.
@@ -1 +1 @@
1
- {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/collapsible-card/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,KAAK,eAAe,MAAM,UAAU,CAAC;AAwB5C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,eAAe,CAAC,IAAI,CAO5C,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,eAAe,CAAC,IAAI,CAAE,CAAC;AAErD;;GAEG;AACH,eAAO,MAAM,OAAO,EAAE,KAqBrB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,EAAE,KAkB7B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,KAetB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,cAAc,EAAE,KA4C5B,CAAC"}
1
+ {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/collapsible-card/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,KAAK,eAAe,MAAM,UAAU,CAAC;AAyB5C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,eAAe,CAAC,IAAI,CAQ5C,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,eAAe,CAAC,IAAI,CAAE,CAAC;AAErD;;GAEG;AACH,eAAO,MAAM,OAAO,EAAE,KAqBrB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,EAAE,KAkB7B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,KAetB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,OAAO,EAAE,KA6CrB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,qBAAqB,EAAE,KAuCnC,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,cAAc,EAAE,KA4C5B,CAAC"}
@@ -1,4 +1,5 @@
1
1
  import type { ReactNode } from 'react';
2
+ import type { PanelProps } from '../collapsible/types';
2
3
  import type { ComponentProps } from '../utils/types';
3
4
  export interface RootProps extends ComponentProps<'div'> {
4
5
  /**
@@ -33,10 +34,30 @@ export interface HeaderProps extends ComponentProps<'div'> {
33
34
  */
34
35
  children?: ReactNode;
35
36
  }
37
+ export interface HeaderDescriptionProps extends ComponentProps<'div'> {
38
+ /**
39
+ * Secondary content that describes the header trigger via
40
+ * `aria-describedby`. Rendered visually but marked `aria-hidden`
41
+ * so assistive technologies consume it only through the description
42
+ * relationship, avoiding double announcements.
43
+ *
44
+ * Avoid interactive elements — the entire header is the toggle trigger.
45
+ */
46
+ children?: ReactNode;
47
+ }
36
48
  export interface ContentProps extends ComponentProps<'div'> {
37
49
  /**
38
50
  * The content to be rendered inside the collapsible content area.
39
51
  */
40
52
  children?: ReactNode;
53
+ /**
54
+ * Allows the browser’s built-in page search to find and expand the panel contents.
55
+ *
56
+ * Overrides the `keepMounted` prop and uses `hidden="until-found"`
57
+ * to hide the element without removing it from the DOM.
58
+ *
59
+ * @default true
60
+ */
61
+ hiddenUntilFound?: PanelProps['hiddenUntilFound'];
41
62
  }
42
63
  //# sourceMappingURL=types.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAErD,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAE,KAAK,CAAE;IACzD;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,YAAY,CAAC,EAAE,CAAE,IAAI,EAAE,OAAO,KAAM,IAAI,CAAC;IACzC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAE,KAAK,CAAE;IAC3D;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAE,KAAK,CAAE;IAC5D;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/collapsible-card/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAErD,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAE,KAAK,CAAE;IACzD;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,YAAY,CAAC,EAAE,CAAE,IAAI,EAAE,OAAO,KAAM,IAAI,CAAC;IACzC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAE,KAAK,CAAE;IAC3D;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,sBAAuB,SAAQ,cAAc,CAAE,KAAK,CAAE;IACtE;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAE,KAAK,CAAE;IAC5D;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;;;OAOG;IACH,gBAAgB,CAAC,EAAE,UAAU,CAAE,kBAAkB,CAAE,CAAC;CACpD"}
@@ -1 +1 @@
1
- {"version":3,"file":"action.d.ts","sourceRoot":"","sources":["../../src/dialog/action.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C;;;GAGG;AACH,QAAA,MAAM,MAAM,2GAUX,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}
1
+ {"version":3,"file":"action.d.ts","sourceRoot":"","sources":["../../src/dialog/action.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C;;;GAGG;AACH,QAAA,MAAM,MAAM,2GAgBX,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"close-icon.d.ts","sourceRoot":"","sources":["../../src/dialog/close-icon.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C;;;GAGG;AACH,QAAA,MAAM,SAAS,8GAkBd,CAAC;AAEF,OAAO,EAAE,SAAS,EAAE,CAAC"}
1
+ {"version":3,"file":"close-icon.d.ts","sourceRoot":"","sources":["../../src/dialog/close-icon.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C;;;GAGG;AACH,QAAA,MAAM,SAAS,8GAmBd,CAAC;AAEF,OAAO,EAAE,SAAS,EAAE,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"popup.d.ts","sourceRoot":"","sources":["../../src/dialog/popup.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAK1C;;;GAGG;AACH,QAAA,MAAM,KAAK,uGAwBR,CAAC;AAEJ,OAAO,EAAE,KAAK,EAAE,CAAC"}
1
+ {"version":3,"file":"popup.d.ts","sourceRoot":"","sources":["../../src/dialog/popup.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAO1C;;;GAGG;AACH,QAAA,MAAM,KAAK,uGAwCR,CAAC;AAEJ,OAAO,EAAE,KAAK,EAAE,CAAC"}
@@ -8,12 +8,6 @@ type Story = StoryObj<typeof Dialog.Root>;
8
8
  * what happens when clicking the close icon.
9
9
  */
10
10
  export declare const _Default: Story;
11
- /**
12
- * A confirmation dialog that intentionally omits the close icon. The user
13
- * must explicitly choose "Cancel" or "Confirm" to make their intent clear,
14
- * since it is not obvious what would happen when clicking a close icon.
15
- */
16
- export declare const ConfirmDialog: Story;
17
11
  export declare const AllSizes: Story;
18
12
  /**
19
13
  * Popovers in Gutenberg are managed with explicit z-index values, which can create
@@ -25,4 +19,12 @@ export declare const AllSizes: Story;
25
19
  * because it requires a global CSS rule.)
26
20
  */
27
21
  export declare const WithCustomZIndex: Story;
22
+ /**
23
+ * A dialog with a visually hidden title. The title is still present in the
24
+ * DOM for `aria-labelledby`, but is not visible to sighted users.
25
+ *
26
+ * Use `<VisuallyHidden render={ <Dialog.Title /> }>` so that `Dialog.Title`
27
+ * keeps its `<h2>` element while being visually hidden.
28
+ */
29
+ export declare const WithVisuallyHiddenTitle: Story;
28
30
  //# sourceMappingURL=index.story.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/dialog/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAG5D,OAAO,KAAK,MAAM,MAAM,UAAU,CAAC;AAEnC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,MAAM,CAAC,IAAI,CAqCnC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,MAAM,CAAC,IAAI,CAAE,CAAC;AAE5C;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,KAsBtB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,aAAa,EAAE,KAqB3B,CAAC;AAuEF,eAAO,MAAM,QAAQ,EAAE,KAItB,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAG9B,CAAC"}
1
+ {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/dialog/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAI5D,OAAO,KAAK,MAAM,MAAM,UAAU,CAAC;AAEnC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,MAAM,CAAC,IAAI,CAqCnC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,MAAM,CAAC,IAAI,CAAE,CAAC;AAE5C;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,KAsBtB,CAAC;AAuEF,eAAO,MAAM,QAAQ,EAAE,KAItB,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAG9B,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,uBAAuB,EAAE,KAuBrC,CAAC"}
@@ -4,8 +4,18 @@ import type { TitleProps } from './types';
4
4
  * and serves as both the visible heading and the accessible label for
5
5
  * the dialog.
6
6
  *
7
- * Base UI's Dialog.Title renders an `<h2>` by default. Use the `render` prop
8
- * to customize the element if needed.
7
+ * **Required** every dialog must include a `Dialog.Title`, even if
8
+ * visually hidden. The rendered element is linked to the popup via
9
+ * `aria-labelledby`. Renders an `<h2>` by default.
10
+ *
11
+ * To visually hide the title while keeping it accessible, wrap it with
12
+ * `VisuallyHidden` using the `render` prop:
13
+ *
14
+ * ```jsx
15
+ * <VisuallyHidden render={ <Dialog.Title /> }>
16
+ * Accessible title text
17
+ * </VisuallyHidden>
18
+ * ```
9
19
  */
10
20
  declare const Title: import("react").ForwardRefExoticComponent<TitleProps & import("react").RefAttributes<HTMLHeadingElement>>;
11
21
  export { Title };
@@ -1 +1 @@
1
- {"version":3,"file":"title.d.ts","sourceRoot":"","sources":["../../src/dialog/title.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C;;;;;;;GAOG;AACH,QAAA,MAAM,KAAK,2GAoBV,CAAC;AAEF,OAAO,EAAE,KAAK,EAAE,CAAC"}
1
+ {"version":3,"file":"title.d.ts","sourceRoot":"","sources":["../../src/dialog/title.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C;;;;;;;;;;;;;;;;;GAiBG;AACH,QAAA,MAAM,KAAK,2GAsBV,CAAC;AAEF,OAAO,EAAE,KAAK,EAAE,CAAC"}