@dxos/ui-theme 0.8.4-main.ef1bc66f44 → 0.8.4-main.fcfe5033a5

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