@wordpress/ui 0.6.1-next.v.0 → 0.7.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 (297) hide show
  1. package/AGENTS.md +9 -0
  2. package/CHANGELOG.md +32 -1
  3. package/CLAUDE.md +1 -0
  4. package/README.md +13 -12
  5. package/build/badge/badge.cjs +37 -62
  6. package/build/badge/badge.cjs.map +4 -4
  7. package/build/button/button.cjs +3 -3
  8. package/build/button/button.cjs.map +2 -2
  9. package/build/dialog/action.cjs +46 -0
  10. package/build/dialog/action.cjs.map +7 -0
  11. package/build/dialog/close-icon.cjs +57 -0
  12. package/build/dialog/close-icon.cjs.map +7 -0
  13. package/build/dialog/context.cjs +76 -0
  14. package/build/dialog/context.cjs.map +7 -0
  15. package/build/dialog/footer.cjs +64 -0
  16. package/build/dialog/footer.cjs.map +7 -0
  17. package/build/dialog/header.cjs +64 -0
  18. package/build/dialog/header.cjs.map +7 -0
  19. package/build/dialog/index.cjs +52 -0
  20. package/build/dialog/index.cjs.map +7 -0
  21. package/build/dialog/popup.cjs +77 -0
  22. package/build/dialog/popup.cjs.map +7 -0
  23. package/build/dialog/root.cjs +35 -0
  24. package/build/dialog/root.cjs.map +7 -0
  25. package/build/dialog/title.cjs +76 -0
  26. package/build/dialog/title.cjs.map +7 -0
  27. package/build/dialog/trigger.cjs +38 -0
  28. package/build/dialog/trigger.cjs.map +7 -0
  29. package/build/dialog/types.cjs +19 -0
  30. package/build/dialog/types.cjs.map +7 -0
  31. package/build/form/primitives/field/root.cjs +1 -1
  32. package/build/form/primitives/field/root.cjs.map +1 -1
  33. package/build/form/primitives/fieldset/root.cjs +3 -3
  34. package/build/form/primitives/fieldset/root.cjs.map +2 -2
  35. package/build/form/primitives/index.cjs +5 -2
  36. package/build/form/primitives/index.cjs.map +2 -2
  37. package/build/form/primitives/input-layout/input-layout.cjs +3 -3
  38. package/build/form/primitives/input-layout/input-layout.cjs.map +2 -2
  39. package/build/form/primitives/input-layout/slot.cjs +3 -3
  40. package/build/form/primitives/input-layout/slot.cjs.map +2 -2
  41. package/build/form/primitives/select/item.cjs +3 -3
  42. package/build/form/primitives/select/item.cjs.map +2 -2
  43. package/build/form/primitives/select/popup.cjs +3 -3
  44. package/build/form/primitives/select/popup.cjs.map +2 -2
  45. package/build/form/primitives/select/trigger.cjs +3 -3
  46. package/build/form/primitives/select/trigger.cjs.map +2 -2
  47. package/build/{box → form/primitives/textarea}/index.cjs +7 -7
  48. package/build/form/primitives/textarea/index.cjs.map +7 -0
  49. package/build/form/primitives/textarea/textarea.cjs +90 -0
  50. package/build/form/primitives/textarea/textarea.cjs.map +7 -0
  51. package/build/form/primitives/textarea/types.cjs +19 -0
  52. package/build/form/primitives/textarea/types.cjs.map +7 -0
  53. package/build/icon-button/icon-button.cjs +104 -0
  54. package/build/icon-button/icon-button.cjs.map +7 -0
  55. package/build/icon-button/index.cjs +31 -0
  56. package/build/icon-button/index.cjs.map +7 -0
  57. package/build/icon-button/types.cjs +19 -0
  58. package/build/icon-button/types.cjs.map +7 -0
  59. package/build/index.cjs +8 -2
  60. package/build/index.cjs.map +2 -2
  61. package/build/tabs/index.cjs +40 -0
  62. package/build/tabs/index.cjs.map +7 -0
  63. package/build/tabs/list.cjs +145 -0
  64. package/build/tabs/list.cjs.map +7 -0
  65. package/build/tabs/panel.cjs +67 -0
  66. package/build/tabs/panel.cjs.map +7 -0
  67. package/build/tabs/root.cjs +38 -0
  68. package/build/tabs/root.cjs.map +7 -0
  69. package/build/tabs/tab.cjs +71 -0
  70. package/build/tabs/tab.cjs.map +7 -0
  71. package/build/{box → tabs}/types.cjs +1 -1
  72. package/build/tabs/types.cjs.map +7 -0
  73. package/build/tooltip/popup.cjs +3 -3
  74. package/build/tooltip/popup.cjs.map +2 -2
  75. package/build-module/badge/badge.mjs +27 -62
  76. package/build-module/badge/badge.mjs.map +3 -3
  77. package/build-module/button/button.mjs +3 -3
  78. package/build-module/button/button.mjs.map +2 -2
  79. package/build-module/dialog/action.mjs +21 -0
  80. package/build-module/dialog/action.mjs.map +7 -0
  81. package/build-module/dialog/close-icon.mjs +32 -0
  82. package/build-module/dialog/close-icon.mjs.map +7 -0
  83. package/build-module/dialog/context.mjs +57 -0
  84. package/build-module/dialog/context.mjs.map +7 -0
  85. package/build-module/dialog/footer.mjs +29 -0
  86. package/build-module/dialog/footer.mjs.map +7 -0
  87. package/build-module/dialog/header.mjs +29 -0
  88. package/build-module/dialog/header.mjs.map +7 -0
  89. package/build-module/dialog/index.mjs +20 -0
  90. package/build-module/dialog/index.mjs.map +7 -0
  91. package/build-module/dialog/popup.mjs +44 -0
  92. package/build-module/dialog/popup.mjs.map +7 -0
  93. package/build-module/dialog/root.mjs +10 -0
  94. package/build-module/dialog/root.mjs.map +7 -0
  95. package/build-module/dialog/title.mjs +41 -0
  96. package/build-module/dialog/title.mjs.map +7 -0
  97. package/build-module/dialog/trigger.mjs +13 -0
  98. package/build-module/dialog/trigger.mjs.map +7 -0
  99. package/build-module/form/primitives/field/root.mjs +1 -1
  100. package/build-module/form/primitives/field/root.mjs.map +1 -1
  101. package/build-module/form/primitives/fieldset/root.mjs +3 -3
  102. package/build-module/form/primitives/fieldset/root.mjs.map +2 -2
  103. package/build-module/form/primitives/index.mjs +3 -1
  104. package/build-module/form/primitives/index.mjs.map +2 -2
  105. package/build-module/form/primitives/input-layout/input-layout.mjs +3 -3
  106. package/build-module/form/primitives/input-layout/input-layout.mjs.map +2 -2
  107. package/build-module/form/primitives/input-layout/slot.mjs +3 -3
  108. package/build-module/form/primitives/input-layout/slot.mjs.map +2 -2
  109. package/build-module/form/primitives/select/item.mjs +3 -3
  110. package/build-module/form/primitives/select/item.mjs.map +2 -2
  111. package/build-module/form/primitives/select/popup.mjs +3 -3
  112. package/build-module/form/primitives/select/popup.mjs.map +2 -2
  113. package/build-module/form/primitives/select/trigger.mjs +3 -3
  114. package/build-module/form/primitives/select/trigger.mjs.map +2 -2
  115. package/build-module/form/primitives/textarea/index.mjs +6 -0
  116. package/build-module/form/primitives/textarea/index.mjs.map +7 -0
  117. package/build-module/form/primitives/textarea/textarea.mjs +55 -0
  118. package/build-module/form/primitives/textarea/textarea.mjs.map +7 -0
  119. package/build-module/form/primitives/textarea/types.mjs +1 -0
  120. package/build-module/form/primitives/textarea/types.mjs.map +7 -0
  121. package/build-module/icon-button/icon-button.mjs +69 -0
  122. package/build-module/icon-button/icon-button.mjs.map +7 -0
  123. package/build-module/icon-button/index.mjs +6 -0
  124. package/build-module/icon-button/index.mjs.map +7 -0
  125. package/build-module/icon-button/types.mjs +1 -0
  126. package/build-module/icon-button/types.mjs.map +7 -0
  127. package/build-module/index.mjs +5 -1
  128. package/build-module/index.mjs.map +2 -2
  129. package/build-module/tabs/index.mjs +12 -0
  130. package/build-module/tabs/index.mjs.map +7 -0
  131. package/build-module/tabs/list.mjs +110 -0
  132. package/build-module/tabs/list.mjs.map +7 -0
  133. package/build-module/tabs/panel.mjs +32 -0
  134. package/build-module/tabs/panel.mjs.map +7 -0
  135. package/build-module/tabs/root.mjs +13 -0
  136. package/build-module/tabs/root.mjs.map +7 -0
  137. package/build-module/tabs/tab.mjs +36 -0
  138. package/build-module/tabs/tab.mjs.map +7 -0
  139. package/build-module/tabs/types.mjs +1 -0
  140. package/build-module/tabs/types.mjs.map +7 -0
  141. package/build-module/tooltip/popup.mjs +3 -3
  142. package/build-module/tooltip/popup.mjs.map +2 -2
  143. package/build-types/badge/badge.d.ts +1 -2
  144. package/build-types/badge/badge.d.ts.map +1 -1
  145. package/build-types/button/stories/index.story.d.ts +1 -2
  146. package/build-types/button/stories/index.story.d.ts.map +1 -1
  147. package/build-types/dialog/action.d.ts +8 -0
  148. package/build-types/dialog/action.d.ts.map +1 -0
  149. package/build-types/dialog/close-icon.d.ts +8 -0
  150. package/build-types/dialog/close-icon.d.ts.map +1 -0
  151. package/build-types/dialog/context.d.ts +25 -0
  152. package/build-types/dialog/context.d.ts.map +1 -0
  153. package/build-types/dialog/footer.d.ts +8 -0
  154. package/build-types/dialog/footer.d.ts.map +1 -0
  155. package/build-types/dialog/header.d.ts +8 -0
  156. package/build-types/dialog/header.d.ts.map +1 -0
  157. package/build-types/dialog/index.d.ts +10 -0
  158. package/build-types/dialog/index.d.ts.map +1 -0
  159. package/build-types/dialog/popup.d.ts +8 -0
  160. package/build-types/dialog/popup.d.ts.map +1 -0
  161. package/build-types/dialog/root.d.ts +10 -0
  162. package/build-types/dialog/root.d.ts.map +1 -0
  163. package/build-types/dialog/stories/index.story.d.ts +18 -0
  164. package/build-types/dialog/stories/index.story.d.ts.map +1 -0
  165. package/build-types/dialog/test/index.test.d.ts +2 -0
  166. package/build-types/dialog/test/index.test.d.ts.map +1 -0
  167. package/build-types/dialog/title.d.ts +12 -0
  168. package/build-types/dialog/title.d.ts.map +1 -0
  169. package/build-types/dialog/trigger.d.ts +7 -0
  170. package/build-types/dialog/trigger.d.ts.map +1 -0
  171. package/build-types/dialog/types.d.ts +77 -0
  172. package/build-types/dialog/types.d.ts.map +1 -0
  173. package/build-types/form/primitives/field/stories/index.story.d.ts +0 -1
  174. package/build-types/form/primitives/field/stories/index.story.d.ts.map +1 -1
  175. package/build-types/form/primitives/index.d.ts +1 -0
  176. package/build-types/form/primitives/index.d.ts.map +1 -1
  177. package/build-types/form/primitives/input/input.d.ts +1 -1
  178. package/build-types/form/primitives/select/stories/index.story.d.ts +0 -1
  179. package/build-types/form/primitives/select/stories/index.story.d.ts.map +1 -1
  180. package/build-types/form/primitives/textarea/index.d.ts +2 -0
  181. package/build-types/form/primitives/textarea/index.d.ts.map +1 -0
  182. package/build-types/form/primitives/textarea/stories/index.story.d.ts +13 -0
  183. package/build-types/form/primitives/textarea/stories/index.story.d.ts.map +1 -0
  184. package/build-types/form/primitives/textarea/test/index.test.d.ts +2 -0
  185. package/build-types/form/primitives/textarea/test/index.test.d.ts.map +1 -0
  186. package/build-types/form/primitives/textarea/textarea.d.ts +4 -0
  187. package/build-types/form/primitives/textarea/textarea.d.ts.map +1 -0
  188. package/build-types/form/primitives/textarea/types.d.ts +11 -0
  189. package/build-types/form/primitives/textarea/types.d.ts.map +1 -0
  190. package/build-types/icon-button/icon-button.d.ts +13 -0
  191. package/build-types/icon-button/icon-button.d.ts.map +1 -0
  192. package/build-types/icon-button/index.d.ts +2 -0
  193. package/build-types/icon-button/index.d.ts.map +1 -0
  194. package/build-types/icon-button/stories/index.story.d.ts +19 -0
  195. package/build-types/icon-button/stories/index.story.d.ts.map +1 -0
  196. package/build-types/icon-button/test/index.test.d.ts +2 -0
  197. package/build-types/icon-button/test/index.test.d.ts.map +1 -0
  198. package/build-types/icon-button/types.d.ts +36 -0
  199. package/build-types/icon-button/types.d.ts.map +1 -0
  200. package/build-types/index.d.ts +3 -1
  201. package/build-types/index.d.ts.map +1 -1
  202. package/build-types/stack/stories/index.story.d.ts.map +1 -1
  203. package/build-types/tabs/index.d.ts +6 -0
  204. package/build-types/tabs/index.d.ts.map +1 -0
  205. package/build-types/tabs/list.d.ts +16 -0
  206. package/build-types/tabs/list.d.ts.map +1 -0
  207. package/build-types/tabs/panel.d.ts +15 -0
  208. package/build-types/tabs/panel.d.ts.map +1 -0
  209. package/build-types/tabs/root.d.ts +15 -0
  210. package/build-types/tabs/root.d.ts.map +1 -0
  211. package/build-types/tabs/stories/index.story.d.ts +13 -0
  212. package/build-types/tabs/stories/index.story.d.ts.map +1 -0
  213. package/build-types/tabs/tab.d.ts +15 -0
  214. package/build-types/tabs/tab.d.ts.map +1 -0
  215. package/build-types/tabs/test/index.test.d.ts +2 -0
  216. package/build-types/tabs/test/index.test.d.ts.map +1 -0
  217. package/build-types/tabs/types.d.ts +33 -0
  218. package/build-types/tabs/types.d.ts.map +1 -0
  219. package/package.json +12 -10
  220. package/src/badge/badge.tsx +19 -78
  221. package/src/badge/stories/choosing-intent.story.tsx +1 -1
  222. package/src/badge/style.module.css +48 -0
  223. package/src/button/stories/index.story.tsx +3 -16
  224. package/src/button/style.module.css +23 -12
  225. package/src/dialog/action.tsx +22 -0
  226. package/src/dialog/close-icon.tsx +32 -0
  227. package/src/dialog/context.tsx +113 -0
  228. package/src/dialog/footer.tsx +26 -0
  229. package/src/dialog/header.tsx +26 -0
  230. package/src/dialog/index.ts +10 -0
  231. package/src/dialog/popup.tsx +46 -0
  232. package/src/dialog/root.tsx +14 -0
  233. package/src/dialog/stories/index.story.tsx +177 -0
  234. package/src/dialog/style.module.css +114 -0
  235. package/src/dialog/test/index.test.tsx +309 -0
  236. package/src/dialog/title.tsx +39 -0
  237. package/src/dialog/trigger.tsx +14 -0
  238. package/src/dialog/types.ts +93 -0
  239. package/src/form/primitives/field/root.tsx +1 -1
  240. package/src/form/primitives/field/stories/index.story.tsx +0 -1
  241. package/src/form/primitives/fieldset/style.module.css +1 -1
  242. package/src/form/primitives/index.ts +1 -0
  243. package/src/form/primitives/input-layout/style.module.css +5 -8
  244. package/src/form/primitives/select/stories/index.story.tsx +0 -1
  245. package/src/form/primitives/select/test/index.test.tsx +0 -2
  246. package/src/form/primitives/textarea/index.ts +1 -0
  247. package/src/form/primitives/textarea/stories/index.story.tsx +40 -0
  248. package/src/form/primitives/textarea/style.module.css +22 -0
  249. package/src/form/primitives/textarea/test/index.test.tsx +143 -0
  250. package/src/form/primitives/textarea/textarea.tsx +51 -0
  251. package/src/form/primitives/textarea/types.ts +18 -0
  252. package/src/icon-button/icon-button.tsx +65 -0
  253. package/src/icon-button/index.ts +1 -0
  254. package/src/icon-button/stories/index.story.tsx +128 -0
  255. package/src/icon-button/style.module.css +16 -0
  256. package/src/icon-button/test/index.test.tsx +86 -0
  257. package/src/icon-button/types.ts +38 -0
  258. package/src/index.ts +3 -1
  259. package/src/stack/stories/index.story.tsx +4 -5
  260. package/src/tabs/index.ts +6 -0
  261. package/src/tabs/list.tsx +130 -0
  262. package/src/tabs/panel.tsx +23 -0
  263. package/src/tabs/root.tsx +15 -0
  264. package/src/tabs/stories/best-practices.mdx +85 -0
  265. package/src/tabs/stories/index.story.tsx +363 -0
  266. package/src/tabs/style.module.css +269 -0
  267. package/src/tabs/tab.tsx +29 -0
  268. package/src/tabs/test/index.test.tsx +2260 -0
  269. package/src/tabs/types.ts +36 -0
  270. package/src/tooltip/style.module.css +3 -3
  271. package/src/utils/css/item-popup.module.css +2 -2
  272. package/src/utils/css/select-trigger.module.css +1 -1
  273. package/build/box/box.cjs +0 -88
  274. package/build/box/box.cjs.map +0 -7
  275. package/build/box/index.cjs.map +0 -7
  276. package/build/box/types.cjs.map +0 -7
  277. package/build-module/box/box.mjs +0 -63
  278. package/build-module/box/box.mjs.map +0 -7
  279. package/build-module/box/index.mjs +0 -6
  280. package/build-module/box/index.mjs.map +0 -7
  281. package/build-types/box/box.d.ts +0 -7
  282. package/build-types/box/box.d.ts.map +0 -1
  283. package/build-types/box/index.d.ts +0 -2
  284. package/build-types/box/index.d.ts.map +0 -1
  285. package/build-types/box/stories/index.story.d.ts +0 -8
  286. package/build-types/box/stories/index.story.d.ts.map +0 -1
  287. package/build-types/box/test/box.test.d.ts +0 -2
  288. package/build-types/box/test/box.test.d.ts.map +0 -1
  289. package/build-types/box/types.d.ts +0 -46
  290. package/build-types/box/types.d.ts.map +0 -1
  291. package/src/box/box.tsx +0 -118
  292. package/src/box/index.ts +0 -1
  293. package/src/box/stories/index.story.tsx +0 -41
  294. package/src/box/test/box.test.tsx +0 -29
  295. package/src/box/types.ts +0 -61
  296. /package/build-module/{box → dialog}/types.mjs +0 -0
  297. /package/build-module/{box → dialog}/types.mjs.map +0 -0
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/tabs/list.tsx", "../../src/tabs/style.module.css"],
4
+ "sourcesContent": ["import { forwardRef, useEffect, useState } from '@wordpress/element';\nimport clsx from 'clsx';\nimport { Tabs as _Tabs } from '@base-ui/react/tabs';\nimport { useMergeRefs } from '@wordpress/compose';\nimport styles from './style.module.css';\nimport type { TabListProps } from './types';\n\n// Account for sub-pixel rounding errors.\nconst SCROLL_EPSILON = 1;\n\n/**\n * Groups the individual tab buttons.\n *\n * `Tabs` is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n */\nexport const List = forwardRef< HTMLDivElement, TabListProps >(\n\tfunction TabList(\n\t\t{\n\t\t\tchildren,\n\t\t\tvariant = 'default',\n\t\t\tclassName,\n\t\t\tactivateOnFocus,\n\t\t\trender,\n\t\t\t...otherProps\n\t\t},\n\t\tforwardedRef\n\t) {\n\t\tconst [ listEl, setListEl ] = useState< HTMLDivElement | null >( null );\n\t\tconst [ overflow, setOverflow ] = useState< {\n\t\t\tfirst: boolean;\n\t\t\tlast: boolean;\n\t\t\tisScrolling: boolean;\n\t\t} >( {\n\t\t\tfirst: false,\n\t\t\tlast: false,\n\t\t\tisScrolling: false,\n\t\t} );\n\n\t\t// Check if list is overflowing when it scrolls or resizes.\n\t\tuseEffect( () => {\n\t\t\tif ( ! listEl ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst measureOverflow = () => {\n\t\t\t\tconst { scrollWidth, clientWidth, scrollLeft } = listEl;\n\t\t\t\tconst maxScroll = Math.max( scrollWidth - clientWidth, 0 );\n\t\t\t\tconst direction =\n\t\t\t\t\tlistEl.dir ||\n\t\t\t\t\t( typeof window !== 'undefined'\n\t\t\t\t\t\t? window.getComputedStyle( listEl ).direction\n\t\t\t\t\t\t: 'ltr' );\n\n\t\t\t\tconst scrollFromStart =\n\t\t\t\t\tdirection === 'rtl' && scrollLeft < 0\n\t\t\t\t\t\t? // In RTL layouts, scrollLeft is typically 0 at the visual \"start\"\n\t\t\t\t\t\t // (right edge) and becomes negative toward the \"end\" (left edge).\n\t\t\t\t\t\t // Normalize value for correct first/last detection logic.\n\t\t\t\t\t\t -scrollLeft\n\t\t\t\t\t\t: scrollLeft;\n\n\t\t\t\t// Use SCROLL_EPSILON to handle subpixel rendering differences.\n\t\t\t\tsetOverflow( {\n\t\t\t\t\tfirst: scrollFromStart > SCROLL_EPSILON,\n\t\t\t\t\tlast: scrollFromStart < maxScroll - SCROLL_EPSILON,\n\t\t\t\t\tisScrolling: scrollWidth > clientWidth,\n\t\t\t\t} );\n\t\t\t};\n\n\t\t\tconst resizeObserver = new ResizeObserver( measureOverflow );\n\t\t\tresizeObserver.observe( listEl );\n\n\t\t\tlet scrollTick = false;\n\t\t\tconst throttleMeasureOverflowOnScroll = () => {\n\t\t\t\tif ( ! scrollTick ) {\n\t\t\t\t\trequestAnimationFrame( () => {\n\t\t\t\t\t\tmeasureOverflow();\n\t\t\t\t\t\tscrollTick = false;\n\t\t\t\t\t} );\n\t\t\t\t\tscrollTick = true;\n\t\t\t\t}\n\t\t\t};\n\t\t\tlistEl.addEventListener(\n\t\t\t\t'scroll',\n\t\t\t\tthrottleMeasureOverflowOnScroll,\n\t\t\t\t{ passive: true }\n\t\t\t);\n\n\t\t\t// Initial check.\n\t\t\tmeasureOverflow();\n\n\t\t\treturn () => {\n\t\t\t\tlistEl.removeEventListener(\n\t\t\t\t\t'scroll',\n\t\t\t\t\tthrottleMeasureOverflowOnScroll\n\t\t\t\t);\n\t\t\t\tresizeObserver.disconnect();\n\t\t\t};\n\t\t}, [ listEl ] );\n\n\t\tconst mergedListRef = useMergeRefs( [\n\t\t\tforwardedRef,\n\t\t\t( el: HTMLDivElement | null ) => setListEl( el ),\n\t\t] );\n\n\t\treturn (\n\t\t\t<_Tabs.List\n\t\t\t\tref={ mergedListRef }\n\t\t\t\tactivateOnFocus={ activateOnFocus }\n\t\t\t\tdata-select-on-move={ activateOnFocus ? 'true' : 'false' }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tstyles.tablist,\n\t\t\t\t\toverflow.first && styles[ 'is-overflowing-first' ],\n\t\t\t\t\toverflow.last && styles[ 'is-overflowing-last' ],\n\t\t\t\t\tstyles[ `is-${ variant }-variant` ],\n\t\t\t\t\tclassName\n\t\t\t\t) }\n\t\t\t\t{ ...otherProps }\n\t\t\t\ttabIndex={\n\t\t\t\t\totherProps.tabIndex ??\n\t\t\t\t\t( overflow.isScrolling ? -1 : undefined )\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t\t<_Tabs.Indicator className={ styles.indicator } />\n\t\t\t</_Tabs.List>\n\t\t);\n\t}\n);\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='e0ff4b2c02']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"e0ff4b2c02\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._7313adbc8a112e90__tablist{--direction-factor:1;--direction-start:left;--direction-end:right;align-items:stretch;display:flex;overflow-inline:auto;overscroll-behavior-inline:none;position:relative;&:dir(rtl){--direction-factor:-1;--direction-start:right;--direction-end:left}&[data-orientation=horizontal]{--fade-width:4rem;--fade-gradient-base:#0000 0%,#000 var(--fade-width);--fade-gradient-composed:var(--fade-gradient-base),#000 60%,#0000 50%;width:fit-content;&._9f2ac729c68a735a__is-overflowing-first{mask-image:linear-gradient(to var(--direction-end),var(--fade-gradient-base))}&._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to var(--direction-start),var(--fade-gradient-base))}&._9f2ac729c68a735a__is-overflowing-first._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to right,var(--fade-gradient-composed)),linear-gradient(to left,var(--fade-gradient-composed))}&._59228b5227f38a99__is-minimal-variant{gap:1rem}}&[data-orientation=vertical]{flex-direction:column}}._1c37dcfaa1ad8cda__indicator{@media not (prefers-reduced-motion){transition-duration:.2s;transition-property:translate,width,height,border-radius,border-block;transition-timing-function:ease-out}outline:2px solid #0000;outline-offset:-1px;pointer-events:none;position:absolute;&[data-orientation=horizontal]{background-color:var(--wpds-color-stroke-interactive-neutral-strong);bottom:0;height:var(--wpds-border-width-focus);left:0;translate:var(--active-tab-left) 0;width:var(--active-tab-width);z-index:1}&[data-orientation=vertical]{background-color:var(--wpds-color-bg-interactive-neutral-weak-active);border-radius:var(--wpds-border-radius-sm);height:var(--active-tab-height);left:50%;top:0;translate:-50% var(--active-tab-top);width:100%;z-index:0}._7313adbc8a112e90__tablist[data-select-on-move=true]:has(:focus-visible)\\n\\t\\t&[data-orientation=vertical]{border:var(--wpds-border-width-focus) solid var(--wpds-color-stroke-focus-brand);box-sizing:border-box}}.a5fd8814f195aa5e__tab{align-items:center;background:#0000;border:none;border-radius:0;box-shadow:none;color:var(--wpds-color-fg-interactive-neutral);cursor:pointer;display:flex;flex:1 0 auto;font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-md);font-weight:400;line-height:1.2;outline:none;padding:0;position:relative;white-space:nowrap;z-index:1;&[data-disabled]{color:var(--wpds-color-fg-interactive-neutral-disabled);cursor:default;@media (forced-colors:active){color:GrayText}}&:not([data-disabled]):is(:hover,:focus-visible){color:var(--wpds-color-fg-interactive-neutral-active)}&:after{border-radius:var(--wpds-border-radius-sm);opacity:0;outline:var(--wpds-border-width-focus) solid var(--wpds-color-stroke-focus-brand);pointer-events:none;position:absolute;z-index:-1;@media not (prefers-reduced-motion){transition:opacity .1s linear}}&:focus-visible:after{opacity:1}[data-orientation=horizontal] &{height:48px;padding-inline:var(--wpds-dimension-padding-lg);scroll-margin:24px;&:after{content:\\\"\\\";inset:var(--wpds-dimension-padding-md)}}._59228b5227f38a99__is-minimal-variant[data-orientation=horizontal] &{padding-inline:0;&:after{inset-inline:round(up,var(--wpds-border-width-focus),1px)}}[data-orientation=vertical] &{min-height:40px;padding:var(--wpds-dimension-padding-sm) var(--wpds-dimension-padding-md)}[data-orientation=vertical][data-select-on-move=false] &:after{content:\\\"\\\";inset:var(--wpds-border-width-focus)}}._5dfc77e6edd345d4__tab-children{align-items:center;display:flex;flex-grow:1;[data-orientation=horizontal] &{justify-content:center}[data-orientation=vertical] &{justify-content:start}}._4a20e969d15e5ac1__tab-chevron{flex-shrink:0;margin-inline-end:calc(var(--wpds-dimension-gap-xs)*-1);opacity:0;[data-orientation=horizontal] &{display:none}[role=tab]:is([aria-selected=true],:focus-visible,:hover) &{opacity:1}@media not (prefers-reduced-motion){[data-select-on-move=true]\\n\\t\\t\\t[role=tab]:is([aria-selected=true])\\n\\t\\t\\t&{transition:opacity .15s linear .15s}}&:dir(rtl){rotate:180deg}}._49f4bf715948892a__tabpanel{&:focus{box-shadow:none;outline:none}&:focus-visible{box-shadow:0 0 0 var(--wpds-border-width-focus) var(--wpds-color-stroke-focus-brand);outline:2px solid #0000;outline-offset:0}}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"tablist\":\"_7313adbc8a112e90__tablist\",\"is-overflowing-first\":\"_9f2ac729c68a735a__is-overflowing-first\",\"is-overflowing-last\":\"_81c799c1f3cdd261__is-overflowing-last\",\"is-minimal-variant\":\"_59228b5227f38a99__is-minimal-variant\",\"indicator\":\"_1c37dcfaa1ad8cda__indicator\",\"tab\":\"a5fd8814f195aa5e__tab\",\"tab-children\":\"_5dfc77e6edd345d4__tab-children\",\"tab-chevron\":\"_4a20e969d15e5ac1__tab-chevron\",\"tabpanel\":\"_49f4bf715948892a__tabpanel\"};\n"],
5
+ "mappings": ";AAAA,SAAS,YAAY,WAAW,gBAAgB;AAChD,OAAO,UAAU;AACjB,SAAS,QAAQ,aAAa;AAC9B,SAAS,oBAAoB;;;ACH7B,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,wuIAAovI,CAAC;AAC/xI,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,WAAU,8BAA6B,wBAAuB,2CAA0C,uBAAsB,0CAAyC,sBAAqB,yCAAwC,aAAY,gCAA+B,OAAM,yBAAwB,gBAAe,mCAAkC,eAAc,kCAAiC,YAAW,8BAA6B;;;ADqGlc,SAkBC,KAlBD;AAnGH,IAAM,iBAAiB;AAQhB,IAAM,OAAO;AAAA,EACnB,SAAS,QACR;AAAA,IACC;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACJ,GACA,cACC;AACD,UAAM,CAAE,QAAQ,SAAU,IAAI,SAAmC,IAAK;AACtE,UAAM,CAAE,UAAU,WAAY,IAAI,SAI7B;AAAA,MACJ,OAAO;AAAA,MACP,MAAM;AAAA,MACN,aAAa;AAAA,IACd,CAAE;AAGF,cAAW,MAAM;AAChB,UAAK,CAAE,QAAS;AACf;AAAA,MACD;AAEA,YAAM,kBAAkB,MAAM;AAC7B,cAAM,EAAE,aAAa,aAAa,WAAW,IAAI;AACjD,cAAM,YAAY,KAAK,IAAK,cAAc,aAAa,CAAE;AACzD,cAAM,YACL,OAAO,QACL,OAAO,WAAW,cACjB,OAAO,iBAAkB,MAAO,EAAE,YAClC;AAEJ,cAAM,kBACL,cAAc,SAAS,aAAa;AAAA;AAAA;AAAA;AAAA,UAIjC,CAAC;AAAA,YACD;AAGJ,oBAAa;AAAA,UACZ,OAAO,kBAAkB;AAAA,UACzB,MAAM,kBAAkB,YAAY;AAAA,UACpC,aAAa,cAAc;AAAA,QAC5B,CAAE;AAAA,MACH;AAEA,YAAM,iBAAiB,IAAI,eAAgB,eAAgB;AAC3D,qBAAe,QAAS,MAAO;AAE/B,UAAI,aAAa;AACjB,YAAM,kCAAkC,MAAM;AAC7C,YAAK,CAAE,YAAa;AACnB,gCAAuB,MAAM;AAC5B,4BAAgB;AAChB,yBAAa;AAAA,UACd,CAAE;AACF,uBAAa;AAAA,QACd;AAAA,MACD;AACA,aAAO;AAAA,QACN;AAAA,QACA;AAAA,QACA,EAAE,SAAS,KAAK;AAAA,MACjB;AAGA,sBAAgB;AAEhB,aAAO,MAAM;AACZ,eAAO;AAAA,UACN;AAAA,UACA;AAAA,QACD;AACA,uBAAe,WAAW;AAAA,MAC3B;AAAA,IACD,GAAG,CAAE,MAAO,CAAE;AAEd,UAAM,gBAAgB,aAAc;AAAA,MACnC;AAAA,MACA,CAAE,OAA+B,UAAW,EAAG;AAAA,IAChD,CAAE;AAEF,WACC;AAAA,MAAC,MAAM;AAAA,MAAN;AAAA,QACA,KAAM;AAAA,QACN;AAAA,QACA,uBAAsB,kBAAkB,SAAS;AAAA,QACjD,WAAY;AAAA,UACX,cAAO;AAAA,UACP,SAAS,SAAS,cAAQ,sBAAuB;AAAA,UACjD,SAAS,QAAQ,cAAQ,qBAAsB;AAAA,UAC/C,cAAQ,MAAO,OAAQ,UAAW;AAAA,UAClC;AAAA,QACD;AAAA,QACE,GAAG;AAAA,QACL,UACC,WAAW,aACT,SAAS,cAAc,KAAK;AAAA,QAG7B;AAAA;AAAA,UACF,oBAAC,MAAM,WAAN,EAAgB,WAAY,cAAO,WAAY;AAAA;AAAA;AAAA,IACjD;AAAA,EAEF;AACD;",
6
+ "names": []
7
+ }
@@ -0,0 +1,32 @@
1
+ // packages/ui/src/tabs/panel.tsx
2
+ import { forwardRef } from "@wordpress/element";
3
+ import clsx from "clsx";
4
+ import { Tabs as _Tabs } from "@base-ui/react/tabs";
5
+
6
+ // packages/ui/src/tabs/style.module.css
7
+ if (typeof document !== "undefined" && !document.head.querySelector("style[data-wp-hash='e0ff4b2c02']")) {
8
+ const style = document.createElement("style");
9
+ style.setAttribute("data-wp-hash", "e0ff4b2c02");
10
+ style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._7313adbc8a112e90__tablist{--direction-factor:1;--direction-start:left;--direction-end:right;align-items:stretch;display:flex;overflow-inline:auto;overscroll-behavior-inline:none;position:relative;&:dir(rtl){--direction-factor:-1;--direction-start:right;--direction-end:left}&[data-orientation=horizontal]{--fade-width:4rem;--fade-gradient-base:#0000 0%,#000 var(--fade-width);--fade-gradient-composed:var(--fade-gradient-base),#000 60%,#0000 50%;width:fit-content;&._9f2ac729c68a735a__is-overflowing-first{mask-image:linear-gradient(to var(--direction-end),var(--fade-gradient-base))}&._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to var(--direction-start),var(--fade-gradient-base))}&._9f2ac729c68a735a__is-overflowing-first._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to right,var(--fade-gradient-composed)),linear-gradient(to left,var(--fade-gradient-composed))}&._59228b5227f38a99__is-minimal-variant{gap:1rem}}&[data-orientation=vertical]{flex-direction:column}}._1c37dcfaa1ad8cda__indicator{@media not (prefers-reduced-motion){transition-duration:.2s;transition-property:translate,width,height,border-radius,border-block;transition-timing-function:ease-out}outline:2px solid #0000;outline-offset:-1px;pointer-events:none;position:absolute;&[data-orientation=horizontal]{background-color:var(--wpds-color-stroke-interactive-neutral-strong);bottom:0;height:var(--wpds-border-width-focus);left:0;translate:var(--active-tab-left) 0;width:var(--active-tab-width);z-index:1}&[data-orientation=vertical]{background-color:var(--wpds-color-bg-interactive-neutral-weak-active);border-radius:var(--wpds-border-radius-sm);height:var(--active-tab-height);left:50%;top:0;translate:-50% var(--active-tab-top);width:100%;z-index:0}._7313adbc8a112e90__tablist[data-select-on-move=true]:has(:focus-visible)\n &[data-orientation=vertical]{border:var(--wpds-border-width-focus) solid var(--wpds-color-stroke-focus-brand);box-sizing:border-box}}.a5fd8814f195aa5e__tab{align-items:center;background:#0000;border:none;border-radius:0;box-shadow:none;color:var(--wpds-color-fg-interactive-neutral);cursor:pointer;display:flex;flex:1 0 auto;font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-md);font-weight:400;line-height:1.2;outline:none;padding:0;position:relative;white-space:nowrap;z-index:1;&[data-disabled]{color:var(--wpds-color-fg-interactive-neutral-disabled);cursor:default;@media (forced-colors:active){color:GrayText}}&:not([data-disabled]):is(:hover,:focus-visible){color:var(--wpds-color-fg-interactive-neutral-active)}&:after{border-radius:var(--wpds-border-radius-sm);opacity:0;outline:var(--wpds-border-width-focus) solid var(--wpds-color-stroke-focus-brand);pointer-events:none;position:absolute;z-index:-1;@media not (prefers-reduced-motion){transition:opacity .1s linear}}&:focus-visible:after{opacity:1}[data-orientation=horizontal] &{height:48px;padding-inline:var(--wpds-dimension-padding-lg);scroll-margin:24px;&:after{content:"";inset:var(--wpds-dimension-padding-md)}}._59228b5227f38a99__is-minimal-variant[data-orientation=horizontal] &{padding-inline:0;&:after{inset-inline:round(up,var(--wpds-border-width-focus),1px)}}[data-orientation=vertical] &{min-height:40px;padding:var(--wpds-dimension-padding-sm) var(--wpds-dimension-padding-md)}[data-orientation=vertical][data-select-on-move=false] &:after{content:"";inset:var(--wpds-border-width-focus)}}._5dfc77e6edd345d4__tab-children{align-items:center;display:flex;flex-grow:1;[data-orientation=horizontal] &{justify-content:center}[data-orientation=vertical] &{justify-content:start}}._4a20e969d15e5ac1__tab-chevron{flex-shrink:0;margin-inline-end:calc(var(--wpds-dimension-gap-xs)*-1);opacity:0;[data-orientation=horizontal] &{display:none}[role=tab]:is([aria-selected=true],:focus-visible,:hover) &{opacity:1}@media not (prefers-reduced-motion){[data-select-on-move=true]\n [role=tab]:is([aria-selected=true])\n &{transition:opacity .15s linear .15s}}&:dir(rtl){rotate:180deg}}._49f4bf715948892a__tabpanel{&:focus{box-shadow:none;outline:none}&:focus-visible{box-shadow:0 0 0 var(--wpds-border-width-focus) var(--wpds-color-stroke-focus-brand);outline:2px solid #0000;outline-offset:0}}}'));
11
+ document.head.appendChild(style);
12
+ }
13
+ var style_default = { "tablist": "_7313adbc8a112e90__tablist", "is-overflowing-first": "_9f2ac729c68a735a__is-overflowing-first", "is-overflowing-last": "_81c799c1f3cdd261__is-overflowing-last", "is-minimal-variant": "_59228b5227f38a99__is-minimal-variant", "indicator": "_1c37dcfaa1ad8cda__indicator", "tab": "a5fd8814f195aa5e__tab", "tab-children": "_5dfc77e6edd345d4__tab-children", "tab-chevron": "_4a20e969d15e5ac1__tab-chevron", "tabpanel": "_49f4bf715948892a__tabpanel" };
14
+
15
+ // packages/ui/src/tabs/panel.tsx
16
+ import { jsx } from "react/jsx-runtime";
17
+ var Panel = forwardRef(
18
+ function TabPanel({ className, ...otherProps }, forwardedRef) {
19
+ return /* @__PURE__ */ jsx(
20
+ _Tabs.Panel,
21
+ {
22
+ ref: forwardedRef,
23
+ className: clsx(style_default.tabpanel, className),
24
+ ...otherProps
25
+ }
26
+ );
27
+ }
28
+ );
29
+ export {
30
+ Panel
31
+ };
32
+ //# sourceMappingURL=panel.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/tabs/panel.tsx", "../../src/tabs/style.module.css"],
4
+ "sourcesContent": ["import { forwardRef } from '@wordpress/element';\nimport clsx from 'clsx';\nimport { Tabs as _Tabs } from '@base-ui/react/tabs';\nimport styles from './style.module.css';\nimport type { TabPanelProps } from './types';\n\n/**\n * A panel displayed when the corresponding tab is active.\n *\n * `Tabs` is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n */\nexport const Panel = forwardRef< HTMLDivElement, TabPanelProps >(\n\tfunction TabPanel( { className, ...otherProps }, forwardedRef ) {\n\t\treturn (\n\t\t\t<_Tabs.Panel\n\t\t\t\tref={ forwardedRef }\n\t\t\t\tclassName={ clsx( styles.tabpanel, className ) }\n\t\t\t\t{ ...otherProps }\n\t\t\t/>\n\t\t);\n\t}\n);\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='e0ff4b2c02']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"e0ff4b2c02\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._7313adbc8a112e90__tablist{--direction-factor:1;--direction-start:left;--direction-end:right;align-items:stretch;display:flex;overflow-inline:auto;overscroll-behavior-inline:none;position:relative;&:dir(rtl){--direction-factor:-1;--direction-start:right;--direction-end:left}&[data-orientation=horizontal]{--fade-width:4rem;--fade-gradient-base:#0000 0%,#000 var(--fade-width);--fade-gradient-composed:var(--fade-gradient-base),#000 60%,#0000 50%;width:fit-content;&._9f2ac729c68a735a__is-overflowing-first{mask-image:linear-gradient(to var(--direction-end),var(--fade-gradient-base))}&._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to var(--direction-start),var(--fade-gradient-base))}&._9f2ac729c68a735a__is-overflowing-first._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to right,var(--fade-gradient-composed)),linear-gradient(to left,var(--fade-gradient-composed))}&._59228b5227f38a99__is-minimal-variant{gap:1rem}}&[data-orientation=vertical]{flex-direction:column}}._1c37dcfaa1ad8cda__indicator{@media not (prefers-reduced-motion){transition-duration:.2s;transition-property:translate,width,height,border-radius,border-block;transition-timing-function:ease-out}outline:2px solid #0000;outline-offset:-1px;pointer-events:none;position:absolute;&[data-orientation=horizontal]{background-color:var(--wpds-color-stroke-interactive-neutral-strong);bottom:0;height:var(--wpds-border-width-focus);left:0;translate:var(--active-tab-left) 0;width:var(--active-tab-width);z-index:1}&[data-orientation=vertical]{background-color:var(--wpds-color-bg-interactive-neutral-weak-active);border-radius:var(--wpds-border-radius-sm);height:var(--active-tab-height);left:50%;top:0;translate:-50% var(--active-tab-top);width:100%;z-index:0}._7313adbc8a112e90__tablist[data-select-on-move=true]:has(:focus-visible)\\n\\t\\t&[data-orientation=vertical]{border:var(--wpds-border-width-focus) solid var(--wpds-color-stroke-focus-brand);box-sizing:border-box}}.a5fd8814f195aa5e__tab{align-items:center;background:#0000;border:none;border-radius:0;box-shadow:none;color:var(--wpds-color-fg-interactive-neutral);cursor:pointer;display:flex;flex:1 0 auto;font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-md);font-weight:400;line-height:1.2;outline:none;padding:0;position:relative;white-space:nowrap;z-index:1;&[data-disabled]{color:var(--wpds-color-fg-interactive-neutral-disabled);cursor:default;@media (forced-colors:active){color:GrayText}}&:not([data-disabled]):is(:hover,:focus-visible){color:var(--wpds-color-fg-interactive-neutral-active)}&:after{border-radius:var(--wpds-border-radius-sm);opacity:0;outline:var(--wpds-border-width-focus) solid var(--wpds-color-stroke-focus-brand);pointer-events:none;position:absolute;z-index:-1;@media not (prefers-reduced-motion){transition:opacity .1s linear}}&:focus-visible:after{opacity:1}[data-orientation=horizontal] &{height:48px;padding-inline:var(--wpds-dimension-padding-lg);scroll-margin:24px;&:after{content:\\\"\\\";inset:var(--wpds-dimension-padding-md)}}._59228b5227f38a99__is-minimal-variant[data-orientation=horizontal] &{padding-inline:0;&:after{inset-inline:round(up,var(--wpds-border-width-focus),1px)}}[data-orientation=vertical] &{min-height:40px;padding:var(--wpds-dimension-padding-sm) var(--wpds-dimension-padding-md)}[data-orientation=vertical][data-select-on-move=false] &:after{content:\\\"\\\";inset:var(--wpds-border-width-focus)}}._5dfc77e6edd345d4__tab-children{align-items:center;display:flex;flex-grow:1;[data-orientation=horizontal] &{justify-content:center}[data-orientation=vertical] &{justify-content:start}}._4a20e969d15e5ac1__tab-chevron{flex-shrink:0;margin-inline-end:calc(var(--wpds-dimension-gap-xs)*-1);opacity:0;[data-orientation=horizontal] &{display:none}[role=tab]:is([aria-selected=true],:focus-visible,:hover) &{opacity:1}@media not (prefers-reduced-motion){[data-select-on-move=true]\\n\\t\\t\\t[role=tab]:is([aria-selected=true])\\n\\t\\t\\t&{transition:opacity .15s linear .15s}}&:dir(rtl){rotate:180deg}}._49f4bf715948892a__tabpanel{&:focus{box-shadow:none;outline:none}&:focus-visible{box-shadow:0 0 0 var(--wpds-border-width-focus) var(--wpds-color-stroke-focus-brand);outline:2px solid #0000;outline-offset:0}}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"tablist\":\"_7313adbc8a112e90__tablist\",\"is-overflowing-first\":\"_9f2ac729c68a735a__is-overflowing-first\",\"is-overflowing-last\":\"_81c799c1f3cdd261__is-overflowing-last\",\"is-minimal-variant\":\"_59228b5227f38a99__is-minimal-variant\",\"indicator\":\"_1c37dcfaa1ad8cda__indicator\",\"tab\":\"a5fd8814f195aa5e__tab\",\"tab-children\":\"_5dfc77e6edd345d4__tab-children\",\"tab-chevron\":\"_4a20e969d15e5ac1__tab-chevron\",\"tabpanel\":\"_49f4bf715948892a__tabpanel\"};\n"],
5
+ "mappings": ";AAAA,SAAS,kBAAkB;AAC3B,OAAO,UAAU;AACjB,SAAS,QAAQ,aAAa;;;ACF9B,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,wuIAAovI,CAAC;AAC/xI,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,WAAU,8BAA6B,wBAAuB,2CAA0C,uBAAsB,0CAAyC,sBAAqB,yCAAwC,aAAY,gCAA+B,OAAM,yBAAwB,gBAAe,mCAAkC,eAAc,kCAAiC,YAAW,8BAA6B;;;ADSlc;AAHI,IAAM,QAAQ;AAAA,EACpB,SAAS,SAAU,EAAE,WAAW,GAAG,WAAW,GAAG,cAAe;AAC/D,WACC;AAAA,MAAC,MAAM;AAAA,MAAN;AAAA,QACA,KAAM;AAAA,QACN,WAAY,KAAM,cAAO,UAAU,SAAU;AAAA,QAC3C,GAAG;AAAA;AAAA,IACN;AAAA,EAEF;AACD;",
6
+ "names": []
7
+ }
@@ -0,0 +1,13 @@
1
+ // packages/ui/src/tabs/root.tsx
2
+ import { forwardRef } from "@wordpress/element";
3
+ import { Tabs as _Tabs } from "@base-ui/react/tabs";
4
+ import { jsx } from "react/jsx-runtime";
5
+ var Root = forwardRef(
6
+ function TabsRoot({ ...otherProps }, forwardedRef) {
7
+ return /* @__PURE__ */ jsx(_Tabs.Root, { ref: forwardedRef, ...otherProps });
8
+ }
9
+ );
10
+ export {
11
+ Root
12
+ };
13
+ //# sourceMappingURL=root.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/tabs/root.tsx"],
4
+ "sourcesContent": ["import { forwardRef } from '@wordpress/element';\nimport { Tabs as _Tabs } from '@base-ui/react/tabs';\nimport type { TabRootProps } from './types';\n\n/**\n * Groups the tabs and the corresponding panels.\n *\n * `Tabs` is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n */\nexport const Root = forwardRef< HTMLDivElement, TabRootProps >(\n\tfunction TabsRoot( { ...otherProps }, forwardedRef ) {\n\t\treturn <_Tabs.Root ref={ forwardedRef } { ...otherProps } />;\n\t}\n);\n"],
5
+ "mappings": ";AAAA,SAAS,kBAAkB;AAC3B,SAAS,QAAQ,aAAa;AAWrB;AAFF,IAAM,OAAO;AAAA,EACnB,SAAS,SAAU,EAAE,GAAG,WAAW,GAAG,cAAe;AACpD,WAAO,oBAAC,MAAM,MAAN,EAAW,KAAM,cAAiB,GAAG,YAAa;AAAA,EAC3D;AACD;",
6
+ "names": []
7
+ }
@@ -0,0 +1,36 @@
1
+ // packages/ui/src/tabs/tab.tsx
2
+ import { forwardRef } from "@wordpress/element";
3
+ import clsx from "clsx";
4
+ import { Tabs as _Tabs } from "@base-ui/react/tabs";
5
+ import { chevronRight } from "@wordpress/icons";
6
+ import { Icon } from "../icon/index.mjs";
7
+
8
+ // packages/ui/src/tabs/style.module.css
9
+ if (typeof document !== "undefined" && !document.head.querySelector("style[data-wp-hash='e0ff4b2c02']")) {
10
+ const style = document.createElement("style");
11
+ style.setAttribute("data-wp-hash", "e0ff4b2c02");
12
+ style.appendChild(document.createTextNode('@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._7313adbc8a112e90__tablist{--direction-factor:1;--direction-start:left;--direction-end:right;align-items:stretch;display:flex;overflow-inline:auto;overscroll-behavior-inline:none;position:relative;&:dir(rtl){--direction-factor:-1;--direction-start:right;--direction-end:left}&[data-orientation=horizontal]{--fade-width:4rem;--fade-gradient-base:#0000 0%,#000 var(--fade-width);--fade-gradient-composed:var(--fade-gradient-base),#000 60%,#0000 50%;width:fit-content;&._9f2ac729c68a735a__is-overflowing-first{mask-image:linear-gradient(to var(--direction-end),var(--fade-gradient-base))}&._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to var(--direction-start),var(--fade-gradient-base))}&._9f2ac729c68a735a__is-overflowing-first._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to right,var(--fade-gradient-composed)),linear-gradient(to left,var(--fade-gradient-composed))}&._59228b5227f38a99__is-minimal-variant{gap:1rem}}&[data-orientation=vertical]{flex-direction:column}}._1c37dcfaa1ad8cda__indicator{@media not (prefers-reduced-motion){transition-duration:.2s;transition-property:translate,width,height,border-radius,border-block;transition-timing-function:ease-out}outline:2px solid #0000;outline-offset:-1px;pointer-events:none;position:absolute;&[data-orientation=horizontal]{background-color:var(--wpds-color-stroke-interactive-neutral-strong);bottom:0;height:var(--wpds-border-width-focus);left:0;translate:var(--active-tab-left) 0;width:var(--active-tab-width);z-index:1}&[data-orientation=vertical]{background-color:var(--wpds-color-bg-interactive-neutral-weak-active);border-radius:var(--wpds-border-radius-sm);height:var(--active-tab-height);left:50%;top:0;translate:-50% var(--active-tab-top);width:100%;z-index:0}._7313adbc8a112e90__tablist[data-select-on-move=true]:has(:focus-visible)\n &[data-orientation=vertical]{border:var(--wpds-border-width-focus) solid var(--wpds-color-stroke-focus-brand);box-sizing:border-box}}.a5fd8814f195aa5e__tab{align-items:center;background:#0000;border:none;border-radius:0;box-shadow:none;color:var(--wpds-color-fg-interactive-neutral);cursor:pointer;display:flex;flex:1 0 auto;font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-md);font-weight:400;line-height:1.2;outline:none;padding:0;position:relative;white-space:nowrap;z-index:1;&[data-disabled]{color:var(--wpds-color-fg-interactive-neutral-disabled);cursor:default;@media (forced-colors:active){color:GrayText}}&:not([data-disabled]):is(:hover,:focus-visible){color:var(--wpds-color-fg-interactive-neutral-active)}&:after{border-radius:var(--wpds-border-radius-sm);opacity:0;outline:var(--wpds-border-width-focus) solid var(--wpds-color-stroke-focus-brand);pointer-events:none;position:absolute;z-index:-1;@media not (prefers-reduced-motion){transition:opacity .1s linear}}&:focus-visible:after{opacity:1}[data-orientation=horizontal] &{height:48px;padding-inline:var(--wpds-dimension-padding-lg);scroll-margin:24px;&:after{content:"";inset:var(--wpds-dimension-padding-md)}}._59228b5227f38a99__is-minimal-variant[data-orientation=horizontal] &{padding-inline:0;&:after{inset-inline:round(up,var(--wpds-border-width-focus),1px)}}[data-orientation=vertical] &{min-height:40px;padding:var(--wpds-dimension-padding-sm) var(--wpds-dimension-padding-md)}[data-orientation=vertical][data-select-on-move=false] &:after{content:"";inset:var(--wpds-border-width-focus)}}._5dfc77e6edd345d4__tab-children{align-items:center;display:flex;flex-grow:1;[data-orientation=horizontal] &{justify-content:center}[data-orientation=vertical] &{justify-content:start}}._4a20e969d15e5ac1__tab-chevron{flex-shrink:0;margin-inline-end:calc(var(--wpds-dimension-gap-xs)*-1);opacity:0;[data-orientation=horizontal] &{display:none}[role=tab]:is([aria-selected=true],:focus-visible,:hover) &{opacity:1}@media not (prefers-reduced-motion){[data-select-on-move=true]\n [role=tab]:is([aria-selected=true])\n &{transition:opacity .15s linear .15s}}&:dir(rtl){rotate:180deg}}._49f4bf715948892a__tabpanel{&:focus{box-shadow:none;outline:none}&:focus-visible{box-shadow:0 0 0 var(--wpds-border-width-focus) var(--wpds-color-stroke-focus-brand);outline:2px solid #0000;outline-offset:0}}}'));
13
+ document.head.appendChild(style);
14
+ }
15
+ var style_default = { "tablist": "_7313adbc8a112e90__tablist", "is-overflowing-first": "_9f2ac729c68a735a__is-overflowing-first", "is-overflowing-last": "_81c799c1f3cdd261__is-overflowing-last", "is-minimal-variant": "_59228b5227f38a99__is-minimal-variant", "indicator": "_1c37dcfaa1ad8cda__indicator", "tab": "a5fd8814f195aa5e__tab", "tab-children": "_5dfc77e6edd345d4__tab-children", "tab-chevron": "_4a20e969d15e5ac1__tab-chevron", "tabpanel": "_49f4bf715948892a__tabpanel" };
16
+
17
+ // packages/ui/src/tabs/tab.tsx
18
+ import { jsx, jsxs } from "react/jsx-runtime";
19
+ var Tab = forwardRef(function Tab2({ className, children, ...otherProps }, forwardedRef) {
20
+ return /* @__PURE__ */ jsxs(
21
+ _Tabs.Tab,
22
+ {
23
+ ref: forwardedRef,
24
+ className: clsx(style_default.tab, className),
25
+ ...otherProps,
26
+ children: [
27
+ /* @__PURE__ */ jsx("span", { className: style_default["tab-children"], children }),
28
+ /* @__PURE__ */ jsx(Icon, { icon: chevronRight, className: style_default["tab-chevron"] })
29
+ ]
30
+ }
31
+ );
32
+ });
33
+ export {
34
+ Tab
35
+ };
36
+ //# sourceMappingURL=tab.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/tabs/tab.tsx", "../../src/tabs/style.module.css"],
4
+ "sourcesContent": ["import { forwardRef } from '@wordpress/element';\nimport clsx from 'clsx';\nimport { Tabs as _Tabs } from '@base-ui/react/tabs';\nimport { chevronRight } from '@wordpress/icons';\nimport { Icon } from '../icon';\nimport styles from './style.module.css';\nimport type { TabProps } from './types';\n\n/**\n * An individual interactive tab button that toggles the corresponding panel.\n *\n * `Tabs` is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n */\nexport const Tab = forwardRef< HTMLButtonElement, TabProps >( function Tab(\n\t{ className, children, ...otherProps },\n\tforwardedRef\n) {\n\treturn (\n\t\t<_Tabs.Tab\n\t\t\tref={ forwardedRef }\n\t\t\tclassName={ clsx( styles.tab, className ) }\n\t\t\t{ ...otherProps }\n\t\t>\n\t\t\t<span className={ styles[ 'tab-children' ] }>{ children }</span>\n\t\t\t<Icon icon={ chevronRight } className={ styles[ 'tab-chevron' ] } />\n\t\t</_Tabs.Tab>\n\t);\n} );\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='e0ff4b2c02']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"e0ff4b2c02\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._7313adbc8a112e90__tablist{--direction-factor:1;--direction-start:left;--direction-end:right;align-items:stretch;display:flex;overflow-inline:auto;overscroll-behavior-inline:none;position:relative;&:dir(rtl){--direction-factor:-1;--direction-start:right;--direction-end:left}&[data-orientation=horizontal]{--fade-width:4rem;--fade-gradient-base:#0000 0%,#000 var(--fade-width);--fade-gradient-composed:var(--fade-gradient-base),#000 60%,#0000 50%;width:fit-content;&._9f2ac729c68a735a__is-overflowing-first{mask-image:linear-gradient(to var(--direction-end),var(--fade-gradient-base))}&._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to var(--direction-start),var(--fade-gradient-base))}&._9f2ac729c68a735a__is-overflowing-first._81c799c1f3cdd261__is-overflowing-last{mask-image:linear-gradient(to right,var(--fade-gradient-composed)),linear-gradient(to left,var(--fade-gradient-composed))}&._59228b5227f38a99__is-minimal-variant{gap:1rem}}&[data-orientation=vertical]{flex-direction:column}}._1c37dcfaa1ad8cda__indicator{@media not (prefers-reduced-motion){transition-duration:.2s;transition-property:translate,width,height,border-radius,border-block;transition-timing-function:ease-out}outline:2px solid #0000;outline-offset:-1px;pointer-events:none;position:absolute;&[data-orientation=horizontal]{background-color:var(--wpds-color-stroke-interactive-neutral-strong);bottom:0;height:var(--wpds-border-width-focus);left:0;translate:var(--active-tab-left) 0;width:var(--active-tab-width);z-index:1}&[data-orientation=vertical]{background-color:var(--wpds-color-bg-interactive-neutral-weak-active);border-radius:var(--wpds-border-radius-sm);height:var(--active-tab-height);left:50%;top:0;translate:-50% var(--active-tab-top);width:100%;z-index:0}._7313adbc8a112e90__tablist[data-select-on-move=true]:has(:focus-visible)\\n\\t\\t&[data-orientation=vertical]{border:var(--wpds-border-width-focus) solid var(--wpds-color-stroke-focus-brand);box-sizing:border-box}}.a5fd8814f195aa5e__tab{align-items:center;background:#0000;border:none;border-radius:0;box-shadow:none;color:var(--wpds-color-fg-interactive-neutral);cursor:pointer;display:flex;flex:1 0 auto;font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-md);font-weight:400;line-height:1.2;outline:none;padding:0;position:relative;white-space:nowrap;z-index:1;&[data-disabled]{color:var(--wpds-color-fg-interactive-neutral-disabled);cursor:default;@media (forced-colors:active){color:GrayText}}&:not([data-disabled]):is(:hover,:focus-visible){color:var(--wpds-color-fg-interactive-neutral-active)}&:after{border-radius:var(--wpds-border-radius-sm);opacity:0;outline:var(--wpds-border-width-focus) solid var(--wpds-color-stroke-focus-brand);pointer-events:none;position:absolute;z-index:-1;@media not (prefers-reduced-motion){transition:opacity .1s linear}}&:focus-visible:after{opacity:1}[data-orientation=horizontal] &{height:48px;padding-inline:var(--wpds-dimension-padding-lg);scroll-margin:24px;&:after{content:\\\"\\\";inset:var(--wpds-dimension-padding-md)}}._59228b5227f38a99__is-minimal-variant[data-orientation=horizontal] &{padding-inline:0;&:after{inset-inline:round(up,var(--wpds-border-width-focus),1px)}}[data-orientation=vertical] &{min-height:40px;padding:var(--wpds-dimension-padding-sm) var(--wpds-dimension-padding-md)}[data-orientation=vertical][data-select-on-move=false] &:after{content:\\\"\\\";inset:var(--wpds-border-width-focus)}}._5dfc77e6edd345d4__tab-children{align-items:center;display:flex;flex-grow:1;[data-orientation=horizontal] &{justify-content:center}[data-orientation=vertical] &{justify-content:start}}._4a20e969d15e5ac1__tab-chevron{flex-shrink:0;margin-inline-end:calc(var(--wpds-dimension-gap-xs)*-1);opacity:0;[data-orientation=horizontal] &{display:none}[role=tab]:is([aria-selected=true],:focus-visible,:hover) &{opacity:1}@media not (prefers-reduced-motion){[data-select-on-move=true]\\n\\t\\t\\t[role=tab]:is([aria-selected=true])\\n\\t\\t\\t&{transition:opacity .15s linear .15s}}&:dir(rtl){rotate:180deg}}._49f4bf715948892a__tabpanel{&:focus{box-shadow:none;outline:none}&:focus-visible{box-shadow:0 0 0 var(--wpds-border-width-focus) var(--wpds-color-stroke-focus-brand);outline:2px solid #0000;outline-offset:0}}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"tablist\":\"_7313adbc8a112e90__tablist\",\"is-overflowing-first\":\"_9f2ac729c68a735a__is-overflowing-first\",\"is-overflowing-last\":\"_81c799c1f3cdd261__is-overflowing-last\",\"is-minimal-variant\":\"_59228b5227f38a99__is-minimal-variant\",\"indicator\":\"_1c37dcfaa1ad8cda__indicator\",\"tab\":\"a5fd8814f195aa5e__tab\",\"tab-children\":\"_5dfc77e6edd345d4__tab-children\",\"tab-chevron\":\"_4a20e969d15e5ac1__tab-chevron\",\"tabpanel\":\"_49f4bf715948892a__tabpanel\"};\n"],
5
+ "mappings": ";AAAA,SAAS,kBAAkB;AAC3B,OAAO,UAAU;AACjB,SAAS,QAAQ,aAAa;AAC9B,SAAS,oBAAoB;AAC7B,SAAS,YAAY;;;ACJrB,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,wuIAAovI,CAAC;AAC/xI,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,WAAU,8BAA6B,wBAAuB,2CAA0C,uBAAsB,0CAAyC,sBAAqB,yCAAwC,aAAY,gCAA+B,OAAM,yBAAwB,gBAAe,mCAAkC,eAAc,kCAAiC,YAAW,8BAA6B;;;ADanc,SAKC,KALD;AALK,IAAM,MAAM,WAA2C,SAASA,KACtE,EAAE,WAAW,UAAU,GAAG,WAAW,GACrC,cACC;AACD,SACC;AAAA,IAAC,MAAM;AAAA,IAAN;AAAA,MACA,KAAM;AAAA,MACN,WAAY,KAAM,cAAO,KAAK,SAAU;AAAA,MACtC,GAAG;AAAA,MAEL;AAAA,4BAAC,UAAK,WAAY,cAAQ,cAAe,GAAM,UAAU;AAAA,QACzD,oBAAC,QAAK,MAAO,cAAe,WAAY,cAAQ,aAAc,GAAI;AAAA;AAAA;AAAA,EACnE;AAEF,CAAE;",
6
+ "names": ["Tab"]
7
+ }
@@ -0,0 +1 @@
1
+ //# sourceMappingURL=types.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": [],
4
+ "sourcesContent": [],
5
+ "mappings": "",
6
+ "names": []
7
+ }
@@ -17,10 +17,10 @@ if (typeof document !== "undefined" && !document.head.querySelector("style[data-
17
17
  var resets_default = { "box-sizing": "_336cd3e4e743482f__box-sizing" };
18
18
 
19
19
  // packages/ui/src/tooltip/style.module.css
20
- if (typeof document !== "undefined" && !document.head.querySelector("style[data-wp-hash='6a5779ba18']")) {
20
+ if (typeof document !== "undefined" && !document.head.querySelector("style[data-wp-hash='7fd277f3a7']")) {
21
21
  const style = document.createElement("style");
22
- style.setAttribute("data-wp-hash", "6a5779ba18");
23
- style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._480b748dd3510e64__positioner{z-index:var(--wp-ui-tooltip-z-index,initial)}._50096b232db7709d__popup{background-color:var(--wpds-color-bg-surface-neutral-strong);border-radius:var(--wpds-border-radius-sm);box-shadow:var(--wpds-elevation-small);color:var(--wpds-color-fg-content-neutral);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-sm);line-height:1.4;padding:var(--wpds-dimension-padding-surface-2xs) var(--wpds-dimension-padding-surface-xs)}}"));
22
+ style.setAttribute("data-wp-hash", "7fd277f3a7");
23
+ style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._480b748dd3510e64__positioner{z-index:var(--wp-ui-tooltip-z-index,initial)}._50096b232db7709d__popup{background-color:var(--wpds-color-bg-surface-neutral-strong);border-radius:var(--wpds-border-radius-sm);box-shadow:var(--wpds-elevation-sm);color:var(--wpds-color-fg-content-neutral);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-sm);line-height:1.4;padding:var(--wpds-dimension-padding-xs) var(--wpds-dimension-padding-sm)}}"));
24
24
  document.head.appendChild(style);
25
25
  }
26
26
  var style_default = { "positioner": "_480b748dd3510e64__positioner", "popup": "_50096b232db7709d__popup" };
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/tooltip/popup.tsx", "../../src/utils/css/resets.module.css", "../../src/tooltip/style.module.css"],
4
- "sourcesContent": ["import clsx from 'clsx';\nimport { Tooltip } from '@base-ui/react/tooltip';\nimport { forwardRef } from '@wordpress/element';\nimport {\n\ttype ThemeProvider as ThemeProviderType,\n\tprivateApis as themePrivateApis,\n} from '@wordpress/theme';\nimport type { PopupProps } from './types';\nimport { unlock } from '../lock-unlock';\nimport resetStyles from '../utils/css/resets.module.css';\nimport styles from './style.module.css';\n\nconst ThemeProvider: typeof ThemeProviderType =\n\tunlock( themePrivateApis ).ThemeProvider;\n\nconst Popup = forwardRef< HTMLDivElement, PopupProps >( function TooltipPopup(\n\t{\n\t\talign = 'center',\n\t\tside = 'bottom',\n\t\tsideOffset = 4,\n\t\tchildren,\n\t\tclassName,\n\t\tstyle,\n\t\t...props\n\t},\n\tref\n) {\n\treturn (\n\t\t<Tooltip.Portal>\n\t\t\t<Tooltip.Positioner\n\t\t\t\talign={ align }\n\t\t\t\tside={ side }\n\t\t\t\tsideOffset={ sideOffset }\n\t\t\t\tstyle={ style }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tresetStyles[ 'box-sizing' ],\n\t\t\t\t\tclassName,\n\t\t\t\t\tstyles.positioner\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t{ /* This should ideally use whatever dark color makes sense,\n\t\t\t\tand not be hardcoded to #1e1e1e. The solutions would be to:\n\t\t\t\t - review the design of the tooltip, in case we want to stop\n\t\t\t\t hardcoding it to a dark background\n\t\t\t\t - create new semantic tokens as needed (aliasing either the \"inverted\n\t\t\t\t\t bg\" or \"perma-dark bg\" private tokens) and have Tooltip.Popup use\n\t\t\t\t them;\n\t\t\t\t - remove the hardcoded `bg` setting from the `ThemeProvider` below\n\t\t\t\t\t*/ }\n\t\t\t\t<ThemeProvider color={ { bg: '#1e1e1e' } }>\n\t\t\t\t\t<Tooltip.Popup\n\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\tclassName={ styles.popup }\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</Tooltip.Popup>\n\t\t\t\t</ThemeProvider>\n\t\t\t</Tooltip.Positioner>\n\t\t</Tooltip.Portal>\n\t);\n} );\n\nexport { Popup };\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='671ebfc62d']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"671ebfc62d\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._336cd3e4e743482f__box-sizing{box-sizing:border-box;*,:after,:before{box-sizing:inherit}}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"box-sizing\":\"_336cd3e4e743482f__box-sizing\"};\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='6a5779ba18']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"6a5779ba18\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._480b748dd3510e64__positioner{z-index:var(--wp-ui-tooltip-z-index,initial)}._50096b232db7709d__popup{background-color:var(--wpds-color-bg-surface-neutral-strong);border-radius:var(--wpds-border-radius-sm);box-shadow:var(--wpds-elevation-small);color:var(--wpds-color-fg-content-neutral);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-sm);line-height:1.4;padding:var(--wpds-dimension-padding-surface-2xs) var(--wpds-dimension-padding-surface-xs)}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"positioner\":\"_480b748dd3510e64__positioner\",\"popup\":\"_50096b232db7709d__popup\"};\n"],
5
- "mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,eAAe;AACxB,SAAS,kBAAkB;AAC3B;AAAA,EAEC,eAAe;AAAA,OACT;AAEP,SAAS,cAAc;;;ACRvB,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,kMAAkM,CAAC;AAC7O,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,iBAAQ,EAAC,cAAa,gCAA+B;;;ACN5D,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,gkBAAgkB,CAAC;AAC3mB,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,cAAa,iCAAgC,SAAQ,2BAA0B;;;AF4C1F;AAtCL,IAAM,gBACL,OAAQ,gBAAiB,EAAE;AAE5B,IAAM,QAAQ,WAA0C,SAAS,aAChE;AAAA,EACC,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACJ,GACA,KACC;AACD,SACC,oBAAC,QAAQ,QAAR,EACA;AAAA,IAAC,QAAQ;AAAA,IAAR;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAY;AAAA,QACX,eAAa,YAAa;AAAA,QAC1B;AAAA,QACA,cAAO;AAAA,MACR;AAAA,MAWA,8BAAC,iBAAc,OAAQ,EAAE,IAAI,UAAU,GACtC;AAAA,QAAC,QAAQ;AAAA,QAAR;AAAA,UACA;AAAA,UACA,WAAY,cAAO;AAAA,UACjB,GAAG;AAAA,UAEH;AAAA;AAAA,MACH,GACD;AAAA;AAAA,EACD,GACD;AAEF,CAAE;",
4
+ "sourcesContent": ["import clsx from 'clsx';\nimport { Tooltip } from '@base-ui/react/tooltip';\nimport { forwardRef } from '@wordpress/element';\nimport {\n\ttype ThemeProvider as ThemeProviderType,\n\tprivateApis as themePrivateApis,\n} from '@wordpress/theme';\nimport type { PopupProps } from './types';\nimport { unlock } from '../lock-unlock';\nimport resetStyles from '../utils/css/resets.module.css';\nimport styles from './style.module.css';\n\nconst ThemeProvider: typeof ThemeProviderType =\n\tunlock( themePrivateApis ).ThemeProvider;\n\nconst Popup = forwardRef< HTMLDivElement, PopupProps >( function TooltipPopup(\n\t{\n\t\talign = 'center',\n\t\tside = 'bottom',\n\t\tsideOffset = 4,\n\t\tchildren,\n\t\tclassName,\n\t\tstyle,\n\t\t...props\n\t},\n\tref\n) {\n\treturn (\n\t\t<Tooltip.Portal>\n\t\t\t<Tooltip.Positioner\n\t\t\t\talign={ align }\n\t\t\t\tside={ side }\n\t\t\t\tsideOffset={ sideOffset }\n\t\t\t\tstyle={ style }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tresetStyles[ 'box-sizing' ],\n\t\t\t\t\tclassName,\n\t\t\t\t\tstyles.positioner\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t{ /* This should ideally use whatever dark color makes sense,\n\t\t\t\tand not be hardcoded to #1e1e1e. The solutions would be to:\n\t\t\t\t - review the design of the tooltip, in case we want to stop\n\t\t\t\t hardcoding it to a dark background\n\t\t\t\t - create new semantic tokens as needed (aliasing either the \"inverted\n\t\t\t\t\t bg\" or \"perma-dark bg\" private tokens) and have Tooltip.Popup use\n\t\t\t\t them;\n\t\t\t\t - remove the hardcoded `bg` setting from the `ThemeProvider` below\n\t\t\t\t\t*/ }\n\t\t\t\t<ThemeProvider color={ { bg: '#1e1e1e' } }>\n\t\t\t\t\t<Tooltip.Popup\n\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\tclassName={ styles.popup }\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</Tooltip.Popup>\n\t\t\t\t</ThemeProvider>\n\t\t\t</Tooltip.Positioner>\n\t\t</Tooltip.Portal>\n\t);\n} );\n\nexport { Popup };\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='671ebfc62d']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"671ebfc62d\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._336cd3e4e743482f__box-sizing{box-sizing:border-box;*,:after,:before{box-sizing:inherit}}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"box-sizing\":\"_336cd3e4e743482f__box-sizing\"};\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='7fd277f3a7']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"7fd277f3a7\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._480b748dd3510e64__positioner{z-index:var(--wp-ui-tooltip-z-index,initial)}._50096b232db7709d__popup{background-color:var(--wpds-color-bg-surface-neutral-strong);border-radius:var(--wpds-border-radius-sm);box-shadow:var(--wpds-elevation-sm);color:var(--wpds-color-fg-content-neutral);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-sm);line-height:1.4;padding:var(--wpds-dimension-padding-xs) var(--wpds-dimension-padding-sm)}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"positioner\":\"_480b748dd3510e64__positioner\",\"popup\":\"_50096b232db7709d__popup\"};\n"],
5
+ "mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,eAAe;AACxB,SAAS,kBAAkB;AAC3B;AAAA,EAEC,eAAe;AAAA,OACT;AAEP,SAAS,cAAc;;;ACRvB,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,kMAAkM,CAAC;AAC7O,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,iBAAQ,EAAC,cAAa,gCAA+B;;;ACN5D,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,4iBAA4iB,CAAC;AACvlB,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,cAAa,iCAAgC,SAAQ,2BAA0B;;;AF4C1F;AAtCL,IAAM,gBACL,OAAQ,gBAAiB,EAAE;AAE5B,IAAM,QAAQ,WAA0C,SAAS,aAChE;AAAA,EACC,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACJ,GACA,KACC;AACD,SACC,oBAAC,QAAQ,QAAR,EACA;AAAA,IAAC,QAAQ;AAAA,IAAR;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAY;AAAA,QACX,eAAa,YAAa;AAAA,QAC1B;AAAA,QACA,cAAO;AAAA,MACR;AAAA,MAWA,8BAAC,iBAAc,OAAQ,EAAE,IAAI,UAAU,GACtC;AAAA,QAAC,QAAQ;AAAA,QAAR;AAAA,UACA;AAAA,UACA,WAAY,cAAO;AAAA,UACjB,GAAG;AAAA,UAEH;AAAA;AAAA,MACH,GACD;AAAA;AAAA,EACD,GACD;AAEF,CAAE;",
6
6
  "names": []
7
7
  }
@@ -1,7 +1,6 @@
1
1
  import { type BadgeProps } from './types';
2
2
  /**
3
3
  * A badge component for displaying labels with semantic intent.
4
- * Built on the Box primitive for consistent theming and accessibility.
5
4
  */
6
- export declare const Badge: import("react").ForwardRefExoticComponent<BadgeProps & import("react").RefAttributes<HTMLDivElement>>;
5
+ export declare const Badge: import("react").ForwardRefExoticComponent<BadgeProps & import("react").RefAttributes<HTMLSpanElement>>;
7
6
  //# sourceMappingURL=badge.d.ts.map
@@ -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;AAwD1C;;;GAGG;AACH,eAAO,MAAM,KAAK,uGAwBf,CAAC"}
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"}
@@ -16,8 +16,7 @@ export declare const WithIcon: Story;
16
16
  export declare const Loading: Story;
17
17
  /**
18
18
  * The pressed state is only available for buttons with `tone="neutral"` and
19
- * `variant="minimal"`. This represents a toggle button that is currently in an
20
- * active/pressed state.
19
+ * `variant="minimal"` and can be toggled via the `aria-pressed` HTML attribute.
21
20
  */
22
21
  export declare const Pressed: Story;
23
22
  //# sourceMappingURL=index.story.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/button/stories/index.story.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,MAAM,CAQ9B,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,MAAM,CAAE,CAAC;AAEvC,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAO5B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KA6DjC,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAWtB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAOrB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,OAAO,EAAE,KAoBrB,CAAC"}
1
+ {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/button/stories/index.story.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,MAAM,CAQ9B,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,MAAM,CAAE,CAAC;AAEvC,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAO5B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KA6DjC,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAWtB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAOrB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAC"}
@@ -0,0 +1,8 @@
1
+ import type { ActionProps } from './types';
2
+ /**
3
+ * Renders a button that closes the dialog when clicked.
4
+ * Accepts all Button component props for styling.
5
+ */
6
+ declare const Action: import("react").ForwardRefExoticComponent<ActionProps & import("react").RefAttributes<HTMLButtonElement>>;
7
+ export { Action };
8
+ //# sourceMappingURL=action.d.ts.map
@@ -0,0 +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"}
@@ -0,0 +1,8 @@
1
+ import type { CloseIconProps } from './types';
2
+ /**
3
+ * Renders an icon button that closes the dialog when clicked.
4
+ * Provides a default close icon and accessible label.
5
+ */
6
+ declare const CloseIcon: import("react").ForwardRefExoticComponent<CloseIconProps & import("react").RefAttributes<HTMLButtonElement>>;
7
+ export { CloseIcon };
8
+ //# sourceMappingURL=close-icon.d.ts.map
@@ -0,0 +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"}
@@ -0,0 +1,25 @@
1
+ type DialogValidationContextType = {
2
+ registerTitle: (element: HTMLElement | null) => void;
3
+ };
4
+ /**
5
+ * Development-only hook to access the dialog validation context.
6
+ */
7
+ declare function useDialogValidationContextDev(): DialogValidationContextType | null;
8
+ /**
9
+ * Hook to access the dialog validation context.
10
+ * Returns null in production or if not within a Dialog.Popup.
11
+ */
12
+ export declare const useDialogValidationContext: typeof useDialogValidationContextDev;
13
+ /**
14
+ * Development-only provider that tracks whether Dialog.Title is rendered.
15
+ */
16
+ declare function DialogValidationProviderDev({ children, }: {
17
+ children: React.ReactNode;
18
+ }): import("react").JSX.Element;
19
+ /**
20
+ * Provider component that validates Dialog.Title presence in development mode.
21
+ * In production, this component is a no-op and just renders children.
22
+ */
23
+ export declare const DialogValidationProvider: typeof DialogValidationProviderDev;
24
+ export {};
25
+ //# sourceMappingURL=context.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../src/dialog/context.tsx"],"names":[],"mappings":"AAeA,KAAK,2BAA2B,GAAG;IAClC,aAAa,EAAE,CAAE,OAAO,EAAE,WAAW,GAAG,IAAI,KAAM,IAAI,CAAC;CACvD,CAAC;AAOF;;GAEG;AACH,iBAAS,6BAA6B,uCAErC;AASD;;;GAGG;AACH,eAAO,MAAM,0BAA0B,sCAEN,CAAC;AAElC;;GAEG;AACH,iBAAS,2BAA2B,CAAE,EACrC,QAAQ,GACR,EAAE;IACF,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B,+BAwCA;AAaD;;;GAGG;AACH,eAAO,MAAM,wBAAwB,oCAEN,CAAC"}
@@ -0,0 +1,8 @@
1
+ import type { FooterProps } from './types';
2
+ /**
3
+ * Renders the footer section of the dialog, typically containing
4
+ * action buttons.
5
+ */
6
+ declare const Footer: import("react").ForwardRefExoticComponent<FooterProps & import("react").RefAttributes<HTMLDivElement>>;
7
+ export { Footer };
8
+ //# sourceMappingURL=footer.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"footer.d.ts","sourceRoot":"","sources":["../../src/dialog/footer.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C;;;GAGG;AACH,QAAA,MAAM,MAAM,wGAaT,CAAC;AAEJ,OAAO,EAAE,MAAM,EAAE,CAAC"}
@@ -0,0 +1,8 @@
1
+ import type { HeaderProps } from './types';
2
+ /**
3
+ * Renders the header section of the dialog, typically containing
4
+ * the heading and close button.
5
+ */
6
+ declare const Header: import("react").ForwardRefExoticComponent<HeaderProps & import("react").RefAttributes<HTMLDivElement>>;
7
+ export { Header };
8
+ //# sourceMappingURL=header.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../src/dialog/header.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C;;;GAGG;AACH,QAAA,MAAM,MAAM,wGAaT,CAAC;AAEJ,OAAO,EAAE,MAAM,EAAE,CAAC"}
@@ -0,0 +1,10 @@
1
+ import { Action } from './action';
2
+ import { CloseIcon } from './close-icon';
3
+ import { Footer } from './footer';
4
+ import { Header } from './header';
5
+ import { Popup } from './popup';
6
+ import { Root } from './root';
7
+ import { Title } from './title';
8
+ import { Trigger } from './trigger';
9
+ export { Action, CloseIcon, Footer, Header, Popup, Root, Title, Trigger };
10
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC"}
@@ -0,0 +1,8 @@
1
+ import type { PopupProps } from './types';
2
+ /**
3
+ * Renders the dialog popup element that contains the dialog content.
4
+ * Uses a portal to render outside the DOM hierarchy.
5
+ */
6
+ declare const Popup: import("react").ForwardRefExoticComponent<PopupProps & import("react").RefAttributes<HTMLDivElement>>;
7
+ export { Popup };
8
+ //# sourceMappingURL=popup.d.ts.map
@@ -0,0 +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"}
@@ -0,0 +1,10 @@
1
+ import type { RootProps } from './types';
2
+ /**
3
+ * Groups the dialog trigger and popup.
4
+ *
5
+ * `Dialog` is a collection of React components that combine to render
6
+ * an ARIA-compliant dialog pattern.
7
+ */
8
+ declare function Root(props: RootProps): import("react").JSX.Element;
9
+ export { Root };
10
+ //# sourceMappingURL=root.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"root.d.ts","sourceRoot":"","sources":["../../src/dialog/root.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC;;;;;GAKG;AACH,iBAAS,IAAI,CAAE,KAAK,EAAE,SAAS,+BAE9B;AAED,OAAO,EAAE,IAAI,EAAE,CAAC"}
@@ -0,0 +1,18 @@
1
+ import type { Meta, StoryObj } from '@storybook/react-vite';
2
+ import * as Dialog from '../index';
3
+ declare const meta: Meta<typeof Dialog.Root>;
4
+ export default meta;
5
+ type Story = StoryObj<typeof Dialog.Root>;
6
+ /**
7
+ * An informational dialog with a close icon, where there is no ambiguity on
8
+ * what happens when clicking the close icon.
9
+ */
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
+ export declare const AllSizes: Story;
18
+ //# sourceMappingURL=index.story.d.ts.map
@@ -0,0 +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"}
@@ -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/dialog/test/index.test.tsx"],"names":[],"mappings":""}
@@ -0,0 +1,12 @@
1
+ import type { TitleProps } from './types';
2
+ /**
3
+ * Renders the dialog title. This component is required for accessibility
4
+ * and serves as both the visible heading and the accessible label for
5
+ * the dialog.
6
+ *
7
+ * Base UI's Dialog.Title renders an `<h2>` by default. Use the `render` prop
8
+ * to customize the element if needed.
9
+ */
10
+ declare const Title: import("react").ForwardRefExoticComponent<TitleProps & import("react").RefAttributes<HTMLHeadingElement>>;
11
+ export { Title };
12
+ //# sourceMappingURL=title.d.ts.map
@@ -0,0 +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"}
@@ -0,0 +1,7 @@
1
+ import type { TriggerProps } from './types';
2
+ /**
3
+ * Renders a button that opens the dialog popup 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/dialog/trigger.tsx"],"names":[],"mappings":"AAEA,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,77 @@
1
+ import type { Dialog as _Dialog } from '@base-ui/react/dialog';
2
+ import type { ReactNode } from 'react';
3
+ import type { Button } from '../button';
4
+ import type { IconButton } from '../icon-button';
5
+ import type { ComponentProps } from '../utils/types';
6
+ export interface RootProps extends Pick<_Dialog.Root.Props, 'open' | 'onOpenChange' | 'defaultOpen' | 'modal'> {
7
+ /**
8
+ * The content to be rendered inside the component.
9
+ */
10
+ children?: ReactNode;
11
+ }
12
+ export interface TriggerProps extends ComponentProps<'button'> {
13
+ /**
14
+ * The content to be rendered inside the component.
15
+ */
16
+ children?: ReactNode;
17
+ }
18
+ export interface PopupProps extends ComponentProps<'div'> {
19
+ /**
20
+ * The content to be rendered inside the component.
21
+ */
22
+ children?: ReactNode;
23
+ /**
24
+ * Renders the dialog at a preset width (excluding additional padding from
25
+ * the viewport edges).
26
+ *
27
+ * - `'small'` — max-width of 384px.
28
+ * - `'medium'` — max-width of 512px.
29
+ * - `'large'` — max-width of 840px.
30
+ * - `'stretch'` — no max-width, stretches to fill available space.
31
+ * - `'full'` — stretches to fill available width and height.
32
+ *
33
+ * @default 'medium'
34
+ */
35
+ size?: 'small' | 'medium' | 'large' | 'stretch' | 'full';
36
+ }
37
+ export interface ActionProps extends ComponentProps<typeof Button> {
38
+ /**
39
+ * The content to be rendered inside the component.
40
+ */
41
+ children?: ReactNode;
42
+ }
43
+ export interface FooterProps extends ComponentProps<'div'> {
44
+ /**
45
+ * The content to be rendered inside the component.
46
+ */
47
+ children?: ReactNode;
48
+ }
49
+ export interface HeaderProps extends ComponentProps<'div'> {
50
+ /**
51
+ * The content to be rendered inside the component.
52
+ */
53
+ children?: ReactNode;
54
+ }
55
+ export interface TitleProps extends ComponentProps<'h2'> {
56
+ /**
57
+ * The title content to be rendered. This serves as both the visible
58
+ * heading and the accessible label for the dialog.
59
+ */
60
+ children: ReactNode;
61
+ }
62
+ export interface CloseIconProps extends Omit<ComponentProps<typeof IconButton>, 'label' | 'icon' | 'loading' | 'loadingAnnouncement'> {
63
+ /**
64
+ * A label describing the button's action, shown as a tooltip and to
65
+ * assistive technology.
66
+ *
67
+ * @default __( 'Close' )
68
+ */
69
+ label?: ComponentProps<typeof IconButton>['label'];
70
+ /**
71
+ * The icon to display in the button.
72
+ *
73
+ * @default the `close` icon from `@wordpress/icons`
74
+ */
75
+ icon?: ComponentProps<typeof IconButton>['icon'];
76
+ }
77
+ //# sourceMappingURL=types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/dialog/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,IAAI,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAC/D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACjD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAErD,MAAM,WAAW,SAChB,SAAQ,IAAI,CACX,OAAO,CAAC,IAAI,CAAC,KAAK,EAClB,MAAM,GAAG,cAAc,GAAG,aAAa,GAAG,OAAO,CACjD;IACD;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAE,QAAQ,CAAE;IAC/D;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,UAAW,SAAQ,cAAc,CAAE,KAAK,CAAE;IAC1D;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;;;;;;;;;OAWG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;CACzD;AAED,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAE,OAAO,MAAM,CAAE;IACnE;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAE,KAAK,CAAE;IAC3D;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAE,KAAK,CAAE;IAC3D;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,UAAW,SAAQ,cAAc,CAAE,IAAI,CAAE;IACzD;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;CACpB;AAED,MAAM,WAAW,cAChB,SAAQ,IAAI,CACX,cAAc,CAAE,OAAO,UAAU,CAAE,EACnC,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,qBAAqB,CACpD;IACD;;;;;OAKG;IACH,KAAK,CAAC,EAAE,cAAc,CAAE,OAAO,UAAU,CAAE,CAAE,OAAO,CAAE,CAAC;IACvD;;;;OAIG;IACH,IAAI,CAAC,EAAE,cAAc,CAAE,OAAO,UAAU,CAAE,CAAE,MAAM,CAAE,CAAC;CACrD"}
@@ -1,5 +1,4 @@
1
1
  import type { Meta, StoryObj } from '@storybook/react-vite';
2
- import '@wordpress/theme/design-tokens.css';
3
2
  import { Field } from '../../../..';
4
3
  declare const meta: Meta<typeof Field.Root>;
5
4
  export default meta;
@@ -1 +1 @@
1
- {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../../../src/form/primitives/field/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,oCAAoC,CAAC;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,KAAK,CAAC,IAAI,CAUlC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB;;;;GAIG;AACH,eAAO,MAAM,OAAO,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAchD,CAAC;AAQF;;;;;;;GAOG;AACH,eAAO,MAAM,YAAY,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAoBrD,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAoB5D,CAAC;AAEF;;;;;;;;;GASG;AACH,eAAO,MAAM,WAAW,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAkBpD,CAAC"}
1
+ {"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../../../src/form/primitives/field/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,KAAK,CAAC,IAAI,CAUlC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB;;;;GAIG;AACH,eAAO,MAAM,OAAO,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAchD,CAAC;AAQF;;;;;;;GAOG;AACH,eAAO,MAAM,YAAY,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAoBrD,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAoB5D,CAAC;AAEF;;;;;;;;;GASG;AACH,eAAO,MAAM,WAAW,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAkBpD,CAAC"}
@@ -3,4 +3,5 @@ export * as Fieldset from './fieldset';
3
3
  export { Input } from './input';
4
4
  export { InputLayout } from './input-layout';
5
5
  export * as Select from './select';
6
+ export { Textarea } from './textarea';
6
7
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/form/primitives/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,SAAS,CAAC;AACjC,OAAO,KAAK,QAAQ,MAAM,YAAY,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,KAAK,MAAM,MAAM,UAAU,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/form/primitives/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,SAAS,CAAC;AACjC,OAAO,KAAK,QAAQ,MAAM,YAAY,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,KAAK,MAAM,MAAM,UAAU,CAAC;AACnC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC"}
@@ -1,5 +1,5 @@
1
1
  import { Input as _Input } from '@base-ui/react/input';
2
- export declare const Input: import("react").ForwardRefExoticComponent<Omit<import("../../../utils/types").ComponentProps<import("react").ForwardRefExoticComponent<import("@base-ui/react").InputProps & import("react").RefAttributes<HTMLInputElement>>>, "defaultValue" | "prefix" | "size" | "disabled" | "type" | "value"> & Pick<import("../input-layout/types").InputLayoutProps, "prefix" | "suffix"> & {
2
+ export declare const Input: import("react").ForwardRefExoticComponent<Omit<import("../../../utils/types").ComponentProps<import("react").ForwardRefExoticComponent<import("@base-ui/react").InputProps & import("react").RefAttributes<HTMLInputElement>>>, "defaultValue" | "prefix" | "disabled" | "type" | "value" | "size"> & Pick<import("../input-layout/types").InputLayoutProps, "prefix" | "suffix"> & {
3
3
  disabled?: boolean;
4
4
  } & {
5
5
  type?: _Input.Props["type"];