@atlaskit/tokens 13.3.1 → 14.0.0

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 (268) hide show
  1. package/CHANGELOG.md +35 -0
  2. package/artifacts/theme-import-map/package.json +1 -8
  3. package/artifacts/types/package.json +1 -8
  4. package/babel-plugin/package.json +1 -8
  5. package/constants/package.json +1 -8
  6. package/css-type-schema/package.json +1 -8
  7. package/custom-themes/package.json +1 -8
  8. package/dist/cjs/artifacts/generated-pairs.js +2 -2
  9. package/dist/cjs/artifacts/themes/atlassian-dark-increased-contrast.js +2 -2
  10. package/dist/cjs/artifacts/themes/atlassian-dark.js +2 -2
  11. package/dist/cjs/artifacts/themes/atlassian-light-increased-contrast.js +2 -2
  12. package/dist/cjs/artifacts/themes/atlassian-light.js +2 -2
  13. package/dist/cjs/artifacts/token-default-values.js +5 -1
  14. package/dist/cjs/artifacts/token-names.js +5 -1
  15. package/dist/cjs/artifacts/tokens-raw/atlassian-dark-increased-contrast.js +89 -1
  16. package/dist/cjs/artifacts/tokens-raw/atlassian-dark.js +89 -1
  17. package/dist/cjs/artifacts/tokens-raw/atlassian-light-increased-contrast.js +89 -1
  18. package/dist/cjs/artifacts/tokens-raw/atlassian-light.js +89 -1
  19. package/dist/cjs/entry-points/token-metadata.codegen.js +37 -1
  20. package/dist/cjs/utils/token-order.js +1 -1
  21. package/dist/cjs/utils/token-usage-guidelines.js +3 -0
  22. package/dist/es2019/artifacts/generated-pairs.js +2 -2
  23. package/dist/es2019/artifacts/themes/atlassian-dark-increased-contrast.js +5 -1
  24. package/dist/es2019/artifacts/themes/atlassian-dark.js +5 -1
  25. package/dist/es2019/artifacts/themes/atlassian-light-increased-contrast.js +5 -1
  26. package/dist/es2019/artifacts/themes/atlassian-light.js +5 -1
  27. package/dist/es2019/artifacts/token-default-values.js +5 -1
  28. package/dist/es2019/artifacts/token-names.js +5 -1
  29. package/dist/es2019/artifacts/tokens-raw/atlassian-dark-increased-contrast.js +89 -1
  30. package/dist/es2019/artifacts/tokens-raw/atlassian-dark.js +89 -1
  31. package/dist/es2019/artifacts/tokens-raw/atlassian-light-increased-contrast.js +89 -1
  32. package/dist/es2019/artifacts/tokens-raw/atlassian-light.js +89 -1
  33. package/dist/es2019/entry-points/token-metadata.codegen.js +37 -1
  34. package/dist/es2019/utils/token-order.js +1 -1
  35. package/dist/es2019/utils/token-usage-guidelines.js +3 -0
  36. package/dist/esm/artifacts/generated-pairs.js +2 -2
  37. package/dist/esm/artifacts/themes/atlassian-dark-increased-contrast.js +2 -2
  38. package/dist/esm/artifacts/themes/atlassian-dark.js +2 -2
  39. package/dist/esm/artifacts/themes/atlassian-light-increased-contrast.js +2 -2
  40. package/dist/esm/artifacts/themes/atlassian-light.js +2 -2
  41. package/dist/esm/artifacts/token-default-values.js +5 -1
  42. package/dist/esm/artifacts/token-names.js +5 -1
  43. package/dist/esm/artifacts/tokens-raw/atlassian-dark-increased-contrast.js +89 -1
  44. package/dist/esm/artifacts/tokens-raw/atlassian-dark.js +89 -1
  45. package/dist/esm/artifacts/tokens-raw/atlassian-light-increased-contrast.js +89 -1
  46. package/dist/esm/artifacts/tokens-raw/atlassian-light.js +89 -1
  47. package/dist/esm/entry-points/token-metadata.codegen.js +37 -1
  48. package/dist/esm/utils/token-order.js +1 -1
  49. package/dist/esm/utils/token-usage-guidelines.js +3 -0
  50. package/dist/types/artifacts/generated-pairs.d.ts +1 -1
  51. package/dist/types/artifacts/themes/atlassian-dark-increased-contrast.d.ts +2 -2
  52. package/dist/types/artifacts/themes/atlassian-dark.d.ts +2 -2
  53. package/dist/types/artifacts/themes/atlassian-light-increased-contrast.d.ts +2 -2
  54. package/dist/types/artifacts/themes/atlassian-light.d.ts +2 -2
  55. package/dist/types/artifacts/token-default-values.d.ts +5 -1
  56. package/dist/types/artifacts/token-names.d.ts +9 -1
  57. package/dist/types/artifacts/tokens-raw/atlassian-dark-increased-contrast.d.ts +1 -1
  58. package/dist/types/artifacts/tokens-raw/atlassian-dark.d.ts +1 -1
  59. package/dist/types/artifacts/tokens-raw/atlassian-light-increased-contrast.d.ts +1 -1
  60. package/dist/types/artifacts/tokens-raw/atlassian-light.d.ts +1 -1
  61. package/dist/types/artifacts/types-internal.d.ts +2 -2
  62. package/dist/types/artifacts/types.d.ts +2 -2
  63. package/dist/types/entry-points/css-type-schema.codegen.d.ts +4 -4
  64. package/dist/types/entry-points/token-metadata.codegen.d.ts +1 -1
  65. package/dist/types/types.d.ts +24 -6
  66. package/enable-global-theme/package.json +1 -8
  67. package/figma/atlassian-dark-increased-contrast.json +36 -0
  68. package/figma/atlassian-dark.json +36 -0
  69. package/figma/atlassian-light-increased-contrast.json +36 -0
  70. package/figma/atlassian-light.json +36 -0
  71. package/get-global-theme/package.json +1 -8
  72. package/get-ssr-auto-script/package.json +1 -8
  73. package/get-theme-html-attrs/package.json +1 -8
  74. package/get-theme-styles/package.json +1 -8
  75. package/get-token/package.json +1 -8
  76. package/get-token-value/package.json +1 -8
  77. package/package.json +29 -37
  78. package/palettes-raw/package.json +1 -8
  79. package/rename-mapping/package.json +1 -8
  80. package/set-global-theme/package.json +1 -8
  81. package/theme-config/package.json +1 -8
  82. package/theme-mutation-observer/package.json +1 -8
  83. package/theme-state-transformer/package.json +1 -8
  84. package/token-default-values/package.json +1 -8
  85. package/token-ids/package.json +1 -8
  86. package/token-metadata/package.json +1 -8
  87. package/token-names/package.json +1 -8
  88. package/token-order/package.json +1 -8
  89. package/tokens-raw/package.json +1 -8
  90. package/types/package.json +1 -8
  91. package/use-theme-observer/package.json +1 -8
  92. package/dist/types-ts4.5/artifacts/atlassian-dark-token-value-for-contrast-check.d.ts +0 -18
  93. package/dist/types-ts4.5/artifacts/atlassian-light-token-value-for-contrast-check.d.ts +0 -18
  94. package/dist/types-ts4.5/artifacts/generated-pairs.d.ts +0 -16
  95. package/dist/types-ts4.5/artifacts/palettes-raw/legacy-palette.d.ts +0 -25
  96. package/dist/types-ts4.5/artifacts/palettes-raw/motion-palette.d.ts +0 -24
  97. package/dist/types-ts4.5/artifacts/palettes-raw/palette-brand-refresh.d.ts +0 -25
  98. package/dist/types-ts4.5/artifacts/palettes-raw/palette.d.ts +0 -25
  99. package/dist/types-ts4.5/artifacts/palettes-raw/shape-palette.d.ts +0 -24
  100. package/dist/types-ts4.5/artifacts/palettes-raw/spacing-scale.d.ts +0 -24
  101. package/dist/types-ts4.5/artifacts/palettes-raw/typography-palette.d.ts +0 -24
  102. package/dist/types-ts4.5/artifacts/replacement-mapping.d.ts +0 -26
  103. package/dist/types-ts4.5/artifacts/theme-import-map.d.ts +0 -16
  104. package/dist/types-ts4.5/artifacts/themes/atlassian-dark-future.d.ts +0 -7
  105. package/dist/types-ts4.5/artifacts/themes/atlassian-dark-increased-contrast.d.ts +0 -7
  106. package/dist/types-ts4.5/artifacts/themes/atlassian-dark-new-input-border.d.ts +0 -7
  107. package/dist/types-ts4.5/artifacts/themes/atlassian-dark.d.ts +0 -7
  108. package/dist/types-ts4.5/artifacts/themes/atlassian-legacy-dark.d.ts +0 -7
  109. package/dist/types-ts4.5/artifacts/themes/atlassian-legacy-light.d.ts +0 -7
  110. package/dist/types-ts4.5/artifacts/themes/atlassian-light-future.d.ts +0 -7
  111. package/dist/types-ts4.5/artifacts/themes/atlassian-light-increased-contrast.d.ts +0 -7
  112. package/dist/types-ts4.5/artifacts/themes/atlassian-light-new-input-border.d.ts +0 -7
  113. package/dist/types-ts4.5/artifacts/themes/atlassian-light.d.ts +0 -7
  114. package/dist/types-ts4.5/artifacts/themes/atlassian-motion.d.ts +0 -7
  115. package/dist/types-ts4.5/artifacts/themes/atlassian-shape-rounder.d.ts +0 -7
  116. package/dist/types-ts4.5/artifacts/themes/atlassian-shape-roundest.d.ts +0 -7
  117. package/dist/types-ts4.5/artifacts/themes/atlassian-shape.d.ts +0 -7
  118. package/dist/types-ts4.5/artifacts/themes/atlassian-spacing.d.ts +0 -7
  119. package/dist/types-ts4.5/artifacts/themes/atlassian-typography.d.ts +0 -7
  120. package/dist/types-ts4.5/artifacts/token-default-values.d.ts +0 -562
  121. package/dist/types-ts4.5/artifacts/token-names.d.ts +0 -1105
  122. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark-brand-refresh.d.ts +0 -50
  123. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark-future.d.ts +0 -31
  124. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark-increased-contrast.d.ts +0 -51
  125. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark.d.ts +0 -51
  126. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-legacy-dark.d.ts +0 -51
  127. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-legacy-light.d.ts +0 -51
  128. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light-brand-refresh.d.ts +0 -50
  129. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light-future.d.ts +0 -31
  130. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light-increased-contrast.d.ts +0 -51
  131. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light.d.ts +0 -51
  132. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-motion.d.ts +0 -43
  133. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-shape.d.ts +0 -31
  134. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-spacing.d.ts +0 -31
  135. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-typography.d.ts +0 -38
  136. package/dist/types-ts4.5/artifacts/types-internal.d.ts +0 -6
  137. package/dist/types-ts4.5/artifacts/types.d.ts +0 -6
  138. package/dist/types-ts4.5/artifacts/typescript/atlassian-dark-token-names.d.ts +0 -784
  139. package/dist/types-ts4.5/artifacts/typescript/atlassian-dark-types-internal.d.ts +0 -6
  140. package/dist/types-ts4.5/artifacts/typescript/atlassian-dark-types.d.ts +0 -6
  141. package/dist/types-ts4.5/artifacts/typescript/atlassian-light-token-names.d.ts +0 -784
  142. package/dist/types-ts4.5/artifacts/typescript/atlassian-light-types-internal.d.ts +0 -6
  143. package/dist/types-ts4.5/artifacts/typescript/atlassian-light-types.d.ts +0 -6
  144. package/dist/types-ts4.5/babel-plugin/index.d.ts +0 -1
  145. package/dist/types-ts4.5/babel-plugin/plugin.d.ts +0 -29
  146. package/dist/types-ts4.5/constants.d.ts +0 -9
  147. package/dist/types-ts4.5/custom-theme.d.ts +0 -6
  148. package/dist/types-ts4.5/enable-global-theme.d.ts +0 -26
  149. package/dist/types-ts4.5/entry-points/artifacts-theme-import-map.d.ts +0 -1
  150. package/dist/types-ts4.5/entry-points/artifacts-types.d.ts +0 -1
  151. package/dist/types-ts4.5/entry-points/babel-plugin.d.ts +0 -1
  152. package/dist/types-ts4.5/entry-points/constants.d.ts +0 -1
  153. package/dist/types-ts4.5/entry-points/css-type-schema.codegen.d.ts +0 -165
  154. package/dist/types-ts4.5/entry-points/custom-themes.d.ts +0 -1
  155. package/dist/types-ts4.5/entry-points/enable-global-theme.d.ts +0 -1
  156. package/dist/types-ts4.5/entry-points/get-global-theme.d.ts +0 -1
  157. package/dist/types-ts4.5/entry-points/get-ssr-auto-script.d.ts +0 -1
  158. package/dist/types-ts4.5/entry-points/get-theme-html-attrs.d.ts +0 -1
  159. package/dist/types-ts4.5/entry-points/get-theme-styles.d.ts +0 -1
  160. package/dist/types-ts4.5/entry-points/get-token-value.d.ts +0 -1
  161. package/dist/types-ts4.5/entry-points/get-token.d.ts +0 -1
  162. package/dist/types-ts4.5/entry-points/palettes-raw.d.ts +0 -2
  163. package/dist/types-ts4.5/entry-points/rename-mapping.d.ts +0 -1
  164. package/dist/types-ts4.5/entry-points/set-global-theme.d.ts +0 -1
  165. package/dist/types-ts4.5/entry-points/theme-config.d.ts +0 -2
  166. package/dist/types-ts4.5/entry-points/theme-mutation-observer.d.ts +0 -1
  167. package/dist/types-ts4.5/entry-points/theme-state-transformer.d.ts +0 -2
  168. package/dist/types-ts4.5/entry-points/token-default-values.d.ts +0 -1
  169. package/dist/types-ts4.5/entry-points/token-ids.d.ts +0 -1
  170. package/dist/types-ts4.5/entry-points/token-metadata.codegen.d.ts +0 -19
  171. package/dist/types-ts4.5/entry-points/token-names.d.ts +0 -2
  172. package/dist/types-ts4.5/entry-points/token-order.d.ts +0 -1
  173. package/dist/types-ts4.5/entry-points/tokens-raw.d.ts +0 -6
  174. package/dist/types-ts4.5/entry-points/types.d.ts +0 -1
  175. package/dist/types-ts4.5/entry-points/use-theme-observer.d.ts +0 -1
  176. package/dist/types-ts4.5/get-custom-theme-styles.d.ts +0 -16
  177. package/dist/types-ts4.5/get-global-theme.d.ts +0 -3
  178. package/dist/types-ts4.5/get-ssr-auto-script.d.ts +0 -11
  179. package/dist/types-ts4.5/get-theme-html-attrs.d.ts +0 -18
  180. package/dist/types-ts4.5/get-theme-styles.d.ts +0 -25
  181. package/dist/types-ts4.5/get-token-value.d.ts +0 -25
  182. package/dist/types-ts4.5/get-token.d.ts +0 -26
  183. package/dist/types-ts4.5/index.d.ts +0 -19
  184. package/dist/types-ts4.5/is-color-mode.d.ts +0 -2
  185. package/dist/types-ts4.5/is-theme-ids.d.ts +0 -2
  186. package/dist/types-ts4.5/is-theme-kind.d.ts +0 -11
  187. package/dist/types-ts4.5/load-custom-theme-styles.d.ts +0 -17
  188. package/dist/types-ts4.5/set-global-theme.d.ts +0 -26
  189. package/dist/types-ts4.5/theme-color-modes.d.ts +0 -12
  190. package/dist/types-ts4.5/theme-config.d.ts +0 -121
  191. package/dist/types-ts4.5/theme-ids.d.ts +0 -19
  192. package/dist/types-ts4.5/theme-mutation-observer.d.ts +0 -25
  193. package/dist/types-ts4.5/theme-object-to-string.d.ts +0 -13
  194. package/dist/types-ts4.5/theme-options-schema.d.ts +0 -7
  195. package/dist/types-ts4.5/theme-state-defaults.d.ts +0 -14
  196. package/dist/types-ts4.5/theme-state.d.ts +0 -17
  197. package/dist/types-ts4.5/theme-string-to-object.d.ts +0 -14
  198. package/dist/types-ts4.5/types.d.ts +0 -1338
  199. package/dist/types-ts4.5/use-theme-observer.d.ts +0 -16
  200. package/dist/types-ts4.5/utils/additional-contrast-checker.d.ts +0 -9
  201. package/dist/types-ts4.5/utils/color-detection.d.ts +0 -8
  202. package/dist/types-ts4.5/utils/color-mode-listeners.d.ts +0 -13
  203. package/dist/types-ts4.5/utils/configure-page.d.ts +0 -6
  204. package/dist/types-ts4.5/utils/contrast-mode-listeners.d.ts +0 -13
  205. package/dist/types-ts4.5/utils/custom-theme-loading-utils.d.ts +0 -4
  206. package/dist/types-ts4.5/utils/custom-theme-token-contrast-check.d.ts +0 -11
  207. package/dist/types-ts4.5/utils/delta-e.d.ts +0 -1
  208. package/dist/types-ts4.5/utils/generate-colors.d.ts +0 -5
  209. package/dist/types-ts4.5/utils/generate-token-map-with-contrast-check.d.ts +0 -11
  210. package/dist/types-ts4.5/utils/generate-token-map.d.ts +0 -11
  211. package/dist/types-ts4.5/utils/get-alpha.d.ts +0 -1
  212. package/dist/types-ts4.5/utils/get-closest-color-index.d.ts +0 -2
  213. package/dist/types-ts4.5/utils/get-contrast-ratio.d.ts +0 -1
  214. package/dist/types-ts4.5/utils/get-css-custom-property.d.ts +0 -15
  215. package/dist/types-ts4.5/utils/get-fully-qualified-token-id.d.ts +0 -11
  216. package/dist/types-ts4.5/utils/get-increased-contrast-theme.d.ts +0 -5
  217. package/dist/types-ts4.5/utils/get-theme-override-preferences.d.ts +0 -2
  218. package/dist/types-ts4.5/utils/get-theme-preferences.d.ts +0 -3
  219. package/dist/types-ts4.5/utils/get-token-id.d.ts +0 -15
  220. package/dist/types-ts4.5/utils/hash.d.ts +0 -1
  221. package/dist/types-ts4.5/utils/hct-color-utils/alpha-from-argb.d.ts +0 -4
  222. package/dist/types-ts4.5/utils/hct-color-utils/argb-from-linrgb.d.ts +0 -4
  223. package/dist/types-ts4.5/utils/hct-color-utils/argb-from-lstar.d.ts +0 -8
  224. package/dist/types-ts4.5/utils/hct-color-utils/argb-from-rgb.d.ts +0 -4
  225. package/dist/types-ts4.5/utils/hct-color-utils/argb-from-rgba.d.ts +0 -8
  226. package/dist/types-ts4.5/utils/hct-color-utils/argb-from-xyz.d.ts +0 -4
  227. package/dist/types-ts4.5/utils/hct-color-utils/blue-from-argb.d.ts +0 -4
  228. package/dist/types-ts4.5/utils/hct-color-utils/clamp-component.d.ts +0 -1
  229. package/dist/types-ts4.5/utils/hct-color-utils/clamp-double.d.ts +0 -7
  230. package/dist/types-ts4.5/utils/hct-color-utils/clamp-int.d.ts +0 -7
  231. package/dist/types-ts4.5/utils/hct-color-utils/contrast.d.ts +0 -78
  232. package/dist/types-ts4.5/utils/hct-color-utils/delinearized.d.ts +0 -9
  233. package/dist/types-ts4.5/utils/hct-color-utils/green-from-argb.d.ts +0 -4
  234. package/dist/types-ts4.5/utils/hct-color-utils/hct.d.ts +0 -92
  235. package/dist/types-ts4.5/utils/hct-color-utils/index.d.ts +0 -4
  236. package/dist/types-ts4.5/utils/hct-color-utils/lab-f.d.ts +0 -1
  237. package/dist/types-ts4.5/utils/hct-color-utils/lab-invf.d.ts +0 -1
  238. package/dist/types-ts4.5/utils/hct-color-utils/lerp.d.ts +0 -6
  239. package/dist/types-ts4.5/utils/hct-color-utils/linearized.d.ts +0 -9
  240. package/dist/types-ts4.5/utils/hct-color-utils/lstar-from-argb.d.ts +0 -7
  241. package/dist/types-ts4.5/utils/hct-color-utils/lstar-from-y.d.ts +0 -12
  242. package/dist/types-ts4.5/utils/hct-color-utils/math-utils.d.ts +0 -6
  243. package/dist/types-ts4.5/utils/hct-color-utils/matrix-multiply.d.ts +0 -4
  244. package/dist/types-ts4.5/utils/hct-color-utils/red-from-argb.d.ts +0 -4
  245. package/dist/types-ts4.5/utils/hct-color-utils/rgba-from-argb.d.ts +0 -8
  246. package/dist/types-ts4.5/utils/hct-color-utils/rgba.d.ts +0 -14
  247. package/dist/types-ts4.5/utils/hct-color-utils/sanitize-degrees-double.d.ts +0 -7
  248. package/dist/types-ts4.5/utils/hct-color-utils/signum.d.ts +0 -6
  249. package/dist/types-ts4.5/utils/hct-color-utils/viewing-conditions.d.ts +0 -47
  250. package/dist/types-ts4.5/utils/hct-color-utils/white-point-d65.d.ts +0 -6
  251. package/dist/types-ts4.5/utils/hct-color-utils/y-from-lstar.d.ts +0 -12
  252. package/dist/types-ts4.5/utils/hex-to-hsl.d.ts +0 -5
  253. package/dist/types-ts4.5/utils/hex-to-rgb-a.d.ts +0 -6
  254. package/dist/types-ts4.5/utils/hex-to-rgb.d.ts +0 -5
  255. package/dist/types-ts4.5/utils/hex-to-rgba-values.d.ts +0 -6
  256. package/dist/types-ts4.5/utils/hsl-to-rgb.d.ts +0 -5
  257. package/dist/types-ts4.5/utils/is-valid-brand-hex.d.ts +0 -1
  258. package/dist/types-ts4.5/utils/is-valid-hex.d.ts +0 -1
  259. package/dist/types-ts4.5/utils/limit-size-of-custom-style-elements.d.ts +0 -1
  260. package/dist/types-ts4.5/utils/load-theme-css.d.ts +0 -2
  261. package/dist/types-ts4.5/utils/reduce-token-map.d.ts +0 -6
  262. package/dist/types-ts4.5/utils/relative-luminance-w3-c.d.ts +0 -1
  263. package/dist/types-ts4.5/utils/rgb-to-hex.d.ts +0 -1
  264. package/dist/types-ts4.5/utils/rgb-to-lab.d.ts +0 -5
  265. package/dist/types-ts4.5/utils/theme-loading.d.ts +0 -5
  266. package/dist/types-ts4.5/utils/token-ids.d.ts +0 -3
  267. package/dist/types-ts4.5/utils/token-order.d.ts +0 -7
  268. package/dist/types-ts4.5/utils/token-usage-guidelines.d.ts +0 -8
@@ -1,6 +0,0 @@
1
- /**
2
- * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
3
- * @codegen <<SignedSource::1dd64ddb2df151d9df21390717a58975>>
4
- * @codegenCommand yarn build tokens
5
- */
6
- export type InternalTokenIds = 'color.text.accent.blue.[default]' | 'color.text.accent.blue.bolder' | 'color.text.accent.red.[default]' | 'color.text.accent.red.bolder' | 'color.text.accent.orange.[default]' | 'color.text.accent.orange.bolder' | 'color.text.accent.yellow.[default]' | 'color.text.accent.yellow.bolder' | 'color.text.accent.green.[default]' | 'color.text.accent.green.bolder' | 'color.text.accent.purple.[default]' | 'color.text.accent.purple.bolder' | 'color.text.accent.teal.[default]' | 'color.text.accent.teal.bolder' | 'color.text.accent.magenta.[default]' | 'color.text.accent.magenta.bolder' | 'color.text.accent.gray.[default]' | 'color.text.accent.gray.bolder' | 'color.text.[default]' | 'color.text.subtle' | 'color.text.subtlest' | 'color.text.disabled' | 'color.text.inverse' | 'color.text.brand' | 'color.text.selected' | 'color.text.danger' | 'color.text.warning.[default]' | 'color.text.warning.inverse' | 'color.text.success' | 'color.text.discovery' | 'color.text.information' | 'color.icon.accent.blue' | 'color.icon.accent.red' | 'color.icon.accent.orange' | 'color.icon.accent.yellow' | 'color.icon.accent.green' | 'color.icon.accent.purple' | 'color.icon.accent.teal' | 'color.icon.accent.magenta' | 'color.icon.accent.gray' | 'color.icon.[default]' | 'color.icon.subtle' | 'color.icon.inverse' | 'color.icon.disabled' | 'color.icon.brand' | 'color.icon.selected' | 'color.icon.danger' | 'color.icon.warning.[default]' | 'color.icon.warning.inverse' | 'color.icon.success' | 'color.icon.discovery' | 'color.icon.information' | 'color.border.accent.blue' | 'color.border.accent.red' | 'color.border.accent.orange' | 'color.border.accent.yellow' | 'color.border.accent.green' | 'color.border.accent.purple' | 'color.border.accent.teal' | 'color.border.accent.magenta' | 'color.border.accent.gray' | 'color.border.[default]' | 'color.border.bold' | 'color.border.inverse' | 'color.border.focused' | 'color.border.input' | 'color.border.disabled' | 'color.border.brand' | 'color.border.selected' | 'color.border.danger' | 'color.border.warning' | 'color.border.success' | 'color.border.discovery' | 'color.border.information' | 'color.background.accent.blue.subtlest' | 'color.background.accent.blue.subtler' | 'color.background.accent.blue.subtle' | 'color.background.accent.blue.bolder' | 'color.background.accent.red.subtlest' | 'color.background.accent.red.subtler' | 'color.background.accent.red.subtle' | 'color.background.accent.red.bolder' | 'color.background.accent.orange.subtlest' | 'color.background.accent.orange.subtler' | 'color.background.accent.orange.subtle' | 'color.background.accent.orange.bolder' | 'color.background.accent.yellow.subtlest' | 'color.background.accent.yellow.subtler' | 'color.background.accent.yellow.subtle' | 'color.background.accent.yellow.bolder' | 'color.background.accent.green.subtlest' | 'color.background.accent.green.subtler' | 'color.background.accent.green.subtle' | 'color.background.accent.green.bolder' | 'color.background.accent.teal.subtlest' | 'color.background.accent.teal.subtler' | 'color.background.accent.teal.subtle' | 'color.background.accent.teal.bolder' | 'color.background.accent.purple.subtlest' | 'color.background.accent.purple.subtler' | 'color.background.accent.purple.subtle' | 'color.background.accent.purple.bolder' | 'color.background.accent.magenta.subtlest' | 'color.background.accent.magenta.subtler' | 'color.background.accent.magenta.subtle' | 'color.background.accent.magenta.bolder' | 'color.background.accent.gray.subtlest' | 'color.background.accent.gray.subtler' | 'color.background.accent.gray.subtle' | 'color.background.accent.gray.bolder' | 'color.background.disabled' | 'color.background.inverse.subtle.[default]' | 'color.background.inverse.subtle.hovered' | 'color.background.inverse.subtle.pressed' | 'color.background.input.[default]' | 'color.background.input.hovered' | 'color.background.input.pressed' | 'color.background.neutral.[default].[default]' | 'color.background.neutral.[default].hovered' | 'color.background.neutral.[default].pressed' | 'color.background.neutral.subtle.[default]' | 'color.background.neutral.subtle.hovered' | 'color.background.neutral.subtle.pressed' | 'color.background.neutral.bold.[default]' | 'color.background.neutral.bold.hovered' | 'color.background.neutral.bold.pressed' | 'color.background.brand.bold.[default]' | 'color.background.brand.bold.hovered' | 'color.background.brand.bold.pressed' | 'color.background.selected.[default].[default]' | 'color.background.selected.[default].hovered' | 'color.background.selected.[default].pressed' | 'color.background.selected.bold.[default]' | 'color.background.selected.bold.hovered' | 'color.background.selected.bold.pressed' | 'color.background.danger.[default].[default]' | 'color.background.danger.[default].hovered' | 'color.background.danger.[default].pressed' | 'color.background.danger.bold.[default]' | 'color.background.danger.bold.hovered' | 'color.background.danger.bold.pressed' | 'color.background.warning.[default].[default]' | 'color.background.warning.[default].hovered' | 'color.background.warning.[default].pressed' | 'color.background.warning.bold.[default]' | 'color.background.warning.bold.hovered' | 'color.background.warning.bold.pressed' | 'color.background.success.[default].[default]' | 'color.background.success.[default].hovered' | 'color.background.success.[default].pressed' | 'color.background.success.bold.[default]' | 'color.background.success.bold.hovered' | 'color.background.success.bold.pressed' | 'color.background.discovery.[default].[default]' | 'color.background.discovery.[default].hovered' | 'color.background.discovery.[default].pressed' | 'color.background.discovery.bold.[default]' | 'color.background.discovery.bold.hovered' | 'color.background.discovery.bold.pressed' | 'color.background.information.[default].[default]' | 'color.background.information.[default].hovered' | 'color.background.information.[default].pressed' | 'color.background.information.bold.[default]' | 'color.background.information.bold.hovered' | 'color.background.information.bold.pressed' | 'color.blanket.[default]' | 'color.blanket.selected' | 'color.blanket.danger' | 'color.chart.brand.[default]' | 'color.chart.brand.hovered' | 'color.chart.neutral.[default]' | 'color.chart.neutral.hovered' | 'color.chart.success.[default].[default]' | 'color.chart.success.[default].hovered' | 'color.chart.success.bold.[default]' | 'color.chart.success.bold.hovered' | 'color.chart.danger.[default].[default]' | 'color.chart.danger.[default].hovered' | 'color.chart.danger.bold.[default]' | 'color.chart.danger.bold.hovered' | 'color.chart.warning.[default].[default]' | 'color.chart.warning.[default].hovered' | 'color.chart.warning.bold.[default]' | 'color.chart.warning.bold.hovered' | 'color.chart.information.[default].[default]' | 'color.chart.information.[default].hovered' | 'color.chart.information.bold.[default]' | 'color.chart.information.bold.hovered' | 'color.chart.discovery.[default].[default]' | 'color.chart.discovery.[default].hovered' | 'color.chart.discovery.bold.[default]' | 'color.chart.discovery.bold.hovered' | 'color.chart.categorical.1.[default]' | 'color.chart.categorical.1.hovered' | 'color.chart.categorical.2.[default]' | 'color.chart.categorical.2.hovered' | 'color.chart.categorical.3.[default]' | 'color.chart.categorical.3.hovered' | 'color.chart.categorical.4.[default]' | 'color.chart.categorical.4.hovered' | 'color.chart.categorical.5.[default]' | 'color.chart.categorical.5.hovered' | 'color.chart.categorical.6.[default]' | 'color.chart.categorical.6.hovered' | 'color.chart.categorical.7.[default]' | 'color.chart.categorical.7.hovered' | 'color.chart.categorical.8.[default]' | 'color.chart.categorical.8.hovered' | 'color.chart.blue.bold.[default]' | 'color.chart.blue.bold.hovered' | 'color.chart.blue.bolder.[default]' | 'color.chart.blue.bolder.hovered' | 'color.chart.blue.boldest.[default]' | 'color.chart.blue.boldest.hovered' | 'color.chart.red.bold.[default]' | 'color.chart.red.bold.hovered' | 'color.chart.red.bolder.[default]' | 'color.chart.red.bolder.hovered' | 'color.chart.red.boldest.[default]' | 'color.chart.red.boldest.hovered' | 'color.chart.orange.bold.[default]' | 'color.chart.orange.bold.hovered' | 'color.chart.orange.bolder.[default]' | 'color.chart.orange.bolder.hovered' | 'color.chart.orange.boldest.[default]' | 'color.chart.orange.boldest.hovered' | 'color.chart.yellow.bold.[default]' | 'color.chart.yellow.bold.hovered' | 'color.chart.yellow.bolder.[default]' | 'color.chart.yellow.bolder.hovered' | 'color.chart.yellow.boldest.[default]' | 'color.chart.yellow.boldest.hovered' | 'color.chart.green.bold.[default]' | 'color.chart.green.bold.hovered' | 'color.chart.green.bolder.[default]' | 'color.chart.green.bolder.hovered' | 'color.chart.green.boldest.[default]' | 'color.chart.green.boldest.hovered' | 'color.chart.teal.bold.[default]' | 'color.chart.teal.bold.hovered' | 'color.chart.teal.bolder.[default]' | 'color.chart.teal.bolder.hovered' | 'color.chart.teal.boldest.[default]' | 'color.chart.teal.boldest.hovered' | 'color.chart.purple.bold.[default]' | 'color.chart.purple.bold.hovered' | 'color.chart.purple.bolder.[default]' | 'color.chart.purple.bolder.hovered' | 'color.chart.purple.boldest.[default]' | 'color.chart.purple.boldest.hovered' | 'color.chart.magenta.bold.[default]' | 'color.chart.magenta.bold.hovered' | 'color.chart.magenta.bolder.[default]' | 'color.chart.magenta.bolder.hovered' | 'color.chart.magenta.boldest.[default]' | 'color.chart.magenta.boldest.hovered' | 'color.chart.gray.bold.[default]' | 'color.chart.gray.bold.hovered' | 'color.chart.gray.bolder.[default]' | 'color.chart.gray.bolder.hovered' | 'color.chart.gray.boldest.[default]' | 'color.chart.gray.boldest.hovered' | 'color.interaction.hovered' | 'color.interaction.pressed' | 'color.skeleton.[default]' | 'color.skeleton.subtle' | 'color.link.[default]' | 'color.link.pressed' | 'elevation.shadow.raised' | 'elevation.shadow.overflow.[default]' | 'elevation.shadow.overflow.spread' | 'elevation.shadow.overflow.perimeter' | 'elevation.shadow.overlay' | 'elevation.surface.[default].[default]' | 'elevation.surface.[default].hovered' | 'elevation.surface.[default].pressed' | 'elevation.surface.sunken' | 'elevation.surface.raised.[default]' | 'elevation.surface.raised.hovered' | 'elevation.surface.raised.pressed' | 'elevation.surface.overlay.[default]' | 'elevation.surface.overlay.hovered' | 'elevation.surface.overlay.pressed' | 'opacity.disabled' | 'opacity.loading' | 'utility.UNSAFE_util.transparent' | 'utility.UNSAFE_util.MISSING_TOKEN';
@@ -1,6 +0,0 @@
1
- /**
2
- * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
3
- * @codegen <<SignedSource::777e098e560f16035bf68a6da00217f2>>
4
- * @codegenCommand yarn build tokens
5
- */
6
- export type ActiveTokens = 'color.text.accent.blue' | 'color.text.accent.blue.bolder' | 'color.text.accent.red' | 'color.text.accent.red.bolder' | 'color.text.accent.orange' | 'color.text.accent.orange.bolder' | 'color.text.accent.yellow' | 'color.text.accent.yellow.bolder' | 'color.text.accent.green' | 'color.text.accent.green.bolder' | 'color.text.accent.purple' | 'color.text.accent.purple.bolder' | 'color.text.accent.teal' | 'color.text.accent.teal.bolder' | 'color.text.accent.magenta' | 'color.text.accent.magenta.bolder' | 'color.text.accent.gray' | 'color.text.accent.gray.bolder' | 'color.text' | 'color.text.subtle' | 'color.text.subtlest' | 'color.text.disabled' | 'color.text.inverse' | 'color.text.brand' | 'color.text.selected' | 'color.text.danger' | 'color.text.warning' | 'color.text.warning.inverse' | 'color.text.success' | 'color.text.discovery' | 'color.text.information' | 'color.icon.accent.blue' | 'color.icon.accent.red' | 'color.icon.accent.orange' | 'color.icon.accent.yellow' | 'color.icon.accent.green' | 'color.icon.accent.purple' | 'color.icon.accent.teal' | 'color.icon.accent.magenta' | 'color.icon.accent.gray' | 'color.icon' | 'color.icon.subtle' | 'color.icon.inverse' | 'color.icon.disabled' | 'color.icon.brand' | 'color.icon.selected' | 'color.icon.danger' | 'color.icon.warning' | 'color.icon.warning.inverse' | 'color.icon.success' | 'color.icon.discovery' | 'color.icon.information' | 'color.border.accent.blue' | 'color.border.accent.red' | 'color.border.accent.orange' | 'color.border.accent.yellow' | 'color.border.accent.green' | 'color.border.accent.purple' | 'color.border.accent.teal' | 'color.border.accent.magenta' | 'color.border.accent.gray' | 'color.border' | 'color.border.bold' | 'color.border.inverse' | 'color.border.focused' | 'color.border.input' | 'color.border.disabled' | 'color.border.brand' | 'color.border.selected' | 'color.border.danger' | 'color.border.warning' | 'color.border.success' | 'color.border.discovery' | 'color.border.information' | 'color.background.accent.blue.subtlest' | 'color.background.accent.blue.subtler' | 'color.background.accent.blue.subtle' | 'color.background.accent.blue.bolder' | 'color.background.accent.red.subtlest' | 'color.background.accent.red.subtler' | 'color.background.accent.red.subtle' | 'color.background.accent.red.bolder' | 'color.background.accent.orange.subtlest' | 'color.background.accent.orange.subtler' | 'color.background.accent.orange.subtle' | 'color.background.accent.orange.bolder' | 'color.background.accent.yellow.subtlest' | 'color.background.accent.yellow.subtler' | 'color.background.accent.yellow.subtle' | 'color.background.accent.yellow.bolder' | 'color.background.accent.green.subtlest' | 'color.background.accent.green.subtler' | 'color.background.accent.green.subtle' | 'color.background.accent.green.bolder' | 'color.background.accent.teal.subtlest' | 'color.background.accent.teal.subtler' | 'color.background.accent.teal.subtle' | 'color.background.accent.teal.bolder' | 'color.background.accent.purple.subtlest' | 'color.background.accent.purple.subtler' | 'color.background.accent.purple.subtle' | 'color.background.accent.purple.bolder' | 'color.background.accent.magenta.subtlest' | 'color.background.accent.magenta.subtler' | 'color.background.accent.magenta.subtle' | 'color.background.accent.magenta.bolder' | 'color.background.accent.gray.subtlest' | 'color.background.accent.gray.subtler' | 'color.background.accent.gray.subtle' | 'color.background.accent.gray.bolder' | 'color.background.disabled' | 'color.background.inverse.subtle' | 'color.background.inverse.subtle.hovered' | 'color.background.inverse.subtle.pressed' | 'color.background.input' | 'color.background.input.hovered' | 'color.background.input.pressed' | 'color.background.neutral' | 'color.background.neutral.hovered' | 'color.background.neutral.pressed' | 'color.background.neutral.subtle' | 'color.background.neutral.subtle.hovered' | 'color.background.neutral.subtle.pressed' | 'color.background.neutral.bold' | 'color.background.neutral.bold.hovered' | 'color.background.neutral.bold.pressed' | 'color.background.brand.bold' | 'color.background.brand.bold.hovered' | 'color.background.brand.bold.pressed' | 'color.background.selected' | 'color.background.selected.hovered' | 'color.background.selected.pressed' | 'color.background.selected.bold' | 'color.background.selected.bold.hovered' | 'color.background.selected.bold.pressed' | 'color.background.danger' | 'color.background.danger.hovered' | 'color.background.danger.pressed' | 'color.background.danger.bold' | 'color.background.danger.bold.hovered' | 'color.background.danger.bold.pressed' | 'color.background.warning' | 'color.background.warning.hovered' | 'color.background.warning.pressed' | 'color.background.warning.bold' | 'color.background.warning.bold.hovered' | 'color.background.warning.bold.pressed' | 'color.background.success' | 'color.background.success.hovered' | 'color.background.success.pressed' | 'color.background.success.bold' | 'color.background.success.bold.hovered' | 'color.background.success.bold.pressed' | 'color.background.discovery' | 'color.background.discovery.hovered' | 'color.background.discovery.pressed' | 'color.background.discovery.bold' | 'color.background.discovery.bold.hovered' | 'color.background.discovery.bold.pressed' | 'color.background.information' | 'color.background.information.hovered' | 'color.background.information.pressed' | 'color.background.information.bold' | 'color.background.information.bold.hovered' | 'color.background.information.bold.pressed' | 'color.blanket' | 'color.blanket.selected' | 'color.blanket.danger' | 'color.chart.brand' | 'color.chart.brand.hovered' | 'color.chart.neutral' | 'color.chart.neutral.hovered' | 'color.chart.success' | 'color.chart.success.hovered' | 'color.chart.success.bold' | 'color.chart.success.bold.hovered' | 'color.chart.danger' | 'color.chart.danger.hovered' | 'color.chart.danger.bold' | 'color.chart.danger.bold.hovered' | 'color.chart.warning' | 'color.chart.warning.hovered' | 'color.chart.warning.bold' | 'color.chart.warning.bold.hovered' | 'color.chart.information' | 'color.chart.information.hovered' | 'color.chart.information.bold' | 'color.chart.information.bold.hovered' | 'color.chart.discovery' | 'color.chart.discovery.hovered' | 'color.chart.discovery.bold' | 'color.chart.discovery.bold.hovered' | 'color.chart.categorical.1' | 'color.chart.categorical.1.hovered' | 'color.chart.categorical.2' | 'color.chart.categorical.2.hovered' | 'color.chart.categorical.3' | 'color.chart.categorical.3.hovered' | 'color.chart.categorical.4' | 'color.chart.categorical.4.hovered' | 'color.chart.categorical.5' | 'color.chart.categorical.5.hovered' | 'color.chart.categorical.6' | 'color.chart.categorical.6.hovered' | 'color.chart.categorical.7' | 'color.chart.categorical.7.hovered' | 'color.chart.categorical.8' | 'color.chart.categorical.8.hovered' | 'color.chart.blue.bold' | 'color.chart.blue.bold.hovered' | 'color.chart.blue.bolder' | 'color.chart.blue.bolder.hovered' | 'color.chart.blue.boldest' | 'color.chart.blue.boldest.hovered' | 'color.chart.red.bold' | 'color.chart.red.bold.hovered' | 'color.chart.red.bolder' | 'color.chart.red.bolder.hovered' | 'color.chart.red.boldest' | 'color.chart.red.boldest.hovered' | 'color.chart.orange.bold' | 'color.chart.orange.bold.hovered' | 'color.chart.orange.bolder' | 'color.chart.orange.bolder.hovered' | 'color.chart.orange.boldest' | 'color.chart.orange.boldest.hovered' | 'color.chart.yellow.bold' | 'color.chart.yellow.bold.hovered' | 'color.chart.yellow.bolder' | 'color.chart.yellow.bolder.hovered' | 'color.chart.yellow.boldest' | 'color.chart.yellow.boldest.hovered' | 'color.chart.green.bold' | 'color.chart.green.bold.hovered' | 'color.chart.green.bolder' | 'color.chart.green.bolder.hovered' | 'color.chart.green.boldest' | 'color.chart.green.boldest.hovered' | 'color.chart.teal.bold' | 'color.chart.teal.bold.hovered' | 'color.chart.teal.bolder' | 'color.chart.teal.bolder.hovered' | 'color.chart.teal.boldest' | 'color.chart.teal.boldest.hovered' | 'color.chart.purple.bold' | 'color.chart.purple.bold.hovered' | 'color.chart.purple.bolder' | 'color.chart.purple.bolder.hovered' | 'color.chart.purple.boldest' | 'color.chart.purple.boldest.hovered' | 'color.chart.magenta.bold' | 'color.chart.magenta.bold.hovered' | 'color.chart.magenta.bolder' | 'color.chart.magenta.bolder.hovered' | 'color.chart.magenta.boldest' | 'color.chart.magenta.boldest.hovered' | 'color.chart.gray.bold' | 'color.chart.gray.bold.hovered' | 'color.chart.gray.bolder' | 'color.chart.gray.bolder.hovered' | 'color.chart.gray.boldest' | 'color.chart.gray.boldest.hovered' | 'color.interaction.hovered' | 'color.interaction.pressed' | 'color.skeleton' | 'color.skeleton.subtle' | 'color.link' | 'color.link.pressed' | 'elevation.shadow.raised' | 'elevation.shadow.overflow' | 'elevation.shadow.overflow.spread' | 'elevation.shadow.overflow.perimeter' | 'elevation.shadow.overlay' | 'elevation.surface' | 'elevation.surface.hovered' | 'elevation.surface.pressed' | 'elevation.surface.sunken' | 'elevation.surface.raised' | 'elevation.surface.raised.hovered' | 'elevation.surface.raised.pressed' | 'elevation.surface.overlay' | 'elevation.surface.overlay.hovered' | 'elevation.surface.overlay.pressed' | 'opacity.disabled' | 'opacity.loading' | 'utility.UNSAFE_util.transparent' | 'utility.UNSAFE_util.MISSING_TOKEN';
@@ -1 +0,0 @@
1
- export { default } from './plugin';
@@ -1,29 +0,0 @@
1
- import { type NodePath } from '@babel/traverse';
2
- import * as t from '@babel/types';
3
- type DefaultColorTheme = 'light';
4
- export default function plugin(): {
5
- visitor: {
6
- Program?: undefined;
7
- };
8
- } | {
9
- visitor: {
10
- Program: {
11
- enter(path: NodePath<t.Program>, state: {
12
- opts: {
13
- /**
14
- * @default true
15
- */
16
- shouldUseAutoFallback?: boolean;
17
- /**
18
- * @default true
19
- */
20
- shouldForceAutoFallback?: boolean;
21
- forceAutoFallbackExemptions?: string[];
22
- defaultTheme?: DefaultColorTheme;
23
- };
24
- }): void;
25
- exit(path: NodePath<t.Program>): void;
26
- };
27
- };
28
- };
29
- export {};
@@ -1,9 +0,0 @@
1
- export declare const THEME_DATA_ATTRIBUTE = "data-theme";
2
- export declare const SUBTREE_THEME_ATTRIBUTE = "data-subtree-theme";
3
- export declare const COLOR_MODE_ATTRIBUTE = "data-color-mode";
4
- export declare const CONTRAST_MODE_ATTRIBUTE = "data-contrast-mode";
5
- export declare const CUSTOM_THEME_ATTRIBUTE = "data-custom-theme";
6
- export declare const CSS_PREFIX = "ds";
7
- export declare const CSS_VAR_FULL: string[];
8
- export declare const TOKEN_NOT_FOUND_CSS_VAR: '--ds-token-not-found';
9
- export declare const CURRENT_SURFACE_CSS_VAR: '--ds-elevation-surface-current';
@@ -1,6 +0,0 @@
1
- import { type ThemeOptionsSchema, type ThemeState } from './theme-config';
2
- export declare const CUSTOM_STYLE_ELEMENTS_SIZE_THRESHOLD = 10;
3
- export declare function loadAndAppendCustomThemeCss(themeState: Partial<ThemeState> & {
4
- UNSAFE_themeOptions: ThemeOptionsSchema;
5
- }): void;
6
- export { getCustomThemeStyles } from './get-custom-theme-styles';
@@ -1,26 +0,0 @@
1
- import { type UnbindFn } from 'bind-event-listener';
2
- import { type ThemeIdsWithOverrides, type ThemeState } from './theme-config';
3
- /**
4
- * Synchronously sets the theme globally at runtime. Themes are not loaded;
5
- * use `getThemeStyles` and other server-side utilities to generate and load them.
6
- *
7
- * @param {Object<string, string>} themeState The themes and color mode that should be applied.
8
- * @param {string} themeState.colorMode Determines which color theme is applied. If set to `auto`, the theme applied will be determined by the OS setting.
9
- * @param {string} themeState.dark The color theme to be applied when the color mode resolves to 'dark'.
10
- * @param {string} themeState.light The color theme to be applied when the color mode resolves to 'light'.
11
- * @param {string} themeState.motion The motion theme to be applied.
12
- * @param {string} themeState.shape The shape theme to be applied.
13
- * @param {string} themeState.spacing The spacing theme to be applied.
14
- * @param {string} themeState.typography The typography theme to be applied.
15
- * @param {Object} themeState.UNSAFE_themeOptions The custom branding options to be used for custom theme generation
16
- * @param {function} themeLoader Callback function used to override the default theme loading functionality.
17
- *
18
- * @returns An unbind function, that can be used to stop listening for changes to system theme.
19
- *
20
- * @example
21
- * ```
22
- * enableGlobalTheme({colorMode: 'auto', light: 'light', dark: 'dark', spacing: 'spacing'});
23
- * ```
24
- */
25
- declare const enableGlobalTheme: ({ colorMode, contrastMode, dark, light, motion, shape, spacing, typography, UNSAFE_themeOptions, }?: Partial<ThemeState>, themeLoader?: (id: ThemeIdsWithOverrides) => void) => UnbindFn;
26
- export default enableGlobalTheme;
@@ -1 +0,0 @@
1
- export { default as themeImportMap } from '../artifacts/theme-import-map';
@@ -1 +0,0 @@
1
- export type { ActiveTokens } from '../artifacts/types';
@@ -1 +0,0 @@
1
- export { default } from '../babel-plugin/plugin';
@@ -1 +0,0 @@
1
- export { COLOR_MODE_ATTRIBUTE, CURRENT_SURFACE_CSS_VAR, SUBTREE_THEME_ATTRIBUTE, THEME_DATA_ATTRIBUTE, } from '../constants';
@@ -1,165 +0,0 @@
1
- /**
2
- * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
3
- *
4
- * Strict design token based typedef representing a subset of safe CSS properties.
5
- *
6
- * @codegen <<SignedSource::385061141691039424c731ba496ba96a>>
7
- * @codegenCommand yarn build tokens
8
- */
9
- export type BackgroundColorHovered = 'var(--ds-background-accent-lime-subtlest-hovered)' | 'var(--ds-background-accent-lime-subtler-hovered)' | 'var(--ds-background-accent-lime-subtle-hovered)' | 'var(--ds-background-accent-lime-bolder-hovered)' | 'var(--ds-background-accent-red-subtlest-hovered)' | 'var(--ds-background-accent-red-subtler-hovered)' | 'var(--ds-background-accent-red-subtle-hovered)' | 'var(--ds-background-accent-red-bolder-hovered)' | 'var(--ds-background-accent-orange-subtlest-hovered)' | 'var(--ds-background-accent-orange-subtler-hovered)' | 'var(--ds-background-accent-orange-subtle-hovered)' | 'var(--ds-background-accent-orange-bolder-hovered)' | 'var(--ds-background-accent-yellow-subtlest-hovered)' | 'var(--ds-background-accent-yellow-subtler-hovered)' | 'var(--ds-background-accent-yellow-subtle-hovered)' | 'var(--ds-background-accent-yellow-bolder-hovered)' | 'var(--ds-background-accent-green-subtlest-hovered)' | 'var(--ds-background-accent-green-subtler-hovered)' | 'var(--ds-background-accent-green-subtle-hovered)' | 'var(--ds-background-accent-green-bolder-hovered)' | 'var(--ds-background-accent-teal-subtlest-hovered)' | 'var(--ds-background-accent-teal-subtler-hovered)' | 'var(--ds-background-accent-teal-subtle-hovered)' | 'var(--ds-background-accent-teal-bolder-hovered)' | 'var(--ds-background-accent-blue-subtlest-hovered)' | 'var(--ds-background-accent-blue-subtler-hovered)' | 'var(--ds-background-accent-blue-subtle-hovered)' | 'var(--ds-background-accent-blue-bolder-hovered)' | 'var(--ds-background-accent-purple-subtlest-hovered)' | 'var(--ds-background-accent-purple-subtler-hovered)' | 'var(--ds-background-accent-purple-subtle-hovered)' | 'var(--ds-background-accent-purple-bolder-hovered)' | 'var(--ds-background-accent-magenta-subtlest-hovered)' | 'var(--ds-background-accent-magenta-subtler-hovered)' | 'var(--ds-background-accent-magenta-subtle-hovered)' | 'var(--ds-background-accent-magenta-bolder-hovered)' | 'var(--ds-background-accent-gray-subtlest-hovered)' | 'var(--ds-background-accent-gray-subtler-hovered)' | 'var(--ds-background-accent-gray-subtle-hovered)' | 'var(--ds-background-accent-gray-bolder-hovered)' | 'var(--ds-background-input-hovered)' | 'var(--ds-background-inverse-subtle-hovered)' | 'var(--ds-background-neutral-hovered)' | 'var(--ds-background-neutral-subtle-hovered)' | 'var(--ds-background-neutral-bold-hovered)' | 'var(--ds-background-selected-hovered)' | 'var(--ds-background-selected-bold-hovered)' | 'var(--ds-background-brand-subtlest-hovered)' | 'var(--ds-background-brand-bold-hovered)' | 'var(--ds-background-brand-boldest-hovered)' | 'var(--ds-background-danger-hovered)' | 'var(--ds-background-danger-subtler-hovered)' | 'var(--ds-background-danger-bold-hovered)' | 'var(--ds-background-warning-hovered)' | 'var(--ds-background-warning-subtler-hovered)' | 'var(--ds-background-warning-bold-hovered)' | 'var(--ds-background-success-hovered)' | 'var(--ds-background-success-subtler-hovered)' | 'var(--ds-background-success-bold-hovered)' | 'var(--ds-background-discovery-hovered)' | 'var(--ds-background-discovery-subtler-hovered)' | 'var(--ds-background-discovery-bold-hovered)' | 'var(--ds-background-information-hovered)' | 'var(--ds-background-information-subtler-hovered)' | 'var(--ds-background-information-bold-hovered)' | 'var(--ds-rovo-background-brand-bold-hovered)' | 'var(--ds-surface-hovered)' | 'var(--ds-surface-overlay-hovered)' | 'var(--ds-surface-raised-hovered)';
10
- export type BackgroundColorPressed = 'var(--ds-background-accent-lime-subtlest-pressed)' | 'var(--ds-background-accent-lime-subtler-pressed)' | 'var(--ds-background-accent-lime-subtle-pressed)' | 'var(--ds-background-accent-lime-bolder-pressed)' | 'var(--ds-background-accent-red-subtlest-pressed)' | 'var(--ds-background-accent-red-subtler-pressed)' | 'var(--ds-background-accent-red-subtle-pressed)' | 'var(--ds-background-accent-red-bolder-pressed)' | 'var(--ds-background-accent-orange-subtlest-pressed)' | 'var(--ds-background-accent-orange-subtler-pressed)' | 'var(--ds-background-accent-orange-subtle-pressed)' | 'var(--ds-background-accent-orange-bolder-pressed)' | 'var(--ds-background-accent-yellow-subtlest-pressed)' | 'var(--ds-background-accent-yellow-subtler-pressed)' | 'var(--ds-background-accent-yellow-subtle-pressed)' | 'var(--ds-background-accent-yellow-bolder-pressed)' | 'var(--ds-background-accent-green-subtlest-pressed)' | 'var(--ds-background-accent-green-subtler-pressed)' | 'var(--ds-background-accent-green-subtle-pressed)' | 'var(--ds-background-accent-green-bolder-pressed)' | 'var(--ds-background-accent-teal-subtlest-pressed)' | 'var(--ds-background-accent-teal-subtler-pressed)' | 'var(--ds-background-accent-teal-subtle-pressed)' | 'var(--ds-background-accent-teal-bolder-pressed)' | 'var(--ds-background-accent-blue-subtlest-pressed)' | 'var(--ds-background-accent-blue-subtler-pressed)' | 'var(--ds-background-accent-blue-subtle-pressed)' | 'var(--ds-background-accent-blue-bolder-pressed)' | 'var(--ds-background-accent-purple-subtlest-pressed)' | 'var(--ds-background-accent-purple-subtler-pressed)' | 'var(--ds-background-accent-purple-subtle-pressed)' | 'var(--ds-background-accent-purple-bolder-pressed)' | 'var(--ds-background-accent-magenta-subtlest-pressed)' | 'var(--ds-background-accent-magenta-subtler-pressed)' | 'var(--ds-background-accent-magenta-subtle-pressed)' | 'var(--ds-background-accent-magenta-bolder-pressed)' | 'var(--ds-background-accent-gray-subtlest-pressed)' | 'var(--ds-background-accent-gray-subtler-pressed)' | 'var(--ds-background-accent-gray-subtle-pressed)' | 'var(--ds-background-accent-gray-bolder-pressed)' | 'var(--ds-background-input-pressed)' | 'var(--ds-background-inverse-subtle-pressed)' | 'var(--ds-background-neutral-pressed)' | 'var(--ds-background-neutral-subtle-pressed)' | 'var(--ds-background-neutral-bold-pressed)' | 'var(--ds-background-selected-pressed)' | 'var(--ds-background-selected-bold-pressed)' | 'var(--ds-background-brand-subtlest-pressed)' | 'var(--ds-background-brand-bold-pressed)' | 'var(--ds-background-brand-boldest-pressed)' | 'var(--ds-background-danger-pressed)' | 'var(--ds-background-danger-subtler-pressed)' | 'var(--ds-background-danger-bold-pressed)' | 'var(--ds-background-warning-pressed)' | 'var(--ds-background-warning-subtler-pressed)' | 'var(--ds-background-warning-bold-pressed)' | 'var(--ds-background-success-pressed)' | 'var(--ds-background-success-subtler-pressed)' | 'var(--ds-background-success-bold-pressed)' | 'var(--ds-background-discovery-pressed)' | 'var(--ds-background-discovery-subtler-pressed)' | 'var(--ds-background-discovery-bold-pressed)' | 'var(--ds-background-information-pressed)' | 'var(--ds-background-information-subtler-pressed)' | 'var(--ds-background-information-bold-pressed)' | 'var(--ds-rovo-background-brand-bold-pressed)' | 'var(--ds-surface-pressed)' | 'var(--ds-surface-overlay-pressed)' | 'var(--ds-surface-raised-pressed)';
11
- export type BackgroundColor = 'transparent' | 'currentcolor' | BackgroundColorHovered | BackgroundColorPressed | 'var(--ds-background-accent-lime-subtlest)' | 'var(--ds-background-accent-lime-subtler)' | 'var(--ds-background-accent-lime-subtle)' | 'var(--ds-background-accent-lime-bolder)' | 'var(--ds-background-accent-red-subtlest)' | 'var(--ds-background-accent-red-subtler)' | 'var(--ds-background-accent-red-subtle)' | 'var(--ds-background-accent-red-bolder)' | 'var(--ds-background-accent-orange-subtlest)' | 'var(--ds-background-accent-orange-subtler)' | 'var(--ds-background-accent-orange-subtle)' | 'var(--ds-background-accent-orange-bolder)' | 'var(--ds-background-accent-yellow-subtlest)' | 'var(--ds-background-accent-yellow-subtler)' | 'var(--ds-background-accent-yellow-subtle)' | 'var(--ds-background-accent-yellow-bolder)' | 'var(--ds-background-accent-green-subtlest)' | 'var(--ds-background-accent-green-subtler)' | 'var(--ds-background-accent-green-subtle)' | 'var(--ds-background-accent-green-bolder)' | 'var(--ds-background-accent-teal-subtlest)' | 'var(--ds-background-accent-teal-subtler)' | 'var(--ds-background-accent-teal-subtle)' | 'var(--ds-background-accent-teal-bolder)' | 'var(--ds-background-accent-blue-subtlest)' | 'var(--ds-background-accent-blue-subtler)' | 'var(--ds-background-accent-blue-subtle)' | 'var(--ds-background-accent-blue-bolder)' | 'var(--ds-background-accent-purple-subtlest)' | 'var(--ds-background-accent-purple-subtler)' | 'var(--ds-background-accent-purple-subtle)' | 'var(--ds-background-accent-purple-bolder)' | 'var(--ds-background-accent-magenta-subtlest)' | 'var(--ds-background-accent-magenta-subtler)' | 'var(--ds-background-accent-magenta-subtle)' | 'var(--ds-background-accent-magenta-bolder)' | 'var(--ds-background-accent-gray-subtlest)' | 'var(--ds-background-accent-gray-subtler)' | 'var(--ds-background-accent-gray-subtle)' | 'var(--ds-background-accent-gray-bolder)' | 'var(--ds-background-disabled)' | 'var(--ds-background-input)' | 'var(--ds-background-inverse-subtle)' | 'var(--ds-background-neutral)' | 'var(--ds-background-neutral-subtle)' | 'var(--ds-background-neutral-bold)' | 'var(--ds-background-selected)' | 'var(--ds-background-selected-bold)' | 'var(--ds-background-brand-subtlest)' | 'var(--ds-background-brand-bold)' | 'var(--ds-background-brand-boldest)' | 'var(--ds-background-danger)' | 'var(--ds-background-danger-subtler)' | 'var(--ds-background-danger-subtle)' | 'var(--ds-background-danger-bold)' | 'var(--ds-background-warning)' | 'var(--ds-background-warning-subtler)' | 'var(--ds-background-warning-subtle)' | 'var(--ds-background-warning-bold)' | 'var(--ds-background-success)' | 'var(--ds-background-success-subtler)' | 'var(--ds-background-success-subtle)' | 'var(--ds-background-success-bold)' | 'var(--ds-background-discovery)' | 'var(--ds-background-discovery-subtler)' | 'var(--ds-background-discovery-subtle)' | 'var(--ds-background-discovery-bold)' | 'var(--ds-background-information)' | 'var(--ds-background-information-subtler)' | 'var(--ds-background-information-subtle)' | 'var(--ds-background-information-bold)' | 'var(--ds-skeleton)' | 'var(--ds-skeleton-subtle)' | 'var(--ds-rovo-background-brand-bold)' | 'var(--ds-surface)' | 'var(--ds-surface-overlay)' | 'var(--ds-surface-raised)' | 'var(--ds-surface-sunken)' | 'var(--ds-elevation-surface-current)';
12
- export type FontShorthand = 'var(--ds-font-heading-xxlarge)' | 'var(--ds-font-heading-xlarge)' | 'var(--ds-font-heading-large)' | 'var(--ds-font-heading-medium)' | 'var(--ds-font-heading-small)' | 'var(--ds-font-heading-xsmall)' | 'var(--ds-font-heading-xxsmall)' | 'var(--ds-font-body-large)' | 'var(--ds-font-body)' | 'var(--ds-font-body-small)' | 'var(--ds-font-metric-large)' | 'var(--ds-font-metric-medium)' | 'var(--ds-font-metric-small)' | 'var(--ds-font-code)';
13
- export type IconColorPressed = 'var(--ds-link-pressed)' | 'var(--ds-link-visited-pressed)';
14
- export type IconColor = IconColorPressed | 'var(--ds-icon)' | 'var(--ds-icon-accent-lime)' | 'var(--ds-icon-accent-red)' | 'var(--ds-icon-accent-orange)' | 'var(--ds-icon-accent-yellow)' | 'var(--ds-icon-accent-green)' | 'var(--ds-icon-accent-teal)' | 'var(--ds-icon-accent-blue)' | 'var(--ds-icon-accent-purple)' | 'var(--ds-icon-accent-magenta)' | 'var(--ds-icon-accent-gray)' | 'var(--ds-icon-disabled)' | 'var(--ds-icon-inverse)' | 'var(--ds-icon-selected)' | 'var(--ds-icon-brand)' | 'var(--ds-icon-danger)' | 'var(--ds-icon-warning)' | 'var(--ds-icon-warning-inverse)' | 'var(--ds-icon-success)' | 'var(--ds-icon-discovery)' | 'var(--ds-icon-information)' | 'var(--ds-icon-subtlest)' | 'var(--ds-icon-subtle)' | 'var(--ds-link)' | 'var(--ds-link-visited)' | 'var(--ds-rovo-icon-lime)' | 'var(--ds-rovo-icon-saffron)' | 'var(--ds-rovo-icon-blue)' | 'var(--ds-rovo-icon-purple)';
15
- export type BorderColor = 'transparent' | 'var(--ds-border)' | 'var(--ds-border-accent-lime)' | 'var(--ds-border-accent-lime-subtle)' | 'var(--ds-border-accent-red)' | 'var(--ds-border-accent-red-subtle)' | 'var(--ds-border-accent-orange)' | 'var(--ds-border-accent-orange-subtle)' | 'var(--ds-border-accent-yellow)' | 'var(--ds-border-accent-yellow-subtle)' | 'var(--ds-border-accent-green)' | 'var(--ds-border-accent-green-subtle)' | 'var(--ds-border-accent-teal)' | 'var(--ds-border-accent-teal-subtle)' | 'var(--ds-border-accent-blue)' | 'var(--ds-border-accent-blue-subtle)' | 'var(--ds-border-accent-purple)' | 'var(--ds-border-accent-purple-subtle)' | 'var(--ds-border-accent-magenta)' | 'var(--ds-border-accent-magenta-subtle)' | 'var(--ds-border-accent-gray)' | 'var(--ds-border-accent-gray-subtle)' | 'var(--ds-border-disabled)' | 'var(--ds-border-focused)' | 'var(--ds-border-input)' | 'var(--ds-border-inverse)' | 'var(--ds-border-selected)' | 'var(--ds-border-brand)' | 'var(--ds-border-danger)' | 'var(--ds-border-danger-subtle)' | 'var(--ds-border-warning)' | 'var(--ds-border-warning-subtle)' | 'var(--ds-border-success)' | 'var(--ds-border-success-subtle)' | 'var(--ds-border-discovery)' | 'var(--ds-border-discovery-subtle)' | 'var(--ds-border-information)' | 'var(--ds-border-information-subtle)' | 'var(--ds-border-bold)' | 'var(--ds-rovo-border-lime)' | 'var(--ds-rovo-border-saffron)' | 'var(--ds-rovo-border-blue)' | 'var(--ds-rovo-border-purple)';
16
- export type BorderRadius = 'var(--ds-radius-xsmall)' | 'var(--ds-radius-small)' | 'var(--ds-radius-medium)' | 'var(--ds-radius-large)' | 'var(--ds-radius-xlarge)' | 'var(--ds-radius-xxlarge)' | 'var(--ds-radius-full)' | 'var(--ds-radius-tile)' | 0 | '0' | 'inherit';
17
- export type BorderWidth = 'var(--ds-border-width)' | 'var(--ds-border-width-selected)' | 'var(--ds-border-width-focused)' | 0 | '0';
18
- export type BorderShorthand = 'none' | `${BorderWidth} solid ${BorderColor}`;
19
- type NumericSize = `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}%`;
20
- export type SizeIntrinsic = 'min-content' | 'max-content' | 'fit-content' | 'auto' | NumericSize | `min(${NumericSize}, ${NumericSize})` | `max(${NumericSize}, ${NumericSize})` | 0 | '0';
21
- export type Space = 'var(--ds-space-0)' | 'var(--ds-space-025)' | 'var(--ds-space-050)' | 'var(--ds-space-075)' | 'var(--ds-space-100)' | 'var(--ds-space-150)' | 'var(--ds-space-200)' | 'var(--ds-space-250)' | 'var(--ds-space-300)' | 'var(--ds-space-400)' | 'var(--ds-space-500)' | 'var(--ds-space-600)' | 'var(--ds-space-800)' | 'var(--ds-space-1000)' | 'var(--ds-space-negative-025)' | 'var(--ds-space-negative-050)' | 'var(--ds-space-negative-075)' | 'var(--ds-space-negative-100)' | 'var(--ds-space-negative-150)' | 'var(--ds-space-negative-200)' | 'var(--ds-space-negative-250)' | 'var(--ds-space-negative-300)' | 'var(--ds-space-negative-400)' | 0 | '0';
22
- export type SpaceMargin = Space | 'auto' | '0 auto';
23
- export type SpaceInset = Space | '50%';
24
- export type Shadow = 'var(--ds-shadow-overflow)' | 'var(--ds-shadow-overflow-perimeter)' | 'var(--ds-shadow-overflow-spread)' | 'var(--ds-shadow-overlay)' | 'var(--ds-shadow-raised)' | 'initial';
25
- export type TextColorPressed = 'var(--ds-link-pressed)' | 'var(--ds-link-visited-pressed)';
26
- export type TextColor = 'transparent' | TextColorPressed | 'var(--ds-text)' | 'var(--ds-text-accent-lime)' | 'var(--ds-text-accent-lime-bolder)' | 'var(--ds-text-accent-red)' | 'var(--ds-text-accent-red-bolder)' | 'var(--ds-text-accent-orange)' | 'var(--ds-text-accent-orange-bolder)' | 'var(--ds-text-accent-yellow)' | 'var(--ds-text-accent-yellow-bolder)' | 'var(--ds-text-accent-green)' | 'var(--ds-text-accent-green-bolder)' | 'var(--ds-text-accent-teal)' | 'var(--ds-text-accent-teal-bolder)' | 'var(--ds-text-accent-blue)' | 'var(--ds-text-accent-blue-bolder)' | 'var(--ds-text-accent-purple)' | 'var(--ds-text-accent-purple-bolder)' | 'var(--ds-text-accent-magenta)' | 'var(--ds-text-accent-magenta-bolder)' | 'var(--ds-text-accent-gray)' | 'var(--ds-text-accent-gray-bolder)' | 'var(--ds-text-disabled)' | 'var(--ds-text-inverse)' | 'var(--ds-text-selected)' | 'var(--ds-text-brand)' | 'var(--ds-text-danger)' | 'var(--ds-text-danger-bolder)' | 'var(--ds-text-warning)' | 'var(--ds-text-warning-inverse)' | 'var(--ds-text-warning-bolder)' | 'var(--ds-text-success)' | 'var(--ds-text-success-bolder)' | 'var(--ds-text-discovery)' | 'var(--ds-text-discovery-bolder)' | 'var(--ds-text-information)' | 'var(--ds-text-information-bolder)' | 'var(--ds-text-subtlest)' | 'var(--ds-text-subtle)' | 'var(--ds-link)' | 'var(--ds-link-visited)';
27
- export type Opacity = 'var(--ds-opacity-disabled)' | 'var(--ds-opacity-loading)' | 0 | 1 | '0' | '1';
28
- export type FontWeight = 'var(--ds-font-weight-regular)' | 'var(--ds-font-weight-medium)' | 'var(--ds-font-weight-semibold)' | 'var(--ds-font-weight-bold)' | 'inherit' | 'initial' | 'unset';
29
- export type FontFamily = 'var(--ds-font-family-heading)' | 'var(--ds-font-family-body)' | 'var(--ds-font-family-code)' | 'var(--ds-font-family-brand-heading)' | 'var(--ds-font-family-brand-body)';
30
- export type MotionDuration = 'var(--ds-duration-instant)' | 'var(--ds-duration-long)' | 'var(--ds-duration-medium)' | 'var(--ds-duration-short)' | 'var(--ds-duration-xlong)' | 'var(--ds-duration-xshort)' | 'var(--ds-duration-xxlong)' | 'var(--ds-duration-xxshort)';
31
- export type MotionEasing = 'var(--ds-easing-in-practical)' | 'var(--ds-easing-inout-bold)' | 'var(--ds-easing-out-practical)' | 'var(--ds-easing-out-bold)' | 'var(--ds-easing-spring)';
32
- export type MotionKeyframes = 'var(--ds-keyframe-fade-in)' | 'var(--ds-keyframe-fade-out)' | 'var(--ds-keyframe-scale-in-medium)' | 'var(--ds-keyframe-scale-in-small)' | 'var(--ds-keyframe-scale-out-medium)' | 'var(--ds-keyframe-scale-out-small)' | 'var(--ds-keyframe-slide-in-bottom-short)' | 'var(--ds-keyframe-slide-in-left-half)' | 'var(--ds-keyframe-slide-in-left-short)' | 'var(--ds-keyframe-slide-in-right-short)' | 'var(--ds-keyframe-slide-in-top-short)' | 'var(--ds-keyframe-slide-out-bottom-short)' | 'var(--ds-keyframe-slide-out-left-half)' | 'var(--ds-keyframe-slide-out-left-short)' | 'var(--ds-keyframe-slide-out-right-short)' | 'var(--ds-keyframe-slide-out-top-short)';
33
- export type Motion = 'var(--ds-avatar-enter)' | 'var(--ds-avatar-exit)' | 'var(--ds-avatar-hovered)' | 'var(--ds-blanket-enter)' | 'var(--ds-blanket-exit)' | 'var(--ds-flag-enter)' | 'var(--ds-flag-exit)' | 'var(--ds-flag-reposition)' | 'var(--ds-modal-enter)' | 'var(--ds-modal-exit)' | 'var(--ds-popup-enter-bottom)' | 'var(--ds-popup-enter-left)' | 'var(--ds-popup-enter-right)' | 'var(--ds-popup-enter-top)' | 'var(--ds-popup-exit-bottom)' | 'var(--ds-popup-exit-left)' | 'var(--ds-popup-exit-right)' | 'var(--ds-popup-exit-top)' | 'var(--ds-spotlight-enter)' | 'var(--ds-spotlight-exit)';
34
- export interface CSSPropertiesHovered {
35
- backgroundColor: BackgroundColorHovered;
36
- }
37
- export interface CSSPropertiesActive {
38
- backgroundColor: BackgroundColorPressed;
39
- color: TextColorPressed;
40
- }
41
- export interface DesignTokenStyles {
42
- '&:active': CSSPropertiesActive;
43
- '&:hover': CSSPropertiesHovered;
44
- border: BorderShorthand;
45
- borderBlock: BorderShorthand;
46
- borderBlockEnd: BorderShorthand;
47
- borderBlockStart: BorderShorthand;
48
- borderBottom: BorderShorthand;
49
- borderInline: BorderShorthand;
50
- borderInlineEnd: BorderShorthand;
51
- borderInlineStart: BorderShorthand;
52
- borderLeft: BorderShorthand;
53
- borderRight: BorderShorthand;
54
- borderTop: BorderShorthand;
55
- appearance: 'none' | 'auto';
56
- background: never;
57
- backgroundColor: BackgroundColor;
58
- blockSize: SizeIntrinsic;
59
- borderBlockColor: BorderColor;
60
- borderBlockEndColor: BorderColor;
61
- borderBlockEndWidth: BorderWidth;
62
- borderBlockStartColor: BorderColor;
63
- borderBlockStartWidth: BorderWidth;
64
- borderBlockWidth: BorderWidth;
65
- borderBottomColor: BorderColor;
66
- borderBottomLeftRadius: BorderRadius;
67
- borderBottomRightRadius: BorderRadius;
68
- borderBottomWidth: BorderWidth;
69
- borderColor: BorderColor;
70
- borderEndEndRadius: BorderRadius;
71
- borderEndStartRadius: BorderRadius;
72
- borderInlineColor: BorderColor;
73
- borderInlineEndColor: BorderColor;
74
- borderInlineEndWidth: BorderWidth;
75
- borderInlineStartColor: BorderColor;
76
- borderInlineStartWidth: BorderWidth;
77
- borderInlineWidth: BorderWidth;
78
- borderLeftColor: BorderColor;
79
- borderLeftWidth: BorderWidth;
80
- borderRadius: BorderRadius;
81
- borderRightColor: BorderColor;
82
- borderRightWidth: BorderWidth;
83
- borderStartEndRadius: BorderRadius;
84
- borderStartStartRadius: BorderRadius;
85
- borderTopColor: BorderColor;
86
- borderTopLeftRadius: BorderRadius;
87
- borderTopRightRadius: BorderRadius;
88
- borderTopWidth: BorderWidth;
89
- borderWidth: BorderWidth;
90
- bottom: SpaceInset;
91
- boxShadow: Shadow;
92
- boxSizing: 'border-box';
93
- clear: never;
94
- clip: never;
95
- color: TextColor;
96
- columnGap: Space;
97
- container: never;
98
- containerName: never;
99
- containerType: never;
100
- float: never;
101
- font: FontShorthand;
102
- fontFamily: FontFamily;
103
- fontSize: never;
104
- fontSizeAdjust: never;
105
- fontStyle: 'normal' | 'italic';
106
- fontWeight: FontWeight;
107
- gap: Space;
108
- height: SizeIntrinsic;
109
- inlineSize: SizeIntrinsic;
110
- inset: SpaceInset;
111
- insetBlock: SpaceInset;
112
- insetBlockEnd: SpaceInset;
113
- insetBlockStart: SpaceInset;
114
- insetInline: SpaceInset;
115
- insetInlineEnd: SpaceInset;
116
- insetInlineStart: SpaceInset;
117
- left: SpaceInset;
118
- letterSpacing: never;
119
- lineHeight: never;
120
- lineHeightStep: never;
121
- margin: SpaceMargin;
122
- marginBlock: SpaceMargin;
123
- marginBlockEnd: SpaceMargin;
124
- marginBlockStart: SpaceMargin;
125
- marginBottom: SpaceMargin;
126
- marginInline: SpaceMargin;
127
- marginInlineEnd: SpaceMargin;
128
- marginInlineStart: SpaceMargin;
129
- marginLeft: SpaceMargin;
130
- marginRight: SpaceMargin;
131
- marginTop: SpaceMargin;
132
- maxBlockSize: SizeIntrinsic;
133
- maxHeight: SizeIntrinsic;
134
- maxInlineSize: SizeIntrinsic;
135
- maxWidth: SizeIntrinsic;
136
- minBlockSize: SizeIntrinsic;
137
- minHeight: SizeIntrinsic;
138
- minInlineSize: SizeIntrinsic;
139
- minWidth: SizeIntrinsic;
140
- opacity: Opacity;
141
- outlineColor: BorderColor;
142
- outlineOffset: Space;
143
- outlineWidth: BorderWidth;
144
- overflowWrap: 'normal' | 'break-word' | 'anywhere';
145
- overlay: never;
146
- padding: Space;
147
- paddingBlock: Space;
148
- paddingBlockEnd: Space;
149
- paddingBlockStart: Space;
150
- paddingBottom: Space;
151
- paddingInline: Space;
152
- paddingInlineEnd: Space;
153
- paddingInlineStart: Space;
154
- paddingLeft: Space;
155
- paddingRight: Space;
156
- paddingTop: Space;
157
- right: SpaceInset;
158
- rowGap: Space;
159
- textDecorationLine: 'line-through' | 'underline';
160
- top: SpaceInset;
161
- userModify: never;
162
- width: SizeIntrinsic;
163
- zIndex: -1 | 0 | 1 | 100 | 200 | 300 | 400 | 500 | 510 | 600 | 700 | 800;
164
- }
165
- export {};
@@ -1 +0,0 @@
1
- export { default as UNSAFE_loadCustomThemeStyles } from '../load-custom-theme-styles';
@@ -1 +0,0 @@
1
- export { default as enableGlobalTheme } from '../enable-global-theme';
@@ -1 +0,0 @@
1
- export { default as getGlobalTheme } from '../get-global-theme';
@@ -1 +0,0 @@
1
- export { default as getSSRAutoScript } from '../get-ssr-auto-script';
@@ -1 +0,0 @@
1
- export { default as getThemeHtmlAttrs } from '../get-theme-html-attrs';
@@ -1 +0,0 @@
1
- export { default as getThemeStyles } from '../get-theme-styles';
@@ -1 +0,0 @@
1
- export { default as getTokenValue } from '../get-token-value';
@@ -1 +0,0 @@
1
- export { default as token } from '../get-token';
@@ -1,2 +0,0 @@
1
- export { default } from '../artifacts/palettes-raw/palette';
2
- export { default as typographyPalette } from '../artifacts/palettes-raw/typography-palette';
@@ -1 +0,0 @@
1
- export { default } from '../artifacts/replacement-mapping';
@@ -1 +0,0 @@
1
- export { default as setGlobalTheme } from '../set-global-theme';
@@ -1,2 +0,0 @@
1
- export { default as themeConfig } from '../theme-config';
2
- export type { ThemeColorModes, ThemeContrastModes, Themes, ThemeFileNames, ThemeIds, ThemeOptionsSchema, ThemeState, ActiveThemeState, } from '../theme-config';
@@ -1 +0,0 @@
1
- export { default as ThemeMutationObserver } from '../theme-mutation-observer';
@@ -1,2 +0,0 @@
1
- export { themeStringToObject } from '../theme-string-to-object';
2
- export { themeObjectToString } from '../theme-object-to-string';
@@ -1 +0,0 @@
1
- export { default } from '../artifacts/token-default-values';
@@ -1 +0,0 @@
1
- export { getCSSCustomProperty, getTokenId, getFullyQualifiedTokenId } from '../utils/token-ids';
@@ -1,19 +0,0 @@
1
- /**
2
- * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
3
- *
4
- * Metadata for generation of `@atlaskit/ads-mcp` and https://atlassian.design/llms-tokens.txt.
5
- *
6
- * @codegen <<SignedSource::b26e4203c4b2d7818ff4ff30fb0f40cf>>
7
- * @codegenCommand yarn build tokens
8
- */
9
- export interface Token {
10
- name: string;
11
- path: string[];
12
- description: string;
13
- exampleValue?: string | number;
14
- usageGuidelines: {
15
- usage: string;
16
- cssProperties: string[];
17
- };
18
- }
19
- export declare const tokens: Token[];
@@ -1,2 +0,0 @@
1
- export { default } from '../artifacts/token-names';
2
- export type { CSSToken, CSSTokenMap } from '../artifacts/token-names';
@@ -1 +0,0 @@
1
- export { tokenOrder } from '../utils/token-order';
@@ -1,6 +0,0 @@
1
- export { default as light } from '../artifacts/tokens-raw/atlassian-light';
2
- export { default as dark } from '../artifacts/tokens-raw/atlassian-dark';
3
- export { default as spacing } from '../artifacts/tokens-raw/atlassian-spacing';
4
- export { default as typography } from '../artifacts/tokens-raw/atlassian-typography';
5
- export { default as shape } from '../artifacts/tokens-raw/atlassian-shape';
6
- export { default as motion } from '../artifacts/tokens-raw/atlassian-motion';
@@ -1 +0,0 @@
1
- export type { FontFamilyToken, FontWeightToken, Groups, OpacityToken, PaintToken, RawToken, ShadowToken, SpacingToken, ShapeToken, TypographyToken, MotionToken, } from '../types';
@@ -1 +0,0 @@
1
- export { default as useThemeObserver } from '../use-theme-observer';
@@ -1,16 +0,0 @@
1
- import { type ThemeStyles } from './get-theme-styles';
2
- import { type ThemeOptionsSchema, type ThemeState } from './theme-config';
3
- /**
4
- * Takes a color mode and custom branding options, and returns an array of objects for use in applying custom styles to the document head.
5
- * Only supplies the color themes necessary for initial render, based on the current themeState. I.e. if in light mode, dark mode themes are not returned.
6
- *
7
- * @param {Object<string, string>} themeState The themes and color mode that should be applied.
8
- * @param {string} themeState.colorMode Determines which color theme is applied
9
- * @param {Object} themeState.UNSAFE_themeOptions The custom branding options to be used for custom theme generation
10
- *
11
- * @returns An object array, containing theme IDs, data-attributes to attach to the theme, and the theme CSS.
12
- * If an error is encountered while loading themes, the themes array will be empty.
13
- */
14
- export declare function getCustomThemeStyles(themeState: Partial<ThemeState> & {
15
- UNSAFE_themeOptions: ThemeOptionsSchema;
16
- }): ThemeStyles[];
@@ -1,3 +0,0 @@
1
- import type { ActiveThemeState } from './theme-config';
2
- declare const getGlobalTheme: () => Partial<ActiveThemeState>;
3
- export default getGlobalTheme;
@@ -1,11 +0,0 @@
1
- import { type ThemeState } from './theme-config';
2
- /**
3
- * Provides a script that, when executed before paint, sets the `data-color-mode` attribute based on the current system theme,
4
- * to enable SSR support for automatic theme switching, avoid a flash of un-themed content on first paint.
5
- *
6
- * @param {string} colorMode Determines which color theme is applied. If set to `auto`, the theme applied will be determined by the OS setting.
7
- *
8
- * @returns {string} A string to be added to the innerHTML of a script tag in the document head
9
- */
10
- declare const getSSRAutoScript: (colorMode: ThemeState["colorMode"], contrastMode?: ThemeState["contrastMode"]) => string | undefined;
11
- export default getSSRAutoScript;
@@ -1,18 +0,0 @@
1
- import { type ThemeState } from './theme-config';
2
- /**
3
- * Server-side rendering utility. Generates the valid HTML attributes for a given theme.
4
- * Note: this utility does not handle automatic theme switching.
5
- *
6
- * @param {Object<string, string>} themeOptions - Theme options object
7
- * @param {string} themeState.colorMode Determines which color theme is applied. If set to `auto`, the theme applied will be determined by the OS setting.
8
- * @param {string} themeState.dark The color theme to be applied when the color mode resolves to 'dark'.
9
- * @param {string} themeState.light The color theme to be applied when the color mode resolves to 'light'.
10
- * @param {string} themeState.motion The motion theme to be applied.
11
- * @param {string} themeState.spacing The spacing theme to be applied.
12
- * @param {string} themeState.typography The typography theme to be applied.
13
- * @param {Object} themeState.UNSAFE_themeOptions The custom branding options to be used for custom theme generation
14
- *
15
- * @returns {Object} Object of HTML attributes to be applied to the document root
16
- */
17
- declare const getThemeHtmlAttrs: ({ colorMode, dark, light, contrastMode, motion, shape, spacing, typography, UNSAFE_themeOptions, }?: Partial<ThemeState>) => Record<string, string>;
18
- export default getThemeHtmlAttrs;
@@ -1,25 +0,0 @@
1
- import { type ThemeIdsWithOverrides, type ThemeState } from './theme-config';
2
- export interface ThemeStyles {
3
- id: ThemeIdsWithOverrides;
4
- attrs: Record<string, string>;
5
- css: string;
6
- }
7
- /**
8
- * Takes an object containing theme preferences, and returns an array of objects for use in applying styles to the document head.
9
- * Only supplies the color themes necessary for initial render, based on the current themeState. I.e. if in light mode, dark mode themes are not returned.
10
- *
11
- * @param {Object<string, string>} themeState The themes and color mode that should be applied.
12
- * @param {string} themeState.colorMode Determines which color theme is applied. If set to `auto`, the theme applied will be determined by the OS setting.
13
- * @param {string} themeState.dark The color theme to be applied when the color mode resolves to 'dark'.
14
- * @param {string} themeState.light The color theme to be applied when the color mode resolves to 'light'.
15
- * @param {string} themeState.motion The motion theme to be applied.
16
- * @param {string} themeState.shape The shape theme to be applied.
17
- * @param {string} themeState.spacing The spacing theme to be applied.
18
- * @param {string} themeState.typography The typography theme to be applied.
19
- * @param {Object} themeState.UNSAFE_themeOptions The custom branding options to be used for custom theme generation
20
- *
21
- * @returns A Promise of an object array, containing theme IDs, data-attributes to attach to the theme, and the theme CSS.
22
- * If an error is encountered while loading themes, the themes array will be empty.
23
- */
24
- declare const getThemeStyles: (preferences?: Partial<ThemeState> | "all") => Promise<ThemeStyles[]>;
25
- export default getThemeStyles;
@@ -1,25 +0,0 @@
1
- import tokens from './artifacts/token-names';
2
- type Tokens = typeof tokens;
3
- /**
4
- * Takes a dot-separated token name and and an optional fallback, and returns the current computed CSS value for the
5
- * resulting CSS Custom Property.
6
- * This should be used for when the CSS cascade isn't available, eg. `<canvas>` elements, JS charting libraries, etc.
7
- *
8
- * Note: these values change depending on the theme so consider pairing them with `useThemeObserver` in React, or the
9
- * `ThemeMutationObserver` class elsewhere.
10
- *
11
- * @param {string} path - A dot-separated token name (example: `'color.background.brand'` or `'spacing.scale.100'`).
12
- * @param {string} [fallback] - The fallback value that should render when token CSS is not present in your app.
13
- *
14
- * @example
15
- * ```
16
- * const theme = useThemeObserver();
17
- *
18
- * useEffect(() => {
19
- * const lineColor = getTokenValue('color.background.accent.blue.subtle', B400);
20
- * }, [theme]);
21
- * ```
22
- *
23
- */
24
- declare function getTokenValue<T extends keyof Tokens>(tokenId: T, fallback?: string): string;
25
- export default getTokenValue;
@@ -1,26 +0,0 @@
1
- import tokens, { type CSSTokenMap } from './artifacts/token-names';
2
- type Tokens = typeof tokens;
3
- /**
4
- * Takes a dot-separated token name and an optional fallback, and returns the CSS custom property for the corresponding token.
5
- * This should be used to implement design decisions throughout your application.
6
- *
7
- * Note: With `@atlaskit/babel-plugin-tokens`, this function can be pre-compiled and a fallback value automatically inserted.
8
- *
9
- * @param {string} path - A dot-separated token name (example: `'color.background.brand'` or `'spacing.scale.100'`).
10
- * @param {string} [fallback] - The fallback value that should render when token CSS is not present in your app.
11
- *
12
- * @example
13
- * ```
14
- * <div
15
- * css={{
16
- * backgroundColor: token('elevation.surface.raised', N0),
17
- * boxShadow: token('elevation.shadow.raised', `0 20px 32px -8px ${N50A}, 0 0 1px ${N60A}`),
18
- * padding: token('spacing.scale.100', '8px'),
19
- * fontWeight: token('font.weight.regular', '400'),
20
- * }}
21
- * />
22
- * ```
23
- *
24
- */
25
- declare function token<T extends keyof Tokens>(path: T, fallback?: string): CSSTokenMap[T];
26
- export default token;