@dxos/react-ui 0.8.4-main.d05539e30a → 0.8.4-main.d9fc60f731

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