@galaxy-io/dls 1.6.1 → 2.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (540) hide show
  1. package/README.md +47 -50
  2. package/biome/index.json +74 -0
  3. package/biome/plugins/no-hex-literal.grit +20 -0
  4. package/biome/plugins/no-inline-style.grit +13 -0
  5. package/biome/plugins/no-margin.grit +9 -0
  6. package/biome/plugins/warn/no-hex-literal.grit +23 -0
  7. package/biome/plugins/warn/no-inline-style.grit +13 -0
  8. package/biome/plugins/warn/no-margin.grit +9 -0
  9. package/dist/a11y/FocusScope.d.ts +44 -0
  10. package/dist/a11y/FocusScope.js +229 -0
  11. package/dist/a11y/VisuallyHidden.d.ts +21 -0
  12. package/dist/a11y/VisuallyHidden.js +30 -0
  13. package/dist/avatar/Avatar.d.ts +56 -14
  14. package/dist/avatar/Avatar.js +250 -96
  15. package/dist/avatar/AvatarGroup.d.ts +43 -0
  16. package/dist/avatar/AvatarGroup.js +153 -0
  17. package/dist/backgrounds/GridBackground.d.ts +48 -0
  18. package/dist/backgrounds/GridBackground.js +146 -0
  19. package/dist/beacons/Beacon.d.ts +86 -22
  20. package/dist/beacons/Beacon.js +170 -47
  21. package/dist/brand/GalaxyFilamentWordmark.d.ts +30 -0
  22. package/dist/brand/GalaxyFilamentWordmark.js +39 -0
  23. package/dist/brand/GalaxyLogomark.d.ts +26 -0
  24. package/dist/brand/GalaxyLogomark.js +41 -0
  25. package/dist/brand/GalaxyLogomarkAnimation.d.ts +36 -0
  26. package/dist/brand/GalaxyLogomarkAnimation.js +107 -0
  27. package/dist/brand/GalaxyWordmark.d.ts +30 -0
  28. package/dist/brand/GalaxyWordmark.js +63 -0
  29. package/dist/brand/assets/galaxy-logomark-animation.js +136678 -0
  30. package/dist/brand/brandMark.d.ts +26 -0
  31. package/dist/brand/brandMark.js +35 -0
  32. package/dist/buttons/Button.d.ts +148 -59
  33. package/dist/buttons/Button.js +437 -227
  34. package/dist/buttons/ButtonGroup.d.ts +38 -0
  35. package/dist/buttons/ButtonGroup.js +68 -0
  36. package/dist/buttons/CopyButton.d.ts +77 -0
  37. package/dist/buttons/CopyButton.js +65 -0
  38. package/dist/charts/AreaChart.d.ts +49 -0
  39. package/dist/charts/AreaChart.js +31 -0
  40. package/dist/charts/BarChart.d.ts +54 -67
  41. package/dist/charts/BarChart.js +160 -124
  42. package/dist/charts/ChartAxis.d.ts +35 -40
  43. package/dist/charts/ChartAxis.js +114 -90
  44. package/dist/charts/ChartCategoryTargets.d.ts +12 -26
  45. package/dist/charts/ChartCategoryTargets.js +33 -20
  46. package/dist/charts/ChartFrame.d.ts +71 -116
  47. package/dist/charts/ChartFrame.js +306 -97
  48. package/dist/charts/ChartGroupProvider.d.ts +30 -41
  49. package/dist/charts/ChartGroupProvider.js +20 -7
  50. package/dist/charts/ChartLegend.d.ts +37 -48
  51. package/dist/charts/ChartLegend.js +243 -125
  52. package/dist/charts/ChartMarkTargets.d.ts +12 -28
  53. package/dist/charts/ChartMarkTargets.js +34 -20
  54. package/dist/charts/ChartPrimitives.d.ts +50 -305
  55. package/dist/charts/ChartPrimitives.js +65 -413
  56. package/dist/charts/ChartTooltip.d.ts +20 -26
  57. package/dist/charts/ChartTooltip.js +77 -40
  58. package/dist/charts/Heatmap.d.ts +35 -0
  59. package/dist/charts/Heatmap.js +307 -0
  60. package/dist/charts/LineChart.d.ts +54 -47
  61. package/dist/charts/LineChart.js +174 -121
  62. package/dist/charts/PieChart.d.ts +32 -53
  63. package/dist/charts/PieChart.js +159 -136
  64. package/dist/charts/Sparkline.d.ts +107 -0
  65. package/dist/charts/Sparkline.js +244 -0
  66. package/dist/charts/StatChart.d.ts +37 -13
  67. package/dist/charts/StatChart.js +82 -35
  68. package/dist/charts/barChartGeometry.d.ts +138 -86
  69. package/dist/charts/barChartGeometry.js +122 -101
  70. package/dist/charts/barChartLegend.d.ts +14 -18
  71. package/dist/charts/barChartLegend.js +18 -13
  72. package/dist/charts/chartFormat.d.ts +12 -18
  73. package/dist/charts/chartFormat.js +20 -52
  74. package/dist/charts/chartPalette.d.ts +33 -0
  75. package/dist/charts/chartPalette.js +68 -0
  76. package/dist/charts/chartScales.d.ts +41 -108
  77. package/dist/charts/chartScales.js +62 -128
  78. package/dist/charts/chartSelection.d.ts +15 -0
  79. package/dist/charts/chartSelection.js +22 -0
  80. package/dist/charts/constants.d.ts +100 -256
  81. package/dist/charts/constants.js +109 -275
  82. package/dist/charts/heatmapGeometry.d.ts +95 -0
  83. package/dist/charts/heatmapGeometry.js +155 -0
  84. package/dist/charts/lineChartGeometry.d.ts +108 -58
  85. package/dist/charts/lineChartGeometry.js +120 -78
  86. package/dist/charts/pieChartGeometry.d.ts +66 -40
  87. package/dist/charts/pieChartGeometry.js +68 -38
  88. package/dist/charts/types.d.ts +206 -466
  89. package/dist/charts/types.js +55 -144
  90. package/dist/charts/useCartesianChartLayout.d.ts +28 -59
  91. package/dist/charts/useCartesianChartLayout.js +47 -32
  92. package/dist/charts/useChartDimensions.d.ts +19 -40
  93. package/dist/charts/useChartDimensions.js +40 -56
  94. package/dist/charts/useChartFormatters.d.ts +6 -15
  95. package/dist/charts/useChartFormatters.js +4 -9
  96. package/dist/charts/useChartInteraction.d.ts +69 -116
  97. package/dist/charts/useChartInteraction.js +148 -78
  98. package/dist/charts/useChartTooltipPosition.d.ts +29 -39
  99. package/dist/charts/useChartTooltipPosition.js +14 -5
  100. package/dist/charts/useSeriesColorResolver.d.ts +11 -33
  101. package/dist/charts/useSeriesColorResolver.js +19 -12
  102. package/dist/chips/Chip.d.ts +155 -44
  103. package/dist/chips/Chip.js +329 -155
  104. package/dist/chips/ChipGroup.d.ts +53 -0
  105. package/dist/chips/ChipGroup.js +98 -0
  106. package/dist/drawer/Drawer.d.ts +83 -17
  107. package/dist/drawer/Drawer.js +399 -65
  108. package/dist/dropdown/Dropdown.d.ts +80 -63
  109. package/dist/dropdown/Dropdown.js +127 -129
  110. package/dist/editor/CodeEditor.d.ts +119 -40
  111. package/dist/editor/CodeEditor.js +490 -400
  112. package/dist/editor/CodeEditorReactWidget.d.ts +20 -17
  113. package/dist/editor/CodeEditorReactWidget.js +28 -21
  114. package/dist/feedback/Alert.d.ts +49 -0
  115. package/dist/feedback/Alert.js +172 -0
  116. package/dist/feedback/EmptyState.d.ts +39 -0
  117. package/dist/feedback/EmptyState.js +109 -0
  118. package/dist/feedback/ProgressBar.d.ts +125 -0
  119. package/dist/feedback/ProgressBar.js +183 -0
  120. package/dist/feedback/ProgressCircle.d.ts +99 -0
  121. package/dist/feedback/ProgressCircle.js +187 -0
  122. package/dist/feedback/Skeleton.d.ts +69 -0
  123. package/dist/feedback/Skeleton.js +130 -0
  124. package/dist/feedback/Spinner.d.ts +63 -0
  125. package/dist/feedback/Spinner.js +141 -0
  126. package/dist/fonts.css +70 -0
  127. package/dist/hooks/internal/useIsClient.d.ts +2 -0
  128. package/dist/hooks/internal/useIsClient.js +14 -0
  129. package/dist/hooks/useClipboard.d.ts +19 -0
  130. package/dist/hooks/useClipboard.js +45 -0
  131. package/dist/hooks/useControlledOpenState.d.ts +21 -0
  132. package/dist/hooks/useControlledOpenState.js +19 -0
  133. package/dist/hooks/useControlledState.d.ts +19 -0
  134. package/dist/hooks/useControlledState.js +22 -0
  135. package/dist/hooks/useDebouncedValue.d.ts +14 -0
  136. package/dist/hooks/useDebouncedValue.js +33 -0
  137. package/dist/hooks/useDisclosure.d.ts +26 -0
  138. package/dist/hooks/useDisclosure.js +36 -0
  139. package/dist/hooks/useDismiss.d.ts +23 -27
  140. package/dist/hooks/useDismiss.js +39 -27
  141. package/dist/hooks/useElementClientSize.d.ts +10 -10
  142. package/dist/hooks/useElementClientSize.js +8 -11
  143. package/dist/hooks/useElementWidth.d.ts +6 -13
  144. package/dist/hooks/useElementWidth.js +6 -14
  145. package/dist/hooks/useField.d.ts +47 -0
  146. package/dist/hooks/useField.js +40 -0
  147. package/dist/hooks/useHotkey.d.ts +77 -0
  148. package/dist/hooks/useHotkey.js +246 -0
  149. package/dist/hooks/useIsMac.d.ts +12 -0
  150. package/dist/hooks/useIsMac.js +27 -0
  151. package/dist/hooks/useIsomorphicLayoutEffect.d.ts +17 -0
  152. package/dist/hooks/useIsomorphicLayoutEffect.js +20 -0
  153. package/dist/hooks/useLocalStorage.d.ts +28 -0
  154. package/dist/hooks/useLocalStorage.js +145 -0
  155. package/dist/hooks/useMediaQuery.d.ts +11 -0
  156. package/dist/hooks/useMediaQuery.js +23 -0
  157. package/dist/hooks/usePrefersReducedMotion.d.ts +12 -0
  158. package/dist/hooks/usePrefersReducedMotion.js +25 -0
  159. package/dist/hooks/useResize.d.ts +42 -62
  160. package/dist/hooks/useResize.js +43 -31
  161. package/dist/icons/Icon.d.ts +64 -37
  162. package/dist/icons/Icon.js +96 -37
  163. package/dist/icons/internal/IconSlot.d.ts +10 -0
  164. package/dist/icons/internal/IconSlot.js +32 -0
  165. package/dist/inputs/CheckboxGroup.d.ts +115 -0
  166. package/dist/inputs/CheckboxGroup.js +183 -0
  167. package/dist/inputs/CheckboxInput.d.ts +98 -28
  168. package/dist/inputs/CheckboxInput.js +218 -88
  169. package/dist/inputs/ColorInput.d.ts +115 -29
  170. package/dist/inputs/ColorInput.js +748 -326
  171. package/dist/inputs/CopyInput.d.ts +49 -20
  172. package/dist/inputs/CopyInput.js +57 -49
  173. package/dist/inputs/CronInput.d.ts +94 -0
  174. package/dist/inputs/CronInput.js +618 -0
  175. package/dist/inputs/DateInput.d.ts +175 -28
  176. package/dist/inputs/DateInput.js +1109 -451
  177. package/dist/inputs/DurationInput.d.ts +101 -0
  178. package/dist/inputs/DurationInput.js +441 -0
  179. package/dist/inputs/Field.d.ts +75 -0
  180. package/dist/inputs/Field.js +247 -0
  181. package/dist/inputs/Fieldset.d.ts +53 -0
  182. package/dist/inputs/Fieldset.js +149 -0
  183. package/dist/inputs/FileInput.d.ts +110 -0
  184. package/dist/inputs/FileInput.js +476 -0
  185. package/dist/inputs/Input.d.ts +148 -187
  186. package/dist/inputs/Input.js +339 -259
  187. package/dist/inputs/KeyValueInput.d.ts +120 -0
  188. package/dist/inputs/KeyValueInput.js +383 -0
  189. package/dist/inputs/MultiSelectInput.d.ts +165 -54
  190. package/dist/inputs/MultiSelectInput.js +175 -559
  191. package/dist/inputs/NumberInput.d.ts +65 -9
  192. package/dist/inputs/NumberInput.js +197 -40
  193. package/dist/inputs/PasswordInput.d.ts +17 -12
  194. package/dist/inputs/PasswordInput.js +33 -33
  195. package/dist/inputs/PinInput.d.ts +117 -0
  196. package/dist/inputs/PinInput.js +364 -0
  197. package/dist/inputs/RadioGroup.d.ts +115 -0
  198. package/dist/inputs/RadioGroup.js +179 -0
  199. package/dist/inputs/RadioInput.d.ts +87 -24
  200. package/dist/inputs/RadioInput.js +182 -95
  201. package/dist/inputs/SearchInput.d.ts +66 -0
  202. package/dist/inputs/SearchInput.js +156 -0
  203. package/dist/inputs/SelectInput.d.ts +195 -55
  204. package/dist/inputs/SelectInput.js +1308 -446
  205. package/dist/inputs/SliderInput.d.ts +150 -30
  206. package/dist/inputs/SliderInput.js +441 -186
  207. package/dist/inputs/SwitchInput.d.ts +109 -0
  208. package/dist/inputs/SwitchInput.js +248 -0
  209. package/dist/inputs/TagInput.d.ts +117 -0
  210. package/dist/inputs/TagInput.js +408 -0
  211. package/dist/inputs/TextAreaInput.d.ts +146 -44
  212. package/dist/inputs/TextAreaInput.js +298 -198
  213. package/dist/inputs/TextInput.d.ts +4 -13
  214. package/dist/inputs/TextInput.js +13 -48
  215. package/dist/inputs/ToggleInput.d.ts +120 -22
  216. package/dist/inputs/ToggleInput.js +262 -116
  217. package/dist/inputs/internal/bareField.d.ts +18 -0
  218. package/dist/inputs/internal/bareField.js +38 -0
  219. package/dist/inputs/internal/devWarn.d.ts +7 -0
  220. package/dist/inputs/internal/devWarn.js +30 -0
  221. package/dist/inputs/internal/fieldFrame.d.ts +34 -0
  222. package/dist/inputs/internal/fieldFrame.js +64 -0
  223. package/dist/inputs/internal/fieldWiring.d.ts +50 -0
  224. package/dist/inputs/internal/fieldWiring.js +38 -0
  225. package/dist/inputs/internal/innerButton.d.ts +2 -0
  226. package/dist/inputs/internal/innerButton.js +24 -0
  227. package/dist/inputs/internal/ownField.d.ts +45 -0
  228. package/dist/inputs/internal/ownField.js +58 -0
  229. package/dist/inputs/internal/predicates.d.ts +9 -0
  230. package/dist/inputs/internal/predicates.js +11 -0
  231. package/dist/inputs/internal/useComboboxPopover.d.ts +46 -0
  232. package/dist/inputs/internal/useComboboxPopover.js +92 -0
  233. package/dist/json/JsonViewer.d.ts +62 -0
  234. package/dist/json/JsonViewer.js +483 -0
  235. package/dist/layout/Box.d.ts +87 -0
  236. package/dist/layout/Box.js +109 -0
  237. package/dist/layout/Divider.d.ts +25 -0
  238. package/dist/layout/Divider.js +70 -0
  239. package/dist/layout/Flex.d.ts +139 -0
  240. package/dist/layout/Flex.js +165 -0
  241. package/dist/layout/FlexItem.d.ts +72 -0
  242. package/dist/layout/FlexItem.js +84 -0
  243. package/dist/layout/Grid.d.ts +140 -0
  244. package/dist/layout/Grid.js +178 -0
  245. package/dist/layout/Portal.d.ts +29 -0
  246. package/dist/layout/Portal.js +27 -0
  247. package/dist/layout/ResizablePanels.d.ts +88 -0
  248. package/dist/layout/ResizablePanels.js +198 -0
  249. package/dist/layout/ResizeHandle.d.ts +48 -0
  250. package/dist/layout/ResizeHandle.js +143 -0
  251. package/dist/layout/ScrollArea.d.ts +30 -0
  252. package/dist/layout/ScrollArea.js +138 -0
  253. package/dist/links/Link.d.ts +101 -1
  254. package/dist/links/Link.js +166 -4
  255. package/dist/lists/BulletedList.d.ts +25 -7
  256. package/dist/lists/BulletedList.js +72 -27
  257. package/dist/lists/DescriptionList.d.ts +91 -0
  258. package/dist/lists/DescriptionList.js +147 -0
  259. package/dist/menu/ContextMenu.d.ts +64 -0
  260. package/dist/menu/ContextMenu.js +34 -0
  261. package/dist/menu/Menu.d.ts +280 -0
  262. package/dist/menu/Menu.js +1003 -0
  263. package/dist/modal/ConfirmDialog.d.ts +55 -0
  264. package/dist/modal/ConfirmDialog.js +151 -0
  265. package/dist/modal/Modal.d.ts +64 -14
  266. package/dist/modal/Modal.js +189 -48
  267. package/dist/navigation/Breadcrumbs.d.ts +65 -0
  268. package/dist/navigation/Breadcrumbs.js +243 -0
  269. package/dist/navigation/CommandPalette.d.ts +83 -0
  270. package/dist/navigation/CommandPalette.js +509 -0
  271. package/dist/navigation/Pagination.d.ts +87 -0
  272. package/dist/navigation/Pagination.js +300 -0
  273. package/dist/navigation/SidebarNav.d.ts +107 -0
  274. package/dist/navigation/SidebarNav.js +341 -0
  275. package/dist/navigation/Stepper.d.ts +52 -0
  276. package/dist/navigation/Stepper.js +207 -0
  277. package/dist/navigation/Tabs.d.ts +113 -0
  278. package/dist/navigation/Tabs.js +543 -0
  279. package/dist/navigation/Topbar.d.ts +20 -0
  280. package/dist/navigation/Topbar.js +62 -0
  281. package/dist/overlay/OverlayProvider.d.ts +28 -32
  282. package/dist/overlay/OverlayProvider.js +42 -93
  283. package/dist/overlay/useOverlay.d.ts +88 -12
  284. package/dist/overlay/useOverlay.js +220 -43
  285. package/dist/overlays/Popover.d.ts +114 -0
  286. package/dist/overlays/Popover.js +389 -0
  287. package/dist/shapes/Circle.d.ts +84 -8
  288. package/dist/shapes/Circle.js +122 -20
  289. package/dist/shapes/Square.d.ts +84 -8
  290. package/dist/shapes/Square.js +123 -20
  291. package/dist/styles/mixins.d.ts +35 -0
  292. package/dist/styles/mixins.js +60 -0
  293. package/dist/styles.css +1 -202
  294. package/dist/table/InfiniteSpreadsheet.d.ts +140 -10
  295. package/dist/table/InfiniteSpreadsheet.js +762 -225
  296. package/dist/table/InfiniteTable.d.ts +116 -14
  297. package/dist/table/InfiniteTable.js +287 -429
  298. package/dist/table/SpreadsheetCellEditor.d.ts +54 -6
  299. package/dist/table/SpreadsheetCellEditor.js +163 -84
  300. package/dist/table/TableCore.d.ts +252 -0
  301. package/dist/table/TableCore.js +1082 -0
  302. package/dist/table/VirtualizedInfiniteTable.d.ts +104 -14
  303. package/dist/table/VirtualizedInfiniteTable.js +280 -219
  304. package/dist/table/types.d.ts +66 -244
  305. package/dist/table/types.js +0 -51
  306. package/dist/table/useInfiniteScrollSentinel.d.ts +25 -21
  307. package/dist/table/useInfiniteScrollSentinel.js +38 -30
  308. package/dist/table/useSpreadsheetCellNavigation.d.ts +44 -0
  309. package/dist/table/useSpreadsheetCellNavigation.js +141 -0
  310. package/dist/table/useTableColumnLayout.d.ts +90 -25
  311. package/dist/table/useTableColumnLayout.js +255 -50
  312. package/dist/table/useTableKeyboardNavigation.d.ts +32 -21
  313. package/dist/table/useTableKeyboardNavigation.js +95 -71
  314. package/dist/table/useTableRowSelection.d.ts +24 -25
  315. package/dist/table/useTableRowSelection.js +57 -84
  316. package/dist/table/useTableVirtualizer.d.ts +20 -0
  317. package/dist/table/useTableVirtualizer.js +48 -0
  318. package/dist/text/Bold.d.ts +5 -6
  319. package/dist/text/Bold.js +16 -15
  320. package/dist/text/Code.d.ts +5 -6
  321. package/dist/text/Code.js +16 -25
  322. package/dist/text/CodeBlock.d.ts +77 -0
  323. package/dist/text/CodeBlock.js +373 -0
  324. package/dist/text/EditableText.d.ts +55 -15
  325. package/dist/text/EditableText.js +153 -135
  326. package/dist/text/Ellipsis.d.ts +34 -8
  327. package/dist/text/Ellipsis.js +55 -23
  328. package/dist/text/Kbd.d.ts +72 -0
  329. package/dist/text/Kbd.js +284 -0
  330. package/dist/text/MarkdownText.d.ts +27 -10
  331. package/dist/text/MarkdownText.js +317 -300
  332. package/dist/text/RequiredMarker.d.ts +17 -5
  333. package/dist/text/RequiredMarker.js +34 -36
  334. package/dist/text/Selectable.d.ts +5 -6
  335. package/dist/text/Selectable.js +16 -13
  336. package/dist/text/Span.d.ts +82 -0
  337. package/dist/text/Span.js +115 -0
  338. package/dist/text/Text.d.ts +128 -41
  339. package/dist/text/Text.js +209 -76
  340. package/dist/theme/GalaxyProvider.d.ts +75 -0
  341. package/dist/theme/GalaxyProvider.js +223 -0
  342. package/dist/theme/ThemeSwitcher.d.ts +52 -0
  343. package/dist/theme/ThemeSwitcher.js +94 -0
  344. package/dist/theme/enums.d.ts +118 -0
  345. package/dist/theme/enums.js +144 -0
  346. package/dist/theme/tokens/dark.d.ts +2 -0
  347. package/dist/theme/tokens/dark.js +275 -0
  348. package/dist/theme/tokens/generate.d.ts +15 -0
  349. package/dist/theme/tokens/generate.js +47 -0
  350. package/dist/theme/tokens/light.d.ts +2 -0
  351. package/dist/theme/tokens/light.js +274 -0
  352. package/dist/theme/tokens/palette.d.ts +14 -0
  353. package/dist/theme/tokens/palette.js +153 -0
  354. package/dist/theme/tokens/scales.d.ts +26 -0
  355. package/dist/theme/tokens/scales.js +154 -0
  356. package/dist/theme/tokens/t.d.ts +3 -0
  357. package/dist/theme/tokens/t.js +25 -0
  358. package/dist/theme/tokens/types.d.ts +189 -0
  359. package/dist/theme/tokens/types.js +0 -0
  360. package/dist/theme/useGalaxyTheme.d.ts +46 -0
  361. package/dist/theme/useGalaxyTheme.js +36 -0
  362. package/dist/theme/useInverseScope.d.ts +18 -0
  363. package/dist/theme/useInverseScope.js +33 -0
  364. package/dist/three/GalaxyLogomark3D.d.ts +46 -0
  365. package/dist/three/GalaxyLogomark3D.js +134 -0
  366. package/dist/three/assets/galaxy-logomark.js +4 -0
  367. package/dist/three/galaxyLogomark3DScene.d.ts +27 -0
  368. package/dist/three/galaxyLogomark3DScene.js +165 -0
  369. package/dist/timeline/Timeline.d.ts +120 -0
  370. package/dist/timeline/Timeline.js +301 -0
  371. package/dist/toast/Toast.d.ts +43 -19
  372. package/dist/toast/Toast.js +130 -89
  373. package/dist/toast/ToastProvider.d.ts +23 -23
  374. package/dist/toast/ToastProvider.js +298 -101
  375. package/dist/toast/ToastViewport.d.ts +12 -0
  376. package/dist/toast/ToastViewport.js +210 -0
  377. package/dist/toast/useToast.d.ts +139 -5
  378. package/dist/toast/useToast.js +15 -13
  379. package/dist/tokens.css +654 -0
  380. package/dist/tooltip/Tooltip.d.ts +64 -44
  381. package/dist/tooltip/Tooltip.js +280 -73
  382. package/dist/tooltip/internal/LazyTooltip.d.ts +7 -0
  383. package/dist/tooltip/internal/LazyTooltip.js +53 -0
  384. package/dist/transform/Fade.d.ts +33 -11
  385. package/dist/transform/Fade.js +71 -19
  386. package/dist/transform/Flasher.d.ts +25 -0
  387. package/dist/transform/Flasher.js +39 -0
  388. package/dist/transform/Rotate.d.ts +24 -12
  389. package/dist/transform/Rotate.js +36 -22
  390. package/dist/transform/ScaleFade.d.ts +36 -11
  391. package/dist/transform/ScaleFade.js +86 -28
  392. package/dist/transform/internal/CollapseMotion.d.ts +10 -0
  393. package/dist/transform/internal/CollapseMotion.js +65 -0
  394. package/dist/tree/Tree.d.ts +85 -0
  395. package/dist/tree/Tree.js +387 -0
  396. package/dist/tree/treeRow.d.ts +39 -0
  397. package/dist/tree/treeRow.js +75 -0
  398. package/dist/utils/colors.d.ts +46 -13
  399. package/dist/utils/colors.js +92 -34
  400. package/dist/utils/css.d.ts +23 -0
  401. package/dist/utils/css.js +30 -0
  402. package/dist/utils/format.d.ts +58 -0
  403. package/dist/utils/format.js +220 -0
  404. package/dist/vite/index.d.ts +16 -0
  405. package/dist/vite/index.js +52 -0
  406. package/dist/widget/Widget.d.ts +164 -48
  407. package/dist/widget/Widget.js +335 -96
  408. package/dist/widget/WidgetGroup.d.ts +36 -0
  409. package/dist/widget/WidgetGroup.js +103 -0
  410. package/package.json +855 -157
  411. package/dist/accordion/Accordion.d.ts +0 -54
  412. package/dist/accordion/Accordion.js +0 -183
  413. package/dist/assets/components/GalaxyFilamentWordmarkDark.d.ts +0 -3
  414. package/dist/assets/components/GalaxyFilamentWordmarkDark.js +0 -14
  415. package/dist/assets/components/GalaxyFilamentWordmarkLight.d.ts +0 -3
  416. package/dist/assets/components/GalaxyFilamentWordmarkLight.js +0 -14
  417. package/dist/assets/components/GalaxyLogomarkDark.d.ts +0 -3
  418. package/dist/assets/components/GalaxyLogomarkDark.js +0 -11
  419. package/dist/assets/components/GalaxyLogomarkLight.d.ts +0 -3
  420. package/dist/assets/components/GalaxyLogomarkLight.js +0 -17
  421. package/dist/assets/components/GalaxyWordmarkDark.d.ts +0 -3
  422. package/dist/assets/components/GalaxyWordmarkDark.js +0 -15
  423. package/dist/assets/components/GalaxyWordmarkLight.d.ts +0 -3
  424. package/dist/assets/components/GalaxyWordmarkLight.js +0 -28
  425. package/dist/assets/models/galaxy-animation.js +0 -136666
  426. package/dist/assets/models/galaxy-logomark.js +0 -4
  427. package/dist/avatar/AvatarShimmer.d.ts +0 -30
  428. package/dist/avatar/AvatarShimmer.js +0 -22
  429. package/dist/backgrounds/CellGridBackground.d.ts +0 -24
  430. package/dist/backgrounds/CellGridBackground.js +0 -44
  431. package/dist/backgrounds/CrossGridBackground.d.ts +0 -26
  432. package/dist/backgrounds/CrossGridBackground.js +0 -49
  433. package/dist/backgrounds/DotGridBackground.d.ts +0 -24
  434. package/dist/backgrounds/DotGridBackground.js +0 -47
  435. package/dist/badge/Badge.d.ts +0 -42
  436. package/dist/badge/Badge.js +0 -99
  437. package/dist/charts/ChartEmptyState.d.ts +0 -17
  438. package/dist/charts/ChartEmptyState.js +0 -29
  439. package/dist/charts/ProgressBar.d.ts +0 -29
  440. package/dist/charts/ProgressBar.js +0 -65
  441. package/dist/charts/chartTheme.d.ts +0 -18
  442. package/dist/charts/chartTheme.js +0 -26
  443. package/dist/containers/FlexItem.d.ts +0 -50
  444. package/dist/containers/FlexItem.js +0 -91
  445. package/dist/containers/FlexWrapper.d.ts +0 -96
  446. package/dist/containers/FlexWrapper.js +0 -143
  447. package/dist/containers/GridWrapper.d.ts +0 -79
  448. package/dist/containers/GridWrapper.js +0 -125
  449. package/dist/containers/Spacing.d.ts +0 -23
  450. package/dist/containers/Spacing.js +0 -59
  451. package/dist/containers/Wrapper.d.ts +0 -26
  452. package/dist/containers/Wrapper.js +0 -54
  453. package/dist/dividers/HorizontalDivider.d.ts +0 -7
  454. package/dist/dividers/HorizontalDivider.js +0 -39
  455. package/dist/dividers/VerticalDivider.d.ts +0 -6
  456. package/dist/dividers/VerticalDivider.js +0 -21
  457. package/dist/icons/GalaxyFilamentWordmark.d.ts +0 -11
  458. package/dist/icons/GalaxyFilamentWordmark.js +0 -25
  459. package/dist/icons/GalaxyLogomark.d.ts +0 -13
  460. package/dist/icons/GalaxyLogomark.js +0 -27
  461. package/dist/icons/GalaxyLogomark3D.d.ts +0 -56
  462. package/dist/icons/GalaxyLogomark3D.js +0 -319
  463. package/dist/icons/GalaxyLogomarkAnimation.d.ts +0 -18
  464. package/dist/icons/GalaxyLogomarkAnimation.js +0 -48
  465. package/dist/icons/GalaxyWordmark.d.ts +0 -11
  466. package/dist/icons/GalaxyWordmark.js +0 -25
  467. package/dist/inputs/MultiTextInput.d.ts +0 -32
  468. package/dist/inputs/MultiTextInput.js +0 -180
  469. package/dist/inputs/SwitcherInput.d.ts +0 -30
  470. package/dist/inputs/SwitcherInput.js +0 -81
  471. package/dist/inputs/hooks.d.ts +0 -10
  472. package/dist/inputs/hooks.js +0 -22
  473. package/dist/overlay/constants.d.ts +0 -28
  474. package/dist/overlay/constants.js +0 -37
  475. package/dist/resizable/HorizontalResizeHandle.d.ts +0 -17
  476. package/dist/resizable/HorizontalResizeHandle.js +0 -38
  477. package/dist/resizable/VerticalResizeHandle.d.ts +0 -18
  478. package/dist/resizable/VerticalResizeHandle.js +0 -39
  479. package/dist/table/SpreadsheetCell.d.ts +0 -21
  480. package/dist/table/SpreadsheetCell.js +0 -71
  481. package/dist/table/SpreadsheetHeaderCell.d.ts +0 -23
  482. package/dist/table/SpreadsheetHeaderCell.js +0 -91
  483. package/dist/table/SpreadsheetMenuItem.d.ts +0 -14
  484. package/dist/table/SpreadsheetMenuItem.js +0 -33
  485. package/dist/table/SpreadsheetPrimitives.d.ts +0 -172
  486. package/dist/table/SpreadsheetPrimitives.js +0 -105
  487. package/dist/table/SpreadsheetRow.d.ts +0 -33
  488. package/dist/table/SpreadsheetRow.js +0 -73
  489. package/dist/table/SpreadsheetRowActionCell.d.ts +0 -14
  490. package/dist/table/SpreadsheetRowActionCell.js +0 -51
  491. package/dist/table/TableExpandCell.d.ts +0 -11
  492. package/dist/table/TableExpandCell.js +0 -24
  493. package/dist/table/TableExpandedRow.d.ts +0 -16
  494. package/dist/table/TableExpandedRow.js +0 -77
  495. package/dist/table/TableHeaderCellContent.d.ts +0 -30
  496. package/dist/table/TableHeaderCellContent.js +0 -48
  497. package/dist/table/TablePrimitives.d.ts +0 -313
  498. package/dist/table/TablePrimitives.js +0 -302
  499. package/dist/table/TableSelectCell.d.ts +0 -18
  500. package/dist/table/TableSelectCell.js +0 -27
  501. package/dist/table/TableStatusRow.d.ts +0 -18
  502. package/dist/table/TableStatusRow.js +0 -50
  503. package/dist/table/useSpreadsheetEditing.d.ts +0 -13
  504. package/dist/table/useSpreadsheetEditing.js +0 -41
  505. package/dist/table/useTableColumnResize.d.ts +0 -38
  506. package/dist/table/useTableColumnResize.js +0 -155
  507. package/dist/table/useTableRowExpansion.d.ts +0 -24
  508. package/dist/table/useTableRowExpansion.js +0 -62
  509. package/dist/table/utils.d.ts +0 -50
  510. package/dist/table/utils.js +0 -78
  511. package/dist/text/HotKeys.d.ts +0 -30
  512. package/dist/text/HotKeys.js +0 -74
  513. package/dist/text/Paragraph.d.ts +0 -33
  514. package/dist/text/Paragraph.js +0 -83
  515. package/dist/text/TextShimmer.d.ts +0 -14
  516. package/dist/text/TextShimmer.js +0 -34
  517. package/dist/theme/GalaxyTheme.d.ts +0 -67
  518. package/dist/theme/GalaxyTheme.js +0 -119
  519. package/dist/theme/constants.d.ts +0 -8
  520. package/dist/theme/constants.js +0 -38
  521. package/dist/theme/index.d.ts +0 -6
  522. package/dist/theme/index.js +0 -7
  523. package/dist/theme/types.d.ts +0 -195
  524. package/dist/theme/types.js +0 -10
  525. package/dist/theme/typography.d.ts +0 -2
  526. package/dist/theme/typography.js +0 -73
  527. package/dist/theme/variants/dark.d.ts +0 -2
  528. package/dist/theme/variants/dark.js +0 -125
  529. package/dist/theme/variants/light.d.ts +0 -2
  530. package/dist/theme/variants/light.js +0 -125
  531. package/dist/toast/ToastContainer.d.ts +0 -10
  532. package/dist/toast/ToastContainer.js +0 -31
  533. package/dist/toast/ToastWrapper.d.ts +0 -6
  534. package/dist/toast/ToastWrapper.js +0 -27
  535. package/dist/transform/Flash.d.ts +0 -7
  536. package/dist/transform/Flash.js +0 -18
  537. package/dist/transform/Spin.d.ts +0 -14
  538. package/dist/transform/Spin.js +0 -25
  539. package/dist/utils/linaria.d.ts +0 -1
  540. package/dist/utils/linaria.js +0 -8
@@ -1,26 +0,0 @@
1
- import type { PropsWithChildren } from "react";
2
- export interface WrapperProps {
3
- /** @default "static" */
4
- position?: React.CSSProperties["position"];
5
- minWidth?: number | string;
6
- /** Doubles as the width when `fillWidth` is off. A number is px. */
7
- maxWidth?: number | string;
8
- /** `width: 100%`. Takes precedence over `maxWidth`. */
9
- fillWidth?: boolean;
10
- /** `height: 100%`. */
11
- fillHeight?: boolean;
12
- /** @default "visible" */
13
- overflow?: React.CSSProperties["overflow"];
14
- padding?: React.CSSProperties["padding"];
15
- /** Offset — only applies once `position` is not `static`. */
16
- top?: React.CSSProperties["top"];
17
- right?: React.CSSProperties["right"];
18
- bottom?: React.CSSProperties["bottom"];
19
- left?: React.CSSProperties["left"];
20
- }
21
- /**
22
- * A plain `div` with positioning and sizing props — the escape hatch for when
23
- * you need a positioned box without flex or grid layout on it.
24
- */
25
- declare const Wrapper: ({ children, position, minWidth, maxWidth, fillWidth, fillHeight, overflow, padding, top, right, bottom, left, }: PropsWithChildren<WrapperProps>) => import("react").JSX.Element;
26
- export default Wrapper;
@@ -1,54 +0,0 @@
1
- import { getCssSizeValue } from "../utils/linaria.js";
2
- /* empty css */
3
- import { styled } from "@linaria/react";
4
- import { jsx } from "react/jsx-runtime";
5
- //#region src/containers/Wrapper.tsx
6
- var _exp = () => ({ $position }) => $position ?? "static";
7
- var _exp2 = () => ({ $minWidth }) => $minWidth ? getCssSizeValue($minWidth) : "auto";
8
- var _exp3 = () => ({ $fillWidth, $maxWidth }) => $fillWidth ? "100%" : $maxWidth ? getCssSizeValue($maxWidth) : "auto";
9
- var _exp4 = () => ({ $fillHeight }) => $fillHeight ? "100%" : "auto";
10
- var _exp5 = () => ({ $overflow }) => $overflow ?? "visible";
11
- var _exp6 = () => ({ $padding }) => $padding ?? "0";
12
- var _exp7 = () => ({ $top }) => $top ?? "auto";
13
- var _exp8 = () => ({ $right }) => $right ?? "auto";
14
- var _exp9 = () => ({ $bottom }) => $bottom ?? "auto";
15
- var _exp0 = () => ({ $left }) => $left ?? "auto";
16
- var StyledWrapper = /*#__PURE__*/ styled("div")({
17
- name: "StyledWrapper",
18
- class: "sck44b4",
19
- propsAsIs: false,
20
- vars: {
21
- "sck44b4-0": [_exp()],
22
- "sck44b4-1": [_exp2()],
23
- "sck44b4-2": [_exp3()],
24
- "sck44b4-3": [_exp4()],
25
- "sck44b4-4": [_exp5()],
26
- "sck44b4-5": [_exp6()],
27
- "sck44b4-6": [_exp7()],
28
- "sck44b4-7": [_exp8()],
29
- "sck44b4-8": [_exp9()],
30
- "sck44b4-9": [_exp0()]
31
- }
32
- });
33
- /**
34
- * A plain `div` with positioning and sizing props — the escape hatch for when
35
- * you need a positioned box without flex or grid layout on it.
36
- */
37
- var Wrapper = ({ children, position, minWidth, maxWidth, fillWidth, fillHeight, overflow, padding, top, right, bottom, left }) => {
38
- return /* @__PURE__ */ jsx(StyledWrapper, {
39
- $position: position,
40
- $minWidth: minWidth,
41
- $maxWidth: maxWidth,
42
- $fillWidth: fillWidth,
43
- $fillHeight: fillHeight,
44
- $overflow: overflow,
45
- $padding: padding,
46
- $top: top,
47
- $right: right,
48
- $bottom: bottom,
49
- $left: left,
50
- children
51
- });
52
- };
53
- //#endregion
54
- export { Wrapper as default };
@@ -1,7 +0,0 @@
1
- export interface HorizontalDividerProps {
2
- /** Caption centered in a break in the rule. Omit for an unbroken line. */
3
- label?: string;
4
- }
5
- /** A full-width 0.5px hairline rule. Borders, not shadows — this is the separator. */
6
- declare const HorizontalDivider: ({ label }: HorizontalDividerProps) => import("react").JSX.Element;
7
- export default HorizontalDivider;
@@ -1,39 +0,0 @@
1
- import { withTheme } from "../theme/GalaxyTheme.js";
2
- import Text, { TextSize, TextVariant } from "../text/Text.js";
3
- /* empty css */
4
- import { styled } from "@linaria/react";
5
- import { jsx, jsxs } from "react/jsx-runtime";
6
- //#region src/dividers/HorizontalDivider.tsx
7
- var _exp = () => ({ $flex }) => $flex ? "auto" : "100%";
8
- var _exp2 = () => ({ $flex }) => $flex ? "1 1 0%" : "0 0 auto";
9
- var _exp3 = () => ({ theme }) => theme.color.border.primary;
10
- var HorizontalDividerLine = withTheme(/*#__PURE__*/ styled("div")({
11
- name: "HorizontalDividerLine",
12
- class: "h1sww5hz",
13
- propsAsIs: false,
14
- vars: {
15
- "h1sww5hz-0": [_exp()],
16
- "h1sww5hz-1": [_exp2()],
17
- "h1sww5hz-2": [_exp3()]
18
- }
19
- }));
20
- var LabeledDividerWrapper = /*#__PURE__*/ styled("div")({
21
- name: "LabeledDividerWrapper",
22
- class: "l44ah51",
23
- propsAsIs: false
24
- });
25
- /** A full-width 0.5px hairline rule. Borders, not shadows — this is the separator. */
26
- var HorizontalDivider = ({ label }) => {
27
- if (!label) return /* @__PURE__ */ jsx(HorizontalDividerLine, {});
28
- return /* @__PURE__ */ jsxs(LabeledDividerWrapper, { children: [
29
- /* @__PURE__ */ jsx(HorizontalDividerLine, { $flex: true }),
30
- /* @__PURE__ */ jsx(Text, {
31
- size: TextSize.CAPTION,
32
- variant: TextVariant.TERTIARY,
33
- children: label
34
- }),
35
- /* @__PURE__ */ jsx(HorizontalDividerLine, { $flex: true })
36
- ] });
37
- };
38
- //#endregion
39
- export { HorizontalDivider as default };
@@ -1,6 +0,0 @@
1
- /**
2
- * A 0.5px hairline rule for separating items in a row. Stretches to the height
3
- * of its flex parent, so it needs one — it has no height of its own.
4
- */
5
- declare const VerticalDivider: () => import("react").JSX.Element;
6
- export default VerticalDivider;
@@ -1,21 +0,0 @@
1
- import { withTheme } from "../theme/GalaxyTheme.js";
2
- /* empty css */
3
- import { styled } from "@linaria/react";
4
- import { jsx } from "react/jsx-runtime";
5
- //#region src/dividers/VerticalDivider.tsx
6
- var _exp = () => ({ theme }) => theme.color.border.primary;
7
- var VerticalDividerWrapper = withTheme(/*#__PURE__*/ styled("div")({
8
- name: "VerticalDividerWrapper",
9
- class: "v1f76t13",
10
- propsAsIs: false,
11
- vars: { "v1f76t13-0": [_exp()] }
12
- }));
13
- /**
14
- * A 0.5px hairline rule for separating items in a row. Stretches to the height
15
- * of its flex parent, so it needs one — it has no height of its own.
16
- */
17
- var VerticalDivider = () => {
18
- return /* @__PURE__ */ jsx(VerticalDividerWrapper, {});
19
- };
20
- //#endregion
21
- export { VerticalDivider as default };
@@ -1,11 +0,0 @@
1
- /**
2
- * The Galaxy wordmark, in the variant that reads against the active theme.
3
- * Use `GalaxyLogomark` when you need just the mark without the word.
4
- */
5
- declare const GalaxyFilamentWordmark: ({ height, isDark, }: {
6
- /** Rendered height in px. Width follows the aspect ratio. */
7
- height: number;
8
- /** Force the light artwork instead of following the theme. */
9
- isDark?: boolean;
10
- }) => import("react").JSX.Element;
11
- export default GalaxyFilamentWordmark;
@@ -1,25 +0,0 @@
1
- import { GalaxyTheme } from "../theme/types.js";
2
- import { useGalaxyTheme } from "../theme/GalaxyTheme.js";
3
- import SvgGalaxyFilamentWordmarkDark from "../assets/components/GalaxyFilamentWordmarkDark.js";
4
- import SvgGalaxyFilamentWordmarkLight from "../assets/components/GalaxyFilamentWordmarkLight.js";
5
- import { match } from "ts-pattern";
6
- import { useMemo } from "react";
7
- import { jsx } from "react/jsx-runtime";
8
- //#region src/icons/GalaxyFilamentWordmark.tsx
9
- /**
10
- * The Galaxy wordmark, in the variant that reads against the active theme.
11
- * Use `GalaxyLogomark` when you need just the mark without the word.
12
- */
13
- var GalaxyFilamentWordmark = ({ height, isDark }) => {
14
- const { activeTheme } = useGalaxyTheme();
15
- return useMemo(() => {
16
- if (isDark) return /* @__PURE__ */ jsx(SvgGalaxyFilamentWordmarkLight, { height });
17
- return match(activeTheme).with(GalaxyTheme.DARK, () => /* @__PURE__ */ jsx(SvgGalaxyFilamentWordmarkLight, { height })).with(GalaxyTheme.LIGHT, () => /* @__PURE__ */ jsx(SvgGalaxyFilamentWordmarkDark, { height })).exhaustive();
18
- }, [
19
- height,
20
- isDark,
21
- activeTheme
22
- ]);
23
- };
24
- //#endregion
25
- export { GalaxyFilamentWordmark as default };
@@ -1,13 +0,0 @@
1
- /**
2
- * The Galaxy mark, in the variant that reads against the active theme.
3
- *
4
- * `isDark` pins it to the dark-surface artwork regardless of theme — for a
5
- * mark sitting on a surface that doesn't follow the theme.
6
- */
7
- declare const GalaxyLogomark: ({ height, isDark, }: {
8
- /** Rendered height in px. Width follows the aspect ratio. */
9
- height: number;
10
- /** Force the dark-surface artwork instead of following the theme. */
11
- isDark?: boolean;
12
- }) => import("react").JSX.Element;
13
- export default GalaxyLogomark;
@@ -1,27 +0,0 @@
1
- import { GalaxyTheme } from "../theme/types.js";
2
- import { useGalaxyTheme } from "../theme/GalaxyTheme.js";
3
- import SvgGalaxyLogomarkDark from "../assets/components/GalaxyLogomarkDark.js";
4
- import SvgGalaxyLogomarkLight from "../assets/components/GalaxyLogomarkLight.js";
5
- import { match } from "ts-pattern";
6
- import { useMemo } from "react";
7
- import { jsx } from "react/jsx-runtime";
8
- //#region src/icons/GalaxyLogomark.tsx
9
- /**
10
- * The Galaxy mark, in the variant that reads against the active theme.
11
- *
12
- * `isDark` pins it to the dark-surface artwork regardless of theme — for a
13
- * mark sitting on a surface that doesn't follow the theme.
14
- */
15
- var GalaxyLogomark = ({ height, isDark }) => {
16
- const { activeTheme } = useGalaxyTheme();
17
- return useMemo(() => {
18
- if (isDark) return /* @__PURE__ */ jsx(SvgGalaxyLogomarkDark, { height });
19
- return match(activeTheme).with(GalaxyTheme.DARK, () => /* @__PURE__ */ jsx(SvgGalaxyLogomarkLight, { height })).with(GalaxyTheme.LIGHT, () => /* @__PURE__ */ jsx(SvgGalaxyLogomarkDark, { height })).exhaustive();
20
- }, [
21
- height,
22
- isDark,
23
- activeTheme
24
- ]);
25
- };
26
- //#endregion
27
- export { GalaxyLogomark as default };
@@ -1,56 +0,0 @@
1
- import { PresetsType } from "@react-three/drei/helpers/environment-assets";
2
- export interface LightConfig {
3
- intensity?: number;
4
- color?: string;
5
- }
6
- export interface MaterialConfig {
7
- metalness?: number;
8
- roughness?: number;
9
- transmission?: number;
10
- thickness?: number;
11
- ior?: number;
12
- envMapIntensity?: number;
13
- clearcoat?: number;
14
- clearcoatRoughness?: number;
15
- sheen?: number;
16
- sheenRoughness?: number;
17
- sheenColor?: string;
18
- }
19
- interface GalaxyLogomark3DProps {
20
- /** Square canvas size. A number is px. */
21
- height: number | string;
22
- /** Force the dark-surface material instead of following the theme. */
23
- isDark?: boolean;
24
- /** Spin continuously. */
25
- isAutoRotate?: boolean;
26
- /** Let the user drag to orbit the mesh. */
27
- isInteractive?: boolean;
28
- /** React to hover. */
29
- isHoverable?: boolean;
30
- /** Rotation rate. */
31
- speed?: number;
32
- /** Backlight configuration (enables dramatic mode when provided) */
33
- backlight?: LightConfig;
34
- /** Spotlight configuration (enables dramatic mode when provided) */
35
- spotlight?: LightConfig;
36
- /** Fill light configuration (enables dramatic mode when provided) */
37
- fillLight?: LightConfig;
38
- /** Override material properties */
39
- material?: MaterialConfig;
40
- /** Override mesh color (bypasses theme) */
41
- color?: string;
42
- /** Environment preset (default: 'studio', or 'night' in dramatic mode) */
43
- environmentPreset?: PresetsType;
44
- }
45
- /**
46
- * The Galaxy mark as an interactive 3D mesh, rendered with react-three-fiber.
47
- *
48
- * The heaviest thing in the library — it pulls in three.js and a ~3MB model.
49
- * Reserve it for hero moments; use `GalaxyLogomark` everywhere else.
50
- *
51
- * Passing any of `backlight`, `spotlight` or `fillLight` switches it into the
52
- * dramatic lighting preset.
53
- */
54
- declare const GalaxyLogomark3D: ({ height, isDark, isAutoRotate, isInteractive, isHoverable, speed, backlight, spotlight, fillLight, material, color: colorOverride, environmentPreset, }: GalaxyLogomark3DProps) => import("react").JSX.Element;
55
- export default GalaxyLogomark3D;
56
- export type { GalaxyLogomark3DProps };
@@ -1,319 +0,0 @@
1
- import { useGalaxyTheme } from "../theme/GalaxyTheme.js";
2
- import { getCssSizeValue } from "../utils/linaria.js";
3
- import galaxy_logomark_default from "../assets/models/galaxy-logomark.js";
4
- /* empty css */
5
- import { styled } from "@linaria/react";
6
- import { Suspense, useEffect, useRef, useState } from "react";
7
- import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
8
- import { Center, Environment, OrbitControls } from "@react-three/drei";
9
- import { Canvas, useFrame, useLoader } from "@react-three/fiber";
10
- import * as THREE from "three";
11
- import { OBJLoader } from "three/examples/jsm/loaders/OBJLoader.js";
12
- //#region src/icons/GalaxyLogomark3D.tsx
13
- var _exp2 = () => ({ $height }) => getCssSizeValue($height);
14
- var CanvasContainer = /*#__PURE__*/ styled("div")({
15
- name: "CanvasContainer",
16
- class: "c17zkoob",
17
- propsAsIs: false,
18
- vars: { "c17zkoob-0": [_exp2()] }
19
- });
20
- var DEFAULT_MATERIAL = {
21
- metalness: 0,
22
- roughness: 0,
23
- transmission: 0,
24
- thickness: 0,
25
- ior: 1,
26
- envMapIntensity: 0,
27
- clearcoat: 0,
28
- clearcoatRoughness: 0,
29
- sheen: 1,
30
- sheenRoughness: 0
31
- };
32
- var DRAMATIC_MATERIAL = {
33
- metalness: 0,
34
- roughness: .9,
35
- transmission: 0,
36
- thickness: 0,
37
- ior: 1,
38
- envMapIntensity: 0,
39
- clearcoat: 0,
40
- clearcoatRoughness: 0,
41
- sheen: 1,
42
- sheenRoughness: .5
43
- };
44
- function LogoMesh({ color, isDark, isAutoRotate = false, isHoverable = true, isHovered = false, speed = 1.5, isDramaticMode = false, material }) {
45
- const groupRef = useRef(null);
46
- const obj = useLoader(OBJLoader, galaxy_logomark_default);
47
- const animationStartTime = useRef(null);
48
- const wasHovered = useRef(false);
49
- const animationDuration = .5 / speed;
50
- const axisMultipliers = useRef({
51
- x: 1,
52
- y: -1,
53
- z: 0
54
- });
55
- useEffect(() => {
56
- axisMultipliers.current = {
57
- x: Math.random() > .3 ? Math.random() > .5 ? 1 : -1 : 0,
58
- y: Math.random() > .3 ? Math.random() > .5 ? 1 : -1 : 0,
59
- z: Math.random() > .3 ? Math.random() > .5 ? 1 : -1 : 0
60
- };
61
- }, []);
62
- useFrame((state) => {
63
- if (!groupRef.current) return;
64
- if (isHoverable) {
65
- if (isHovered && !wasHovered.current) {
66
- animationStartTime.current = state.clock.elapsedTime;
67
- let x = Math.random() > .4 ? Math.random() > .5 ? 1 : -1 : 0;
68
- let y = Math.random() > .4 ? Math.random() > .5 ? 1 : -1 : 0;
69
- let z = Math.random() > .4 ? Math.random() > .5 ? 1 : -1 : 0;
70
- if (x === 0 && y === 0 && z === 0) {
71
- const fallback = Math.floor(Math.random() * 3);
72
- if (fallback === 0) x = 1;
73
- else if (fallback === 1) y = 1;
74
- else z = 1;
75
- }
76
- axisMultipliers.current = {
77
- x,
78
- y,
79
- z
80
- };
81
- }
82
- wasHovered.current = isHovered;
83
- if (animationStartTime.current !== null && state.clock.elapsedTime - animationStartTime.current < animationDuration) {
84
- const progress = (state.clock.elapsedTime - animationStartTime.current) / animationDuration;
85
- const rotation = (1 - Math.pow(1 - progress, 4)) * Math.PI * 4;
86
- groupRef.current.rotation.x = rotation * axisMultipliers.current.x;
87
- groupRef.current.rotation.y = rotation * axisMultipliers.current.y;
88
- groupRef.current.rotation.z = rotation * axisMultipliers.current.z;
89
- return;
90
- }
91
- }
92
- if (isAutoRotate) {
93
- groupRef.current.rotation.x = THREE.MathUtils.lerp(groupRef.current.rotation.x, 0, .1);
94
- groupRef.current.rotation.y = state.clock.elapsedTime * speed;
95
- groupRef.current.rotation.z = THREE.MathUtils.lerp(groupRef.current.rotation.z, 0, .1);
96
- } else {
97
- groupRef.current.rotation.x = THREE.MathUtils.lerp(groupRef.current.rotation.x, 0, .1);
98
- groupRef.current.rotation.y = THREE.MathUtils.lerp(groupRef.current.rotation.y, 0, .1);
99
- groupRef.current.rotation.z = THREE.MathUtils.lerp(groupRef.current.rotation.z, 0, .1);
100
- }
101
- });
102
- const mergedMaterial = {
103
- ...isDramaticMode ? DRAMATIC_MATERIAL : DEFAULT_MATERIAL,
104
- ...material
105
- };
106
- if (!isDramaticMode && material?.envMapIntensity === void 0) mergedMaterial.envMapIntensity = isDark ? .3 : 1.5;
107
- const clonedObj = obj.clone();
108
- clonedObj.traverse((child) => {
109
- if (child instanceof THREE.Mesh) {
110
- if (isDramaticMode) child.castShadow = true;
111
- child.material = new THREE.MeshPhysicalMaterial({
112
- color,
113
- metalness: mergedMaterial.metalness,
114
- roughness: mergedMaterial.roughness,
115
- transmission: mergedMaterial.transmission,
116
- thickness: mergedMaterial.thickness,
117
- ior: mergedMaterial.ior,
118
- envMapIntensity: mergedMaterial.envMapIntensity,
119
- clearcoat: mergedMaterial.clearcoat,
120
- clearcoatRoughness: mergedMaterial.clearcoatRoughness,
121
- sheen: mergedMaterial.sheen,
122
- sheenRoughness: mergedMaterial.sheenRoughness,
123
- sheenColor: mergedMaterial.sheenColor ? new THREE.Color(mergedMaterial.sheenColor) : new THREE.Color(color),
124
- ...mergedMaterial.transmission > 0 ? {
125
- attenuationColor: new THREE.Color(color),
126
- attenuationDistance: .5
127
- } : {}
128
- });
129
- }
130
- });
131
- return /* @__PURE__ */ jsx("group", {
132
- ref: groupRef,
133
- scale: [
134
- .088,
135
- .088,
136
- .088
137
- ],
138
- children: /* @__PURE__ */ jsx(Center, { children: /* @__PURE__ */ jsx("primitive", { object: clonedObj }) })
139
- });
140
- }
141
- function SimpleLighting() {
142
- return /* @__PURE__ */ jsxs(Fragment$1, { children: [
143
- /* @__PURE__ */ jsx("ambientLight", { intensity: .5 }),
144
- /* @__PURE__ */ jsx("directionalLight", {
145
- position: [
146
- 10,
147
- 10,
148
- 5
149
- ],
150
- intensity: 1
151
- }),
152
- /* @__PURE__ */ jsx("directionalLight", {
153
- position: [
154
- -10,
155
- -10,
156
- -5
157
- ],
158
- intensity: .5
159
- })
160
- ] });
161
- }
162
- function DramaticLighting({ backlight, spotlight, fillLight }) {
163
- return /* @__PURE__ */ jsxs(Fragment$1, { children: [
164
- /* @__PURE__ */ jsx("ambientLight", { intensity: .15 }),
165
- /* @__PURE__ */ jsx("directionalLight", {
166
- position: [
167
- 0,
168
- 0,
169
- 5
170
- ],
171
- intensity: .3
172
- }),
173
- /* @__PURE__ */ jsx("spotLight", {
174
- position: [
175
- 0,
176
- 6,
177
- 5
178
- ],
179
- angle: Math.PI / 4,
180
- penumbra: .6,
181
- intensity: backlight.intensity,
182
- color: backlight.color,
183
- castShadow: true,
184
- distance: 20,
185
- decay: 1.5
186
- }),
187
- /* @__PURE__ */ jsx("pointLight", {
188
- position: [
189
- -3,
190
- 2,
191
- 4
192
- ],
193
- intensity: backlight.intensity * .3,
194
- color: backlight.color,
195
- distance: 15,
196
- decay: 2
197
- }),
198
- /* @__PURE__ */ jsx("spotLight", {
199
- position: [
200
- 4,
201
- 5,
202
- 2
203
- ],
204
- "target-position": [
205
- 0,
206
- 0,
207
- 0
208
- ],
209
- angle: Math.PI / 6,
210
- penumbra: .4,
211
- intensity: spotlight.intensity,
212
- color: spotlight.color,
213
- distance: 15,
214
- decay: 1
215
- }),
216
- /* @__PURE__ */ jsx("pointLight", {
217
- position: [
218
- -5,
219
- -1,
220
- 2
221
- ],
222
- intensity: fillLight.intensity,
223
- color: fillLight.color,
224
- distance: 15,
225
- decay: 1.5
226
- })
227
- ] });
228
- }
229
- function Scene({ color, isDark, isAutoRotate, isInteractive, isHoverable, isHovered, speed, isDramaticMode, backlight, spotlight, fillLight, material, environmentPreset }) {
230
- return /* @__PURE__ */ jsxs(Fragment$1, { children: [
231
- isDramaticMode && backlight && spotlight && fillLight ? /* @__PURE__ */ jsx(DramaticLighting, {
232
- backlight,
233
- spotlight,
234
- fillLight
235
- }) : /* @__PURE__ */ jsx(SimpleLighting, {}),
236
- /* @__PURE__ */ jsx(LogoMesh, {
237
- color,
238
- isDark,
239
- isAutoRotate,
240
- isHoverable,
241
- isHovered,
242
- speed,
243
- isDramaticMode,
244
- material
245
- }),
246
- /* @__PURE__ */ jsx(Environment, { preset: environmentPreset }),
247
- /* @__PURE__ */ jsx(OrbitControls, {
248
- autoRotate: false,
249
- enableZoom: isInteractive,
250
- enablePan: isInteractive,
251
- enableRotate: isInteractive
252
- })
253
- ] });
254
- }
255
- /**
256
- * The Galaxy mark as an interactive 3D mesh, rendered with react-three-fiber.
257
- *
258
- * The heaviest thing in the library — it pulls in three.js and a ~3MB model.
259
- * Reserve it for hero moments; use `GalaxyLogomark` everywhere else.
260
- *
261
- * Passing any of `backlight`, `spotlight` or `fillLight` switches it into the
262
- * dramatic lighting preset.
263
- */
264
- var GalaxyLogomark3D = ({ height, isDark = false, isAutoRotate = false, isInteractive = false, isHoverable = false, speed = 2, backlight, spotlight, fillLight, material, color: colorOverride, environmentPreset }) => {
265
- const [isHovered, setIsHovered] = useState(false);
266
- const { theme } = useGalaxyTheme();
267
- const color = colorOverride ?? (isDark ? theme.color.background.primary : theme.color.background.primaryAlt);
268
- const isDramaticMode = !!(backlight || spotlight || fillLight);
269
- return /* @__PURE__ */ jsx(CanvasContainer, {
270
- $height: height,
271
- onMouseEnter: () => setIsHovered(true),
272
- onMouseLeave: () => setIsHovered(false),
273
- children: /* @__PURE__ */ jsx(Canvas, {
274
- camera: {
275
- position: [
276
- 0,
277
- 0,
278
- 4
279
- ],
280
- fov: 45
281
- },
282
- style: { background: "transparent" },
283
- gl: {
284
- alpha: true,
285
- antialias: true
286
- },
287
- shadows: isDramaticMode,
288
- children: /* @__PURE__ */ jsx(Suspense, {
289
- fallback: null,
290
- children: /* @__PURE__ */ jsx(Scene, {
291
- color,
292
- isDark,
293
- isAutoRotate,
294
- isInteractive,
295
- isHoverable,
296
- isHovered,
297
- speed,
298
- isDramaticMode,
299
- backlight: isDramaticMode ? {
300
- intensity: backlight?.intensity ?? 8,
301
- color: backlight?.color ?? "#ffffff"
302
- } : void 0,
303
- spotlight: isDramaticMode ? {
304
- intensity: spotlight?.intensity ?? 30,
305
- color: spotlight?.color ?? "#ff0000"
306
- } : void 0,
307
- fillLight: isDramaticMode ? {
308
- intensity: fillLight?.intensity ?? 10,
309
- color: fillLight?.color ?? "#B57EDC"
310
- } : void 0,
311
- material,
312
- environmentPreset: environmentPreset ?? (isDramaticMode ? "night" : "studio")
313
- })
314
- })
315
- })
316
- });
317
- };
318
- //#endregion
319
- export { GalaxyLogomark3D as default };
@@ -1,18 +0,0 @@
1
- export interface GalaxyLogomarkAnimationProps {
2
- /** Square size. A number is px. @default 32 */
3
- height?: number | string;
4
- /** Force the dark-surface fill instead of following the theme. */
5
- isDark?: boolean;
6
- /** Freeze on the first frame. Also stops it looping. @default false */
7
- isPaused?: boolean;
8
- /** Playback rate. @default 1 */
9
- speed?: number;
10
- }
11
- /**
12
- * The Galaxy mark as a looping Lottie animation, tinted from the theme.
13
- *
14
- * Ships a ~700kB animation payload — reach for the static `GalaxyLogomark` for
15
- * ordinary chrome and save this for splash and loading moments.
16
- */
17
- declare const GalaxyLogomarkAnimation: ({ height, isDark, isPaused, speed, }: GalaxyLogomarkAnimationProps) => import("react").JSX.Element;
18
- export default GalaxyLogomarkAnimation;
@@ -1,48 +0,0 @@
1
- import { GalaxyTheme } from "../theme/types.js";
2
- import { useGalaxyTheme } from "../theme/GalaxyTheme.js";
3
- import { getCssSizeValue } from "../utils/linaria.js";
4
- import galaxy_animation_default from "../assets/models/galaxy-animation.js";
5
- /* empty css */
6
- import { styled } from "@linaria/react";
7
- import { match } from "ts-pattern";
8
- import { useEffect, useRef } from "react";
9
- import { jsx } from "react/jsx-runtime";
10
- import Lottie from "lottie-react/build/index.es.js";
11
- //#region src/icons/GalaxyLogomarkAnimation.tsx
12
- var _exp2 = () => ({ $height }) => $height;
13
- var _exp3 = () => ({ $fill }) => $fill;
14
- var GalaxyLogomarkAnimationWrapper = /*#__PURE__*/ styled("div")({
15
- name: "GalaxyLogomarkAnimationWrapper",
16
- class: "gm80o9u",
17
- propsAsIs: false,
18
- vars: {
19
- "gm80o9u-0": [_exp2()],
20
- "gm80o9u-1": [_exp3()]
21
- }
22
- });
23
- /**
24
- * The Galaxy mark as a looping Lottie animation, tinted from the theme.
25
- *
26
- * Ships a ~700kB animation payload — reach for the static `GalaxyLogomark` for
27
- * ordinary chrome and save this for splash and loading moments.
28
- */
29
- var GalaxyLogomarkAnimation = ({ height = 32, isDark, isPaused = false, speed = 1 }) => {
30
- const lottieRef = useRef(null);
31
- const { theme, activeTheme } = useGalaxyTheme();
32
- useEffect(() => {
33
- lottieRef.current?.setSpeed(speed);
34
- }, [speed, isPaused]);
35
- const fill = isDark ? match(activeTheme).with(GalaxyTheme.DARK, () => theme.color.icon.primaryAlt).with(GalaxyTheme.LIGHT, () => theme.color.icon.primary).exhaustive() : theme.color.icon.primary;
36
- return /* @__PURE__ */ jsx(GalaxyLogomarkAnimationWrapper, {
37
- $height: getCssSizeValue(height),
38
- $fill: fill,
39
- children: /* @__PURE__ */ jsx(Lottie, {
40
- lottieRef,
41
- animationData: galaxy_animation_default,
42
- loop: !isPaused,
43
- autoplay: !isPaused
44
- })
45
- });
46
- };
47
- //#endregion
48
- export { GalaxyLogomarkAnimation as default };