@dxos/ui-theme 0.8.4-main.937b3ca → 0.8.4-main.9be5663bfe

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 (384) hide show
  1. package/dist/lib/browser/index.mjs +746 -2790
  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 +746 -2790
  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 +7 -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 +3 -0
  29. package/dist/types/src/fragments/text.d.ts.map +1 -0
  30. package/dist/types/src/index.d.ts +3 -10
  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/{styles → theme}/components/dialog.d.ts +2 -0
  43. package/dist/types/src/theme/components/dialog.d.ts.map +1 -0
  44. package/dist/types/src/theme/components/focus.d.ts +6 -0
  45. package/dist/types/src/theme/components/focus.d.ts.map +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 +4 -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 +25 -21
  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 +6 -6
  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/{styles → theme}/components/message.d.ts +1 -0
  60. package/dist/types/src/theme/components/message.d.ts.map +1 -0
  61. package/dist/types/src/{styles → theme}/components/popover.d.ts +1 -1
  62. package/dist/types/src/theme/components/popover.d.ts.map +1 -0
  63. package/dist/types/src/theme/components/scroll-area.d.ts +32 -0
  64. package/dist/types/src/theme/components/scroll-area.d.ts.map +1 -0
  65. package/dist/types/src/theme/components/select.d.ts.map +1 -0
  66. package/dist/types/src/theme/components/separator.d.ts.map +1 -0
  67. package/dist/types/src/theme/components/skeleton.d.ts +7 -0
  68. package/dist/types/src/theme/components/skeleton.d.ts.map +1 -0
  69. package/dist/types/src/theme/components/splitter.d.ts +4 -0
  70. package/dist/types/src/theme/components/splitter.d.ts.map +1 -0
  71. package/dist/types/src/{styles → theme}/components/status.d.ts +1 -1
  72. package/dist/types/src/theme/components/status.d.ts.map +1 -0
  73. package/dist/types/src/theme/components/tag.d.ts.map +1 -0
  74. package/dist/types/src/theme/components/toast.d.ts.map +1 -0
  75. package/dist/types/src/theme/components/toolbar.d.ts +11 -0
  76. package/dist/types/src/theme/components/toolbar.d.ts.map +1 -0
  77. package/dist/types/src/theme/components/tooltip.d.ts.map +1 -0
  78. package/dist/types/src/theme/components/treegrid.d.ts.map +1 -0
  79. package/dist/types/src/theme/index.d.ts +4 -0
  80. package/dist/types/src/theme/index.d.ts.map +1 -0
  81. package/dist/types/src/theme/primitives/column.d.ts +12 -0
  82. package/dist/types/src/theme/primitives/column.d.ts.map +1 -0
  83. package/dist/types/src/theme/primitives/index.d.ts +3 -0
  84. package/dist/types/src/theme/primitives/index.d.ts.map +1 -0
  85. package/dist/types/src/theme/primitives/panel.d.ts +13 -0
  86. package/dist/types/src/theme/primitives/panel.d.ts.map +1 -0
  87. package/dist/types/src/theme/theme.d.ts +5 -0
  88. package/dist/types/src/theme/theme.d.ts.map +1 -0
  89. package/dist/types/src/{styles/fragments → util}/elevation.d.ts +0 -6
  90. package/dist/types/src/util/elevation.d.ts.map +1 -0
  91. package/dist/types/src/util/hash-styles.d.ts +8 -5
  92. package/dist/types/src/util/hash-styles.d.ts.map +1 -1
  93. package/dist/types/src/util/index.d.ts +3 -0
  94. package/dist/types/src/util/index.d.ts.map +1 -1
  95. package/dist/types/src/util/mx.d.ts +36 -0
  96. package/dist/types/src/util/mx.d.ts.map +1 -1
  97. package/dist/types/src/util/size.d.ts +27 -0
  98. package/dist/types/src/util/size.d.ts.map +1 -0
  99. package/dist/types/src/util/valence.d.ts +4 -0
  100. package/dist/types/src/util/valence.d.ts.map +1 -0
  101. package/dist/types/tsconfig.tsbuildinfo +1 -1
  102. package/package.json +24 -27
  103. package/src/Theme.stories.tsx +224 -0
  104. package/src/css/base/base.css +43 -0
  105. package/src/{styles/layers → css/base}/typography.css +3 -5
  106. package/src/{styles/layers → css/components}/button.css +23 -14
  107. package/src/{styles/layers → css/components}/checkbox.css +12 -8
  108. package/src/{styles/layers → css/components}/dialog.css +16 -15
  109. package/src/{styles/layers/focus-ring.css → css/components/focus.css} +60 -41
  110. package/src/css/components/icon.css +9 -0
  111. package/src/css/components/link.css +9 -0
  112. package/src/css/components/panel.css +117 -0
  113. package/src/css/components/scrollbar.css +24 -0
  114. package/src/css/components/selected.css +30 -0
  115. package/src/css/components/surface.css +34 -0
  116. package/src/css/components/tag.css +130 -0
  117. package/src/css/components/text.css +124 -0
  118. package/src/css/integrations/codemirror.css +34 -0
  119. package/src/css/integrations/tldraw.css +14 -0
  120. package/src/css/layout/main.css +205 -0
  121. package/src/{styles/layers → css/layout}/native.css +6 -4
  122. package/src/css/layout/positioning.css +19 -0
  123. package/src/{styles/layers → css/layout}/size.css +117 -109
  124. package/src/css/theme/animation.css +229 -0
  125. package/src/css/theme/border.css +23 -0
  126. package/src/css/theme/palette.css +36 -0
  127. package/src/css/theme/semantic.css +116 -0
  128. package/src/css/theme/spacing.css +148 -0
  129. package/src/css/theme/styles.css +145 -0
  130. package/src/css/theme/text.css +37 -0
  131. package/src/css/utilities.css +76 -0
  132. package/src/defs.ts +48 -0
  133. package/src/fragments/AUDIT.md +58 -0
  134. package/src/fragments/density.ts +13 -0
  135. package/src/fragments/hover.ts +18 -0
  136. package/src/fragments/index.ts +10 -0
  137. package/src/fragments/text.ts +6 -0
  138. package/src/index.ts +3 -14
  139. package/src/main.css +87 -0
  140. package/src/plugins/ThemePlugin.ts +125 -0
  141. package/src/plugins/dark-mode.ts +22 -0
  142. package/src/plugins/main.css +45 -0
  143. package/src/{styles → theme}/components/avatar.ts +12 -13
  144. package/src/theme/components/button.ts +48 -0
  145. package/src/theme/components/card.ts +98 -0
  146. package/src/{styles → theme}/components/dialog.ts +17 -10
  147. package/src/theme/components/focus.ts +33 -0
  148. package/src/{styles → theme}/components/icon-button.ts +1 -3
  149. package/src/theme/components/icon.ts +28 -0
  150. package/src/{styles → theme}/components/index.ts +4 -1
  151. package/src/theme/components/input.ts +171 -0
  152. package/src/{styles → theme}/components/link.ts +3 -4
  153. package/src/{styles → theme}/components/list.ts +5 -5
  154. package/src/{styles → theme}/components/main.ts +9 -11
  155. package/src/{styles → theme}/components/menu.ts +11 -21
  156. package/src/{styles → theme}/components/message.ts +11 -7
  157. package/src/{styles → theme}/components/popover.ts +13 -12
  158. package/src/theme/components/scroll-area.ts +110 -0
  159. package/src/{styles → theme}/components/select.ts +8 -16
  160. package/src/{styles → theme}/components/separator.ts +3 -3
  161. package/src/theme/components/skeleton.ts +23 -0
  162. package/src/theme/components/splitter.ts +20 -0
  163. package/src/{styles → theme}/components/status.ts +7 -7
  164. package/src/{styles → theme}/components/tag.ts +1 -1
  165. package/src/{styles → theme}/components/toast.ts +6 -8
  166. package/src/theme/components/toolbar.ts +35 -0
  167. package/src/{styles → theme}/components/tooltip.ts +4 -6
  168. package/src/{styles → theme}/components/treegrid.ts +9 -9
  169. package/src/{styles → theme}/index.ts +2 -2
  170. package/src/theme/primitives/column.ts +47 -0
  171. package/src/theme/primitives/index.ts +6 -0
  172. package/src/theme/primitives/panel.ts +43 -0
  173. package/src/{styles → theme}/theme.ts +27 -9
  174. package/src/typings.d.ts +3 -1
  175. package/src/{styles/fragments → util}/elevation.ts +6 -8
  176. package/src/util/hash-styles.ts +118 -98
  177. package/src/util/index.ts +3 -0
  178. package/src/util/mx.ts +165 -43
  179. package/src/util/size.ts +103 -0
  180. package/src/util/valence.ts +33 -0
  181. package/dist/plugin/node-cjs/chunk-UUMDOU7E.cjs +0 -79
  182. package/dist/plugin/node-cjs/chunk-UUMDOU7E.cjs.map +0 -7
  183. package/dist/plugin/node-cjs/chunk-ZVALPM6U.cjs +0 -1619
  184. package/dist/plugin/node-cjs/chunk-ZVALPM6U.cjs.map +0 -7
  185. package/dist/plugin/node-cjs/config/tailwind.cjs +0 -29
  186. package/dist/plugin/node-cjs/config/tailwind.cjs.map +0 -7
  187. package/dist/plugin/node-cjs/plugins/esbuild-plugin.cjs +0 -90
  188. package/dist/plugin/node-cjs/plugins/esbuild-plugin.cjs.map +0 -7
  189. package/dist/plugin/node-cjs/plugins/plugin.cjs +0 -124
  190. package/dist/plugin/node-cjs/plugins/plugin.cjs.map +0 -7
  191. package/dist/plugin/node-cjs/theme.css +0 -1362
  192. package/dist/plugin/node-cjs/theme.css.map +0 -7
  193. package/dist/plugin/node-esm/chunk-AFRHJHP4.mjs +0 -49
  194. package/dist/plugin/node-esm/chunk-AFRHJHP4.mjs.map +0 -7
  195. package/dist/plugin/node-esm/chunk-HJE6EZWE.mjs +0 -1614
  196. package/dist/plugin/node-esm/chunk-HJE6EZWE.mjs.map +0 -7
  197. package/dist/plugin/node-esm/config/tailwind.mjs +0 -8
  198. package/dist/plugin/node-esm/config/tailwind.mjs.map +0 -7
  199. package/dist/plugin/node-esm/plugins/esbuild-plugin.mjs +0 -63
  200. package/dist/plugin/node-esm/plugins/esbuild-plugin.mjs.map +0 -7
  201. package/dist/plugin/node-esm/plugins/plugin.mjs +0 -98
  202. package/dist/plugin/node-esm/plugins/plugin.mjs.map +0 -7
  203. package/dist/plugin/node-esm/theme.css +0 -1362
  204. package/dist/plugin/node-esm/theme.css.map +0 -7
  205. package/dist/types/src/Tokens.stories.d.ts +0 -10
  206. package/dist/types/src/Tokens.stories.d.ts.map +0 -1
  207. package/dist/types/src/config/index.d.ts +0 -3
  208. package/dist/types/src/config/index.d.ts.map +0 -1
  209. package/dist/types/src/config/tailwind.d.ts +0 -9
  210. package/dist/types/src/config/tailwind.d.ts.map +0 -1
  211. package/dist/types/src/config/tokens/alias-colors.d.ts +0 -21
  212. package/dist/types/src/config/tokens/alias-colors.d.ts.map +0 -1
  213. package/dist/types/src/config/tokens/index.d.ts +0 -486
  214. package/dist/types/src/config/tokens/index.d.ts.map +0 -1
  215. package/dist/types/src/config/tokens/lengths.d.ts +0 -139
  216. package/dist/types/src/config/tokens/lengths.d.ts.map +0 -1
  217. package/dist/types/src/config/tokens/physical-colors.d.ts +0 -23
  218. package/dist/types/src/config/tokens/physical-colors.d.ts.map +0 -1
  219. package/dist/types/src/config/tokens/semantic-colors.d.ts +0 -187
  220. package/dist/types/src/config/tokens/semantic-colors.d.ts.map +0 -1
  221. package/dist/types/src/config/tokens/sememes-calls.d.ts +0 -3
  222. package/dist/types/src/config/tokens/sememes-calls.d.ts.map +0 -1
  223. package/dist/types/src/config/tokens/sememes-codemirror.d.ts +0 -43
  224. package/dist/types/src/config/tokens/sememes-codemirror.d.ts.map +0 -1
  225. package/dist/types/src/config/tokens/sememes-hue.d.ts +0 -4
  226. package/dist/types/src/config/tokens/sememes-hue.d.ts.map +0 -1
  227. package/dist/types/src/config/tokens/sememes-sheet.d.ts +0 -58
  228. package/dist/types/src/config/tokens/sememes-sheet.d.ts.map +0 -1
  229. package/dist/types/src/config/tokens/sememes-system.d.ts +0 -99
  230. package/dist/types/src/config/tokens/sememes-system.d.ts.map +0 -1
  231. package/dist/types/src/config/tokens/sizes.d.ts +0 -7
  232. package/dist/types/src/config/tokens/sizes.d.ts.map +0 -1
  233. package/dist/types/src/config/tokens/types.d.ts +0 -5
  234. package/dist/types/src/config/tokens/types.d.ts.map +0 -1
  235. package/dist/types/src/plugins/esbuild-plugin.d.ts +0 -9
  236. package/dist/types/src/plugins/esbuild-plugin.d.ts.map +0 -1
  237. package/dist/types/src/plugins/plugin.d.ts +0 -20
  238. package/dist/types/src/plugins/plugin.d.ts.map +0 -1
  239. package/dist/types/src/plugins/resolveContent.d.ts +0 -2
  240. package/dist/types/src/plugins/resolveContent.d.ts.map +0 -1
  241. package/dist/types/src/styles/components/anchored-overflow.d.ts +0 -6
  242. package/dist/types/src/styles/components/anchored-overflow.d.ts.map +0 -1
  243. package/dist/types/src/styles/components/avatar.d.ts.map +0 -1
  244. package/dist/types/src/styles/components/breadcrumb.d.ts.map +0 -1
  245. package/dist/types/src/styles/components/button.d.ts +0 -19
  246. package/dist/types/src/styles/components/button.d.ts.map +0 -1
  247. package/dist/types/src/styles/components/dialog.d.ts.map +0 -1
  248. package/dist/types/src/styles/components/icon-button.d.ts.map +0 -1
  249. package/dist/types/src/styles/components/icon.d.ts.map +0 -1
  250. package/dist/types/src/styles/components/index.d.ts.map +0 -1
  251. package/dist/types/src/styles/components/input.d.ts.map +0 -1
  252. package/dist/types/src/styles/components/link.d.ts.map +0 -1
  253. package/dist/types/src/styles/components/list.d.ts.map +0 -1
  254. package/dist/types/src/styles/components/main.d.ts.map +0 -1
  255. package/dist/types/src/styles/components/menu.d.ts.map +0 -1
  256. package/dist/types/src/styles/components/message.d.ts.map +0 -1
  257. package/dist/types/src/styles/components/popover.d.ts.map +0 -1
  258. package/dist/types/src/styles/components/scroll-area.d.ts +0 -9
  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/status.d.ts.map +0 -1
  263. package/dist/types/src/styles/components/tag.d.ts.map +0 -1
  264. package/dist/types/src/styles/components/toast.d.ts.map +0 -1
  265. package/dist/types/src/styles/components/toolbar.d.ts +0 -11
  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 +0 -4
  302. package/dist/types/src/styles/index.d.ts.map +0 -1
  303. package/dist/types/src/styles/theme.d.ts +0 -5
  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 -264
  314. package/src/config/tokens/alias-colors.ts +0 -39
  315. package/src/config/tokens/index.ts +0 -92
  316. package/src/config/tokens/lengths.ts +0 -97
  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 -302
  324. package/src/config/tokens/sizes.ts +0 -10
  325. package/src/config/tokens/types.ts +0 -9
  326. package/src/docs/theme.drawio.svg +0 -635
  327. package/src/plugins/esbuild-plugin.ts +0 -65
  328. package/src/plugins/plugin.ts +0 -130
  329. package/src/plugins/resolveContent.ts +0 -51
  330. package/src/styles/components/README.md +0 -6
  331. package/src/styles/components/anchored-overflow.ts +0 -20
  332. package/src/styles/components/button.ts +0 -48
  333. package/src/styles/components/icon.ts +0 -19
  334. package/src/styles/components/input.ts +0 -177
  335. package/src/styles/components/scroll-area.ts +0 -43
  336. package/src/styles/components/toolbar.ts +0 -29
  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 -26
  361. package/src/styles/layers/main.css +0 -160
  362. package/src/styles/layers/positioning.css +0 -23
  363. package/src/styles/layers/surfaces.css +0 -31
  364. package/src/styles/layers/tag.css +0 -132
  365. package/src/styles/layers/tldraw.css +0 -91
  366. package/src/styles/layers/tokens.css +0 -45
  367. package/src/tailwind.ts +0 -7
  368. package/src/theme.css +0 -9
  369. package/src/types.ts +0 -7
  370. package/src/util/withLogical.ts +0 -114
  371. /package/dist/types/src/{styles/fragments → fragments}/disabled.d.ts +0 -0
  372. /package/dist/types/src/{styles → theme}/components/avatar.d.ts +0 -0
  373. /package/dist/types/src/{styles → theme}/components/breadcrumb.d.ts +0 -0
  374. /package/dist/types/src/{styles → theme}/components/icon-button.d.ts +0 -0
  375. /package/dist/types/src/{styles → theme}/components/link.d.ts +0 -0
  376. /package/dist/types/src/{styles → theme}/components/list.d.ts +0 -0
  377. /package/dist/types/src/{styles → theme}/components/select.d.ts +0 -0
  378. /package/dist/types/src/{styles → theme}/components/separator.d.ts +0 -0
  379. /package/dist/types/src/{styles → theme}/components/tag.d.ts +0 -0
  380. /package/dist/types/src/{styles → theme}/components/toast.d.ts +0 -0
  381. /package/dist/types/src/{styles → theme}/components/tooltip.d.ts +0 -0
  382. /package/dist/types/src/{styles → theme}/components/treegrid.d.ts +0 -0
  383. /package/src/{styles/fragments → fragments}/disabled.ts +0 -0
  384. /package/src/{styles → theme}/components/breadcrumb.ts +0 -0
@@ -1,1362 +0,0 @@
1
- @import "tailwindcss/base" layer(tw-base);
2
- @import "tailwindcss/utilities";
3
- @import "tailwindcss/components" layer(tw-components);
4
- @import "@fontsource-variable/jetbrains-mono/wght-italic.css";
5
- @import "@fontsource-variable/jetbrains-mono/wght.css";
6
- @import "@fontsource/poiret-one";
7
-
8
- /* src/styles/layers/anchored-overflow.css */
9
- @layer utilities {
10
- .overflow-anchored * {
11
- overflow-anchor: none;
12
- }
13
- .overflow-anchor {
14
- overflow-anchor: auto;
15
- }
16
- }
17
-
18
- /* src/styles/layers/animation.css */
19
- @layer utilities {
20
- @keyframes blink {
21
- 0%, 50%, 100% {
22
- opacity: 1;
23
- }
24
- 25%, 75% {
25
- opacity: 0;
26
- }
27
- }
28
- .animate-blink {
29
- animation: blink 1s step-start infinite;
30
- }
31
- }
32
-
33
- /* src/styles/layers/attention.css */
34
- @layer utilities {
35
- .attention-surface {
36
- --surface-separator: transparent;
37
- background-color: var(--dx-baseSurface);
38
- border-color: var(--dx-separator);
39
- }
40
- }
41
-
42
- /* src/styles/layers/base.css */
43
- @layer dx-base {
44
- :root {
45
- touch-action: pan-x pan-y;
46
- font-synthesis: none;
47
- font-variation-settings: "wght" 400, "slnt" 0;
48
- scroll-padding-block-start: theme(spacing.14);
49
- scroll-padding-block-end: theme(spacing.2);
50
- @apply font-body;
51
- }
52
- button {
53
- -webkit-tap-highlight-color: transparent;
54
- }
55
- }
56
- @layer dx-tokens {
57
- html,
58
- html.dark,
59
- html .dark {
60
- background-color: var(--dx-baseSurface);
61
- --surface-bg: var(--dx-baseSurface);
62
- color: var(--dx-baseText);
63
- --surface-text: var(--dx-baseText);
64
- --description-text: var(--dx-description);
65
- }
66
- }
67
-
68
- /* src/styles/layers/button.css */
69
- @layer dx-components {
70
- .dx-button {
71
- @apply font-medium shrink-0 inline-flex select-none items-center justify-center overflow-hidden transition-colors duration-100 ease-linear bg-inputSurface min-bs-[2.5rem] pli-3;
72
- &[aria-pressed=true],
73
- &[aria-checked=true] {
74
- @apply text-accentText bg-attention;
75
- }
76
- &[disabled]:not([disabled=false]) {
77
- @apply opacity-40 cursor-not-allowed shadow-none;
78
- }
79
- &[data-variant=ghost] {
80
- @apply bg-transparent;
81
- &:hover {
82
- @apply bg-hoverSurface text-inherit;
83
- }
84
- &[data-state=open] {
85
- @apply bg-inputSurface;
86
- }
87
- &[aria-pressed=true],
88
- &[aria-checked=true] {
89
- @apply bg-baseSurface text-accentText;
90
- }
91
- }
92
- &[data-variant=outline] {
93
- @apply border border-baseSurface bg-transparent;
94
- &:hover {
95
- @apply bg-hoverSurface;
96
- }
97
- }
98
- &:not([disabled]),
99
- &[disabled=false] {
100
- &:hover {
101
- @apply bg-hoverSurface;
102
- }
103
- &[data-variant=primary] {
104
- @apply text-accentSurfaceText bg-accentSurface;
105
- &:hover,
106
- &[aria-pressed=true],
107
- &[aria-checked=true] &[data-state=open] {
108
- @apply bg-accentSurfaceHover;
109
- }
110
- }
111
- &[data-variant=destructive] {
112
- @apply text-accentSurfaceText bg-roseFill;
113
- &:hover,
114
- &[aria-pressed=true],
115
- &[aria-checked=true] &[data-state=open] {
116
- @apply bg-roseFill;
117
- }
118
- }
119
- }
120
- }
121
- .dx-button:not([data-props~=grouped]) {
122
- @apply rounded-sm;
123
- }
124
- .dx-button:not([data-props~=wrap]) {
125
- @apply truncate;
126
- }
127
- @media (pointer: fine) {
128
- .dx-button[data-density=fine] {
129
- @apply min-bs-[2rem] pli-2.5;
130
- }
131
- }
132
- }
133
-
134
- /* src/styles/layers/can-scroll.css */
135
- @layer dx-components {
136
- :root {
137
- --can-scroll-inline: initial;
138
- }
139
- @keyframes detect-scroll-inline {
140
- from, to {
141
- --can-scroll-inline: ;
142
- }
143
- }
144
- .justify-center-if-no-scroll {
145
- justify-content: start;
146
- }
147
- @supports (animation-timeline: scroll(inline self)) {
148
- .justify-center-if-no-scroll {
149
- animation: detect-scroll-inline linear;
150
- animation-timeline: scroll(inline self);
151
- --justify-if-no-scroll: center;
152
- --justify-if-can-scroll: var(--can-scroll-inline) start;
153
- justify-content: var(--justify-if-can-scroll, var(--justify-if-no-scroll));
154
- }
155
- }
156
- }
157
-
158
- /* src/styles/layers/checkbox.css */
159
- @layer dx-components {
160
- .dx-checkbox--switch,
161
- .dx-checkbox {
162
- @apply border border-unAccent;
163
- &[aria-checked=true],
164
- &[aria-checked=mixed],
165
- &:checked {
166
- @apply bg-accentSurface accent-accentSurface border-accentSurface;
167
- }
168
- &:not([disabled]),
169
- &[disabled=false] {
170
- &:hover {
171
- @apply bg-unAccentHover accent-unAccentHover;
172
- &[aria-checked=true],
173
- &[aria-checked=mixed],
174
- &:checked {
175
- @apply bg-accentSurfaceHover accent-accentSurfaceHover border-accentSurfaceHover;
176
- }
177
- }
178
- }
179
- }
180
- .dx-checkbox {
181
- @apply is-4 bs-4 overflow-hidden shadow-inner transition-colors bg-unAccent accent-unAccent text-accentSurfaceText shrink-0 inline-grid place-items-center rounded-sm;
182
- }
183
- .dx-checkbox--switch {
184
- @apply inline-block appearance-none relative shrink-0 bs-5 is-8;
185
- @apply shadow-inner transition-colors bg-unAccent;
186
- @apply cursor-pointer rounded-full;
187
- &::before {
188
- @apply is-3 bs-3 mli-[0.1875rem] mlb-[0.1875rem] absolute block bg-white rounded-full border-separator transition-transform duration-100 will-change-transform;
189
- content: "";
190
- }
191
- &[aria-checked=true],
192
- &[aria-checked=mixed],
193
- &:checked {
194
- background-image: none;
195
- &::before {
196
- @apply translate-x-[100%];
197
- }
198
- }
199
- }
200
- }
201
-
202
- /* src/styles/layers/dialog.css */
203
- @layer dx-components {
204
- .dx-dialog__overlay {
205
- @apply z-50 fixed grid inset-inline-0 block-start-0 bs-dvh pbs-[env(safe-area-inset-top)] place-items-center overflow-auto bg-scrimSurface;
206
- &[data-state=open] {
207
- @apply animate-fade-in;
208
- }
209
- &[data-state=closed] {
210
- @apply animate-fade-out;
211
- }
212
- &[data-block-align=start] {
213
- align-items: start;
214
- justify-items: center;
215
- }
216
- &[data-block-align=center] {
217
- place-items: center;
218
- }
219
- &[data-block-align=end] {
220
- align-items: end;
221
- justify-items: center;
222
- }
223
- }
224
- @media (min-width: theme("screens.sm")) {
225
- .dx-dialog__overlay {
226
- @apply p-[calc(env(safe-area-inset-top)+.6rem)];
227
- }
228
- }
229
- @media (min-width: theme("screens.md")) {
230
- .dx-dialog__overlay {
231
- @apply p-[calc(env(safe-area-inset-top)+1.2rem)];
232
- }
233
- }
234
- @media (min-width: theme("screens.lg")) {
235
- .dx-dialog__overlay {
236
- @apply p-[calc(env(safe-area-inset-top)+2.4rem)];
237
- }
238
- }
239
- .dx-dialog__content {
240
- @apply flex flex-col is-dvw max-is-full p-4 shadow-md backdrop-blur;
241
- &[data-state=open] {
242
- @apply animate-slide-up-and-fade;
243
- }
244
- &[data-state=closed] {
245
- @apply animate-slide-down-and-fade;
246
- }
247
- }
248
- @media (min-width: theme("screens.sm")) {
249
- .dx-dialog__content {
250
- @apply is-[95vw] border rounded-md border-separator;
251
- }
252
- }
253
- @media (min-width: theme("screens.md")) {
254
- .dx-dialog__content {
255
- @apply max-is-[24rem];
256
- }
257
- }
258
- .dx-dialog__title {
259
- @apply shrink-0 text-xl font-medium;
260
- }
261
- .dx-dialog__description {
262
- @apply mlb-2;
263
- }
264
- }
265
-
266
- /* src/styles/layers/drag-preview.css */
267
- @layer dx-base {
268
- body[data-drag-preview] {
269
- i[data-tabster-dummy] {
270
- display: none;
271
- }
272
- }
273
- }
274
- @layer utilities {
275
- body[data-drag-preview] {
276
- .drag-preview-p-0 {
277
- padding-inline-start: 0;
278
- padding-inline-end: 0;
279
- padding-block-start: 0;
280
- padding-block-end: 0;
281
- }
282
- }
283
- }
284
-
285
- /* src/styles/layers/focus-ring.css */
286
- @layer utilities {
287
- .dx-focus-ring,
288
- .dx-focus-ring-inset {
289
- &:not([disabled]),
290
- &[disabled=false] {
291
- &:focus {
292
- @apply outline-none;
293
- }
294
- &:focus-visible {
295
- @apply ring-focusLine ring-offset-focusOffset z-[1] ring-neutralFocusIndicator;
296
- &[data-variant=primary] {
297
- @apply ring-accentFocusIndicator;
298
- }
299
- &:hover {
300
- @apply outline-none;
301
- .dark & {
302
- @apply outline-none;
303
- }
304
- }
305
- }
306
- }
307
- }
308
- .dx-focus-ring-always,
309
- .dx-focus-ring-inset-always {
310
- &:not([disabled]),
311
- &[disabled=false] {
312
- &:focus {
313
- @apply outline-none;
314
- }
315
- &:focus {
316
- @apply ring-focusLine ring-offset-focusOffset z-[1] ring-neutralFocusIndicator;
317
- &[data-variant=primary] {
318
- @apply ring-accentFocusIndicator;
319
- }
320
- &:hover {
321
- @apply outline-none;
322
- .dark & {
323
- @apply outline-none;
324
- }
325
- }
326
- }
327
- }
328
- }
329
- .dx-focus-ring-group,
330
- .dx-focus-ring-group-x,
331
- .dx-focus-ring-group-y,
332
- .dx-focus-ring-group-always,
333
- .dx-focus-ring-group-x-always,
334
- .dx-focus-ring-group-y-always {
335
- &:not([disabled]),
336
- &[disabled=false] {
337
- &:focus {
338
- @apply outline-none;
339
- }
340
- }
341
- }
342
- .dx-focus-ring-group:focus-visible .dx-focus-ring-group-indicator,
343
- .dx-focus-ring-group-x:focus-visible .dx-focus-ring-group-x-indicator,
344
- .dx-focus-ring-group-y:focus-visible .dx-focus-ring-group-y-indicator {
345
- @apply ring-focusLine ring-offset-focusOffset ring-neutralFocusIndicator;
346
- &[data-variant=primary] {
347
- @apply ring-accentFocusIndicator;
348
- }
349
- &:hover {
350
- @apply outline-none;
351
- .dark & {
352
- @apply outline-none;
353
- }
354
- }
355
- }
356
- .dx-focus-ring-group-always:focus .dx-focus-ring-group-indicator,
357
- .dx-focus-ring-group-x-always:focus .dx-focus-ring-group-x-indicator,
358
- .dx-focus-ring-group-y-always:focus .dx-focus-ring-group-y-indicator {
359
- @apply ring-focusLine ring-offset-focusOffset ring-neutralFocusIndicator;
360
- &[data-variant=primary] {
361
- @apply ring-accentFocusIndicator;
362
- }
363
- &:hover {
364
- @apply outline-none;
365
- .dark & {
366
- @apply outline-none;
367
- }
368
- }
369
- }
370
- .dx-focus-ring-inset {
371
- &:not([disabled]),
372
- &[disabled=false] {
373
- &:focus-visible {
374
- @apply ring-inset;
375
- }
376
- }
377
- }
378
- .dx-focus-ring-inset-always {
379
- &:not([disabled]),
380
- &[disabled=false] {
381
- &:focus {
382
- @apply ring-inset;
383
- }
384
- }
385
- }
386
- .dx-focus-ring-inset-over-all,
387
- .dx-focus-ring-main[data-handles-focus=true] {
388
- &:not([disabled]),
389
- &[disabled=false] {
390
- &::after {
391
- content: "";
392
- @apply z-20 pointer-events-none;
393
- }
394
- &:focus {
395
- @apply outline-none;
396
- }
397
- &:focus-visible {
398
- &::after {
399
- @apply ring-focusLine ring-offset-focusOffset ring-inset z-[1] ring-neutralFocusIndicator;
400
- }
401
- &[data-variant=primary]::after {
402
- @apply ring-accentFocusIndicator;
403
- }
404
- &:hover {
405
- @apply outline-none;
406
- .dark & {
407
- @apply outline-none;
408
- }
409
- }
410
- }
411
- }
412
- }
413
- .dx-focus-ring-inset-over-all-always,
414
- .dx-focus-ring-main-always[data-handles-focus=true] {
415
- &:not([disabled]),
416
- &[disabled=false] {
417
- &::after {
418
- content: "";
419
- @apply z-20 pointer-events-none;
420
- }
421
- &:focus {
422
- @apply outline-none;
423
- }
424
- &:focus {
425
- &::after {
426
- @apply ring-focusLine ring-offset-focusOffset ring-inset z-[1] ring-neutralFocusIndicator;
427
- }
428
- &[data-variant=primary]::after {
429
- @apply ring-accentFocusIndicator;
430
- }
431
- &:hover {
432
- @apply outline-none;
433
- .dark & {
434
- @apply outline-none;
435
- }
436
- }
437
- }
438
- }
439
- }
440
- .dx-focus-ring-inset-over-all,
441
- .dx-focus-ring-inset-over-all-always {
442
- &:not([disabled]),
443
- &[disabled=false] {
444
- &::after {
445
- @apply inset-0 absolute;
446
- }
447
- }
448
- }
449
- .dx-focus-ring-main[data-handles-focus=true] {
450
- &:not([disabled]),
451
- &[disabled=false] {
452
- &::after {
453
- position: fixed;
454
- inset: 0;
455
- }
456
- @media screen(lg) {
457
- &[data-sidebar-inline-start-state=expanded]::after {
458
- inset-inline-start: var(--nav-sidebar-size);
459
- }
460
- &[data-sidebar-inline-start-state=collapsed]::after {
461
- inset-inline-start: var(--l0-size);
462
- }
463
- &[data-sidebar-inline-end-state=expanded]::after {
464
- inset-inline-end: var(--complementary-sidebar-size);
465
- }
466
- &[data-sidebar-inline-end-state=collapsed]::after {
467
- inset-inline-end: var(--r0-size);
468
- }
469
- }
470
- }
471
- }
472
- }
473
-
474
- /* src/styles/layers/hues.css */
475
- @layer dx-components {
476
- .dx-text-hue[data-hue=red],
477
- .dx-text-hue--red {
478
- @apply text-redText;
479
- }
480
- .dx-text-hue[data-hue=orange],
481
- .dx-text-hue--orange {
482
- @apply text-orangeText;
483
- }
484
- .dx-text-hue[data-hue=amber],
485
- .dx-text-hue--amber {
486
- @apply text-amberText;
487
- }
488
- .dx-text-hue[data-hue=yellow],
489
- .dx-text-hue--yellow {
490
- @apply text-yellowText;
491
- }
492
- .dx-text-hue[data-hue=lime],
493
- .dx-text-hue--lime {
494
- @apply text-limeText;
495
- }
496
- .dx-text-hue[data-hue=green],
497
- .dx-text-hue--green {
498
- @apply text-greenText;
499
- }
500
- .dx-text-hue[data-hue=emerald],
501
- .dx-text-hue--emerald {
502
- @apply text-emeraldText;
503
- }
504
- .dx-text-hue[data-hue=teal],
505
- .dx-text-hue--teal {
506
- @apply text-tealText;
507
- }
508
- .dx-text-hue[data-hue=cyan],
509
- .dx-text-hue--cyan {
510
- @apply text-cyanText;
511
- }
512
- .dx-text-hue[data-hue=sky],
513
- .dx-text-hue--sky {
514
- @apply text-skyText;
515
- }
516
- .dx-text-hue[data-hue=blue],
517
- .dx-text-hue--blue {
518
- @apply text-blueText;
519
- }
520
- .dx-text-hue[data-hue=indigo],
521
- .dx-text-hue--indigo {
522
- @apply text-indigoText;
523
- }
524
- .dx-text-hue[data-hue=violet],
525
- .dx-text-hue--violet {
526
- @apply text-violetText;
527
- }
528
- .dx-text-hue[data-hue=purple],
529
- .dx-text-hue--purple {
530
- @apply text-purpleText;
531
- }
532
- .dx-text-hue[data-hue=fuchsia],
533
- .dx-text-hue--fuchsia {
534
- @apply text-fuchsiaText;
535
- }
536
- .dx-text-hue[data-hue=pink],
537
- .dx-text-hue--pink {
538
- @apply text-pinkText;
539
- }
540
- .dx-text-hue[data-hue=rose],
541
- .dx-text-hue--rose {
542
- @apply text-roseText;
543
- }
544
- .dx-text-hue[data-hue=info],
545
- .dx-text-hue--info {
546
- @apply text-cyanText;
547
- }
548
- .dx-text-hue[data-hue=success],
549
- .dx-text-hue--success {
550
- @apply text-emeraldText;
551
- }
552
- .dx-text-hue[data-hue=warning],
553
- .dx-text-hue--warning {
554
- @apply text-amberText;
555
- }
556
- .dx-text-hue[data-hue=error],
557
- .dx-text-hue--error {
558
- @apply text-roseText;
559
- }
560
- }
561
-
562
- /* src/styles/layers/positioning.css */
563
- @layer utilities {
564
- .snap-inline {
565
- scroll-snap-type: inline var(--tw-scroll-snap-strictness);
566
- }
567
- .snap-block {
568
- scroll-snap-type: block var(--tw-scroll-snap-strictness);
569
- }
570
- .sticky-top-0 {
571
- --sticky-top: 0;
572
- }
573
- .contain-layout {
574
- contain: layout;
575
- }
576
- }
577
- @layer dx-components {
578
- .sticky-top-from-topbar-bottom {
579
- --sticky-top: var(--topbar-size);
580
- }
581
- .sticky-bottom-from-statusbar-bottom {
582
- --sticky-bottom: var(--statusbar-size);
583
- }
584
- }
585
-
586
- /* src/styles/layers/main.css */
587
- @layer utilities {
588
- .dx-main-content-padding {
589
- @apply pis-0 scroll-ps-0 pie-0 scroll-pe-0;
590
- @media (min-width: theme("screens.lg")) {
591
- &[data-sidebar-inline-start-state=collapsed] {
592
- @apply pis-[--l0-size] scroll-ps-[--l0-size];
593
- }
594
- &[data-sidebar-inline-start-state=expanded] {
595
- @apply pis-[--nav-sidebar-size] scroll-ps-[--nav-sidebar-size];
596
- }
597
- &[data-sidebar-inline-end-state=collapsed] {
598
- @apply pie-[--r0-size] scroll-pe-[--r0-size];
599
- }
600
- &[data-sidebar-inline-end-state=expanded] {
601
- @apply pie-[--complementary-sidebar-size] scroll-pe-[--complementary-sidebar-size];
602
- }
603
- }
604
- }
605
- .dx-main-content-padding-transitions {
606
- transition-property:
607
- padding-inline-start,
608
- padding-inline-end,
609
- scroll-padding-start,
610
- scroll-padding-end;
611
- @apply duration-200 ease-in-out-symmetric;
612
- }
613
- .dx-main-intrinsic-size {
614
- @apply is-[calc(100dvw)-2*var(--main-spacing)] transition-[inline-size] ease-in-out-symmetric duration-200;
615
- @media (min-width: theme("screens.lg")) {
616
- &[data-sidebar-inline-start-state=closed][data-sidebar-inline-end-state=closed] {
617
- inline-size: calc(100dvw - 2 * var(--main-spacing));
618
- }
619
- &[data-sidebar-inline-start-state=collapsed][data-sidebar-inline-end-state=closed] {
620
- inline-size: calc(100dvw - var(--l0-size) - 2 * var(--main-spacing));
621
- }
622
- &[data-sidebar-inline-start-state=expanded][data-sidebar-inline-end-state=closed] {
623
- inline-size: calc(100dvw - var(--nav-sidebar-size) - 2 * var(--main-spacing));
624
- }
625
- &[data-sidebar-inline-start-state=closed][data-sidebar-inline-end-state=collapsed] {
626
- inline-size: calc(100dvw - var(--r0-size) - 2 * var(--main-spacing));
627
- }
628
- &[data-sidebar-inline-start-state=collapsed][data-sidebar-inline-end-state=collapsed] {
629
- inline-size: calc(100dvw - var(--l0-size) - var(--r0-size) - 2 * var(--main-spacing));
630
- }
631
- &[data-sidebar-inline-start-state=expanded][data-sidebar-inline-end-state=collapsed] {
632
- inline-size: calc(100dvw - var(--nav-sidebar-size) - var(--r0-size) - 2 * var(--main-spacing));
633
- }
634
- &[data-sidebar-inline-start-state=closed][data-sidebar-inline-end-state=expanded] {
635
- inline-size: calc(100dvw - var(--complementary-sidebar-size) - 2 * var(--main-spacing));
636
- }
637
- &[data-sidebar-inline-start-state=collapsed][data-sidebar-inline-end-state=expanded] {
638
- inline-size: calc(100dvw - var(--l0-size) - var(--complementary-sidebar-size) - 2 * var(--main-spacing));
639
- }
640
- &[data-sidebar-inline-start-state=expanded][data-sidebar-inline-end-state=expanded] {
641
- inline-size: calc(100dvw - var(--nav-sidebar-size) - var(--complementary-sidebar-size) - 2 * var(--main-spacing));
642
- }
643
- }
644
- }
645
- .dx-main-bounce-layout {
646
- @apply fixed inset-0 z-0 overflow-auto overscroll-auto;
647
- }
648
- }
649
- @layer dx-components {
650
- .dx-main-sidebar {
651
- @apply fixed overscroll-contain overflow-x-hidden overflow-y-auto;
652
- @apply duration-200 ease-in-out-symmetric;
653
- @apply border-landmarkLine border-subduedSeparator rounded-md;
654
- @apply sidebar-surface backdrop-blur-md dark:backdrop-blur-lg;
655
- transition-property:
656
- inset-inline-start,
657
- inset-inline-end,
658
- inline-size;
659
- inset-block-start: max(0.5rem, env(safe-area-inset-top));
660
- inset-block-end: max(0.5rem, env(safe-area-inset-bottom));
661
- inline-size: calc(100dvw - 3rem);
662
- z-index: 7;
663
- @media (min-width: theme("screens.lg")) {
664
- @apply block-start-0 block-end-0 rounded-none border-lb-0;
665
- }
666
- &[data-resizing=false] {
667
- @apply duration-200;
668
- }
669
- &[data-side=is] {
670
- @apply -inline-start-[100vw] border-ie-landmarkLine border-subduedSeparator;
671
- z-index: 8;
672
- &[data-state=expanded] {
673
- inset-inline-start: max(0.5rem, env(safe-area-inset-left));
674
- @media (min-width: theme("screens.lg")) {
675
- @apply inline-start-0;
676
- }
677
- }
678
- @media (min-width: theme("screens.sm")) {
679
- @apply is-[--nav-sidebar-size];
680
- }
681
- @media (min-width: theme("screens.lg")) {
682
- @apply border-is-0;
683
- &[data-state=collapsed] {
684
- @apply is-[--l0-size] inline-start-0;
685
- }
686
- &[data-state=expanded] {
687
- @apply is-[--nav-sidebar-size];
688
- }
689
- }
690
- }
691
- &[data-side=ie] {
692
- @apply -inline-end-[100vw] border-is-landmarkLine border-separator;
693
- &[data-state=expanded] {
694
- inset-inline-end: max(0.5rem, env(safe-area-inset-right));
695
- @media (min-width: theme("screens.lg")) {
696
- @apply inline-end-0;
697
- }
698
- }
699
- @media (min-width: theme("screens.sm")) {
700
- @apply is-[--complementary-sidebar-size];
701
- }
702
- @media (min-width: theme("screens.lg")) {
703
- @apply border-ie-0;
704
- &[data-state=collapsed] {
705
- @apply is-[--r0-size] inline-end-0;
706
- }
707
- &[data-state=expanded] {
708
- @apply is-[--complementary-sidebar-size];
709
- }
710
- }
711
- }
712
- }
713
- .dx-main-overlay {
714
- @apply fixed inset-0 bg-scrimSurface;
715
- @apply transition-opacity duration-200 ease-in-out-symmetric;
716
- @apply opacity-0 hidden;
717
- z-index: 6;
718
- &[data-state=open] {
719
- @apply opacity-100 block;
720
- @media (min-width: theme("screens.lg")) {
721
- @apply opacity-100 hidden;
722
- }
723
- }
724
- }
725
- }
726
-
727
- /* src/styles/layers/native.css */
728
- @layer utilities {
729
- .app-drag {
730
- -webkit-user-select: none;
731
- -webkit-app-region: drag;
732
- --app-region: drag;
733
- }
734
- .app-no-drag {
735
- -webkit-app-region: no-drag;
736
- --app-region: no-drag;
737
- }
738
- }
739
-
740
- /* src/styles/layers/size.css */
741
- .size-container {
742
- container-type: size;
743
- }
744
- .container-max-width {
745
- @apply is-full max-is-container-max-width mli-auto;
746
- }
747
- .card-default-width {
748
- @apply is-card-default-width;
749
- }
750
- .card-min-width {
751
- @apply min-is-card-min-width;
752
- }
753
- .card-max-width {
754
- @apply is-full max-is-card-max-width;
755
- }
756
- .popover-max-width {
757
- @apply is-max max-is-popover-max-width;
758
- }
759
- .popover-card-width {
760
- inline-size: min(var(--radix-popper-available-width), calc(var(--dx-popover-max-width) - 2 * var(--dx-hairLine)));
761
- }
762
- .popover-card-height {
763
- block-size: min(var(--radix-popper-available-height), 100dvh);
764
- }
765
- .popover-square {
766
- inline-size: min(min(var(--radix-popper-available-width), var(--dx-popover-max-width)), min(var(--radix-popper-available-height), 100dvh));
767
- block-size: min(min(var(--radix-popper-available-width), var(--dx-popover-max-width)), min(var(--radix-popper-available-height), 100dvh));
768
- }
769
- .popover-card-max-width {
770
- max-inline-size: min(var(--radix-popper-available-width), var(--dx-popover-max-width));
771
- }
772
- @layer dx-components {
773
- [data-size="0"],
774
- [data-block-size="0"] {
775
- @apply bs-0;
776
- }
777
- [data-size=px],
778
- [data-block-size=px] {
779
- @apply bs-px;
780
- }
781
- [data-size="0.5"],
782
- [data-block-size="0.5"] {
783
- @apply bs-0.5;
784
- }
785
- [data-size="1"],
786
- [data-block-size="1"] {
787
- @apply bs-1;
788
- }
789
- [data-size="1.5"],
790
- [data-block-size="1.5"] {
791
- @apply bs-1.5;
792
- }
793
- [data-size="2"],
794
- [data-block-size="2"] {
795
- @apply bs-2;
796
- }
797
- [data-size="2.5"],
798
- [data-block-size="2.5"] {
799
- @apply bs-2.5;
800
- }
801
- [data-size="3"],
802
- [data-block-size="3"] {
803
- @apply bs-3;
804
- }
805
- [data-size="3.5"],
806
- [data-block-size="3.5"] {
807
- @apply bs-3.5;
808
- }
809
- [data-size="4"],
810
- [data-block-size="4"] {
811
- @apply bs-4;
812
- }
813
- [data-size="5"],
814
- [data-block-size="5"] {
815
- @apply bs-5;
816
- }
817
- [data-size="6"],
818
- [data-block-size="6"] {
819
- @apply bs-6;
820
- }
821
- [data-size="7"],
822
- [data-block-size="7"] {
823
- @apply bs-7;
824
- }
825
- [data-size="8"],
826
- [data-block-size="8"] {
827
- @apply bs-8;
828
- }
829
- [data-size="9"],
830
- [data-block-size="9"] {
831
- @apply bs-9;
832
- }
833
- [data-size="10"],
834
- [data-block-size="10"] {
835
- @apply bs-10;
836
- }
837
- [data-size="11"],
838
- [data-block-size="11"] {
839
- @apply bs-11;
840
- }
841
- [data-size="12"],
842
- [data-block-size="12"] {
843
- @apply bs-12;
844
- }
845
- [data-size="14"],
846
- [data-block-size="14"] {
847
- @apply bs-14;
848
- }
849
- [data-size="16"],
850
- [data-block-size="16"] {
851
- @apply bs-16;
852
- }
853
- [data-size="20"],
854
- [data-block-size="20"] {
855
- @apply bs-20;
856
- }
857
- [data-size="24"],
858
- [data-block-size="24"] {
859
- @apply bs-24;
860
- }
861
- [data-size="28"],
862
- [data-block-size="28"] {
863
- @apply bs-28;
864
- }
865
- [data-size="32"],
866
- [data-block-size="32"] {
867
- @apply bs-32;
868
- }
869
- [data-size="36"],
870
- [data-block-size="36"] {
871
- @apply bs-36;
872
- }
873
- [data-size="40"],
874
- [data-block-size="40"] {
875
- @apply bs-40;
876
- }
877
- [data-size="44"],
878
- [data-block-size="44"] {
879
- @apply bs-44;
880
- }
881
- [data-size="48"],
882
- [data-block-size="48"] {
883
- @apply bs-48;
884
- }
885
- [data-size="52"],
886
- [data-block-size="52"] {
887
- @apply bs-52;
888
- }
889
- [data-size="56"],
890
- [data-block-size="56"] {
891
- @apply bs-56;
892
- }
893
- [data-size="60"],
894
- [data-block-size="60"] {
895
- @apply bs-60;
896
- }
897
- [data-size="64"],
898
- [data-block-size="64"] {
899
- @apply bs-64;
900
- }
901
- [data-size="72"],
902
- [data-block-size="72"] {
903
- @apply bs-72;
904
- }
905
- [data-size="80"],
906
- [data-block-size="80"] {
907
- @apply bs-80;
908
- }
909
- [data-size="96"],
910
- [data-block-size="96"] {
911
- @apply bs-96;
912
- }
913
- [data-size="0"],
914
- [data-inline-size="0"] {
915
- @apply is-0;
916
- }
917
- [data-size=px],
918
- [data-inline-size=px] {
919
- @apply is-px;
920
- }
921
- [data-size="0.5"],
922
- [data-inline-size="0.5"] {
923
- @apply is-0.5;
924
- }
925
- [data-size="1"],
926
- [data-inline-size="1"] {
927
- @apply is-1;
928
- }
929
- [data-size="1.5"],
930
- [data-inline-size="1.5"] {
931
- @apply is-1.5;
932
- }
933
- [data-size="2"],
934
- [data-inline-size="2"] {
935
- @apply is-2;
936
- }
937
- [data-size="2.5"],
938
- [data-inline-size="2.5"] {
939
- @apply is-2.5;
940
- }
941
- [data-size="3"],
942
- [data-inline-size="3"] {
943
- @apply is-3;
944
- }
945
- [data-size="3.5"],
946
- [data-inline-size="3.5"] {
947
- @apply is-3.5;
948
- }
949
- [data-size="4"],
950
- [data-inline-size="4"] {
951
- @apply is-4;
952
- }
953
- [data-size="5"],
954
- [data-inline-size="5"] {
955
- @apply is-5;
956
- }
957
- [data-size="6"],
958
- [data-inline-size="6"] {
959
- @apply is-6;
960
- }
961
- [data-size="7"],
962
- [data-inline-size="7"] {
963
- @apply is-7;
964
- }
965
- [data-size="8"],
966
- [data-inline-size="8"] {
967
- @apply is-8;
968
- }
969
- [data-size="9"],
970
- [data-inline-size="9"] {
971
- @apply is-9;
972
- }
973
- [data-size="10"],
974
- [data-inline-size="10"] {
975
- @apply is-10;
976
- }
977
- [data-size="11"],
978
- [data-inline-size="11"] {
979
- @apply is-11;
980
- }
981
- [data-size="12"],
982
- [data-inline-size="12"] {
983
- @apply is-12;
984
- }
985
- [data-size="14"],
986
- [data-inline-size="14"] {
987
- @apply is-14;
988
- }
989
- [data-size="16"],
990
- [data-inline-size="16"] {
991
- @apply is-16;
992
- }
993
- [data-size="20"],
994
- [data-inline-size="20"] {
995
- @apply is-20;
996
- }
997
- [data-size="24"],
998
- [data-inline-size="24"] {
999
- @apply is-24;
1000
- }
1001
- [data-size="28"],
1002
- [data-inline-size="28"] {
1003
- @apply is-28;
1004
- }
1005
- [data-size="32"],
1006
- [data-inline-size="32"] {
1007
- @apply is-32;
1008
- }
1009
- [data-size="36"],
1010
- [data-inline-size="36"] {
1011
- @apply is-36;
1012
- }
1013
- [data-size="40"],
1014
- [data-inline-size="40"] {
1015
- @apply is-40;
1016
- }
1017
- [data-size="44"],
1018
- [data-inline-size="44"] {
1019
- @apply is-44;
1020
- }
1021
- [data-size="48"],
1022
- [data-inline-size="48"] {
1023
- @apply is-48;
1024
- }
1025
- [data-size="52"],
1026
- [data-inline-size="52"] {
1027
- @apply is-52;
1028
- }
1029
- [data-size="56"],
1030
- [data-inline-size="56"] {
1031
- @apply is-56;
1032
- }
1033
- [data-size="60"],
1034
- [data-inline-size="60"] {
1035
- @apply is-60;
1036
- }
1037
- [data-size="64"],
1038
- [data-inline-size="64"] {
1039
- @apply is-64;
1040
- }
1041
- [data-size="72"],
1042
- [data-inline-size="72"] {
1043
- @apply is-72;
1044
- }
1045
- [data-size="80"],
1046
- [data-inline-size="80"] {
1047
- @apply is-80;
1048
- }
1049
- [data-size="96"],
1050
- [data-inline-size="96"] {
1051
- @apply is-96;
1052
- }
1053
- }
1054
-
1055
- /* src/styles/layers/surfaces.css */
1056
- @layer utilities {
1057
- .base-surface {
1058
- background-color: var(--dx-baseSurface);
1059
- --surface-bg: var(--dx-baseSurface);
1060
- }
1061
- .dark .base-surface {
1062
- background-color: var(--dx-baseSurface);
1063
- --surface-bg: var(--dx-baseSurface);
1064
- }
1065
- .sidebar-surface {
1066
- background-color: var(--dx-sidebarSurface);
1067
- --surface-bg: var(--dx-sidebarSurface);
1068
- }
1069
- .dark .sidebar-surface {
1070
- background-color: var(--dx-sidebarSurface);
1071
- --surface-bg: var(--dx-sidebarSurface);
1072
- }
1073
- .modal-surface {
1074
- background-color: var(--dx-modalSurface);
1075
- --surface-bg: var(--dx-modalSurface);
1076
- }
1077
- .dark .modal-surface {
1078
- background-color: var(--dx-modalSurface);
1079
- --surface-bg: var(--dx-modalSurface);
1080
- }
1081
- }
1082
-
1083
- /* src/styles/layers/tag.css */
1084
- @layer dx-tokens {
1085
- :root {
1086
- --dx-tag-padding-block: 0.125rem;
1087
- }
1088
- }
1089
- @layer dx-components {
1090
- .dx-tag {
1091
- @apply inline-block text-xs font-semibold m-0.5 pli-1 rounded-sm cursor-default truncate;
1092
- padding-block: var(--dx-tag-padding-block);
1093
- user-select: none;
1094
- }
1095
- .dx-tag--anchor {
1096
- @apply inline cursor-pointer -mli-[4px] pli-[3px] plb-0.5 border border-separator rounded-sm bg-groupSurface transition-colors;
1097
- &:hover {
1098
- @apply bg-hoverSurface;
1099
- }
1100
- }
1101
- .dx-tag[data-hue=neutral],
1102
- .dx-tag--neutral {
1103
- @apply bg-separator text-neutral-700 dark:text-neutral-150;
1104
- }
1105
- .dx-tag[data-hue=red],
1106
- .dx-tag--red {
1107
- @apply bg-redSurface text-redSurfaceText;
1108
- }
1109
- .dx-tag[data-hue=orange],
1110
- .dx-tag--orange {
1111
- @apply bg-orangeSurface text-orangeSurfaceText;
1112
- }
1113
- .dx-tag[data-hue=amber],
1114
- .dx-tag--amber {
1115
- @apply bg-amberSurface text-amberSurfaceText;
1116
- }
1117
- .dx-tag[data-hue=yellow],
1118
- .dx-tag--yellow {
1119
- @apply bg-yellowSurface text-yellowSurfaceText;
1120
- }
1121
- .dx-tag[data-hue=lime],
1122
- .dx-tag--lime {
1123
- @apply bg-limeSurface text-limeSurfaceText;
1124
- }
1125
- .dx-tag[data-hue=green],
1126
- .dx-tag--green {
1127
- @apply bg-greenSurface text-greenSurfaceText;
1128
- }
1129
- .dx-tag[data-hue=emerald],
1130
- .dx-tag--emerald {
1131
- @apply bg-emeraldSurface text-emeraldSurfaceText;
1132
- }
1133
- .dx-tag[data-hue=teal],
1134
- .dx-tag--teal {
1135
- @apply bg-tealSurface text-tealSurfaceText;
1136
- }
1137
- .dx-tag[data-hue=cyan],
1138
- .dx-tag--cyan {
1139
- @apply bg-cyanSurface text-cyanSurfaceText;
1140
- }
1141
- .dx-tag[data-hue=sky],
1142
- .dx-tag--sky {
1143
- @apply bg-skySurface text-skySurfaceText;
1144
- }
1145
- .dx-tag[data-hue=blue],
1146
- .dx-tag--blue {
1147
- @apply bg-blueSurface text-blueSurfaceText;
1148
- }
1149
- .dx-tag[data-hue=indigo],
1150
- .dx-tag--indigo {
1151
- @apply bg-indigoSurface text-indigoSurfaceText;
1152
- }
1153
- .dx-tag[data-hue=violet],
1154
- .dx-tag--violet {
1155
- @apply bg-violetSurface text-violetSurfaceText;
1156
- }
1157
- .dx-tag[data-hue=purple],
1158
- .dx-tag--purple {
1159
- @apply bg-purpleSurface text-purpleSurfaceText;
1160
- }
1161
- .dx-tag[data-hue=fuchsia],
1162
- .dx-tag--fuchsia {
1163
- @apply bg-fuchsiaSurface text-fuchsiaSurfaceText;
1164
- }
1165
- .dx-tag[data-hue=pink],
1166
- .dx-tag--pink {
1167
- @apply bg-pinkSurface text-pinkSurfaceText;
1168
- }
1169
- .dx-tag[data-hue=rose],
1170
- .dx-tag--rose {
1171
- @apply bg-roseSurface text-roseSurfaceText;
1172
- }
1173
- .dx-tag[data-hue=info],
1174
- .dx-tag--info {
1175
- @apply bg-cyanSurface text-cyanSurfaceText;
1176
- }
1177
- .dx-tag[data-hue=success],
1178
- .dx-tag--success {
1179
- @apply bg-emeraldSurface text-emeraldSurfaceText;
1180
- }
1181
- .dx-tag[data-hue=warning],
1182
- .dx-tag--warning {
1183
- @apply bg-amberSurface text-amberSurfaceText;
1184
- }
1185
- .dx-tag[data-hue=error],
1186
- .dx-tag--error {
1187
- @apply bg-roseSurface text-roseSurfaceText;
1188
- }
1189
- }
1190
-
1191
- /* src/styles/layers/tldraw.css */
1192
- @layer dx-components {
1193
- .tl-container.tl-theme__light {
1194
- --color-accent: var(--color-accent);
1195
- --color-background: var(--surface-bg);
1196
- --color-panel-contrast: var(--dx-separator);
1197
- --color-panel-overlay: rgba(255, 255, 255, 0.82);
1198
- }
1199
- .tl-container.tl-theme__dark {
1200
- --color-accent: var(--color-accent);
1201
- --color-background: var(--surface-bg);
1202
- --color-divider: var(--dx-separator);
1203
- --color-panel: var(--dx-attention);
1204
- --color-panel-contrast: var(--dx-separator);
1205
- --color-panel-overlay: rgba(54, 61, 68, 0.82);
1206
- }
1207
- }
1208
-
1209
- /* src/styles/layers/tokens.css */
1210
- @layer dx-tokens {
1211
- @tokens dx;
1212
- :root {
1213
- --sticky-top: 0;
1214
- --rail-content: 3rem;
1215
- --rail-size: calc(var(--rail-content) + 1px);
1216
- --rail-action: calc(var(--rail-content) - 0.5rem + 1px);
1217
- --rail-item: calc(var(--rail-content) - 1rem);
1218
- --line-height: 32px;
1219
- --topbar-size: var(--rail-size);
1220
- --toolbar-size: var(--rail-content);
1221
- --statusbar-size: theme(spacing.8);
1222
- --nav-sidebar-size: 22.5rem;
1223
- --complementary-sidebar-size: 25rem;
1224
- --l0-size: 74px;
1225
- --l0-avatar-size: 3rem;
1226
- --l1-size: calc(var(--nav-sidebar-size) - var(--l0-size));
1227
- --r0-size: var(--rail-size);
1228
- --r1-size: calc(var(--complementary-sidebar-size) - var(--r0-size));
1229
- --text-content: calc(50rem - env(safe-area-inset-left) - env(safe-area-inset-right));
1230
- }
1231
- :root {
1232
- --dx-calc-auto: auto;
1233
- --dx-calc-min: min-content;
1234
- --dx-calc-fit: fit-content;
1235
- --dx-calc-max: max-content;
1236
- --dx-calc-content: content;
1237
- }
1238
- @supports (block-size: calc-size(fit-content, size)) {
1239
- :root {
1240
- --dx-calc-auto: calc-size(auto, size);
1241
- --dx-calc-min: calc-size(min-content, size);
1242
- --dx-calc-fit: calc-size(fit-content, size);
1243
- --dx-calc-max: calc-size(max-content, size);
1244
- --dx-calc-content: calc-size(content, size);
1245
- }
1246
- }
1247
- }
1248
-
1249
- /* src/styles/layers/typography.css */
1250
- @layer utilities {
1251
- .not-italic {
1252
- font-variation-settings: "wght" 400, "slnt" 0;
1253
- }
1254
- .font-thin,
1255
- .not-italic.font-thin,
1256
- .not-italic .font-thin,
1257
- .font-thin .not-italic {
1258
- font-variation-settings: "wght" 100, "slnt" 0;
1259
- }
1260
- .font-extralight,
1261
- .not-italic.font-extralight,
1262
- .not-italic .font-extralight,
1263
- .font-extralight .not-italic {
1264
- font-variation-settings: "wght" 200, "slnt" 0;
1265
- }
1266
- .font-light,
1267
- .not-italic.font-light,
1268
- .not-italic .font-light,
1269
- .font-light .not-italic {
1270
- font-variation-settings: "wght" 300, "slnt" 0;
1271
- }
1272
- .font-normal,
1273
- .not-italic.font-normal,
1274
- .not-italic .font-normal,
1275
- .font-normal .not-italic {
1276
- font-variation-settings: "wght" 400, "slnt" 0;
1277
- }
1278
- .font-medium,
1279
- .not-italic.font-medium,
1280
- .not-italic .font-medium,
1281
- .font-medium .not-italic {
1282
- font-variation-settings: "wght" 500, "slnt" 0;
1283
- }
1284
- .font-semibold,
1285
- .not-italic.font-semibold,
1286
- .not-italic .font-semibold,
1287
- .font-semibold .not-italic {
1288
- font-variation-settings: "wght" 600, "slnt" 0;
1289
- }
1290
- .font-bold,
1291
- .not-italic.font-bold,
1292
- .not-italic .font-bold,
1293
- .font-bold .not-italic {
1294
- font-variation-settings: "wght" 700, "slnt" 0;
1295
- }
1296
- .font-extrabold,
1297
- .not-italic.font-extrabold,
1298
- .not-italic .font-extrabold,
1299
- .font-extrabold .not-italic {
1300
- font-variation-settings: "wght" 800, "slnt" 0;
1301
- }
1302
- .font-black,
1303
- .not-italic.font-black,
1304
- .not-italic .font-black,
1305
- .font-black .not-italic {
1306
- font-variation-settings: "wght" 900, "slnt" 0;
1307
- }
1308
- .italic {
1309
- font-variation-settings: "wght" 400, "slnt" -10;
1310
- }
1311
- .italic.font-thin,
1312
- .italic .font-thin,
1313
- .font-thin .italic {
1314
- font-variation-settings: "wght" 100, "slnt" -10;
1315
- }
1316
- .italic.font-extralight,
1317
- .italic .font-extralight,
1318
- .font-extralight .italic {
1319
- font-variation-settings: "wght" 200, "slnt" -10;
1320
- }
1321
- .italic.font-light,
1322
- .italic .font-light,
1323
- .font-light .italic {
1324
- font-variation-settings: "wght" 300, "slnt" -10;
1325
- }
1326
- .italic.font-normal,
1327
- .italic .font-normal,
1328
- .font-normal .italic {
1329
- font-variation-settings: "wght" 400, "slnt" -10;
1330
- }
1331
- .italic.font-medium,
1332
- .italic .font-medium,
1333
- .font-medium .italic {
1334
- font-variation-settings: "wght" 500, "slnt" -10;
1335
- }
1336
- .italic.font-semibold,
1337
- .italic .font-semibold,
1338
- .font-semibold .italic {
1339
- font-variation-settings: "wght" 600, "slnt" -10;
1340
- }
1341
- .italic.font-bold,
1342
- .italic .font-bold,
1343
- .font-bold .italic {
1344
- font-variation-settings: "wght" 700, "slnt" -10;
1345
- }
1346
- .italic.font-extrabold,
1347
- .italic .font-extrabold,
1348
- .font-extrabold .italic {
1349
- font-variation-settings: "wght" 800, "slnt" -10;
1350
- }
1351
- .italic.font-black,
1352
- .italic .font-black,
1353
- .font-black .italic {
1354
- font-variation-settings: "wght" 900, "slnt" -10;
1355
- }
1356
- }
1357
-
1358
- /* src/styles/layers/index.css */
1359
- @layer dx-tokens, user-tokens, tw-base, dx-base, tw-components, dx-components, utilities;
1360
-
1361
- /* src/theme.css */
1362
- /*# sourceMappingURL=theme.css.map */