@dxos/ui-theme 0.8.4-main.2244d791bb → 0.8.4-main.3fbcb4aa9b

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 (393) hide show
  1. package/dist/lib/browser/index.mjs +758 -2875
  2. package/dist/lib/browser/index.mjs.map +4 -4
  3. package/dist/lib/browser/meta.json +1 -1
  4. package/dist/lib/node-esm/index.mjs +758 -2875
  5. package/dist/lib/node-esm/index.mjs.map +4 -4
  6. package/dist/lib/node-esm/meta.json +1 -1
  7. package/dist/plugin/node-cjs/main.css +1570 -0
  8. package/dist/plugin/node-cjs/main.css.map +7 -0
  9. package/dist/plugin/node-cjs/meta.json +1 -1
  10. package/dist/plugin/node-cjs/plugins/ThemePlugin.cjs +137 -0
  11. package/dist/plugin/node-cjs/plugins/ThemePlugin.cjs.map +7 -0
  12. package/dist/plugin/node-esm/main.css +1570 -0
  13. package/dist/plugin/node-esm/main.css.map +7 -0
  14. package/dist/plugin/node-esm/meta.json +1 -1
  15. package/dist/plugin/node-esm/plugins/ThemePlugin.mjs +105 -0
  16. package/dist/plugin/node-esm/plugins/ThemePlugin.mjs.map +7 -0
  17. package/dist/types/src/Theme.stories.d.ts +27 -0
  18. package/dist/types/src/Theme.stories.d.ts.map +1 -0
  19. package/dist/types/src/defs.d.ts +21 -0
  20. package/dist/types/src/defs.d.ts.map +1 -0
  21. package/dist/types/src/fragments/density.d.ts +4 -0
  22. package/dist/types/src/fragments/density.d.ts.map +1 -0
  23. package/dist/types/src/fragments/disabled.d.ts.map +1 -0
  24. package/dist/types/src/fragments/hover.d.ts +10 -0
  25. package/dist/types/src/fragments/hover.d.ts.map +1 -0
  26. package/dist/types/src/fragments/index.d.ts +5 -0
  27. package/dist/types/src/fragments/index.d.ts.map +1 -0
  28. package/dist/types/src/fragments/text.d.ts +2 -0
  29. package/dist/types/src/fragments/text.d.ts.map +1 -0
  30. package/dist/types/src/index.d.ts +3 -11
  31. package/dist/types/src/index.d.ts.map +1 -1
  32. package/dist/types/src/plugins/ThemePlugin.d.ts +16 -0
  33. package/dist/types/src/plugins/ThemePlugin.d.ts.map +1 -0
  34. package/dist/types/src/plugins/dark-mode.d.ts +1 -0
  35. package/dist/types/src/plugins/dark-mode.d.ts.map +1 -0
  36. package/dist/types/src/theme/components/avatar.d.ts.map +1 -0
  37. package/dist/types/src/theme/components/breadcrumb.d.ts.map +1 -0
  38. package/dist/types/src/theme/components/button.d.ts +15 -0
  39. package/dist/types/src/theme/components/button.d.ts.map +1 -0
  40. package/dist/types/src/theme/components/card.d.ts +12 -0
  41. package/dist/types/src/theme/components/card.d.ts.map +1 -0
  42. package/dist/types/src/theme/components/dialog.d.ts.map +1 -0
  43. package/dist/types/src/theme/components/focus.d.ts +6 -0
  44. package/dist/types/src/theme/components/focus.d.ts.map +1 -0
  45. package/dist/types/src/{styles → theme}/components/icon-button.d.ts +1 -0
  46. package/dist/types/src/theme/components/icon-button.d.ts.map +1 -0
  47. package/dist/types/src/{styles → theme}/components/icon.d.ts +3 -0
  48. package/dist/types/src/theme/components/icon.d.ts.map +1 -0
  49. package/dist/types/src/{styles → theme}/components/index.d.ts +3 -1
  50. package/dist/types/src/theme/components/index.d.ts.map +1 -0
  51. package/dist/types/src/{styles → theme}/components/input.d.ts +31 -26
  52. package/dist/types/src/theme/components/input.d.ts.map +1 -0
  53. package/dist/types/src/theme/components/link.d.ts.map +1 -0
  54. package/dist/types/src/theme/components/list.d.ts.map +1 -0
  55. package/dist/types/src/{styles → theme}/components/main.d.ts +2 -2
  56. package/dist/types/src/theme/components/main.d.ts.map +1 -0
  57. package/dist/types/src/{styles → theme}/components/menu.d.ts +1 -1
  58. package/dist/types/src/theme/components/menu.d.ts.map +1 -0
  59. package/dist/types/src/theme/components/message.d.ts.map +1 -0
  60. package/dist/types/src/{styles → theme}/components/popover.d.ts +1 -1
  61. package/dist/types/src/theme/components/popover.d.ts.map +1 -0
  62. package/dist/types/src/{styles → theme}/components/scroll-area.d.ts +17 -1
  63. package/dist/types/src/theme/components/scroll-area.d.ts.map +1 -0
  64. package/dist/types/src/theme/components/select.d.ts.map +1 -0
  65. package/dist/types/src/theme/components/separator.d.ts.map +1 -0
  66. package/dist/types/src/theme/components/skeleton.d.ts.map +1 -0
  67. package/dist/types/src/theme/components/splitter.d.ts +4 -0
  68. package/dist/types/src/theme/components/splitter.d.ts.map +1 -0
  69. package/dist/types/src/{styles → theme}/components/status.d.ts +1 -1
  70. package/dist/types/src/theme/components/status.d.ts.map +1 -0
  71. package/dist/types/src/theme/components/tag.d.ts.map +1 -0
  72. package/dist/types/src/theme/components/toast.d.ts.map +1 -0
  73. package/dist/types/src/{styles → theme}/components/toolbar.d.ts +2 -2
  74. package/dist/types/src/theme/components/toolbar.d.ts.map +1 -0
  75. package/dist/types/src/theme/components/tooltip.d.ts.map +1 -0
  76. package/dist/types/src/theme/components/treegrid.d.ts.map +1 -0
  77. package/dist/types/src/{styles → theme}/index.d.ts +0 -1
  78. package/dist/types/src/theme/index.d.ts.map +1 -0
  79. package/dist/types/src/theme/primitives/column.d.ts +29 -0
  80. package/dist/types/src/theme/primitives/column.d.ts.map +1 -0
  81. package/dist/types/src/theme/primitives/index.d.ts +3 -0
  82. package/dist/types/src/theme/primitives/index.d.ts.map +1 -0
  83. package/dist/types/src/theme/primitives/panel.d.ts +13 -0
  84. package/dist/types/src/theme/primitives/panel.d.ts.map +1 -0
  85. package/dist/types/src/theme/theme.d.ts.map +1 -0
  86. package/dist/types/src/{styles/fragments → util}/elevation.d.ts +0 -6
  87. package/dist/types/src/util/elevation.d.ts.map +1 -0
  88. package/dist/types/src/util/hash-styles.d.ts +8 -5
  89. package/dist/types/src/util/hash-styles.d.ts.map +1 -1
  90. package/dist/types/src/util/index.d.ts +3 -0
  91. package/dist/types/src/util/index.d.ts.map +1 -1
  92. package/dist/types/src/util/mx.d.ts +56 -0
  93. package/dist/types/src/util/mx.d.ts.map +1 -1
  94. package/dist/types/src/util/size.d.ts +27 -0
  95. package/dist/types/src/util/size.d.ts.map +1 -0
  96. package/dist/types/src/util/valence.d.ts +4 -0
  97. package/dist/types/src/util/valence.d.ts.map +1 -0
  98. package/dist/types/tsconfig.tsbuildinfo +1 -1
  99. package/package.json +25 -36
  100. package/src/Theme.stories.tsx +224 -0
  101. package/src/css/base/base.css +43 -0
  102. package/src/{styles/layers → css/base}/typography.css +3 -5
  103. package/src/{styles/layers → css/components}/button.css +23 -14
  104. package/src/{styles/layers → css/components}/checkbox.css +12 -8
  105. package/src/{styles/layers → css/components}/dialog.css +16 -11
  106. package/src/{styles/layers/focus-ring.css → css/components/focus.css} +60 -41
  107. package/src/css/components/icon.css +9 -0
  108. package/src/css/components/link.css +9 -0
  109. package/src/css/components/panel.css +117 -0
  110. package/src/{styles/layers → css/components}/scrollbar.css +10 -6
  111. package/src/css/components/selected.css +49 -0
  112. package/src/css/components/selected.md +101 -0
  113. package/src/css/components/surface.css +34 -0
  114. package/src/css/components/tag.css +132 -0
  115. package/src/css/components/text.css +124 -0
  116. package/src/css/integrations/codemirror.css +34 -0
  117. package/src/css/integrations/tldraw.css +14 -0
  118. package/src/css/layout/main.css +205 -0
  119. package/src/{styles/layers → css/layout}/native.css +6 -4
  120. package/src/css/layout/positioning.css +19 -0
  121. package/src/{styles/layers → css/layout}/size.css +129 -106
  122. package/src/css/theme/animation.css +260 -0
  123. package/src/css/theme/border.css +23 -0
  124. package/src/css/theme/palette.css +36 -0
  125. package/src/css/theme/semantic.css +116 -0
  126. package/src/css/theme/spacing.css +147 -0
  127. package/src/css/theme/styles.css +145 -0
  128. package/src/css/theme/text.css +37 -0
  129. package/src/css/utilities.css +118 -0
  130. package/src/defs.ts +48 -0
  131. package/src/fragments/AUDIT.md +57 -0
  132. package/src/fragments/density.ts +16 -0
  133. package/src/fragments/hover.ts +18 -0
  134. package/src/fragments/index.ts +10 -0
  135. package/src/fragments/text.ts +6 -0
  136. package/src/index.ts +3 -15
  137. package/src/main.css +121 -0
  138. package/src/plugins/ThemePlugin.ts +125 -0
  139. package/src/plugins/dark-mode.ts +22 -0
  140. package/src/plugins/main.css +45 -0
  141. package/src/{styles → theme}/components/avatar.ts +12 -13
  142. package/src/theme/components/button.ts +48 -0
  143. package/src/theme/components/card.ts +102 -0
  144. package/src/{styles → theme}/components/dialog.ts +13 -12
  145. package/src/theme/components/focus.ts +33 -0
  146. package/src/{styles → theme}/components/icon-button.ts +6 -5
  147. package/src/theme/components/icon.ts +28 -0
  148. package/src/{styles → theme}/components/index.ts +3 -1
  149. package/src/theme/components/input.ts +171 -0
  150. package/src/{styles → theme}/components/link.ts +3 -4
  151. package/src/{styles → theme}/components/list.ts +5 -5
  152. package/src/{styles → theme}/components/main.ts +2 -2
  153. package/src/{styles → theme}/components/menu.ts +11 -13
  154. package/src/{styles → theme}/components/message.ts +6 -7
  155. package/src/{styles → theme}/components/popover.ts +13 -12
  156. package/src/theme/components/scroll-area.ts +115 -0
  157. package/src/{styles → theme}/components/select.ts +8 -16
  158. package/src/{styles → theme}/components/separator.ts +3 -3
  159. package/src/{styles → theme}/components/skeleton.ts +2 -2
  160. package/src/theme/components/splitter.ts +20 -0
  161. package/src/{styles → theme}/components/status.ts +7 -7
  162. package/src/{styles → theme}/components/toast.ts +6 -8
  163. package/src/{styles → theme}/components/toolbar.ts +6 -7
  164. package/src/{styles → theme}/components/tooltip.ts +4 -6
  165. package/src/{styles → theme}/components/treegrid.ts +9 -9
  166. package/src/{styles → theme}/index.ts +1 -2
  167. package/src/theme/primitives/column.ts +71 -0
  168. package/src/theme/primitives/index.ts +6 -0
  169. package/src/theme/primitives/panel.ts +43 -0
  170. package/src/{styles → theme}/theme.ts +11 -6
  171. package/src/typings.d.ts +3 -1
  172. package/src/{styles/fragments → util}/elevation.ts +6 -8
  173. package/src/util/hash-styles.ts +118 -98
  174. package/src/util/index.ts +3 -0
  175. package/src/util/mx.ts +165 -43
  176. package/src/util/size.ts +103 -0
  177. package/src/util/valence.ts +33 -0
  178. package/dist/plugin/node-cjs/chunk-TH5YZMTA.cjs +0 -1633
  179. package/dist/plugin/node-cjs/chunk-TH5YZMTA.cjs.map +0 -7
  180. package/dist/plugin/node-cjs/chunk-UUMDOU7E.cjs +0 -79
  181. package/dist/plugin/node-cjs/chunk-UUMDOU7E.cjs.map +0 -7
  182. package/dist/plugin/node-cjs/config/tailwind.cjs +0 -29
  183. package/dist/plugin/node-cjs/config/tailwind.cjs.map +0 -7
  184. package/dist/plugin/node-cjs/plugins/esbuild-plugin.cjs +0 -90
  185. package/dist/plugin/node-cjs/plugins/esbuild-plugin.cjs.map +0 -7
  186. package/dist/plugin/node-cjs/plugins/plugin.cjs +0 -124
  187. package/dist/plugin/node-cjs/plugins/plugin.cjs.map +0 -7
  188. package/dist/plugin/node-cjs/theme.css +0 -1388
  189. package/dist/plugin/node-cjs/theme.css.map +0 -7
  190. package/dist/plugin/node-esm/chunk-6EGZAB2N.mjs +0 -1628
  191. package/dist/plugin/node-esm/chunk-6EGZAB2N.mjs.map +0 -7
  192. package/dist/plugin/node-esm/chunk-AFRHJHP4.mjs +0 -49
  193. package/dist/plugin/node-esm/chunk-AFRHJHP4.mjs.map +0 -7
  194. package/dist/plugin/node-esm/config/tailwind.mjs +0 -8
  195. package/dist/plugin/node-esm/config/tailwind.mjs.map +0 -7
  196. package/dist/plugin/node-esm/plugins/esbuild-plugin.mjs +0 -63
  197. package/dist/plugin/node-esm/plugins/esbuild-plugin.mjs.map +0 -7
  198. package/dist/plugin/node-esm/plugins/plugin.mjs +0 -98
  199. package/dist/plugin/node-esm/plugins/plugin.mjs.map +0 -7
  200. package/dist/plugin/node-esm/theme.css +0 -1388
  201. package/dist/plugin/node-esm/theme.css.map +0 -7
  202. package/dist/types/src/Tokens.stories.d.ts +0 -10
  203. package/dist/types/src/Tokens.stories.d.ts.map +0 -1
  204. package/dist/types/src/config/index.d.ts +0 -3
  205. package/dist/types/src/config/index.d.ts.map +0 -1
  206. package/dist/types/src/config/tailwind.d.ts +0 -9
  207. package/dist/types/src/config/tailwind.d.ts.map +0 -1
  208. package/dist/types/src/config/tokens/colors/alias-colors.d.ts +0 -21
  209. package/dist/types/src/config/tokens/colors/alias-colors.d.ts.map +0 -1
  210. package/dist/types/src/config/tokens/colors/index.d.ts +0 -5
  211. package/dist/types/src/config/tokens/colors/index.d.ts.map +0 -1
  212. package/dist/types/src/config/tokens/colors/physical-colors.d.ts +0 -23
  213. package/dist/types/src/config/tokens/colors/physical-colors.d.ts.map +0 -1
  214. package/dist/types/src/config/tokens/colors/semantic-colors.d.ts +0 -192
  215. package/dist/types/src/config/tokens/colors/semantic-colors.d.ts.map +0 -1
  216. package/dist/types/src/config/tokens/colors/sememes-calls.d.ts +0 -3
  217. package/dist/types/src/config/tokens/colors/sememes-calls.d.ts.map +0 -1
  218. package/dist/types/src/config/tokens/colors/sememes-codemirror.d.ts +0 -43
  219. package/dist/types/src/config/tokens/colors/sememes-codemirror.d.ts.map +0 -1
  220. package/dist/types/src/config/tokens/colors/sememes-hue.d.ts +0 -4
  221. package/dist/types/src/config/tokens/colors/sememes-hue.d.ts.map +0 -1
  222. package/dist/types/src/config/tokens/colors/sememes-sheet.d.ts +0 -58
  223. package/dist/types/src/config/tokens/colors/sememes-sheet.d.ts.map +0 -1
  224. package/dist/types/src/config/tokens/colors/sememes-system.d.ts +0 -104
  225. package/dist/types/src/config/tokens/colors/sememes-system.d.ts.map +0 -1
  226. package/dist/types/src/config/tokens/colors/types.d.ts +0 -5
  227. package/dist/types/src/config/tokens/colors/types.d.ts.map +0 -1
  228. package/dist/types/src/config/tokens/index.d.ts +0 -3
  229. package/dist/types/src/config/tokens/index.d.ts.map +0 -1
  230. package/dist/types/src/config/tokens/lengths.d.ts +0 -142
  231. package/dist/types/src/config/tokens/lengths.d.ts.map +0 -1
  232. package/dist/types/src/config/tokens/sizes.d.ts +0 -9
  233. package/dist/types/src/config/tokens/sizes.d.ts.map +0 -1
  234. package/dist/types/src/config/tokens/tokens.d.ts +0 -498
  235. package/dist/types/src/config/tokens/tokens.d.ts.map +0 -1
  236. package/dist/types/src/plugins/esbuild-plugin.d.ts +0 -9
  237. package/dist/types/src/plugins/esbuild-plugin.d.ts.map +0 -1
  238. package/dist/types/src/plugins/plugin.d.ts +0 -20
  239. package/dist/types/src/plugins/plugin.d.ts.map +0 -1
  240. package/dist/types/src/plugins/resolveContent.d.ts +0 -2
  241. package/dist/types/src/plugins/resolveContent.d.ts.map +0 -1
  242. package/dist/types/src/styles/components/anchored-overflow.d.ts +0 -6
  243. package/dist/types/src/styles/components/anchored-overflow.d.ts.map +0 -1
  244. package/dist/types/src/styles/components/avatar.d.ts.map +0 -1
  245. package/dist/types/src/styles/components/breadcrumb.d.ts.map +0 -1
  246. package/dist/types/src/styles/components/button.d.ts +0 -19
  247. package/dist/types/src/styles/components/button.d.ts.map +0 -1
  248. package/dist/types/src/styles/components/dialog.d.ts.map +0 -1
  249. package/dist/types/src/styles/components/icon-button.d.ts.map +0 -1
  250. package/dist/types/src/styles/components/icon.d.ts.map +0 -1
  251. package/dist/types/src/styles/components/index.d.ts.map +0 -1
  252. package/dist/types/src/styles/components/input.d.ts.map +0 -1
  253. package/dist/types/src/styles/components/link.d.ts.map +0 -1
  254. package/dist/types/src/styles/components/list.d.ts.map +0 -1
  255. package/dist/types/src/styles/components/main.d.ts.map +0 -1
  256. package/dist/types/src/styles/components/menu.d.ts.map +0 -1
  257. package/dist/types/src/styles/components/message.d.ts.map +0 -1
  258. package/dist/types/src/styles/components/popover.d.ts.map +0 -1
  259. package/dist/types/src/styles/components/scroll-area.d.ts.map +0 -1
  260. package/dist/types/src/styles/components/select.d.ts.map +0 -1
  261. package/dist/types/src/styles/components/separator.d.ts.map +0 -1
  262. package/dist/types/src/styles/components/skeleton.d.ts.map +0 -1
  263. package/dist/types/src/styles/components/status.d.ts.map +0 -1
  264. package/dist/types/src/styles/components/tag.d.ts.map +0 -1
  265. package/dist/types/src/styles/components/toast.d.ts.map +0 -1
  266. package/dist/types/src/styles/components/toolbar.d.ts.map +0 -1
  267. package/dist/types/src/styles/components/tooltip.d.ts.map +0 -1
  268. package/dist/types/src/styles/components/treegrid.d.ts.map +0 -1
  269. package/dist/types/src/styles/fragments/density.d.ts +0 -13
  270. package/dist/types/src/styles/fragments/density.d.ts.map +0 -1
  271. package/dist/types/src/styles/fragments/dimension.d.ts +0 -5
  272. package/dist/types/src/styles/fragments/dimension.d.ts.map +0 -1
  273. package/dist/types/src/styles/fragments/disabled.d.ts.map +0 -1
  274. package/dist/types/src/styles/fragments/elevation.d.ts.map +0 -1
  275. package/dist/types/src/styles/fragments/focus.d.ts +0 -6
  276. package/dist/types/src/styles/fragments/focus.d.ts.map +0 -1
  277. package/dist/types/src/styles/fragments/group.d.ts +0 -5
  278. package/dist/types/src/styles/fragments/group.d.ts.map +0 -1
  279. package/dist/types/src/styles/fragments/hover.d.ts +0 -17
  280. package/dist/types/src/styles/fragments/hover.d.ts.map +0 -1
  281. package/dist/types/src/styles/fragments/index.d.ts +0 -17
  282. package/dist/types/src/styles/fragments/index.d.ts.map +0 -1
  283. package/dist/types/src/styles/fragments/layout.d.ts +0 -3
  284. package/dist/types/src/styles/fragments/layout.d.ts.map +0 -1
  285. package/dist/types/src/styles/fragments/motion.d.ts +0 -2
  286. package/dist/types/src/styles/fragments/motion.d.ts.map +0 -1
  287. package/dist/types/src/styles/fragments/ornament.d.ts +0 -5
  288. package/dist/types/src/styles/fragments/ornament.d.ts.map +0 -1
  289. package/dist/types/src/styles/fragments/selected.d.ts +0 -13
  290. package/dist/types/src/styles/fragments/selected.d.ts.map +0 -1
  291. package/dist/types/src/styles/fragments/shimmer.d.ts +0 -3
  292. package/dist/types/src/styles/fragments/shimmer.d.ts.map +0 -1
  293. package/dist/types/src/styles/fragments/size.d.ts +0 -9
  294. package/dist/types/src/styles/fragments/size.d.ts.map +0 -1
  295. package/dist/types/src/styles/fragments/surface.d.ts +0 -9
  296. package/dist/types/src/styles/fragments/surface.d.ts.map +0 -1
  297. package/dist/types/src/styles/fragments/text.d.ts +0 -7
  298. package/dist/types/src/styles/fragments/text.d.ts.map +0 -1
  299. package/dist/types/src/styles/fragments/valence.d.ts +0 -13
  300. package/dist/types/src/styles/fragments/valence.d.ts.map +0 -1
  301. package/dist/types/src/styles/index.d.ts.map +0 -1
  302. package/dist/types/src/styles/primitives/container.d.ts +0 -15
  303. package/dist/types/src/styles/primitives/container.d.ts.map +0 -1
  304. package/dist/types/src/styles/primitives/index.d.ts +0 -2
  305. package/dist/types/src/styles/primitives/index.d.ts.map +0 -1
  306. package/dist/types/src/styles/theme.d.ts.map +0 -1
  307. package/dist/types/src/tailwind.d.ts +0 -3
  308. package/dist/types/src/tailwind.d.ts.map +0 -1
  309. package/dist/types/src/types.d.ts +0 -3
  310. package/dist/types/src/types.d.ts.map +0 -1
  311. package/dist/types/src/util/withLogical.d.ts +0 -164
  312. package/dist/types/src/util/withLogical.d.ts.map +0 -1
  313. package/src/Tokens.stories.tsx +0 -88
  314. package/src/config/index.ts +0 -6
  315. package/src/config/tailwind.ts +0 -265
  316. package/src/config/tokens/colors/alias-colors.ts +0 -39
  317. package/src/config/tokens/colors/index.ts +0 -8
  318. package/src/config/tokens/colors/physical-colors.ts +0 -125
  319. package/src/config/tokens/colors/semantic-colors.ts +0 -27
  320. package/src/config/tokens/colors/sememes-calls.ts +0 -17
  321. package/src/config/tokens/colors/sememes-codemirror.ts +0 -50
  322. package/src/config/tokens/colors/sememes-hue.ts +0 -54
  323. package/src/config/tokens/colors/sememes-sheet.ts +0 -62
  324. package/src/config/tokens/colors/sememes-system.ts +0 -311
  325. package/src/config/tokens/colors/types.ts +0 -9
  326. package/src/config/tokens/index.ts +0 -6
  327. package/src/config/tokens/lengths.ts +0 -105
  328. package/src/config/tokens/sizes.ts +0 -12
  329. package/src/config/tokens/tokens.ts +0 -87
  330. package/src/docs/theme.drawio.svg +0 -635
  331. package/src/plugins/esbuild-plugin.ts +0 -65
  332. package/src/plugins/plugin.ts +0 -130
  333. package/src/plugins/resolveContent.ts +0 -51
  334. package/src/styles/components/README.md +0 -6
  335. package/src/styles/components/anchored-overflow.ts +0 -20
  336. package/src/styles/components/button.ts +0 -48
  337. package/src/styles/components/icon.ts +0 -19
  338. package/src/styles/components/input.ts +0 -177
  339. package/src/styles/components/scroll-area.ts +0 -88
  340. package/src/styles/fragments/density.ts +0 -17
  341. package/src/styles/fragments/dimension.ts +0 -8
  342. package/src/styles/fragments/focus.ts +0 -16
  343. package/src/styles/fragments/group.ts +0 -12
  344. package/src/styles/fragments/hover.ts +0 -25
  345. package/src/styles/fragments/index.ts +0 -20
  346. package/src/styles/fragments/layout.ts +0 -7
  347. package/src/styles/fragments/motion.ts +0 -6
  348. package/src/styles/fragments/ornament.ts +0 -10
  349. package/src/styles/fragments/selected.ts +0 -45
  350. package/src/styles/fragments/shimmer.ts +0 -9
  351. package/src/styles/fragments/size.ts +0 -117
  352. package/src/styles/fragments/surface.ts +0 -29
  353. package/src/styles/fragments/text.ts +0 -12
  354. package/src/styles/fragments/valence.ts +0 -46
  355. package/src/styles/layers/README.md +0 -15
  356. package/src/styles/layers/anchored-overflow.css +0 -9
  357. package/src/styles/layers/animation.css +0 -17
  358. package/src/styles/layers/attention.css +0 -8
  359. package/src/styles/layers/base.css +0 -25
  360. package/src/styles/layers/can-scroll.css +0 -26
  361. package/src/styles/layers/drag-preview.css +0 -18
  362. package/src/styles/layers/hues.css +0 -110
  363. package/src/styles/layers/index.css +0 -27
  364. package/src/styles/layers/main.css +0 -183
  365. package/src/styles/layers/positioning.css +0 -23
  366. package/src/styles/layers/surfaces.css +0 -31
  367. package/src/styles/layers/tag.css +0 -132
  368. package/src/styles/layers/tldraw.css +0 -91
  369. package/src/styles/layers/tokens.css +0 -47
  370. package/src/styles/primitives/container.ts +0 -33
  371. package/src/styles/primitives/index.ts +0 -5
  372. package/src/tailwind.ts +0 -7
  373. package/src/theme.css +0 -9
  374. package/src/types.ts +0 -7
  375. package/src/util/withLogical.ts +0 -114
  376. /package/dist/types/src/{styles/fragments → fragments}/disabled.d.ts +0 -0
  377. /package/dist/types/src/{styles → theme}/components/avatar.d.ts +0 -0
  378. /package/dist/types/src/{styles → theme}/components/breadcrumb.d.ts +0 -0
  379. /package/dist/types/src/{styles → theme}/components/dialog.d.ts +0 -0
  380. /package/dist/types/src/{styles → theme}/components/link.d.ts +0 -0
  381. /package/dist/types/src/{styles → theme}/components/list.d.ts +0 -0
  382. /package/dist/types/src/{styles → theme}/components/message.d.ts +0 -0
  383. /package/dist/types/src/{styles → theme}/components/select.d.ts +0 -0
  384. /package/dist/types/src/{styles → theme}/components/separator.d.ts +0 -0
  385. /package/dist/types/src/{styles → theme}/components/skeleton.d.ts +0 -0
  386. /package/dist/types/src/{styles → theme}/components/tag.d.ts +0 -0
  387. /package/dist/types/src/{styles → theme}/components/toast.d.ts +0 -0
  388. /package/dist/types/src/{styles → theme}/components/tooltip.d.ts +0 -0
  389. /package/dist/types/src/{styles → theme}/components/treegrid.d.ts +0 -0
  390. /package/dist/types/src/{styles → theme}/theme.d.ts +0 -0
  391. /package/src/{styles/fragments → fragments}/disabled.ts +0 -0
  392. /package/src/{styles → theme}/components/breadcrumb.ts +0 -0
  393. /package/src/{styles → theme}/components/tag.ts +0 -0
@@ -1,1628 +0,0 @@
1
- import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
2
-
3
- // src/config/tailwind.ts
4
- import tailwindcssContainerQueries from "@tailwindcss/container-queries";
5
- import tailwindcssForms from "@tailwindcss/forms";
6
- import merge from "lodash.merge";
7
- import tailwindScrollbar from "tailwind-scrollbar";
8
- import defaultConfig from "tailwindcss/stubs/config.full.js";
9
- import tailwindcssLogical from "tailwindcss-logical";
10
- import tailwindcssRadix from "tailwindcss-radix";
11
-
12
- // src/config/tokens/sizes.ts
13
- var cardMinInlineSize = 18;
14
- var cardDefaultInlineSize = 20;
15
- var cardMaxInlineSize = 22;
16
- var cardMinBlockSize = 18;
17
- var cardMaxBlockSize = 30;
18
-
19
- // src/config/tokens/tokens.ts
20
- import adapter from "@ch-ui/tailwind-tokens";
21
-
22
- // src/config/tokens/colors/physical-colors.ts
23
- var reflectiveRelation = {
24
- initial: 1e3,
25
- slope: -1e3,
26
- method: "floor"
27
- };
28
- var gamuts = [
29
- "srgb",
30
- "p3",
31
- "rec2020"
32
- ];
33
- var DEG_RAD = Math.PI / 180;
34
- var hueKeyPoint = (hue) => {
35
- const hueDeg = (360 * (hue / 17) + 26) % 360;
36
- return {
37
- keyPoint: [
38
- 0.5,
39
- 0.13 + 0.024 * Math.sin((hueDeg - 15) * DEG_RAD),
40
- hueDeg
41
- ],
42
- lowerCp: 1,
43
- upperCp: 1,
44
- torsion: 0
45
- };
46
- };
47
- var huePalettes = {
48
- red: hueKeyPoint(0),
49
- orange: hueKeyPoint(1),
50
- amber: hueKeyPoint(2),
51
- yellow: hueKeyPoint(3),
52
- lime: hueKeyPoint(4),
53
- green: hueKeyPoint(5),
54
- emerald: hueKeyPoint(6),
55
- teal: hueKeyPoint(7),
56
- cyan: hueKeyPoint(8),
57
- sky: hueKeyPoint(9),
58
- blue: hueKeyPoint(10),
59
- indigo: hueKeyPoint(11),
60
- violet: hueKeyPoint(12),
61
- purple: hueKeyPoint(13),
62
- fuchsia: hueKeyPoint(14),
63
- pink: hueKeyPoint(15),
64
- rose: hueKeyPoint(16)
65
- };
66
- var systemPalettes = {
67
- neutral: {
68
- keyPoint: [
69
- 0.5,
70
- 1e-3,
71
- 260
72
- ],
73
- lowerCp: 0,
74
- upperCp: 0,
75
- torsion: 0,
76
- // Values used directly.
77
- // TODO(burdon): Audit.
78
- values: [
79
- 25,
80
- 50,
81
- 75,
82
- 100,
83
- 150,
84
- 200,
85
- 250,
86
- 300,
87
- 400,
88
- 500,
89
- 600,
90
- 700,
91
- 750,
92
- 800,
93
- 850,
94
- 900
95
- ]
96
- },
97
- // https://oklch.com/#0.5,0.2,260,100 (#0559d2)
98
- primary: {
99
- keyPoint: [
100
- 0.5,
101
- 0.2,
102
- 260
103
- ],
104
- lowerCp: 0.86,
105
- upperCp: 1,
106
- torsion: -30,
107
- // Values used directly.
108
- // TODO(burdon): Audit.
109
- values: [
110
- 100,
111
- 150,
112
- 200,
113
- 350,
114
- 400,
115
- 450,
116
- 500,
117
- 750,
118
- 800,
119
- 850
120
- ]
121
- }
122
- };
123
- var physicalSeries = {
124
- ...huePalettes,
125
- ...systemPalettes
126
- };
127
- var physicalColors = {
128
- namespace: "dx-",
129
- definitions: {
130
- // @ts-ignore
131
- series: physicalSeries,
132
- accompanyingSeries: {
133
- reflectiveRelation
134
- }
135
- },
136
- conditions: {
137
- srgb: [
138
- ":root, .dark"
139
- ],
140
- p3: [
141
- "@media (color-gamut: p3)",
142
- ":root, .dark"
143
- ],
144
- rec2020: [
145
- "@media (color-gamut: rec2020)",
146
- ":root, .dark"
147
- ]
148
- },
149
- series: Object.entries(physicalSeries).reduce((acc, [id]) => {
150
- acc[id] = gamuts.reduce((acc2, gamut) => {
151
- acc2[gamut] = {
152
- extends: id,
153
- physicalValueRelation: {
154
- extends: "reflectiveRelation"
155
- }
156
- };
157
- return acc2;
158
- }, {});
159
- return acc;
160
- }, {})
161
- };
162
-
163
- // src/config/tokens/colors/sememes-hue.ts
164
- var hueSememes = [
165
- ...Object.keys(huePalettes),
166
- "neutral",
167
- "primary"
168
- ].reduce((acc, palette) => {
169
- acc[`${palette}Cursor`] = {
170
- light: [
171
- palette,
172
- 400
173
- ],
174
- dark: [
175
- palette,
176
- 300
177
- ]
178
- };
179
- acc[`${palette}Text`] = {
180
- light: [
181
- palette,
182
- 550
183
- ],
184
- dark: [
185
- palette,
186
- 300
187
- ]
188
- };
189
- acc[`${palette}Fill`] = {
190
- light: [
191
- palette,
192
- 500
193
- ],
194
- dark: [
195
- palette,
196
- 500
197
- ]
198
- };
199
- acc[`${palette}Surface`] = {
200
- light: [
201
- palette,
202
- 200
203
- ],
204
- dark: [
205
- palette,
206
- 700
207
- ]
208
- };
209
- acc[`${palette}SurfaceText`] = {
210
- light: [
211
- palette,
212
- 700
213
- ],
214
- dark: [
215
- palette,
216
- 200
217
- ]
218
- };
219
- acc[`${palette}Screen`] = {
220
- light: [
221
- palette,
222
- 100
223
- ],
224
- dark: [
225
- palette,
226
- 800
227
- ]
228
- };
229
- return acc;
230
- }, {});
231
- var valenceAliasSememeStems = [
232
- "Text",
233
- "Surface",
234
- "SurfaceText",
235
- "Fill",
236
- "Cursor"
237
- ];
238
- var valenceMapping = {
239
- emerald: [
240
- "success"
241
- ],
242
- cyan: [
243
- "info"
244
- ],
245
- amber: [
246
- "warning"
247
- ],
248
- rose: [
249
- "error"
250
- ],
251
- primary: [
252
- "current"
253
- ],
254
- fuchsia: [
255
- "internal"
256
- ]
257
- };
258
- var valenceAliases = valenceAliasSememeStems.reduce((acc, stem) => {
259
- return Object.entries(valenceMapping).reduce((acc2, [hue, valences]) => {
260
- acc2[`${hue}${stem}`] = {
261
- root: valences.map((valence) => `${valence}${stem}`)
262
- };
263
- return acc2;
264
- }, acc);
265
- }, {});
266
-
267
- // src/config/tokens/colors/sememes-sheet.ts
268
- var sheetSememes = {
269
- // NOTE: background styles for the main content area must have transparency otherwise they will mask the selection.
270
- axisSurface: {
271
- light: [
272
- "neutral",
273
- 50
274
- ],
275
- dark: [
276
- "neutral",
277
- 800
278
- ]
279
- },
280
- axisText: {
281
- light: [
282
- "neutral",
283
- 800
284
- ],
285
- dark: [
286
- "neutral",
287
- 200
288
- ]
289
- },
290
- axisSelectedSurface: {
291
- light: [
292
- "neutral",
293
- 100
294
- ],
295
- dark: [
296
- "neutral",
297
- 900
298
- ]
299
- },
300
- axisSelectedText: {
301
- light: [
302
- "neutral",
303
- 100
304
- ],
305
- dark: [
306
- "neutral",
307
- 900
308
- ]
309
- },
310
- gridCell: {
311
- // TODO(thure): Why override only dark?
312
- light: [
313
- "neutral",
314
- "50/0"
315
- ],
316
- dark: [
317
- "neutral",
318
- 850
319
- ]
320
- },
321
- gridCellSelected: {
322
- // TODO(thure): Can this not just use `attention`?
323
- light: [
324
- "neutral",
325
- 50
326
- ],
327
- dark: [
328
- "neutral",
329
- 800
330
- ]
331
- },
332
- gridOverlay: {
333
- light: [
334
- "primary",
335
- "500/.5"
336
- ],
337
- dark: [
338
- "primary",
339
- "500/.5"
340
- ]
341
- },
342
- gridSelectionOverlay: {
343
- light: [
344
- "primary",
345
- "500/.2"
346
- ],
347
- dark: [
348
- "primary",
349
- "500/.2"
350
- ]
351
- },
352
- gridHighlight: {
353
- light: [
354
- "emerald",
355
- "500/.5"
356
- ],
357
- dark: [
358
- "emerald",
359
- "500/.5"
360
- ]
361
- },
362
- // TODO(burdon): Factor out def (in common with editor).
363
- gridCommented: {
364
- light: [
365
- "green",
366
- 200
367
- ],
368
- dark: [
369
- "green",
370
- 600
371
- ]
372
- },
373
- gridCommentedActive: {
374
- light: [
375
- "green",
376
- "200/.5"
377
- ],
378
- dark: [
379
- "green",
380
- "600/.5"
381
- ]
382
- }
383
- };
384
- var sheetAliases = {
385
- activeSurface: {
386
- root: [
387
- "gridLine"
388
- ]
389
- },
390
- accentFocusIndicator: {
391
- root: [
392
- "gridFocusIndicatorColor"
393
- ]
394
- },
395
- neutralFocusIndicator: {
396
- gridFocusStack: [
397
- "gridFocusIndicatorColor"
398
- ]
399
- }
400
- };
401
-
402
- // src/config/tokens/colors/sememes-system.ts
403
- var getMapValue = (map, key, defaultValue) => {
404
- let value = map[key];
405
- if (!value) {
406
- value = defaultValue();
407
- map[key] = value;
408
- }
409
- return value;
410
- };
411
- var applyAlpha = (sememe, alpha) => {
412
- if (alpha >= 1) {
413
- return sememe;
414
- } else {
415
- return {
416
- light: [
417
- sememe.light[0],
418
- `${sememe.light[1]}/${alpha}`
419
- ],
420
- dark: [
421
- sememe.dark[0],
422
- `${sememe.dark[1]}/${alpha}`
423
- ]
424
- };
425
- }
426
- };
427
- var DARK_ELEVATION_MIN = 855;
428
- var DARK_ELEVATION_MAX = 731;
429
- var DARK_CONTRAST_MIN = 750;
430
- var DARK_CONTRAST_MAX = 665;
431
- var LIGHT_ELEVATION_MIN = 0;
432
- var LIGHT_ELEVATION_MAX = 0;
433
- var LIGHT_CONTRAST_MIN = 82;
434
- var LIGHT_CONTRAST_MAX = 24;
435
- var ELEVATION_SCALE = 2;
436
- var CONTRAST_SCALE = 3;
437
- var darkElevationCadence = (depth) => Math.round(DARK_ELEVATION_MAX + (DARK_ELEVATION_MIN - DARK_ELEVATION_MAX) * ((ELEVATION_SCALE - depth) / ELEVATION_SCALE));
438
- var darkContrastCadence = (depth) => Math.round(DARK_CONTRAST_MAX + (DARK_CONTRAST_MIN - DARK_CONTRAST_MAX) * ((ELEVATION_SCALE - depth) / ELEVATION_SCALE));
439
- var lightElevationCadence = (depth) => Math.round(LIGHT_ELEVATION_MIN + (LIGHT_ELEVATION_MAX - LIGHT_ELEVATION_MIN) * ((CONTRAST_SCALE - depth) / CONTRAST_SCALE));
440
- var lightContrastCadence = (depth) => Math.round(LIGHT_CONTRAST_MAX + (LIGHT_CONTRAST_MIN - LIGHT_CONTRAST_MAX) * (depth / CONTRAST_SCALE));
441
- var elevationCadence = (lightDepth, darkDepth = lightDepth, alpha = 1) => applyAlpha({
442
- light: [
443
- "neutral",
444
- lightElevationCadence(lightDepth)
445
- ],
446
- dark: [
447
- "neutral",
448
- darkElevationCadence(darkDepth)
449
- ]
450
- }, alpha);
451
- var contrastCadence = (lightDepth, darkDepth = lightDepth, alpha = 1) => applyAlpha({
452
- light: [
453
- "neutral",
454
- lightContrastCadence(lightDepth)
455
- ],
456
- dark: [
457
- "neutral",
458
- darkContrastCadence(darkDepth)
459
- ]
460
- }, alpha);
461
- var aliasDefs = {
462
- // Selected items, current items, other surfaces needing special contrast against baseSurface.
463
- activeSurface: {
464
- root: "inputSurfaceBase"
465
- },
466
- // Main sidebar panel.
467
- sidebarSurface: {
468
- root: "groupSurface"
469
- },
470
- // Plank header.
471
- headerSurface: {
472
- root: "groupSurface"
473
- },
474
- // Toolbars, table/sheet headers, etc.
475
- toolbarSurface: {
476
- root: "groupSurface"
477
- },
478
- // Forms, cards, etc.
479
- cardSurface: {
480
- root: "groupSurface"
481
- },
482
- // Secondary aliases.
483
- textInputSurface: {
484
- root: "textInputSurfaceBase",
485
- group: "textInputSurfaceGroup",
486
- modal: "textInputSurfaceModal"
487
- },
488
- inputSurface: {
489
- root: "inputSurfaceBase",
490
- group: "inputSurfaceGroup",
491
- modal: "inputSurfaceModal"
492
- },
493
- hoverSurface: {
494
- root: "hoverSurfaceBase",
495
- group: "hoverSurfaceGroup",
496
- modal: "hoverSurfaceModal"
497
- },
498
- // TODO(thure): Rename uses of this token to `focusSurface` and remove this alias.
499
- attention: {
500
- root: "focusSurface"
501
- },
502
- // In “master-detail” patterns, the background of the item in the list which is enumerated in the adjacent view.
503
- // TODO(burdon): Review tokens.
504
- currentRelated: {
505
- root: "modalSurface"
506
- },
507
- // Borders and dividers.
508
- separator: {
509
- root: "separatorBase",
510
- group: "separatorGroup",
511
- modal: "separatorModal"
512
- }
513
- };
514
- var systemSememes = {
515
- //
516
- // Elevation cadence tokens
517
- //
518
- baseSurface: elevationCadence(0),
519
- groupSurface: elevationCadence(1),
520
- modalSurface: elevationCadence(2, 1.7),
521
- //
522
- // Contrast cadence tokens
523
- //
524
- textInputSurfaceBase: contrastCadence(0, 0),
525
- textInputSurfaceGroup: contrastCadence(0, 0.5),
526
- textInputSurfaceModal: contrastCadence(0, 1),
527
- inputSurfaceBase: contrastCadence(0.8, 0.33),
528
- inputSurfaceGroup: contrastCadence(0.8, 0.66),
529
- inputSurfaceModal: contrastCadence(0.8, 1),
530
- hoverSurfaceBase: contrastCadence(2, 1.5),
531
- hoverSurfaceGroup: contrastCadence(2, 2),
532
- hoverSurfaceModal: contrastCadence(2, 2.5),
533
- separatorBase: contrastCadence(3, 2),
534
- separatorGroup: contrastCadence(3, 2.5),
535
- separatorModal: contrastCadence(3, 3),
536
- subduedSeparator: contrastCadence(3, 1),
537
- scrollbarTrack: contrastCadence(0),
538
- scrollbarThumbSubdued: contrastCadence(1, 1),
539
- scrollbarThumb: contrastCadence(2.5, 2.5),
540
- scrollbarThumbHover: contrastCadence(3.5, 3.5),
541
- scrollbarThumbActive: contrastCadence(4.5, 4.5),
542
- unAccent: {
543
- light: [
544
- "neutral",
545
- 400
546
- ],
547
- dark: [
548
- "neutral",
549
- 400
550
- ]
551
- },
552
- unAccentHover: {
553
- light: [
554
- "neutral",
555
- 450
556
- ],
557
- dark: [
558
- "neutral",
559
- 450
560
- ]
561
- },
562
- hoverOverlay: {
563
- light: [
564
- "neutral",
565
- "450/.1"
566
- ],
567
- dark: [
568
- "neutral",
569
- "450/.1"
570
- ]
571
- },
572
- //
573
- // Special surfaces.
574
- //
575
- // Screen overlay for modal dialogs.
576
- scrimSurface: applyAlpha({
577
- light: [
578
- "neutral",
579
- LIGHT_CONTRAST_MAX
580
- ],
581
- dark: [
582
- "neutral",
583
- DARK_ELEVATION_MIN
584
- ]
585
- }, 0.65),
586
- // High contrast for focused interactive elements. (Technically this is part of the surface cadence, but the contrast cadence is on the opposite side of the elevation cadence as this point.)
587
- focusSurface: {
588
- light: [
589
- "neutral",
590
- 0
591
- ],
592
- dark: [
593
- "neutral",
594
- 1e3
595
- ]
596
- },
597
- deckSurface: {
598
- light: [
599
- "neutral",
600
- 50
601
- ],
602
- dark: [
603
- "neutral",
604
- 950
605
- ]
606
- },
607
- // For tooltips only; the highest elevation from the opposite theme
608
- inverseSurface: {
609
- light: [
610
- "neutral",
611
- DARK_ELEVATION_MIN
612
- ],
613
- dark: [
614
- "neutral",
615
- LIGHT_ELEVATION_MIN
616
- ]
617
- },
618
- //
619
- // Accent surfaces
620
- //
621
- accentSurfaceRelated: {
622
- light: [
623
- "primary",
624
- "300/.1"
625
- ],
626
- dark: [
627
- "primary",
628
- "400/.1"
629
- ]
630
- },
631
- accentSurfaceHover: {
632
- light: [
633
- "primary",
634
- 600
635
- ],
636
- dark: [
637
- "primary",
638
- 475
639
- ]
640
- },
641
- accentSurface: {
642
- light: [
643
- "primary",
644
- 500
645
- ],
646
- dark: [
647
- "primary",
648
- 500
649
- ]
650
- },
651
- //
652
- // Text (text-) and other foregrounds
653
- // TODO(thure): Establish contrast-order cadence for text.
654
- //
655
- baseText: {
656
- light: [
657
- "neutral",
658
- 1e3
659
- ],
660
- dark: [
661
- "neutral",
662
- 50
663
- ]
664
- },
665
- inverseSurfaceText: {
666
- light: [
667
- "neutral",
668
- 50
669
- ],
670
- dark: [
671
- "neutral",
672
- 1e3
673
- ]
674
- },
675
- description: {
676
- light: [
677
- "neutral",
678
- 550
679
- ],
680
- dark: [
681
- "neutral",
682
- 350
683
- ]
684
- },
685
- subdued: {
686
- light: [
687
- "neutral",
688
- 700
689
- ],
690
- dark: [
691
- "neutral",
692
- 300
693
- ]
694
- },
695
- placeholder: {
696
- light: [
697
- "neutral",
698
- 500
699
- ],
700
- dark: [
701
- "neutral",
702
- 500
703
- ]
704
- },
705
- accentText: {
706
- light: [
707
- "primary",
708
- 550
709
- ],
710
- dark: [
711
- "primary",
712
- 400
713
- ]
714
- },
715
- accentSurfaceText: {
716
- light: [
717
- "neutral",
718
- 0
719
- ],
720
- dark: [
721
- "neutral",
722
- 0
723
- ]
724
- },
725
- accentTextHover: {
726
- light: [
727
- "primary",
728
- 500
729
- ],
730
- dark: [
731
- "primary",
732
- 350
733
- ]
734
- },
735
- accentFocusIndicator: {
736
- light: [
737
- "primary",
738
- 300
739
- ],
740
- dark: [
741
- "primary",
742
- 450
743
- ]
744
- },
745
- neutralFocusIndicator: {
746
- light: [
747
- "neutral",
748
- 300
749
- ],
750
- dark: [
751
- "neutral",
752
- 550
753
- ]
754
- }
755
- };
756
- var systemAliases = Object.entries(aliasDefs).reduce((aliases, [alias, values]) => {
757
- Object.entries(values).forEach(([key, sememe]) => {
758
- const record = getMapValue(aliases, sememe, () => ({}));
759
- const list = getMapValue(record, key, () => []);
760
- list.push(alias);
761
- });
762
- return aliases;
763
- }, {});
764
-
765
- // src/config/tokens/colors/alias-colors.ts
766
- var groupAliases = [
767
- "groupSurface",
768
- ...systemAliases.groupSurface?.root ?? []
769
- ];
770
- var modalAliases = [
771
- "modalSurface",
772
- ...systemAliases.modalSurface?.root ?? []
773
- ];
774
- var aliasColors = {
775
- conditions: {
776
- root: [
777
- ":root, .dark"
778
- ],
779
- group: [
780
- [
781
- ".sidebar-surface, .dark .sidebar-surface",
782
- ...groupAliases.map((alias) => `.bg-${alias}, .dark .bg-${alias}`)
783
- ].join(", ")
784
- ],
785
- modal: [
786
- [
787
- ".modal-surface, .dark .modal-surface",
788
- ...modalAliases.map((alias) => `.bg-${alias}, .dark .bg-${alias}`)
789
- ].join(", ")
790
- ],
791
- gridFocusStack: [
792
- '[data-grid-focus-indicator-variant="stack"]'
793
- ]
794
- },
795
- aliases: {
796
- // TODO(thure): Aliases should be merged more elegantly, this causes overwrites.
797
- ...sheetAliases,
798
- ...systemAliases,
799
- ...valenceAliases
800
- },
801
- namespace: "dx-"
802
- };
803
-
804
- // src/config/tokens/colors/sememes-calls.ts
805
- var callsSememes = {
806
- callActive: {
807
- light: [
808
- "green",
809
- "500"
810
- ],
811
- dark: [
812
- "green",
813
- "500"
814
- ]
815
- },
816
- callAlert: {
817
- light: [
818
- "rose",
819
- "500"
820
- ],
821
- dark: [
822
- "rose",
823
- "500"
824
- ]
825
- }
826
- };
827
-
828
- // src/config/tokens/colors/sememes-codemirror.ts
829
- var codemirrorSememes = {
830
- // NOTE: background styles for the main content area must have transparency otherwise they will mask the selection.
831
- cmCodeblock: {
832
- light: [
833
- "neutral",
834
- "500/.1"
835
- ],
836
- dark: [
837
- "neutral",
838
- "500/.1"
839
- ]
840
- },
841
- cmActiveLine: {
842
- light: [
843
- "neutral",
844
- "200/.5"
845
- ],
846
- dark: [
847
- "neutral",
848
- "800/.5"
849
- ]
850
- },
851
- cmSeparator: {
852
- light: [
853
- "primary",
854
- 500
855
- ],
856
- dark: [
857
- "primary",
858
- 500
859
- ]
860
- },
861
- cmCursor: {
862
- light: [
863
- "neutral",
864
- 900
865
- ],
866
- dark: [
867
- "neutral",
868
- 100
869
- ]
870
- },
871
- cmSelection: {
872
- light: [
873
- "primary",
874
- "400/.5"
875
- ],
876
- dark: [
877
- "primary",
878
- "600/.5"
879
- ]
880
- },
881
- cmFocusedSelection: {
882
- light: [
883
- "primary",
884
- 400
885
- ],
886
- dark: [
887
- "primary",
888
- 600
889
- ]
890
- },
891
- cmHighlight: {
892
- light: [
893
- "neutral",
894
- 950
895
- ],
896
- dark: [
897
- "neutral",
898
- 50
899
- ]
900
- },
901
- cmHighlightSurface: {
902
- light: [
903
- "sky",
904
- 200
905
- ],
906
- dark: [
907
- "cyan",
908
- 600
909
- ]
910
- },
911
- // TODO(burdon): Factor out defs in common with sheet.
912
- cmCommentText: {
913
- light: [
914
- "neutral",
915
- 50
916
- ],
917
- dark: [
918
- "neutral",
919
- 950
920
- ]
921
- },
922
- cmCommentSurface: {
923
- light: [
924
- "amber",
925
- 700
926
- ],
927
- dark: [
928
- "amber",
929
- 200
930
- ]
931
- }
932
- };
933
-
934
- // src/config/tokens/colors/semantic-colors.ts
935
- var semanticColors = {
936
- conditions: {
937
- light: [
938
- ":root"
939
- ],
940
- dark: [
941
- ".dark"
942
- ]
943
- },
944
- sememes: {
945
- // Define each set of sememes in its own file.
946
- ...callsSememes,
947
- ...codemirrorSememes,
948
- ...hueSememes,
949
- ...sheetSememes,
950
- ...systemSememes
951
- },
952
- namespace: "dx-"
953
- };
954
-
955
- // src/config/tokens/lengths.ts
956
- var lengthsFacet = {
957
- physical: {
958
- namespace: "dx-",
959
- conditions: {
960
- root: [
961
- ":root"
962
- ]
963
- },
964
- series: {
965
- line: {
966
- root: {
967
- unit: "px",
968
- initial: 0,
969
- slope: 1
970
- }
971
- },
972
- // "gap"
973
- lacuna: {
974
- root: {
975
- unit: "rem",
976
- initial: 0,
977
- slope: 0.125
978
- }
979
- }
980
- }
981
- },
982
- semantic: {
983
- namespace: "dx-",
984
- conditions: {
985
- root: [
986
- ":root"
987
- ]
988
- },
989
- sememes: {
990
- noLine: {
991
- root: [
992
- "line",
993
- 0
994
- ]
995
- },
996
- hairLine: {
997
- root: [
998
- "line",
999
- 1
1000
- ]
1001
- },
1002
- thickLine: {
1003
- root: [
1004
- "line",
1005
- 2
1006
- ]
1007
- },
1008
- trimXs: {
1009
- root: [
1010
- "lacuna",
1011
- 3
1012
- ]
1013
- },
1014
- trimSm: {
1015
- root: [
1016
- "lacuna",
1017
- 4
1018
- ]
1019
- },
1020
- trimMd: {
1021
- root: [
1022
- "lacuna",
1023
- 6
1024
- ]
1025
- },
1026
- trimLg: {
1027
- root: [
1028
- "lacuna",
1029
- 12
1030
- ]
1031
- },
1032
- inputFine: {
1033
- root: [
1034
- "lacuna",
1035
- 3
1036
- ]
1037
- },
1038
- inputCoarse: {
1039
- root: [
1040
- "lacuna",
1041
- 4
1042
- ]
1043
- }
1044
- }
1045
- },
1046
- alias: {
1047
- namespace: "dx-",
1048
- conditions: {
1049
- fine: [
1050
- ":root, .density-fine"
1051
- ],
1052
- coarse: [
1053
- ".density-coarse"
1054
- ],
1055
- flush: [
1056
- ".density-flush"
1057
- ],
1058
- gridFocusStack: [
1059
- '[data-grid-focus-indicator-variant="stack"]'
1060
- ]
1061
- },
1062
- aliases: {
1063
- noLine: {
1064
- fine: [
1065
- "focusOffset"
1066
- ]
1067
- },
1068
- hairLine: {
1069
- fine: [
1070
- "modalLine",
1071
- "landmarkLine",
1072
- "positionedLine",
1073
- "gridGap",
1074
- "gridFocusIndicatorWidth"
1075
- ]
1076
- },
1077
- thickLine: {
1078
- fine: [
1079
- "focusLine"
1080
- ],
1081
- gridFocusStack: [
1082
- "gridFocusIndicatorWidth"
1083
- ]
1084
- },
1085
- inputFine: {
1086
- fine: [
1087
- "iconButtonPadding"
1088
- ]
1089
- },
1090
- inputCoarse: {
1091
- coarse: [
1092
- "iconButtonPadding"
1093
- ]
1094
- },
1095
- trimXs: {
1096
- fine: [
1097
- "cardSpacingChrome",
1098
- "labelSpacingBlock",
1099
- "inputSpacingBlock"
1100
- ]
1101
- },
1102
- trimSm: {
1103
- fine: [
1104
- "cardSpacingInline",
1105
- "cardSpacingBlock",
1106
- "cardSpacingGap"
1107
- ]
1108
- },
1109
- trimMd: {
1110
- coarse: [
1111
- "cardSpacingInline",
1112
- "cardSpacingBlock",
1113
- "cardSpacingGap"
1114
- ]
1115
- }
1116
- }
1117
- }
1118
- };
1119
- var maxSizesFacet = {
1120
- physical: {
1121
- namespace: "dx-",
1122
- conditions: {
1123
- root: [
1124
- ":root"
1125
- ]
1126
- },
1127
- series: {
1128
- size: {
1129
- root: {
1130
- unit: "rem",
1131
- initial: 0,
1132
- slope: 1
1133
- }
1134
- }
1135
- }
1136
- },
1137
- semantic: {
1138
- namespace: "dx-",
1139
- conditions: {
1140
- root: [
1141
- ":root"
1142
- ]
1143
- },
1144
- sememes: {
1145
- "prose-max-width": {
1146
- root: [
1147
- "size",
1148
- 50
1149
- ]
1150
- },
1151
- "container-max-width": {
1152
- root: [
1153
- "size",
1154
- 50
1155
- ]
1156
- },
1157
- "card-default-width": {
1158
- root: [
1159
- "size",
1160
- cardDefaultInlineSize
1161
- ]
1162
- },
1163
- "card-min-width": {
1164
- root: [
1165
- "size",
1166
- cardMinInlineSize
1167
- ]
1168
- },
1169
- "card-max-width": {
1170
- root: [
1171
- "size",
1172
- cardMaxInlineSize
1173
- ]
1174
- },
1175
- "card-min-height": {
1176
- root: [
1177
- "size",
1178
- cardMinBlockSize
1179
- ]
1180
- },
1181
- "card-max-height": {
1182
- root: [
1183
- "size",
1184
- cardMaxBlockSize
1185
- ]
1186
- }
1187
- }
1188
- }
1189
- };
1190
-
1191
- // src/config/tokens/tokens.ts
1192
- var adapterConfig = {
1193
- colors: {
1194
- facet: "colors",
1195
- disposition: "overwrite",
1196
- tokenization: "recursive"
1197
- },
1198
- borderWidth: {
1199
- facet: "lengths",
1200
- disposition: "extend",
1201
- tokenization: "omit-series"
1202
- },
1203
- ringWidth: {
1204
- facet: "lengths",
1205
- disposition: "extend",
1206
- tokenization: "omit-series"
1207
- },
1208
- ringOffsetWidth: {
1209
- facet: "lengths",
1210
- disposition: "extend",
1211
- tokenization: "omit-series"
1212
- },
1213
- outlineWidth: {
1214
- facet: "lengths",
1215
- disposition: "extend",
1216
- tokenization: "omit-series"
1217
- },
1218
- spacing: {
1219
- facet: "lengths",
1220
- disposition: "extend",
1221
- tokenization: "keep-series"
1222
- }
1223
- };
1224
- var hues = Object.keys(huePalettes);
1225
- var tokenSet = {
1226
- colors: {
1227
- physical: physicalColors,
1228
- semantic: semanticColors,
1229
- alias: aliasColors
1230
- },
1231
- lengths: lengthsFacet,
1232
- maxSizes: maxSizesFacet
1233
- };
1234
- var userDefaultTokenSet = {
1235
- colors: {
1236
- physical: {
1237
- definitions: {
1238
- series: {
1239
- neutral: physicalColors.definitions.series.neutral,
1240
- primary: physicalColors.definitions.series.primary
1241
- },
1242
- accompanyingSeries: physicalColors.definitions.accompanyingSeries
1243
- },
1244
- conditions: physicalColors.conditions,
1245
- series: {
1246
- neutral: physicalColors.series.neutral,
1247
- primary: physicalColors.series.primary
1248
- },
1249
- namespace: physicalColors.namespace
1250
- },
1251
- semantic: {
1252
- conditions: semanticColors.conditions,
1253
- sememes: systemSememes,
1254
- namespace: semanticColors.namespace
1255
- },
1256
- alias: {
1257
- conditions: aliasColors.conditions,
1258
- aliases: systemAliases,
1259
- namespace: aliasColors.namespace
1260
- }
1261
- }
1262
- };
1263
- var tokensTailwindConfig = adapter(tokenSet, adapterConfig);
1264
-
1265
- // src/config/tailwind.ts
1266
- var { extend: extendTokens, ...overrideTokens } = tokensTailwindConfig;
1267
- var tailwindConfig = ({ env = "production", content = [], extensions = [] }) => ({
1268
- darkMode: "class",
1269
- theme: {
1270
- // Configure fonts in theme.css and package.json.
1271
- fontFamily: {
1272
- body: [
1273
- "Inter Variable",
1274
- ...defaultConfig.theme.fontFamily.sans
1275
- ],
1276
- mono: [
1277
- "JetBrains Mono Variable",
1278
- ...defaultConfig.theme.fontFamily.mono
1279
- ]
1280
- },
1281
- extend: merge({
1282
- // Generates is-card-default-width, is-card-min-width, etc.
1283
- spacing: {
1284
- "prose-max-width": "var(--dx-prose-max-width)",
1285
- "container-max-width": "var(--dx-container-max-width)",
1286
- "card-default-width": "var(--dx-card-default-width)",
1287
- "card-min-width": "var(--dx-card-min-width)",
1288
- "card-max-width": "var(--dx-card-max-width)",
1289
- "card-min-height": "var(--dx-card-min-height)",
1290
- "card-max-height": "var(--dx-card-max-height)"
1291
- },
1292
- backgroundImage: {
1293
- "gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
1294
- "gradient-conic": "conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))"
1295
- },
1296
- borderRadius: {
1297
- none: "0",
1298
- sm: "0.25rem",
1299
- DEFAULT: "0.5rem",
1300
- md: "0.75rem",
1301
- lg: "1rem"
1302
- },
1303
- screens: {
1304
- "pointer-fine": {
1305
- raw: "(pointer: fine)"
1306
- },
1307
- "hover-hover": {
1308
- raw: "(hover: hover)"
1309
- },
1310
- "md": "768px",
1311
- "lg": "1024px"
1312
- },
1313
- fontSize: {
1314
- // Base size 16px
1315
- // Scale 1.125
1316
- "xs": [
1317
- "0.790rem",
1318
- {
1319
- lineHeight: "1rem"
1320
- }
1321
- ],
1322
- "sm": [
1323
- "0.889rem",
1324
- {
1325
- lineHeight: "1.25rem"
1326
- }
1327
- ],
1328
- "base": [
1329
- "1rem",
1330
- {
1331
- lineHeight: "1.5rem"
1332
- }
1333
- ],
1334
- "lg": [
1335
- "1.125rem",
1336
- {
1337
- lineHeight: "1.75rem"
1338
- }
1339
- ],
1340
- "xl": [
1341
- "1.266rem",
1342
- {
1343
- lineHeight: "1.75rem"
1344
- }
1345
- ],
1346
- "2xl": [
1347
- "1.424rem",
1348
- {
1349
- lineHeight: "2rem"
1350
- }
1351
- ],
1352
- "3xl": [
1353
- "1.602rem",
1354
- {
1355
- lineHeight: "2.25rem"
1356
- }
1357
- ],
1358
- "4xl": [
1359
- "1.802rem",
1360
- {
1361
- lineHeight: "2.5rem"
1362
- }
1363
- ],
1364
- "5xl": [
1365
- "2.027rem",
1366
- {
1367
- lineHeight: "2.5rem"
1368
- }
1369
- ],
1370
- "6xl": [
1371
- "2.281rem",
1372
- {
1373
- lineHeight: "2.5rem"
1374
- }
1375
- ],
1376
- "7xl": [
1377
- "2.566rem",
1378
- {
1379
- lineHeight: "2.75rem"
1380
- }
1381
- ],
1382
- "8xl": [
1383
- "2.887rem",
1384
- {
1385
- lineHeight: "3rem"
1386
- }
1387
- ],
1388
- "9xl": [
1389
- "3.247rem",
1390
- {
1391
- lineHeight: "3.25rem"
1392
- }
1393
- ]
1394
- },
1395
- boxShadow: {
1396
- "slider": "0 0 0 5px rgba(0, 0, 0, 0.3)"
1397
- },
1398
- transitionProperty: {
1399
- "max-height": "max-height"
1400
- },
1401
- transitionTimingFunction: {
1402
- "in-out-symmetric": "cubic-bezier(0.5, 0, 0.5, 1)"
1403
- },
1404
- keyframes: {
1405
- // Fade
1406
- "fade-in": {
1407
- from: {
1408
- opacity: 0
1409
- },
1410
- to: {
1411
- opacity: 1
1412
- }
1413
- },
1414
- "fade-out": {
1415
- from: {
1416
- opacity: 1
1417
- },
1418
- to: {
1419
- opacity: 0
1420
- }
1421
- },
1422
- // Popper chrome
1423
- "slide-down-and-fade": {
1424
- from: {
1425
- opacity: 1,
1426
- transform: "translateY(0)"
1427
- },
1428
- to: {
1429
- opacity: 0,
1430
- transform: "translateY(16px)"
1431
- }
1432
- },
1433
- "slide-left-and-fade": {
1434
- from: {
1435
- opacity: 0,
1436
- transform: "translateX(-16px)"
1437
- },
1438
- to: {
1439
- opacity: 1,
1440
- transform: "translateX(0)"
1441
- }
1442
- },
1443
- "slide-up-and-fade": {
1444
- from: {
1445
- opacity: 0,
1446
- transform: "translateY(16px)"
1447
- },
1448
- to: {
1449
- opacity: 1,
1450
- transform: "translateY(0)"
1451
- }
1452
- },
1453
- "slide-right-and-fade": {
1454
- from: {
1455
- opacity: 0,
1456
- transform: "translateX(16px)"
1457
- },
1458
- to: {
1459
- opacity: 1,
1460
- transform: "translateX(0)"
1461
- }
1462
- },
1463
- // Toast
1464
- "toast-hide": {
1465
- "0%": {
1466
- opacity: "1"
1467
- },
1468
- "100%": {
1469
- opacity: "0"
1470
- }
1471
- },
1472
- "toast-slide-in-right": {
1473
- "0%": {
1474
- transform: "translateX(calc(100% + 1rem))"
1475
- },
1476
- "100%": {
1477
- transform: "translateX(0)"
1478
- }
1479
- },
1480
- "toast-slide-in-bottom": {
1481
- "0%": {
1482
- transform: "translateY(calc(100% + 1rem))"
1483
- },
1484
- "100%": {
1485
- transform: "translateY(0)"
1486
- }
1487
- },
1488
- "toast-swipe-out": {
1489
- "0%": {
1490
- transform: "translateX(var(--radix-toast-swipe-end-x))"
1491
- },
1492
- "100%": {
1493
- transform: "translateX(calc(100% + 1rem))"
1494
- }
1495
- },
1496
- // Accordion
1497
- "slide-down": {
1498
- from: {
1499
- height: "0px"
1500
- },
1501
- to: {
1502
- height: "var(--radix-accordion-content-height)"
1503
- }
1504
- },
1505
- "slide-up": {
1506
- from: {
1507
- height: "var(--radix-accordion-content-height)"
1508
- },
1509
- to: {
1510
- height: "0px"
1511
- }
1512
- },
1513
- // Shimmer
1514
- "shimmer-loop": {
1515
- "100%": {
1516
- transform: "translateX(100%)"
1517
- }
1518
- },
1519
- // HALO
1520
- "halo-pulse": {
1521
- "0%": {
1522
- opacity: 0.3
1523
- },
1524
- "5%": {
1525
- opacity: 1
1526
- },
1527
- "100%": {
1528
- opacity: 0.3
1529
- }
1530
- },
1531
- // Progress
1532
- "progress-indeterminate": {
1533
- "0%": {
1534
- left: 0,
1535
- width: "0%"
1536
- },
1537
- "25%": {
1538
- left: "25%",
1539
- width: "50%"
1540
- },
1541
- "75%": {
1542
- left: "50%",
1543
- width: "100%"
1544
- },
1545
- "100%": {
1546
- left: "100%",
1547
- width: "0%"
1548
- }
1549
- },
1550
- // Border trail effect
1551
- "trail": {
1552
- to: {
1553
- "offset-distance": "100%"
1554
- }
1555
- },
1556
- "trail-offset": {
1557
- "0%": {
1558
- "offset-distance": "50%"
1559
- },
1560
- "100%": {
1561
- "offset-distance": "150%"
1562
- }
1563
- }
1564
- },
1565
- animation: {
1566
- // Fade
1567
- "fade-in": "fade-in 200ms ease-out",
1568
- "fade-out": "fade-out 400ms ease-out",
1569
- // Popper chrome
1570
- "slide-down-and-fade": "slide-down-and-fade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
1571
- "slide-left-and-fade": "slide-left-and-fade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
1572
- "slide-up-and-fade": "slide-up-and-fade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
1573
- "slide-right-and-fade": "slide-right-and-fade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
1574
- // Toast
1575
- "toast-hide": "toast-hide 100ms ease-in forwards",
1576
- "toast-slide-in-right": "toast-slide-in-right 150ms cubic-bezier(0.16, 1, 0.3, 1)",
1577
- "toast-slide-in-bottom": "toast-slide-in-bottom 150ms cubic-bezier(0.16, 1, 0.3, 1)",
1578
- "toast-swipe-out": "toast-swipe-out 100ms ease-out forwards",
1579
- // Accordion
1580
- "slide-down": "slide-down 300ms cubic-bezier(0.87, 0, 0.13, 1)",
1581
- "slide-up": "slide-up 300ms cubic-bezier(0.87, 0, 0.13, 1)",
1582
- // Border trail effect
1583
- "trail": "trail 6s linear infinite",
1584
- "trail-offset": "trail-offset 6s linear infinite",
1585
- // Progress effects
1586
- "spin": "spin 1.5s linear infinite",
1587
- "spin-slow": "spin 3s linear infinite",
1588
- "shimmer": "shimmer-loop 2s infinite",
1589
- "halo-pulse": "halo-pulse 2s ease-out infinite",
1590
- "progress-indeterminate": "progress-indeterminate 2s ease-out infinite",
1591
- "progress-linear": "progress-linear 2s ease-out infinite"
1592
- }
1593
- }, extendTokens, ...extensions),
1594
- ...overrideTokens,
1595
- colors: {
1596
- ...overrideTokens.colors,
1597
- inherit: "inherit",
1598
- current: "currentColor",
1599
- transparent: "transparent",
1600
- black: "black",
1601
- white: "white"
1602
- }
1603
- },
1604
- plugins: [
1605
- tailwindcssContainerQueries,
1606
- tailwindcssForms,
1607
- tailwindcssLogical,
1608
- tailwindcssRadix(),
1609
- // https://adoxography.github.io/tailwind-scrollbar/utilities
1610
- tailwindScrollbar({
1611
- nocompatible: true,
1612
- preferredStrategy: "pseudoelements"
1613
- })
1614
- ],
1615
- ...env === "development" && {
1616
- mode: "jit"
1617
- },
1618
- content,
1619
- future: {
1620
- hoverOnlyWhenSupported: true
1621
- }
1622
- });
1623
-
1624
- export {
1625
- tokenSet,
1626
- tailwindConfig
1627
- };
1628
- //# sourceMappingURL=chunk-6EGZAB2N.mjs.map