@dxos/react-ui 0.8.4-main.c4373fc → 0.8.4-main.c85a9c8dae

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 (396) hide show
  1. package/dist/lib/browser/chunk-2FKSMWNY.mjs +774 -0
  2. package/dist/lib/browser/chunk-2FKSMWNY.mjs.map +7 -0
  3. package/dist/lib/browser/index.mjs +3929 -66
  4. package/dist/lib/browser/index.mjs.map +4 -4
  5. package/dist/lib/browser/meta.json +1 -1
  6. package/dist/lib/browser/testing/index.mjs +77 -55
  7. package/dist/lib/browser/testing/index.mjs.map +4 -4
  8. package/dist/lib/node-esm/chunk-ZNBLTSHI.mjs +776 -0
  9. package/dist/lib/node-esm/chunk-ZNBLTSHI.mjs.map +7 -0
  10. package/dist/lib/node-esm/index.mjs +3929 -66
  11. package/dist/lib/node-esm/index.mjs.map +4 -4
  12. package/dist/lib/node-esm/meta.json +1 -1
  13. package/dist/lib/node-esm/testing/index.mjs +77 -55
  14. package/dist/lib/node-esm/testing/index.mjs.map +4 -4
  15. package/dist/types/src/components/Avatars/Avatar.d.ts.map +1 -1
  16. package/dist/types/src/components/Avatars/Avatar.stories.d.ts.map +1 -1
  17. package/dist/types/src/components/Breadcrumb/Breadcrumb.d.ts.map +1 -1
  18. package/dist/types/src/components/{Buttons → Button}/Button.d.ts +1 -1
  19. package/dist/types/src/components/Button/Button.d.ts.map +1 -0
  20. package/dist/types/src/components/Button/Button.stories.d.ts.map +1 -0
  21. package/dist/types/src/components/{Buttons → Button}/IconButton.d.ts +2 -2
  22. package/dist/types/src/components/Button/IconButton.d.ts.map +1 -0
  23. package/dist/types/src/components/Button/IconButton.stories.d.ts.map +1 -0
  24. package/dist/types/src/components/Button/Toggle.d.ts.map +1 -0
  25. package/dist/types/src/components/Button/Toggle.stories.d.ts +16 -0
  26. package/dist/types/src/components/Button/Toggle.stories.d.ts.map +1 -0
  27. package/dist/types/src/components/{Buttons → Button}/ToggleGroup.d.ts +4 -4
  28. package/dist/types/src/components/Button/ToggleGroup.d.ts.map +1 -0
  29. package/dist/types/src/components/{Buttons → Button}/ToggleGroup.stories.d.ts +4 -4
  30. package/dist/types/src/components/Button/ToggleGroup.stories.d.ts.map +1 -0
  31. package/dist/types/src/components/Button/index.d.ts.map +1 -0
  32. package/dist/types/src/components/Card/Card.d.ts +121 -0
  33. package/dist/types/src/components/Card/Card.d.ts.map +1 -0
  34. package/dist/types/src/components/Card/Card.stories.d.ts +21 -0
  35. package/dist/types/src/components/Card/Card.stories.d.ts.map +1 -0
  36. package/dist/types/src/components/Card/index.d.ts +2 -0
  37. package/dist/types/src/components/Card/index.d.ts.map +1 -0
  38. package/dist/types/src/components/Clipboard/CopyButton.d.ts +1 -1
  39. package/dist/types/src/components/Clipboard/CopyButton.d.ts.map +1 -1
  40. package/dist/types/src/components/DensityProvider/DensityProvider.d.ts +1 -1
  41. package/dist/types/src/components/DensityProvider/DensityProvider.d.ts.map +1 -1
  42. package/dist/types/src/components/{Dialogs → Dialog}/AlertDialog.d.ts +12 -3
  43. package/dist/types/src/components/Dialog/AlertDialog.d.ts.map +1 -0
  44. package/dist/types/src/components/Dialog/AlertDialog.stories.d.ts.map +1 -0
  45. package/dist/types/src/components/Dialog/Dialog.d.ts +47 -0
  46. package/dist/types/src/components/Dialog/Dialog.d.ts.map +1 -0
  47. package/dist/types/src/components/{Dialogs → Dialog}/Dialog.stories.d.ts +9 -10
  48. package/dist/types/src/components/Dialog/Dialog.stories.d.ts.map +1 -0
  49. package/dist/types/src/components/Dialog/index.d.ts.map +1 -0
  50. package/dist/types/src/components/ElevationProvider/ElevationProvider.d.ts +1 -1
  51. package/dist/types/src/components/ElevationProvider/ElevationProvider.d.ts.map +1 -1
  52. package/dist/types/src/components/ErrorFallback/ErrorFallback.d.ts +11 -0
  53. package/dist/types/src/components/ErrorFallback/ErrorFallback.d.ts.map +1 -0
  54. package/dist/types/src/components/ErrorFallback/ErrorFallback.stories.d.ts +7 -0
  55. package/dist/types/src/components/ErrorFallback/ErrorFallback.stories.d.ts.map +1 -0
  56. package/dist/types/src/components/ErrorFallback/ErrorStack.d.ts +8 -0
  57. package/dist/types/src/components/ErrorFallback/ErrorStack.d.ts.map +1 -0
  58. package/dist/types/src/components/ErrorFallback/ThrowError.d.ts +9 -0
  59. package/dist/types/src/components/ErrorFallback/ThrowError.d.ts.map +1 -0
  60. package/dist/types/src/components/ErrorFallback/index.d.ts +5 -0
  61. package/dist/types/src/components/ErrorFallback/index.d.ts.map +1 -0
  62. package/dist/types/src/components/Icon/Icon.d.ts +1 -1
  63. package/dist/types/src/components/Icon/Icon.d.ts.map +1 -1
  64. package/dist/types/src/components/Icon/Icon.stories.d.ts +17 -0
  65. package/dist/types/src/components/Icon/Icon.stories.d.ts.map +1 -0
  66. package/dist/types/src/components/Image/Image.d.ts +14 -0
  67. package/dist/types/src/components/Image/Image.d.ts.map +1 -0
  68. package/dist/types/src/components/Image/Image.stories.d.ts +33 -0
  69. package/dist/types/src/components/Image/Image.stories.d.ts.map +1 -0
  70. package/dist/types/src/components/Image/index.d.ts +2 -0
  71. package/dist/types/src/components/Image/index.d.ts.map +1 -0
  72. package/dist/types/src/components/Input/Input.d.ts +5 -5
  73. package/dist/types/src/components/Input/Input.d.ts.map +1 -1
  74. package/dist/types/src/components/Input/Input.stories.d.ts +8 -8
  75. package/dist/types/src/components/Input/Input.stories.d.ts.map +1 -1
  76. package/dist/types/src/components/{Lists → List}/List.d.ts +1 -1
  77. package/dist/types/src/components/List/List.d.ts.map +1 -0
  78. package/dist/types/src/components/List/List.stories.d.ts.map +1 -0
  79. package/dist/types/src/components/List/ListDropIndicator.d.ts.map +1 -0
  80. package/dist/types/src/components/List/Tree.d.ts.map +1 -0
  81. package/dist/types/src/components/List/Tree.stories.d.ts.map +1 -0
  82. package/dist/types/src/components/List/TreeDropIndicator.d.ts.map +1 -0
  83. package/dist/types/src/components/List/Treegrid.d.ts.map +1 -0
  84. package/dist/types/src/components/List/Treegrid.stories.d.ts.map +1 -0
  85. package/dist/types/src/components/List/index.d.ts.map +1 -0
  86. package/dist/types/src/components/Main/Main.d.ts +17 -18
  87. package/dist/types/src/components/Main/Main.d.ts.map +1 -1
  88. package/dist/types/src/components/Main/Main.stories.d.ts +0 -3
  89. package/dist/types/src/components/Main/Main.stories.d.ts.map +1 -1
  90. package/dist/types/src/components/{Menus → Menu}/ContextMenu.d.ts +6 -6
  91. package/dist/types/src/components/Menu/ContextMenu.d.ts.map +1 -0
  92. package/dist/types/src/components/Menu/ContextMenu.stories.d.ts.map +1 -0
  93. package/dist/types/src/components/{Menus → Menu}/DropdownMenu.d.ts +3 -4
  94. package/dist/types/src/components/Menu/DropdownMenu.d.ts.map +1 -0
  95. package/dist/types/src/components/Menu/DropdownMenu.stories.d.ts.map +1 -0
  96. package/dist/types/src/components/Menu/index.d.ts.map +1 -0
  97. package/dist/types/src/components/Message/Message.d.ts +1 -1
  98. package/dist/types/src/components/Message/Message.d.ts.map +1 -1
  99. package/dist/types/src/components/Message/Message.stories.d.ts +3 -4
  100. package/dist/types/src/components/Message/Message.stories.d.ts.map +1 -1
  101. package/dist/types/src/components/Popover/Popover.d.ts +2 -1
  102. package/dist/types/src/components/Popover/Popover.d.ts.map +1 -1
  103. package/dist/types/src/components/ScrollArea/ScrollArea.d.ts +25 -26
  104. package/dist/types/src/components/ScrollArea/ScrollArea.d.ts.map +1 -1
  105. package/dist/types/src/components/ScrollArea/ScrollArea.stories.d.ts +46 -8
  106. package/dist/types/src/components/ScrollArea/ScrollArea.stories.d.ts.map +1 -1
  107. package/dist/types/src/components/ScrollContainer/ScrollContainer.d.ts +39 -0
  108. package/dist/types/src/components/ScrollContainer/ScrollContainer.d.ts.map +1 -0
  109. package/dist/types/src/components/ScrollContainer/ScrollContainer.stories.d.ts +24 -0
  110. package/dist/types/src/components/ScrollContainer/ScrollContainer.stories.d.ts.map +1 -0
  111. package/dist/types/src/components/ScrollContainer/index.d.ts +2 -0
  112. package/dist/types/src/components/ScrollContainer/index.d.ts.map +1 -0
  113. package/dist/types/src/components/Select/Select.d.ts +10 -10
  114. package/dist/types/src/components/Select/Select.d.ts.map +1 -1
  115. package/dist/types/src/components/Separator/Separator.d.ts +1 -1
  116. package/dist/types/src/components/Skeleton/Skeleton.d.ts +12 -0
  117. package/dist/types/src/components/Skeleton/Skeleton.d.ts.map +1 -0
  118. package/dist/types/src/components/Skeleton/Skeleton.stories.d.ts +17 -0
  119. package/dist/types/src/components/Skeleton/Skeleton.stories.d.ts.map +1 -0
  120. package/dist/types/src/components/Skeleton/index.d.ts +2 -0
  121. package/dist/types/src/components/Skeleton/index.d.ts.map +1 -0
  122. package/dist/types/src/components/Splitter/Splitter.d.ts +36 -0
  123. package/dist/types/src/components/Splitter/Splitter.d.ts.map +1 -0
  124. package/dist/types/src/components/Splitter/Splitter.stories.d.ts +7 -0
  125. package/dist/types/src/components/Splitter/Splitter.stories.d.ts.map +1 -0
  126. package/dist/types/src/components/Splitter/index.d.ts +2 -0
  127. package/dist/types/src/components/Splitter/index.d.ts.map +1 -0
  128. package/dist/types/src/components/Status/Status.stories.d.ts +4 -2
  129. package/dist/types/src/components/Status/Status.stories.d.ts.map +1 -1
  130. package/dist/types/src/components/Tag/Tag.d.ts +1 -1
  131. package/dist/types/src/components/Tag/Tag.d.ts.map +1 -1
  132. package/dist/types/src/components/Tag/Tag.stories.d.ts +0 -5
  133. package/dist/types/src/components/Tag/Tag.stories.d.ts.map +1 -1
  134. package/dist/types/src/components/ThemeProvider/ThemeProvider.d.ts +2 -2
  135. package/dist/types/src/components/ThemeProvider/ThemeProvider.d.ts.map +1 -1
  136. package/dist/types/src/components/ThemeProvider/ThemeProvider.stories.d.ts +12 -0
  137. package/dist/types/src/components/ThemeProvider/ThemeProvider.stories.d.ts.map +1 -0
  138. package/dist/types/src/components/ThemeProvider/TranslationsProvider.d.ts +1 -8
  139. package/dist/types/src/components/ThemeProvider/TranslationsProvider.d.ts.map +1 -1
  140. package/dist/types/src/components/ThemeProvider/index.d.ts +2 -1
  141. package/dist/types/src/components/ThemeProvider/index.d.ts.map +1 -1
  142. package/dist/types/src/components/Toast/Toast.d.ts +4 -4
  143. package/dist/types/src/components/Toast/Toast.d.ts.map +1 -1
  144. package/dist/types/src/components/Toolbar/Toolbar.d.ts +45 -13
  145. package/dist/types/src/components/Toolbar/Toolbar.d.ts.map +1 -1
  146. package/dist/types/src/components/Toolbar/Toolbar.stories.d.ts.map +1 -1
  147. package/dist/types/src/components/Tooltip/Tooltip.d.ts.map +1 -1
  148. package/dist/types/src/components/Tooltip/Tooltip.stories.d.ts.map +1 -1
  149. package/dist/types/src/components/index.d.ts +13 -8
  150. package/dist/types/src/components/index.d.ts.map +1 -1
  151. package/dist/types/src/exemplars/generics.stories.d.ts +18 -0
  152. package/dist/types/src/exemplars/generics.stories.d.ts.map +1 -0
  153. package/dist/types/src/exemplars/slot.stories.d.ts +14 -0
  154. package/dist/types/src/exemplars/slot.stories.d.ts.map +1 -0
  155. package/dist/types/src/exemplars/tabster.stories.d.ts +8 -0
  156. package/dist/types/src/exemplars/tabster.stories.d.ts.map +1 -0
  157. package/dist/types/src/exemplars/virtualizer.stories.d.ts +11 -0
  158. package/dist/types/src/exemplars/virtualizer.stories.d.ts.map +1 -0
  159. package/dist/types/src/hooks/useDensityContext.d.ts +1 -1
  160. package/dist/types/src/hooks/useDensityContext.d.ts.map +1 -1
  161. package/dist/types/src/hooks/useElevationContext.d.ts +1 -1
  162. package/dist/types/src/hooks/useElevationContext.d.ts.map +1 -1
  163. package/dist/types/src/hooks/useVisualViewport.d.ts +2 -2
  164. package/dist/types/src/hooks/useVisualViewport.d.ts.map +1 -1
  165. package/dist/types/src/index.d.ts +2 -1
  166. package/dist/types/src/index.d.ts.map +1 -1
  167. package/dist/types/src/playground/Controls.stories.d.ts.map +1 -1
  168. package/dist/types/src/playground/Custom.stories.d.ts.map +1 -1
  169. package/dist/types/src/primitives/Column/Column.d.ts +32 -0
  170. package/dist/types/src/primitives/Column/Column.d.ts.map +1 -0
  171. package/dist/types/src/primitives/Column/Column.stories.d.ts +6 -0
  172. package/dist/types/src/primitives/Column/Column.stories.d.ts.map +1 -0
  173. package/dist/types/src/primitives/Column/index.d.ts +2 -0
  174. package/dist/types/src/primitives/Column/index.d.ts.map +1 -0
  175. package/dist/types/src/primitives/Flex/Flex.d.ts +8 -0
  176. package/dist/types/src/primitives/Flex/Flex.d.ts.map +1 -0
  177. package/dist/types/src/primitives/Flex/Flex.stories.d.ts +8 -0
  178. package/dist/types/src/primitives/Flex/Flex.stories.d.ts.map +1 -0
  179. package/dist/types/src/primitives/Flex/index.d.ts +2 -0
  180. package/dist/types/src/primitives/Flex/index.d.ts.map +1 -0
  181. package/dist/types/src/primitives/Grid/Grid.d.ts +9 -0
  182. package/dist/types/src/primitives/Grid/Grid.d.ts.map +1 -0
  183. package/dist/types/src/primitives/Grid/Grid.stories.d.ts +8 -0
  184. package/dist/types/src/primitives/Grid/Grid.stories.d.ts.map +1 -0
  185. package/dist/types/src/primitives/Grid/index.d.ts +2 -0
  186. package/dist/types/src/primitives/Grid/index.d.ts.map +1 -0
  187. package/dist/types/src/primitives/Panel/Panel.d.ts +34 -0
  188. package/dist/types/src/primitives/Panel/Panel.d.ts.map +1 -0
  189. package/dist/types/src/primitives/Panel/Panel.stories.d.ts +6 -0
  190. package/dist/types/src/primitives/Panel/Panel.stories.d.ts.map +1 -0
  191. package/dist/types/src/primitives/Panel/index.d.ts +2 -0
  192. package/dist/types/src/primitives/Panel/index.d.ts.map +1 -0
  193. package/dist/types/src/primitives/index.d.ts +5 -0
  194. package/dist/types/src/primitives/index.d.ts.map +1 -0
  195. package/dist/types/src/testing/decorators/index.d.ts +2 -1
  196. package/dist/types/src/testing/decorators/index.d.ts.map +1 -1
  197. package/dist/types/src/testing/decorators/withLayout.d.ts +15 -0
  198. package/dist/types/src/testing/decorators/withLayout.d.ts.map +1 -0
  199. package/dist/types/src/testing/decorators/withLayoutVariants.d.ts +12 -0
  200. package/dist/types/src/testing/decorators/withLayoutVariants.d.ts.map +1 -0
  201. package/dist/types/src/testing/decorators/withTheme.d.ts +3 -2
  202. package/dist/types/src/testing/decorators/withTheme.d.ts.map +1 -1
  203. package/dist/types/src/translations.d.ts +11 -0
  204. package/dist/types/src/translations.d.ts.map +1 -0
  205. package/dist/types/src/util/index.d.ts +1 -2
  206. package/dist/types/src/util/index.d.ts.map +1 -1
  207. package/dist/types/tsconfig.tsbuildinfo +1 -1
  208. package/package.json +41 -29
  209. package/src/components/Avatars/Avatar.stories.tsx +5 -6
  210. package/src/components/Avatars/Avatar.tsx +6 -13
  211. package/src/components/Avatars/AvatarGroup.stories.tsx +2 -2
  212. package/src/components/Breadcrumb/Breadcrumb.stories.tsx +4 -4
  213. package/src/components/Breadcrumb/Breadcrumb.tsx +11 -37
  214. package/src/components/{Buttons → Button}/Button.stories.tsx +4 -4
  215. package/src/components/{Buttons → Button}/Button.tsx +7 -13
  216. package/src/components/{Buttons → Button}/IconButton.stories.tsx +4 -4
  217. package/src/components/{Buttons → Button}/IconButton.tsx +20 -14
  218. package/src/components/{Buttons → Button}/Toggle.stories.tsx +7 -6
  219. package/src/components/{Buttons → Button}/ToggleGroup.stories.tsx +2 -2
  220. package/src/components/Card/Card.stories.tsx +151 -0
  221. package/src/components/Card/Card.tsx +352 -0
  222. package/src/components/Card/index.ts +5 -0
  223. package/src/components/Clipboard/CopyButton.tsx +7 -7
  224. package/src/components/DensityProvider/DensityProvider.tsx +1 -1
  225. package/src/components/Dialog/AlertDialog.stories.tsx +69 -0
  226. package/src/components/{Dialogs → Dialog}/AlertDialog.tsx +116 -16
  227. package/src/components/Dialog/Dialog.stories.tsx +122 -0
  228. package/src/components/{Dialogs → Dialog}/Dialog.tsx +179 -49
  229. package/src/components/ElevationProvider/ElevationProvider.tsx +1 -1
  230. package/src/components/ErrorFallback/ErrorFallback.stories.tsx +50 -0
  231. package/src/components/ErrorFallback/ErrorFallback.tsx +70 -0
  232. package/src/components/ErrorFallback/ErrorStack.tsx +80 -0
  233. package/src/components/ErrorFallback/ThrowError.tsx +37 -0
  234. package/src/components/ErrorFallback/index.ts +9 -0
  235. package/src/components/Icon/Icon.stories.tsx +113 -0
  236. package/src/components/Icon/Icon.tsx +3 -3
  237. package/src/components/Image/Image.stories.tsx +86 -0
  238. package/src/components/Image/Image.tsx +223 -0
  239. package/src/components/Image/index.ts +5 -0
  240. package/src/components/Input/Input.stories.tsx +21 -40
  241. package/src/components/Input/Input.tsx +32 -68
  242. package/src/components/Link/Link.stories.tsx +2 -2
  243. package/src/components/Link/Link.tsx +2 -2
  244. package/src/components/{Lists → List}/List.stories.tsx +30 -33
  245. package/src/components/{Lists → List}/List.tsx +12 -17
  246. package/src/components/{Lists → List}/ListDropIndicator.tsx +7 -7
  247. package/src/components/{Lists → List}/Tree.stories.tsx +4 -4
  248. package/src/components/{Lists → List}/TreeDropIndicator.tsx +6 -6
  249. package/src/components/{Lists → List}/Treegrid.stories.tsx +3 -3
  250. package/src/components/{Lists → List}/Treegrid.tsx +10 -15
  251. package/src/components/Main/Main.stories.tsx +41 -23
  252. package/src/components/Main/Main.tsx +149 -92
  253. package/src/components/{Menus → Menu}/ContextMenu.stories.tsx +2 -2
  254. package/src/components/{Menus → Menu}/ContextMenu.tsx +9 -33
  255. package/src/components/{Menus → Menu}/DropdownMenu.stories.tsx +3 -3
  256. package/src/components/{Menus → Menu}/DropdownMenu.tsx +89 -68
  257. package/src/components/Message/Message.stories.tsx +26 -11
  258. package/src/components/Message/Message.tsx +46 -33
  259. package/src/components/Popover/Popover.stories.tsx +5 -5
  260. package/src/components/Popover/Popover.tsx +78 -56
  261. package/src/components/ScrollArea/ScrollArea.stories.tsx +166 -40
  262. package/src/components/ScrollArea/ScrollArea.tsx +84 -82
  263. package/src/components/ScrollArea/index.ts +1 -1
  264. package/src/components/ScrollContainer/ScrollContainer.stories.tsx +89 -0
  265. package/src/components/ScrollContainer/ScrollContainer.tsx +238 -0
  266. package/src/components/ScrollContainer/index.ts +5 -0
  267. package/src/components/Select/Select.stories.tsx +3 -3
  268. package/src/components/Select/Select.tsx +11 -27
  269. package/src/components/Separator/Separator.tsx +1 -1
  270. package/src/components/Skeleton/Skeleton.stories.tsx +52 -0
  271. package/src/components/Skeleton/Skeleton.tsx +26 -0
  272. package/src/components/Skeleton/index.ts +5 -0
  273. package/src/components/Splitter/Splitter.stories.tsx +83 -0
  274. package/src/components/Splitter/Splitter.tsx +138 -0
  275. package/src/components/Splitter/index.ts +5 -0
  276. package/src/components/Status/Status.stories.tsx +21 -17
  277. package/src/components/Status/Status.tsx +2 -2
  278. package/src/components/Tag/Tag.stories.tsx +6 -11
  279. package/src/components/Tag/Tag.tsx +3 -8
  280. package/src/components/ThemeProvider/ThemeProvider.stories.tsx +32 -0
  281. package/src/components/ThemeProvider/ThemeProvider.tsx +5 -6
  282. package/src/components/ThemeProvider/TranslationsProvider.tsx +1 -16
  283. package/src/components/ThemeProvider/index.ts +3 -3
  284. package/src/components/Toast/Toast.stories.tsx +3 -3
  285. package/src/components/Toast/Toast.tsx +10 -14
  286. package/src/components/Toolbar/Toolbar.stories.tsx +4 -6
  287. package/src/components/Toolbar/Toolbar.tsx +196 -9
  288. package/src/components/Tooltip/Tooltip.stories.tsx +16 -14
  289. package/src/components/Tooltip/Tooltip.tsx +25 -22
  290. package/src/components/index.ts +14 -9
  291. package/src/exemplars/generics.stories.tsx +49 -0
  292. package/src/exemplars/slot.stories.tsx +119 -0
  293. package/src/exemplars/tabster.stories.tsx +127 -0
  294. package/src/exemplars/virtualizer.stories.tsx +137 -0
  295. package/src/hooks/useDensityContext.ts +1 -1
  296. package/src/hooks/useElevationContext.ts +1 -1
  297. package/src/hooks/useSafeArea.ts +2 -2
  298. package/src/hooks/useVisualViewport.ts +3 -3
  299. package/src/index.ts +2 -1
  300. package/src/playground/Controls.stories.tsx +3 -10
  301. package/src/playground/Custom.stories.tsx +8 -10
  302. package/src/playground/Typography.stories.tsx +3 -3
  303. package/src/primitives/Column/Column.stories.tsx +72 -0
  304. package/src/primitives/Column/Column.tsx +156 -0
  305. package/src/primitives/Column/index.ts +5 -0
  306. package/src/primitives/Flex/Flex.stories.tsx +58 -0
  307. package/src/primitives/Flex/Flex.tsx +27 -0
  308. package/src/primitives/Flex/index.ts +5 -0
  309. package/src/primitives/Grid/Grid.stories.tsx +57 -0
  310. package/src/primitives/Grid/Grid.tsx +43 -0
  311. package/src/primitives/Grid/index.ts +5 -0
  312. package/src/primitives/Panel/Panel.stories.tsx +67 -0
  313. package/src/primitives/Panel/Panel.tsx +137 -0
  314. package/src/primitives/Panel/index.ts +5 -0
  315. package/src/primitives/index.ts +8 -0
  316. package/src/testing/decorators/index.ts +2 -1
  317. package/src/testing/decorators/withLayout.tsx +77 -0
  318. package/src/testing/decorators/withLayoutVariants.tsx +48 -0
  319. package/src/testing/decorators/withTheme.tsx +21 -18
  320. package/src/translations.ts +19 -0
  321. package/src/util/index.ts +2 -2
  322. package/dist/lib/browser/chunk-B7HPXBP2.mjs +0 -4514
  323. package/dist/lib/browser/chunk-B7HPXBP2.mjs.map +0 -7
  324. package/dist/lib/node-esm/chunk-6JCSY5Y7.mjs +0 -4516
  325. package/dist/lib/node-esm/chunk-6JCSY5Y7.mjs.map +0 -7
  326. package/dist/types/src/components/AnchoredOverflow/AnchoredOverflow.d.ts +0 -15
  327. package/dist/types/src/components/AnchoredOverflow/AnchoredOverflow.d.ts.map +0 -1
  328. package/dist/types/src/components/AnchoredOverflow/index.d.ts +0 -2
  329. package/dist/types/src/components/AnchoredOverflow/index.d.ts.map +0 -1
  330. package/dist/types/src/components/Buttons/Button.d.ts.map +0 -1
  331. package/dist/types/src/components/Buttons/Button.stories.d.ts.map +0 -1
  332. package/dist/types/src/components/Buttons/IconButton.d.ts.map +0 -1
  333. package/dist/types/src/components/Buttons/IconButton.stories.d.ts.map +0 -1
  334. package/dist/types/src/components/Buttons/Toggle.d.ts.map +0 -1
  335. package/dist/types/src/components/Buttons/Toggle.stories.d.ts +0 -13
  336. package/dist/types/src/components/Buttons/Toggle.stories.d.ts.map +0 -1
  337. package/dist/types/src/components/Buttons/ToggleGroup.d.ts.map +0 -1
  338. package/dist/types/src/components/Buttons/ToggleGroup.stories.d.ts.map +0 -1
  339. package/dist/types/src/components/Buttons/index.d.ts.map +0 -1
  340. package/dist/types/src/components/Dialogs/AlertDialog.d.ts.map +0 -1
  341. package/dist/types/src/components/Dialogs/AlertDialog.stories.d.ts.map +0 -1
  342. package/dist/types/src/components/Dialogs/Dialog.d.ts +0 -31
  343. package/dist/types/src/components/Dialogs/Dialog.d.ts.map +0 -1
  344. package/dist/types/src/components/Dialogs/Dialog.stories.d.ts.map +0 -1
  345. package/dist/types/src/components/Dialogs/index.d.ts.map +0 -1
  346. package/dist/types/src/components/Lists/List.d.ts.map +0 -1
  347. package/dist/types/src/components/Lists/List.stories.d.ts.map +0 -1
  348. package/dist/types/src/components/Lists/ListDropIndicator.d.ts.map +0 -1
  349. package/dist/types/src/components/Lists/Tree.d.ts.map +0 -1
  350. package/dist/types/src/components/Lists/Tree.stories.d.ts.map +0 -1
  351. package/dist/types/src/components/Lists/TreeDropIndicator.d.ts.map +0 -1
  352. package/dist/types/src/components/Lists/Treegrid.d.ts.map +0 -1
  353. package/dist/types/src/components/Lists/Treegrid.stories.d.ts.map +0 -1
  354. package/dist/types/src/components/Lists/index.d.ts.map +0 -1
  355. package/dist/types/src/components/Menus/ContextMenu.d.ts.map +0 -1
  356. package/dist/types/src/components/Menus/ContextMenu.stories.d.ts.map +0 -1
  357. package/dist/types/src/components/Menus/DropdownMenu.d.ts.map +0 -1
  358. package/dist/types/src/components/Menus/DropdownMenu.stories.d.ts.map +0 -1
  359. package/dist/types/src/components/Menus/index.d.ts.map +0 -1
  360. package/dist/types/src/testing/decorators/withSurfaceVariantsLayout.d.ts +0 -12
  361. package/dist/types/src/testing/decorators/withSurfaceVariantsLayout.d.ts.map +0 -1
  362. package/dist/types/src/util/ThemedClassName.d.ts +0 -5
  363. package/dist/types/src/util/ThemedClassName.d.ts.map +0 -1
  364. package/dist/types/src/util/domino.d.ts +0 -18
  365. package/dist/types/src/util/domino.d.ts.map +0 -1
  366. package/src/components/AnchoredOverflow/AnchoredOverflow.tsx +0 -59
  367. package/src/components/AnchoredOverflow/index.ts +0 -5
  368. package/src/components/Dialogs/AlertDialog.stories.tsx +0 -69
  369. package/src/components/Dialogs/Dialog.stories.tsx +0 -67
  370. package/src/testing/decorators/withSurfaceVariantsLayout.tsx +0 -51
  371. package/src/util/ThemedClassName.ts +0 -7
  372. package/src/util/domino.ts +0 -51
  373. /package/dist/types/src/components/{Buttons → Button}/Button.stories.d.ts +0 -0
  374. /package/dist/types/src/components/{Buttons → Button}/IconButton.stories.d.ts +0 -0
  375. /package/dist/types/src/components/{Buttons → Button}/Toggle.d.ts +0 -0
  376. /package/dist/types/src/components/{Buttons → Button}/index.d.ts +0 -0
  377. /package/dist/types/src/components/{Dialogs → Dialog}/AlertDialog.stories.d.ts +0 -0
  378. /package/dist/types/src/components/{Dialogs → Dialog}/index.d.ts +0 -0
  379. /package/dist/types/src/components/{Lists → List}/List.stories.d.ts +0 -0
  380. /package/dist/types/src/components/{Lists → List}/ListDropIndicator.d.ts +0 -0
  381. /package/dist/types/src/components/{Lists → List}/Tree.d.ts +0 -0
  382. /package/dist/types/src/components/{Lists → List}/Tree.stories.d.ts +0 -0
  383. /package/dist/types/src/components/{Lists → List}/TreeDropIndicator.d.ts +0 -0
  384. /package/dist/types/src/components/{Lists → List}/Treegrid.d.ts +0 -0
  385. /package/dist/types/src/components/{Lists → List}/Treegrid.stories.d.ts +0 -0
  386. /package/dist/types/src/components/{Lists → List}/index.d.ts +0 -0
  387. /package/dist/types/src/components/{Menus → Menu}/ContextMenu.stories.d.ts +0 -0
  388. /package/dist/types/src/components/{Menus → Menu}/DropdownMenu.stories.d.ts +0 -0
  389. /package/dist/types/src/components/{Menus → Menu}/index.d.ts +0 -0
  390. /package/src/components/{Buttons → Button}/Toggle.tsx +0 -0
  391. /package/src/components/{Buttons → Button}/ToggleGroup.tsx +0 -0
  392. /package/src/components/{Buttons → Button}/index.ts +0 -0
  393. /package/src/components/{Dialogs → Dialog}/index.ts +0 -0
  394. /package/src/components/{Lists → List}/Tree.tsx +0 -0
  395. /package/src/components/{Lists → List}/index.ts +0 -0
  396. /package/src/components/{Menus → Menu}/index.ts +0 -0
@@ -0,0 +1,774 @@
1
+ // src/components/DensityProvider/DensityProvider.tsx
2
+ import React, { createContext } from "react";
3
+ var DensityContext = /* @__PURE__ */ createContext({
4
+ density: "fine"
5
+ });
6
+ var DensityProvider = ({ density, children }) => /* @__PURE__ */ React.createElement(DensityContext.Provider, {
7
+ value: {
8
+ density
9
+ }
10
+ }, children);
11
+
12
+ // src/components/ElevationProvider/ElevationProvider.tsx
13
+ import React2, { createContext as createContext2 } from "react";
14
+ var ElevationContext = /* @__PURE__ */ createContext2({
15
+ elevation: "base"
16
+ });
17
+ var ElevationProvider = ({ elevation, children }) => /* @__PURE__ */ React2.createElement(ElevationContext.Provider, {
18
+ value: {
19
+ elevation
20
+ }
21
+ }, children);
22
+
23
+ // src/hooks/useElevationContext.ts
24
+ import { useContext as useContext3 } from "react";
25
+
26
+ // src/components/ThemeProvider/ThemeProvider.tsx
27
+ import { createKeyborg } from "keyborg";
28
+ import React4, { createContext as createContext4, useEffect as useEffect2, useMemo } from "react";
29
+
30
+ // src/hooks/useThemeContext.ts
31
+ import { useContext } from "react";
32
+ import { raise } from "@dxos/debug";
33
+ var useThemeContext = () => useContext(ThemeContext) ?? raise(new Error("Missing ThemeContext"));
34
+
35
+ // src/hooks/useSafeArea.ts
36
+ import { useCallback, useState } from "react";
37
+ import { useViewportResize } from "@dxos/react-hooks";
38
+ var initialSafeArea = {
39
+ top: NaN,
40
+ right: NaN,
41
+ bottom: NaN,
42
+ left: NaN
43
+ };
44
+ var useSafeArea = () => {
45
+ const [padding, setPadding] = useState(initialSafeArea);
46
+ const handleResize = useCallback(() => {
47
+ setPadding({
48
+ top: parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--safe-area-top")),
49
+ right: parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--safe-area-right")),
50
+ bottom: parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--safe-area-bottom")),
51
+ left: parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--safe-area-left"))
52
+ });
53
+ }, []);
54
+ useViewportResize(handleResize);
55
+ return padding;
56
+ };
57
+
58
+ // src/components/ThemeProvider/TranslationsProvider.tsx
59
+ import { enUS as dtLocaleEnUs } from "date-fns/locale";
60
+ import i18Next from "i18next";
61
+ import React3, { Suspense, createContext as createContext3, useContext as useContext2, useEffect, useState as useState2 } from "react";
62
+ import { initReactI18next, useTranslation as useI18NextTranslation } from "react-i18next";
63
+ var initialLng = "en-US";
64
+ var initialNs = "dxos-common";
65
+ var initialDtLocale = dtLocaleEnUs;
66
+ var resources = {
67
+ [initialLng]: {
68
+ [initialNs]: {
69
+ "loading translations": "Loading translations\u2026"
70
+ }
71
+ }
72
+ };
73
+ void i18Next.use(initReactI18next).init({
74
+ resources,
75
+ lng: initialLng,
76
+ defaultNS: initialNs,
77
+ interpolation: {
78
+ escapeValue: false
79
+ }
80
+ });
81
+ var TranslationsContext = /* @__PURE__ */ createContext3({
82
+ appNs: initialNs,
83
+ dtLocale: initialDtLocale
84
+ });
85
+ var useTranslation = (...args) => {
86
+ const result = useI18NextTranslation(...args);
87
+ const { dtLocale } = useContext2(TranslationsContext);
88
+ return {
89
+ ...result,
90
+ dtLocale
91
+ };
92
+ };
93
+ var TranslationsProvider = ({ fallback, resourceExtensions, children, appNs, dtLocale }) => {
94
+ const [loaded, setLoaded] = useState2(false);
95
+ useEffect(() => {
96
+ setLoaded(false);
97
+ if (resourceExtensions && resourceExtensions.length) {
98
+ resourceExtensions.forEach((resource) => {
99
+ Object.keys(resource).forEach((language) => {
100
+ Object.keys(resource[language]).forEach((ns) => {
101
+ i18Next.addResourceBundle(language, ns, resource[language][ns]);
102
+ });
103
+ });
104
+ });
105
+ }
106
+ setLoaded(true);
107
+ }, [
108
+ resourceExtensions
109
+ ]);
110
+ return /* @__PURE__ */ React3.createElement(TranslationsContext.Provider, {
111
+ value: {
112
+ appNs: appNs ?? initialNs,
113
+ dtLocale: dtLocale ?? initialDtLocale
114
+ }
115
+ }, /* @__PURE__ */ React3.createElement(Suspense, {
116
+ fallback
117
+ }, loaded ? children : fallback));
118
+ };
119
+
120
+ // src/util/hasIosKeyboard.ts
121
+ var hasIosKeyboard = () => {
122
+ return !!navigator.userAgent.match(/iP(ad|od|hone).+Safari/);
123
+ };
124
+
125
+ // src/components/ThemeProvider/ThemeProvider.tsx
126
+ var ThemeContext = /* @__PURE__ */ createContext4(void 0);
127
+ var ThemeProvider = ({ children, fallback = null, resourceExtensions, appNs, tx = (_path, _styleProps, ..._options) => void 0, themeMode = "dark", rootDensity = "fine", ...rest }) => {
128
+ useEffect2(() => {
129
+ if (document.defaultView) {
130
+ const kb = createKeyborg(document.defaultView);
131
+ kb.subscribe(handleInputModalityChange);
132
+ return () => kb.unsubscribe(handleInputModalityChange);
133
+ }
134
+ }, []);
135
+ const safeAreaPadding = useSafeArea();
136
+ const contextValue = useMemo(() => ({
137
+ tx,
138
+ themeMode,
139
+ hasIosKeyboard: hasIosKeyboard(),
140
+ safeAreaPadding,
141
+ ...rest
142
+ }), [
143
+ tx,
144
+ themeMode,
145
+ safeAreaPadding,
146
+ rest
147
+ ]);
148
+ return /* @__PURE__ */ React4.createElement(ThemeContext.Provider, {
149
+ value: contextValue
150
+ }, /* @__PURE__ */ React4.createElement(TranslationsProvider, {
151
+ fallback,
152
+ resourceExtensions,
153
+ appNs
154
+ }, /* @__PURE__ */ React4.createElement(ElevationProvider, {
155
+ elevation: "base"
156
+ }, /* @__PURE__ */ React4.createElement(DensityProvider, {
157
+ density: rootDensity
158
+ }, children))));
159
+ };
160
+ var handleInputModalityChange = (isUsingKeyboard) => {
161
+ if (isUsingKeyboard) {
162
+ document.body.setAttribute("data-w-keyboard", "true");
163
+ } else {
164
+ document.body.removeAttribute("data-w-keyboard");
165
+ }
166
+ };
167
+
168
+ // src/components/Tooltip/Tooltip.tsx
169
+ import { composeEventHandlers } from "@radix-ui/primitive";
170
+ import { useComposedRefs } from "@radix-ui/react-compose-refs";
171
+ import { createContextScope } from "@radix-ui/react-context";
172
+ import { DismissableLayer } from "@radix-ui/react-dismissable-layer";
173
+ import { useId } from "@radix-ui/react-id";
174
+ import * as PopperPrimitive from "@radix-ui/react-popper";
175
+ import { createPopperScope } from "@radix-ui/react-popper";
176
+ import { Portal as PortalPrimitive } from "@radix-ui/react-portal";
177
+ import { Presence } from "@radix-ui/react-presence";
178
+ import { Primitive } from "@radix-ui/react-primitive";
179
+ import { Slottable } from "@radix-ui/react-slot";
180
+ import { useControllableState } from "@radix-ui/react-use-controllable-state";
181
+ import * as VisuallyHiddenPrimitive from "@radix-ui/react-visually-hidden";
182
+ import React5, { forwardRef, useCallback as useCallback2, useEffect as useEffect3, useMemo as useMemo2, useRef, useState as useState3 } from "react";
183
+ var [createTooltipContext, createTooltipScope] = createContextScope("Tooltip", [
184
+ createPopperScope
185
+ ]);
186
+ var usePopperScope = createPopperScope();
187
+ var DEFAULT_DELAY_DURATION = 700;
188
+ var TOOLTIP_OPEN = "tooltip.open";
189
+ var TOOLTIP_NAME = "Tooltip";
190
+ var [TooltipContextProvider, useTooltipContext] = createTooltipContext(TOOLTIP_NAME);
191
+ var TooltipProvider = (props) => {
192
+ const { __scopeTooltip, children, open: openProp, defaultOpen = false, onOpenChange, disableHoverableContent = false, delayDuration = DEFAULT_DELAY_DURATION, skipDelayDuration = 300 } = props;
193
+ const isOpenDelayedRef = useRef(true);
194
+ const isPointerInTransitRef = useRef(false);
195
+ const skipDelayTimerRef = useRef(0);
196
+ useEffect3(() => {
197
+ const skipDelayTimer = skipDelayTimerRef.current;
198
+ return () => window.clearTimeout(skipDelayTimer);
199
+ }, []);
200
+ const popperScope = usePopperScope(__scopeTooltip);
201
+ const [trigger, setTrigger] = useState3(null);
202
+ const [content, setContent] = useState3("");
203
+ const [side, setSide] = useState3(void 0);
204
+ const triggerRef = useRef(trigger);
205
+ const handleTriggerChange = useCallback2((nextTrigger) => {
206
+ setTrigger(nextTrigger);
207
+ triggerRef.current = nextTrigger;
208
+ setContent(nextTrigger?.getAttribute("data-tooltip-content") ?? "");
209
+ setSide(nextTrigger?.getAttribute("data-tooltip-side") ?? void 0);
210
+ }, []);
211
+ const contentId = useId();
212
+ const openTimerRef = useRef(0);
213
+ const wasOpenDelayedRef = useRef(false);
214
+ const handleOpenChange = useCallback2((open2) => {
215
+ if (open2) {
216
+ window.clearTimeout(skipDelayTimerRef.current);
217
+ isOpenDelayedRef.current = false;
218
+ document.dispatchEvent(new CustomEvent(TOOLTIP_OPEN));
219
+ } else {
220
+ window.clearTimeout(skipDelayTimerRef.current);
221
+ skipDelayTimerRef.current = window.setTimeout(() => isOpenDelayedRef.current = true, skipDelayDuration);
222
+ }
223
+ onOpenChange?.(open2);
224
+ }, [
225
+ skipDelayDuration,
226
+ onOpenChange
227
+ ]);
228
+ const [open = false, setOpen] = useControllableState({
229
+ prop: openProp,
230
+ defaultProp: defaultOpen,
231
+ onChange: handleOpenChange
232
+ });
233
+ const stateAttribute = useMemo2(() => {
234
+ return open ? wasOpenDelayedRef.current ? "delayed-open" : "instant-open" : "closed";
235
+ }, [
236
+ open
237
+ ]);
238
+ const handleOpen = useCallback2(() => {
239
+ window.clearTimeout(openTimerRef.current);
240
+ openTimerRef.current = 0;
241
+ wasOpenDelayedRef.current = false;
242
+ setOpen(true);
243
+ }, [
244
+ setOpen
245
+ ]);
246
+ const handleClose = useCallback2(() => {
247
+ window.clearTimeout(openTimerRef.current);
248
+ openTimerRef.current = 0;
249
+ setOpen(false);
250
+ }, [
251
+ setOpen
252
+ ]);
253
+ const handleDelayedOpen = useCallback2(() => {
254
+ window.clearTimeout(openTimerRef.current);
255
+ openTimerRef.current = window.setTimeout(() => {
256
+ wasOpenDelayedRef.current = true;
257
+ setOpen(true);
258
+ openTimerRef.current = 0;
259
+ }, delayDuration);
260
+ }, [
261
+ delayDuration,
262
+ setOpen
263
+ ]);
264
+ useEffect3(() => {
265
+ return () => {
266
+ if (openTimerRef.current) {
267
+ window.clearTimeout(openTimerRef.current);
268
+ openTimerRef.current = 0;
269
+ }
270
+ };
271
+ }, []);
272
+ const { tx } = useThemeContext();
273
+ const elevation = useElevationContext();
274
+ return /* @__PURE__ */ React5.createElement(PopperPrimitive.Root, popperScope, /* @__PURE__ */ React5.createElement(TooltipContextProvider, {
275
+ scope: __scopeTooltip,
276
+ contentId,
277
+ open,
278
+ stateAttribute,
279
+ trigger,
280
+ onTriggerChange: handleTriggerChange,
281
+ onTriggerEnter: useCallback2(() => {
282
+ if (isOpenDelayedRef.current) {
283
+ handleDelayedOpen();
284
+ } else {
285
+ handleOpen();
286
+ }
287
+ }, [
288
+ isOpenDelayedRef,
289
+ handleDelayedOpen,
290
+ handleOpen
291
+ ]),
292
+ onTriggerLeave: useCallback2(() => {
293
+ if (disableHoverableContent) {
294
+ handleClose();
295
+ } else {
296
+ window.clearTimeout(openTimerRef.current);
297
+ openTimerRef.current = 0;
298
+ }
299
+ }, [
300
+ handleClose,
301
+ disableHoverableContent
302
+ ]),
303
+ onOpen: handleOpen,
304
+ onClose: handleClose,
305
+ disableHoverableContent,
306
+ isPointerInTransitRef,
307
+ onPointerInTransitChange: useCallback2((inTransit) => {
308
+ isPointerInTransitRef.current = inTransit;
309
+ }, [])
310
+ }, /* @__PURE__ */ React5.createElement(TooltipContent, {
311
+ side,
312
+ className: tx("tooltip.content", {
313
+ elevation
314
+ })
315
+ }, content, /* @__PURE__ */ React5.createElement(TooltipArrow, {
316
+ className: tx("tooltip.arrow")
317
+ })), /* @__PURE__ */ React5.createElement(TooltipVirtualTrigger, {
318
+ virtualRef: triggerRef
319
+ }), children));
320
+ };
321
+ TooltipProvider.displayName = TOOLTIP_NAME;
322
+ var TooltipVirtualTrigger = ({ virtualRef, __scopeTooltip }) => {
323
+ const popperScope = usePopperScope(__scopeTooltip);
324
+ return /* @__PURE__ */ React5.createElement(PopperPrimitive.Anchor, {
325
+ asChild: true,
326
+ ...popperScope,
327
+ virtualRef
328
+ });
329
+ };
330
+ var TRIGGER_NAME = "TooltipTrigger";
331
+ var TooltipTrigger = /* @__PURE__ */ forwardRef((props, forwardedRef) => {
332
+ const {
333
+ __scopeTooltip,
334
+ onInteract,
335
+ // TODO(thure): Pass `delayDuration` into the context.
336
+ delayDuration: _delayDuration,
337
+ side,
338
+ content,
339
+ ...triggerProps
340
+ } = props;
341
+ const context = useTooltipContext(TRIGGER_NAME, __scopeTooltip);
342
+ const ref = useRef(null);
343
+ const composedRefs = useComposedRefs(forwardedRef, ref);
344
+ const isPointerDownRef = useRef(false);
345
+ const hasPointerMoveOpenedRef = useRef(false);
346
+ const handlePointerUp = useCallback2(() => isPointerDownRef.current = false, []);
347
+ useEffect3(() => {
348
+ return () => document.removeEventListener("pointerup", handlePointerUp);
349
+ }, [
350
+ handlePointerUp
351
+ ]);
352
+ return /* @__PURE__ */ React5.createElement(Primitive.button, {
353
+ // We purposefully avoid adding `type=button` here because tooltip triggers are also
354
+ // commonly anchors and the anchor `type` attribute signifies MIME type.
355
+ "aria-describedby": context.open ? context.contentId : void 0,
356
+ "data-state": context.stateAttribute,
357
+ "data-tooltip-content": content,
358
+ "data-tooltip-side": side,
359
+ ...triggerProps,
360
+ ref: composedRefs,
361
+ onPointerMove: composeEventHandlers(props.onPointerMove, (event) => {
362
+ if (event.pointerType === "touch") {
363
+ return;
364
+ }
365
+ if (!hasPointerMoveOpenedRef.current && !context.isPointerInTransitRef.current) {
366
+ onInteract?.(event);
367
+ if (event.defaultPrevented) {
368
+ return;
369
+ }
370
+ context.onTriggerChange(ref.current);
371
+ context.onTriggerEnter();
372
+ hasPointerMoveOpenedRef.current = true;
373
+ }
374
+ }),
375
+ onPointerLeave: composeEventHandlers(props.onPointerLeave, () => {
376
+ context.onTriggerLeave();
377
+ hasPointerMoveOpenedRef.current = false;
378
+ }),
379
+ onPointerDown: composeEventHandlers(props.onPointerDown, () => {
380
+ if (context.open) {
381
+ context.onClose();
382
+ }
383
+ isPointerDownRef.current = true;
384
+ document.addEventListener("pointerup", handlePointerUp, {
385
+ once: true
386
+ });
387
+ }),
388
+ onFocus: props.onFocus,
389
+ onBlur: composeEventHandlers(props.onBlur, context.onClose),
390
+ onClick: composeEventHandlers(props.onClick, context.onClose)
391
+ });
392
+ });
393
+ TooltipTrigger.displayName = TRIGGER_NAME;
394
+ var PORTAL_NAME = "TooltipPortal";
395
+ var [PortalProvider, usePortalContext] = createTooltipContext(PORTAL_NAME, {
396
+ forceMount: void 0
397
+ });
398
+ var TooltipPortal = (props) => {
399
+ const { __scopeTooltip, forceMount, children, container } = props;
400
+ const context = useTooltipContext(PORTAL_NAME, __scopeTooltip);
401
+ return /* @__PURE__ */ React5.createElement(PortalProvider, {
402
+ scope: __scopeTooltip,
403
+ forceMount
404
+ }, /* @__PURE__ */ React5.createElement(Presence, {
405
+ present: forceMount || context.open
406
+ }, /* @__PURE__ */ React5.createElement(PortalPrimitive, {
407
+ asChild: true,
408
+ container
409
+ }, children)));
410
+ };
411
+ TooltipPortal.displayName = PORTAL_NAME;
412
+ var CONTENT_NAME = "TooltipContent";
413
+ var TooltipContent = /* @__PURE__ */ forwardRef((props, forwardedRef) => {
414
+ const portalContext = usePortalContext(CONTENT_NAME, props.__scopeTooltip);
415
+ const { forceMount = portalContext.forceMount, side = "top", ...contentProps } = props;
416
+ const context = useTooltipContext(CONTENT_NAME, props.__scopeTooltip);
417
+ return /* @__PURE__ */ React5.createElement(Presence, {
418
+ present: forceMount || context.open
419
+ }, context.disableHoverableContent ? /* @__PURE__ */ React5.createElement(TooltipContentImpl, {
420
+ side,
421
+ ...contentProps,
422
+ ref: forwardedRef
423
+ }) : /* @__PURE__ */ React5.createElement(TooltipContentHoverable, {
424
+ side,
425
+ ...contentProps,
426
+ ref: forwardedRef
427
+ }));
428
+ });
429
+ var TooltipContentHoverable = /* @__PURE__ */ forwardRef((props, forwardedRef) => {
430
+ const context = useTooltipContext(CONTENT_NAME, props.__scopeTooltip);
431
+ const ref = useRef(null);
432
+ const composedRefs = useComposedRefs(forwardedRef, ref);
433
+ const [pointerGraceArea, setPointerGraceArea] = useState3(null);
434
+ const { trigger, onClose } = context;
435
+ const content = ref.current;
436
+ const { onPointerInTransitChange } = context;
437
+ const handleRemoveGraceArea = useCallback2(() => {
438
+ setPointerGraceArea(null);
439
+ onPointerInTransitChange(false);
440
+ }, [
441
+ onPointerInTransitChange
442
+ ]);
443
+ const handleCreateGraceArea = useCallback2((event, hoverTarget) => {
444
+ const currentTarget = event.currentTarget;
445
+ const exitPoint = {
446
+ x: event.clientX,
447
+ y: event.clientY
448
+ };
449
+ const exitSide = getExitSideFromRect(exitPoint, currentTarget.getBoundingClientRect());
450
+ const paddedExitPoints = getPaddedExitPoints(exitPoint, exitSide);
451
+ const hoverTargetPoints = getPointsFromRect(hoverTarget.getBoundingClientRect());
452
+ const graceArea = getHull([
453
+ ...paddedExitPoints,
454
+ ...hoverTargetPoints
455
+ ]);
456
+ setPointerGraceArea(graceArea);
457
+ onPointerInTransitChange(true);
458
+ }, [
459
+ onPointerInTransitChange
460
+ ]);
461
+ useEffect3(() => {
462
+ return () => handleRemoveGraceArea();
463
+ }, [
464
+ handleRemoveGraceArea
465
+ ]);
466
+ useEffect3(() => {
467
+ if (trigger && content) {
468
+ const handleTriggerLeave = (event) => handleCreateGraceArea(event, content);
469
+ const handleContentLeave = (event) => handleCreateGraceArea(event, trigger);
470
+ trigger.addEventListener("pointerleave", handleTriggerLeave);
471
+ content.addEventListener("pointerleave", handleContentLeave);
472
+ return () => {
473
+ trigger.removeEventListener("pointerleave", handleTriggerLeave);
474
+ content.removeEventListener("pointerleave", handleContentLeave);
475
+ };
476
+ }
477
+ }, [
478
+ trigger,
479
+ content,
480
+ handleCreateGraceArea,
481
+ handleRemoveGraceArea
482
+ ]);
483
+ useEffect3(() => {
484
+ if (pointerGraceArea) {
485
+ const handleTrackPointerGrace = (event) => {
486
+ const target = event.target;
487
+ const pointerPosition = {
488
+ x: event.clientX,
489
+ y: event.clientY
490
+ };
491
+ const hasEnteredTarget = trigger?.contains(target) || content?.contains(target);
492
+ const isPointerOutsideGraceArea = !isPointInPolygon(pointerPosition, pointerGraceArea);
493
+ if (hasEnteredTarget) {
494
+ handleRemoveGraceArea();
495
+ } else if (isPointerOutsideGraceArea) {
496
+ handleRemoveGraceArea();
497
+ onClose();
498
+ }
499
+ };
500
+ document.addEventListener("pointermove", handleTrackPointerGrace);
501
+ return () => document.removeEventListener("pointermove", handleTrackPointerGrace);
502
+ }
503
+ }, [
504
+ trigger,
505
+ content,
506
+ pointerGraceArea,
507
+ onClose,
508
+ handleRemoveGraceArea
509
+ ]);
510
+ return /* @__PURE__ */ React5.createElement(TooltipContentImpl, {
511
+ ...props,
512
+ ref: composedRefs
513
+ });
514
+ });
515
+ var [VisuallyHiddenContentContextProvider, useVisuallyHiddenContentContext] = createTooltipContext(TOOLTIP_NAME, {
516
+ isInside: false
517
+ });
518
+ var TooltipContentImpl = /* @__PURE__ */ forwardRef((props, forwardedRef) => {
519
+ const { __scopeTooltip, children, "aria-label": ariaLabel, onEscapeKeyDown, onPointerDownOutside, ...contentProps } = props;
520
+ const context = useTooltipContext(CONTENT_NAME, __scopeTooltip);
521
+ const popperScope = usePopperScope(__scopeTooltip);
522
+ const { onClose } = context;
523
+ useEffect3(() => {
524
+ document.addEventListener(TOOLTIP_OPEN, onClose);
525
+ return () => document.removeEventListener(TOOLTIP_OPEN, onClose);
526
+ }, [
527
+ onClose
528
+ ]);
529
+ useEffect3(() => {
530
+ if (context.trigger) {
531
+ const handleScroll = (event) => {
532
+ const target = event.target;
533
+ if (target?.contains(context.trigger)) {
534
+ onClose();
535
+ }
536
+ };
537
+ window.addEventListener("scroll", handleScroll, {
538
+ capture: true
539
+ });
540
+ return () => window.removeEventListener("scroll", handleScroll, {
541
+ capture: true
542
+ });
543
+ }
544
+ }, [
545
+ context.trigger,
546
+ onClose
547
+ ]);
548
+ return /* @__PURE__ */ React5.createElement(DismissableLayer, {
549
+ asChild: true,
550
+ disableOutsidePointerEvents: false,
551
+ onEscapeKeyDown,
552
+ onPointerDownOutside,
553
+ onFocusOutside: (event) => event.preventDefault(),
554
+ onDismiss: onClose
555
+ }, /* @__PURE__ */ React5.createElement(PopperPrimitive.Content, {
556
+ "data-state": context.stateAttribute,
557
+ ...popperScope,
558
+ ...contentProps,
559
+ ref: forwardedRef,
560
+ style: {
561
+ ...contentProps.style,
562
+ // re-namespace exposed content custom properties
563
+ ...{
564
+ "--radix-tooltip-content-transform-origin": "var(--radix-popper-transform-origin)",
565
+ "--radix-tooltip-content-available-width": "var(--radix-popper-available-width)",
566
+ "--radix-tooltip-content-available-height": "var(--radix-popper-available-height)",
567
+ "--radix-tooltip-trigger-width": "var(--radix-popper-anchor-width)",
568
+ "--radix-tooltip-trigger-height": "var(--radix-popper-anchor-height)"
569
+ }
570
+ }
571
+ }, /* @__PURE__ */ React5.createElement(Slottable, null, children), /* @__PURE__ */ React5.createElement(VisuallyHiddenContentContextProvider, {
572
+ scope: __scopeTooltip,
573
+ isInside: true
574
+ }, /* @__PURE__ */ React5.createElement(VisuallyHiddenPrimitive.Root, {
575
+ id: context.contentId,
576
+ role: "tooltip"
577
+ }, ariaLabel || children))));
578
+ });
579
+ TooltipContent.displayName = CONTENT_NAME;
580
+ var ARROW_NAME = "TooltipArrow";
581
+ var TooltipArrow = /* @__PURE__ */ forwardRef((props, forwardedRef) => {
582
+ const { __scopeTooltip, ...arrowProps } = props;
583
+ const popperScope = usePopperScope(__scopeTooltip);
584
+ const visuallyHiddenContentContext = useVisuallyHiddenContentContext(ARROW_NAME, __scopeTooltip);
585
+ return visuallyHiddenContentContext.isInside ? null : /* @__PURE__ */ React5.createElement(PopperPrimitive.Arrow, {
586
+ ...popperScope,
587
+ ...arrowProps,
588
+ ref: forwardedRef
589
+ });
590
+ });
591
+ TooltipArrow.displayName = ARROW_NAME;
592
+ var getExitSideFromRect = (point, rect) => {
593
+ const top = Math.abs(rect.top - point.y);
594
+ const bottom = Math.abs(rect.bottom - point.y);
595
+ const right = Math.abs(rect.right - point.x);
596
+ const left = Math.abs(rect.left - point.x);
597
+ switch (Math.min(top, bottom, right, left)) {
598
+ case left:
599
+ return "left";
600
+ case right:
601
+ return "right";
602
+ case top:
603
+ return "top";
604
+ case bottom:
605
+ return "bottom";
606
+ default:
607
+ throw new Error("unreachable");
608
+ }
609
+ };
610
+ var getPaddedExitPoints = (exitPoint, exitSide, padding = 5) => {
611
+ const paddedExitPoints = [];
612
+ switch (exitSide) {
613
+ case "top":
614
+ paddedExitPoints.push({
615
+ x: exitPoint.x - padding,
616
+ y: exitPoint.y + padding
617
+ }, {
618
+ x: exitPoint.x + padding,
619
+ y: exitPoint.y + padding
620
+ });
621
+ break;
622
+ case "bottom":
623
+ paddedExitPoints.push({
624
+ x: exitPoint.x - padding,
625
+ y: exitPoint.y - padding
626
+ }, {
627
+ x: exitPoint.x + padding,
628
+ y: exitPoint.y - padding
629
+ });
630
+ break;
631
+ case "left":
632
+ paddedExitPoints.push({
633
+ x: exitPoint.x + padding,
634
+ y: exitPoint.y - padding
635
+ }, {
636
+ x: exitPoint.x + padding,
637
+ y: exitPoint.y + padding
638
+ });
639
+ break;
640
+ case "right":
641
+ paddedExitPoints.push({
642
+ x: exitPoint.x - padding,
643
+ y: exitPoint.y - padding
644
+ }, {
645
+ x: exitPoint.x - padding,
646
+ y: exitPoint.y + padding
647
+ });
648
+ break;
649
+ }
650
+ return paddedExitPoints;
651
+ };
652
+ var getPointsFromRect = (rect) => {
653
+ const { top, right, bottom, left } = rect;
654
+ return [
655
+ {
656
+ x: left,
657
+ y: top
658
+ },
659
+ {
660
+ x: right,
661
+ y: top
662
+ },
663
+ {
664
+ x: right,
665
+ y: bottom
666
+ },
667
+ {
668
+ x: left,
669
+ y: bottom
670
+ }
671
+ ];
672
+ };
673
+ var isPointInPolygon = (point, polygon) => {
674
+ const { x, y } = point;
675
+ let inside = false;
676
+ for (let i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {
677
+ const xi = polygon[i].x;
678
+ const yi = polygon[i].y;
679
+ const xj = polygon[j].x;
680
+ const yj = polygon[j].y;
681
+ const intersect = yi > y !== yj > y && x < (xj - xi) * (y - yi) / (yj - yi) + xi;
682
+ if (intersect) {
683
+ inside = !inside;
684
+ }
685
+ }
686
+ return inside;
687
+ };
688
+ var getHull = (points) => {
689
+ const newPoints = points.slice();
690
+ newPoints.sort((a, b) => {
691
+ if (a.x < b.x) {
692
+ return -1;
693
+ } else if (a.x > b.x) {
694
+ return 1;
695
+ } else if (a.y < b.y) {
696
+ return -1;
697
+ } else if (a.y > b.y) {
698
+ return 1;
699
+ } else {
700
+ return 0;
701
+ }
702
+ });
703
+ return getHullPresorted(newPoints);
704
+ };
705
+ var getHullPresorted = (points) => {
706
+ if (points.length <= 1) {
707
+ return points.slice();
708
+ }
709
+ const upperHull = [];
710
+ for (let i = 0; i < points.length; i++) {
711
+ const p = points[i];
712
+ while (upperHull.length >= 2) {
713
+ const q = upperHull[upperHull.length - 1];
714
+ const r = upperHull[upperHull.length - 2];
715
+ if ((q.x - r.x) * (p.y - r.y) >= (q.y - r.y) * (p.x - r.x)) {
716
+ upperHull.pop();
717
+ } else {
718
+ break;
719
+ }
720
+ }
721
+ upperHull.push(p);
722
+ }
723
+ upperHull.pop();
724
+ const lowerHull = [];
725
+ for (let i = points.length - 1; i >= 0; i--) {
726
+ const p = points[i];
727
+ while (lowerHull.length >= 2) {
728
+ const q = lowerHull[lowerHull.length - 1];
729
+ const r = lowerHull[lowerHull.length - 2];
730
+ if ((q.x - r.x) * (p.y - r.y) >= (q.y - r.y) * (p.x - r.x)) {
731
+ lowerHull.pop();
732
+ } else {
733
+ break;
734
+ }
735
+ }
736
+ lowerHull.push(p);
737
+ }
738
+ lowerHull.pop();
739
+ if (upperHull.length === 1 && lowerHull.length === 1 && upperHull[0].x === lowerHull[0].x && upperHull[0].y === lowerHull[0].y) {
740
+ return upperHull;
741
+ } else {
742
+ return upperHull.concat(lowerHull);
743
+ }
744
+ };
745
+ var Tooltip = {
746
+ Provider: TooltipProvider,
747
+ Trigger: TooltipTrigger
748
+ };
749
+
750
+ // src/hooks/useElevationContext.ts
751
+ var useElevationContext = (propsElevation) => {
752
+ const { elevation } = useContext3(ElevationContext);
753
+ return propsElevation ?? elevation;
754
+ };
755
+
756
+ export {
757
+ DensityContext,
758
+ DensityProvider,
759
+ ElevationContext,
760
+ ElevationProvider,
761
+ useElevationContext,
762
+ useThemeContext,
763
+ initialSafeArea,
764
+ useSafeArea,
765
+ TranslationsContext,
766
+ useTranslation,
767
+ hasIosKeyboard,
768
+ ThemeContext,
769
+ ThemeProvider,
770
+ createTooltipScope,
771
+ useTooltipContext,
772
+ Tooltip
773
+ };
774
+ //# sourceMappingURL=chunk-2FKSMWNY.mjs.map