@atlaskit/tokens 1.49.1 → 1.51.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 (115) hide show
  1. package/CHANGELOG.md +1593 -1594
  2. package/README.md +14 -8
  3. package/codemods/css-to-design-tokens/lib/colors.tsx +47 -49
  4. package/codemods/css-to-design-tokens/lib/declaration.tsx +26 -26
  5. package/codemods/css-to-design-tokens/lib/legacy-colors.tsx +326 -326
  6. package/codemods/css-to-design-tokens/lib/meta.tsx +116 -122
  7. package/codemods/css-to-design-tokens/lib/tokens.tsx +28 -35
  8. package/codemods/css-to-design-tokens/lib/value.tsx +70 -72
  9. package/codemods/css-to-design-tokens/transform.tsx +68 -72
  10. package/codemods/hypermod.config.tsx +5 -5
  11. package/codemods/remove-fallbacks-color/transform.tsx +16 -18
  12. package/codemods/theme-to-design-tokens/transform.tsx +505 -588
  13. package/codemods/theme-to-design-tokens/utils/ast-meta.tsx +139 -147
  14. package/codemods/theme-to-design-tokens/utils/ast.tsx +23 -34
  15. package/codemods/theme-to-design-tokens/utils/color.tsx +25 -26
  16. package/codemods/theme-to-design-tokens/utils/css-utils.tsx +27 -30
  17. package/codemods/theme-to-design-tokens/utils/fuzzy-search.tsx +272 -290
  18. package/codemods/theme-to-design-tokens/utils/legacy-colors.tsx +224 -224
  19. package/codemods/theme-to-design-tokens/utils/named-colors.tsx +148 -148
  20. package/codemods/theme-to-design-tokens/utils/string-utils.tsx +10 -16
  21. package/codemods/utils/tokens.tsx +371 -371
  22. package/dist/cjs/artifacts/atlassian-dark-token-value-for-contrast-check.js +1 -1
  23. package/dist/cjs/artifacts/atlassian-light-token-value-for-contrast-check.js +1 -1
  24. package/dist/cjs/artifacts/generated-pairs.js +1 -1
  25. package/dist/cjs/artifacts/theme-import-map.js +1 -1
  26. package/dist/cjs/artifacts/themes/atlassian-typography-minor3.js +2 -2
  27. package/dist/cjs/artifacts/token-default-values.js +1 -1
  28. package/dist/cjs/artifacts/token-names.js +1 -1
  29. package/dist/cjs/artifacts/tokens-raw/atlassian-typography-minor3.js +3 -3
  30. package/dist/es2019/artifacts/atlassian-dark-token-value-for-contrast-check.js +1 -1
  31. package/dist/es2019/artifacts/atlassian-light-token-value-for-contrast-check.js +1 -1
  32. package/dist/es2019/artifacts/generated-pairs.js +1 -1
  33. package/dist/es2019/artifacts/theme-import-map.js +1 -1
  34. package/dist/es2019/artifacts/themes/atlassian-typography-minor3.js +2 -2
  35. package/dist/es2019/artifacts/token-default-values.js +1 -1
  36. package/dist/es2019/artifacts/token-names.js +1 -1
  37. package/dist/es2019/artifacts/tokens-raw/atlassian-typography-minor3.js +3 -3
  38. package/dist/esm/artifacts/atlassian-dark-token-value-for-contrast-check.js +1 -1
  39. package/dist/esm/artifacts/atlassian-light-token-value-for-contrast-check.js +1 -1
  40. package/dist/esm/artifacts/generated-pairs.js +1 -1
  41. package/dist/esm/artifacts/theme-import-map.js +1 -1
  42. package/dist/esm/artifacts/themes/atlassian-typography-minor3.js +2 -2
  43. package/dist/esm/artifacts/token-default-values.js +1 -1
  44. package/dist/esm/artifacts/token-names.js +1 -1
  45. package/dist/esm/artifacts/tokens-raw/atlassian-typography-minor3.js +3 -3
  46. package/dist/types/artifacts/atlassian-dark-token-value-for-contrast-check.d.ts +1 -1
  47. package/dist/types/artifacts/atlassian-light-token-value-for-contrast-check.d.ts +1 -1
  48. package/dist/types/artifacts/generated-pairs.d.ts +1 -1
  49. package/dist/types/artifacts/theme-import-map.d.ts +2 -2
  50. package/dist/types/artifacts/themes/atlassian-typography-minor3.d.ts +2 -2
  51. package/dist/types/artifacts/token-default-values.d.ts +1 -1
  52. package/dist/types/artifacts/token-names.d.ts +1 -1
  53. package/dist/types/artifacts/tokens-raw/atlassian-typography-minor3.d.ts +1 -1
  54. package/dist/types/artifacts/types-internal.d.ts +1 -1
  55. package/dist/types/artifacts/types.d.ts +1 -1
  56. package/dist/types/babel-plugin/plugin.d.ts +1 -1
  57. package/dist/types/custom-theme.d.ts +2 -2
  58. package/dist/types/enable-global-theme.d.ts +2 -2
  59. package/dist/types/entry-points/css-type-schema.codegen.d.ts +1 -1
  60. package/dist/types/entry-points/token-ids.d.ts +1 -1
  61. package/dist/types/get-global-theme.d.ts +1 -1
  62. package/dist/types/get-ssr-auto-script.d.ts +1 -1
  63. package/dist/types/get-theme-html-attrs.d.ts +1 -1
  64. package/dist/types/get-theme-styles.d.ts +1 -1
  65. package/dist/types/get-token.d.ts +1 -1
  66. package/dist/types/index.d.ts +1 -1
  67. package/dist/types/load-custom-theme-styles.d.ts +1 -1
  68. package/dist/types/set-global-theme.d.ts +2 -2
  69. package/dist/types/theme-state-transformer.d.ts +1 -1
  70. package/dist/types/utils/color-detection.d.ts +1 -1
  71. package/dist/types/utils/color-mode-listeners.d.ts +1 -1
  72. package/dist/types/utils/configure-page.d.ts +1 -1
  73. package/dist/types/utils/contrast-mode-listeners.d.ts +1 -1
  74. package/dist/types/utils/custom-theme-loading-utils.d.ts +1 -1
  75. package/dist/types/utils/custom-theme-token-contrast-check.d.ts +1 -1
  76. package/dist/types/utils/generate-custom-color-ramp.d.ts +2 -2
  77. package/dist/types/utils/get-increased-contrast-theme.d.ts +1 -1
  78. package/dist/types/utils/get-theme-preferences.d.ts +1 -1
  79. package/dist/types/utils/theme-loading.d.ts +1 -1
  80. package/dist/types-ts4.5/artifacts/atlassian-dark-token-value-for-contrast-check.d.ts +1 -1
  81. package/dist/types-ts4.5/artifacts/atlassian-light-token-value-for-contrast-check.d.ts +1 -1
  82. package/dist/types-ts4.5/artifacts/generated-pairs.d.ts +1 -1
  83. package/dist/types-ts4.5/artifacts/theme-import-map.d.ts +2 -2
  84. package/dist/types-ts4.5/artifacts/themes/atlassian-typography-minor3.d.ts +2 -2
  85. package/dist/types-ts4.5/artifacts/token-default-values.d.ts +1 -1
  86. package/dist/types-ts4.5/artifacts/token-names.d.ts +1 -1
  87. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-typography-minor3.d.ts +1 -1
  88. package/dist/types-ts4.5/artifacts/types-internal.d.ts +1 -1
  89. package/dist/types-ts4.5/artifacts/types.d.ts +1 -1
  90. package/dist/types-ts4.5/babel-plugin/plugin.d.ts +1 -1
  91. package/dist/types-ts4.5/custom-theme.d.ts +2 -2
  92. package/dist/types-ts4.5/enable-global-theme.d.ts +2 -2
  93. package/dist/types-ts4.5/entry-points/css-type-schema.codegen.d.ts +1 -1
  94. package/dist/types-ts4.5/entry-points/token-ids.d.ts +1 -1
  95. package/dist/types-ts4.5/get-global-theme.d.ts +1 -1
  96. package/dist/types-ts4.5/get-ssr-auto-script.d.ts +1 -1
  97. package/dist/types-ts4.5/get-theme-html-attrs.d.ts +1 -1
  98. package/dist/types-ts4.5/get-theme-styles.d.ts +1 -1
  99. package/dist/types-ts4.5/get-token.d.ts +1 -1
  100. package/dist/types-ts4.5/index.d.ts +1 -1
  101. package/dist/types-ts4.5/load-custom-theme-styles.d.ts +1 -1
  102. package/dist/types-ts4.5/set-global-theme.d.ts +2 -2
  103. package/dist/types-ts4.5/theme-state-transformer.d.ts +1 -1
  104. package/dist/types-ts4.5/utils/color-detection.d.ts +1 -1
  105. package/dist/types-ts4.5/utils/color-mode-listeners.d.ts +1 -1
  106. package/dist/types-ts4.5/utils/configure-page.d.ts +1 -1
  107. package/dist/types-ts4.5/utils/contrast-mode-listeners.d.ts +1 -1
  108. package/dist/types-ts4.5/utils/custom-theme-loading-utils.d.ts +1 -1
  109. package/dist/types-ts4.5/utils/custom-theme-token-contrast-check.d.ts +1 -1
  110. package/dist/types-ts4.5/utils/generate-custom-color-ramp.d.ts +2 -2
  111. package/dist/types-ts4.5/utils/get-increased-contrast-theme.d.ts +1 -1
  112. package/dist/types-ts4.5/utils/get-theme-preferences.d.ts +1 -1
  113. package/dist/types-ts4.5/utils/theme-loading.d.ts +1 -1
  114. package/package.json +138 -140
  115. package/report.api.md +2071 -2090
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
3
- * @codegen <<SignedSource::954e99b73431ea61225dcfa4ff725669>>
3
+ * @codegen <<SignedSource::60fc1c36a2d5546b9114051d7e0e51d6>>
4
4
  * @codegenCommand yarn build tokens
5
5
  */
6
6
  export type InternalTokenIds = 'color.text.[default]' | 'color.text.accent.lime.[default]' | 'color.text.accent.lime.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.teal.[default]' | 'color.text.accent.teal.bolder' | 'color.text.accent.blue.[default]' | 'color.text.accent.blue.bolder' | 'color.text.accent.purple.[default]' | 'color.text.accent.purple.bolder' | 'color.text.accent.magenta.[default]' | 'color.text.accent.magenta.bolder' | 'color.text.accent.gray.[default]' | 'color.text.accent.gray.bolder' | 'color.text.disabled' | 'color.text.inverse' | 'color.text.selected' | 'color.text.brand' | 'color.text.danger' | 'color.text.warning.[default]' | 'color.text.warning.inverse' | 'color.text.success' | 'color.text.discovery' | 'color.text.information' | 'color.text.subtlest' | 'color.text.subtle' | 'color.link.[default]' | 'color.link.pressed' | 'color.link.visited.[default]' | 'color.link.visited.pressed' | 'color.icon.[default]' | 'color.icon.accent.lime' | 'color.icon.accent.red' | 'color.icon.accent.orange' | 'color.icon.accent.yellow' | 'color.icon.accent.green' | 'color.icon.accent.teal' | 'color.icon.accent.blue' | 'color.icon.accent.purple' | 'color.icon.accent.magenta' | 'color.icon.accent.gray' | 'color.icon.disabled' | 'color.icon.inverse' | 'color.icon.selected' | 'color.icon.brand' | 'color.icon.danger' | 'color.icon.warning.[default]' | 'color.icon.warning.inverse' | 'color.icon.success' | 'color.icon.discovery' | 'color.icon.information' | 'color.icon.subtle' | 'color.border.[default]' | 'color.border.accent.lime' | 'color.border.accent.red' | 'color.border.accent.orange' | 'color.border.accent.yellow' | 'color.border.accent.green' | 'color.border.accent.teal' | 'color.border.accent.blue' | 'color.border.accent.purple' | 'color.border.accent.magenta' | 'color.border.accent.gray' | 'color.border.disabled' | 'color.border.focused' | 'color.border.input' | 'color.border.inverse' | 'color.border.selected' | 'color.border.brand' | 'color.border.danger' | 'color.border.warning' | 'color.border.success' | 'color.border.discovery' | 'color.border.information' | 'color.border.bold' | 'color.background.accent.lime.subtlest.[default]' | 'color.background.accent.lime.subtlest.hovered' | 'color.background.accent.lime.subtlest.pressed' | 'color.background.accent.lime.subtler.[default]' | 'color.background.accent.lime.subtler.hovered' | 'color.background.accent.lime.subtler.pressed' | 'color.background.accent.lime.subtle.[default]' | 'color.background.accent.lime.subtle.hovered' | 'color.background.accent.lime.subtle.pressed' | 'color.background.accent.lime.bolder.[default]' | 'color.background.accent.lime.bolder.hovered' | 'color.background.accent.lime.bolder.pressed' | 'color.background.accent.red.subtlest.[default]' | 'color.background.accent.red.subtlest.hovered' | 'color.background.accent.red.subtlest.pressed' | 'color.background.accent.red.subtler.[default]' | 'color.background.accent.red.subtler.hovered' | 'color.background.accent.red.subtler.pressed' | 'color.background.accent.red.subtle.[default]' | 'color.background.accent.red.subtle.hovered' | 'color.background.accent.red.subtle.pressed' | 'color.background.accent.red.bolder.[default]' | 'color.background.accent.red.bolder.hovered' | 'color.background.accent.red.bolder.pressed' | 'color.background.accent.orange.subtlest.[default]' | 'color.background.accent.orange.subtlest.hovered' | 'color.background.accent.orange.subtlest.pressed' | 'color.background.accent.orange.subtler.[default]' | 'color.background.accent.orange.subtler.hovered' | 'color.background.accent.orange.subtler.pressed' | 'color.background.accent.orange.subtle.[default]' | 'color.background.accent.orange.subtle.hovered' | 'color.background.accent.orange.subtle.pressed' | 'color.background.accent.orange.bolder.[default]' | 'color.background.accent.orange.bolder.hovered' | 'color.background.accent.orange.bolder.pressed' | 'color.background.accent.yellow.subtlest.[default]' | 'color.background.accent.yellow.subtlest.hovered' | 'color.background.accent.yellow.subtlest.pressed' | 'color.background.accent.yellow.subtler.[default]' | 'color.background.accent.yellow.subtler.hovered' | 'color.background.accent.yellow.subtler.pressed' | 'color.background.accent.yellow.subtle.[default]' | 'color.background.accent.yellow.subtle.hovered' | 'color.background.accent.yellow.subtle.pressed' | 'color.background.accent.yellow.bolder.[default]' | 'color.background.accent.yellow.bolder.hovered' | 'color.background.accent.yellow.bolder.pressed' | 'color.background.accent.green.subtlest.[default]' | 'color.background.accent.green.subtlest.hovered' | 'color.background.accent.green.subtlest.pressed' | 'color.background.accent.green.subtler.[default]' | 'color.background.accent.green.subtler.hovered' | 'color.background.accent.green.subtler.pressed' | 'color.background.accent.green.subtle.[default]' | 'color.background.accent.green.subtle.hovered' | 'color.background.accent.green.subtle.pressed' | 'color.background.accent.green.bolder.[default]' | 'color.background.accent.green.bolder.hovered' | 'color.background.accent.green.bolder.pressed' | 'color.background.accent.teal.subtlest.[default]' | 'color.background.accent.teal.subtlest.hovered' | 'color.background.accent.teal.subtlest.pressed' | 'color.background.accent.teal.subtler.[default]' | 'color.background.accent.teal.subtler.hovered' | 'color.background.accent.teal.subtler.pressed' | 'color.background.accent.teal.subtle.[default]' | 'color.background.accent.teal.subtle.hovered' | 'color.background.accent.teal.subtle.pressed' | 'color.background.accent.teal.bolder.[default]' | 'color.background.accent.teal.bolder.hovered' | 'color.background.accent.teal.bolder.pressed' | 'color.background.accent.blue.subtlest.[default]' | 'color.background.accent.blue.subtlest.hovered' | 'color.background.accent.blue.subtlest.pressed' | 'color.background.accent.blue.subtler.[default]' | 'color.background.accent.blue.subtler.hovered' | 'color.background.accent.blue.subtler.pressed' | 'color.background.accent.blue.subtle.[default]' | 'color.background.accent.blue.subtle.hovered' | 'color.background.accent.blue.subtle.pressed' | 'color.background.accent.blue.bolder.[default]' | 'color.background.accent.blue.bolder.hovered' | 'color.background.accent.blue.bolder.pressed' | 'color.background.accent.purple.subtlest.[default]' | 'color.background.accent.purple.subtlest.hovered' | 'color.background.accent.purple.subtlest.pressed' | 'color.background.accent.purple.subtler.[default]' | 'color.background.accent.purple.subtler.hovered' | 'color.background.accent.purple.subtler.pressed' | 'color.background.accent.purple.subtle.[default]' | 'color.background.accent.purple.subtle.hovered' | 'color.background.accent.purple.subtle.pressed' | 'color.background.accent.purple.bolder.[default]' | 'color.background.accent.purple.bolder.hovered' | 'color.background.accent.purple.bolder.pressed' | 'color.background.accent.magenta.subtlest.[default]' | 'color.background.accent.magenta.subtlest.hovered' | 'color.background.accent.magenta.subtlest.pressed' | 'color.background.accent.magenta.subtler.[default]' | 'color.background.accent.magenta.subtler.hovered' | 'color.background.accent.magenta.subtler.pressed' | 'color.background.accent.magenta.subtle.[default]' | 'color.background.accent.magenta.subtle.hovered' | 'color.background.accent.magenta.subtle.pressed' | 'color.background.accent.magenta.bolder.[default]' | 'color.background.accent.magenta.bolder.hovered' | 'color.background.accent.magenta.bolder.pressed' | 'color.background.accent.gray.subtlest.[default]' | 'color.background.accent.gray.subtlest.hovered' | 'color.background.accent.gray.subtlest.pressed' | 'color.background.accent.gray.subtler.[default]' | 'color.background.accent.gray.subtler.hovered' | 'color.background.accent.gray.subtler.pressed' | 'color.background.accent.gray.subtle.[default]' | 'color.background.accent.gray.subtle.hovered' | 'color.background.accent.gray.subtle.pressed' | 'color.background.accent.gray.bolder.[default]' | 'color.background.accent.gray.bolder.hovered' | 'color.background.accent.gray.bolder.pressed' | 'color.background.disabled' | 'color.background.input.[default]' | 'color.background.input.hovered' | 'color.background.input.pressed' | 'color.background.inverse.subtle.[default]' | 'color.background.inverse.subtle.hovered' | 'color.background.inverse.subtle.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.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.brand.subtlest.[default]' | 'color.background.brand.subtlest.hovered' | 'color.background.brand.subtlest.pressed' | 'color.background.brand.bold.[default]' | 'color.background.brand.bold.hovered' | 'color.background.brand.bold.pressed' | 'color.background.brand.boldest.[default]' | 'color.background.brand.boldest.hovered' | 'color.background.brand.boldest.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.interaction.hovered' | 'color.interaction.pressed' | 'color.skeleton.[default]' | 'color.skeleton.subtle' | '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.lime.bold.[default]' | 'color.chart.lime.bold.hovered' | 'color.chart.lime.bolder.[default]' | 'color.chart.lime.bolder.hovered' | 'color.chart.lime.boldest.[default]' | 'color.chart.lime.boldest.hovered' | 'color.chart.neutral.[default]' | 'color.chart.neutral.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.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.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.chart.brand.[default]' | 'color.chart.brand.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.success.[default].[default]' | 'color.chart.success.[default].hovered' | 'color.chart.success.bold.[default]' | 'color.chart.success.bold.hovered' | 'color.chart.discovery.[default].[default]' | 'color.chart.discovery.[default].hovered' | 'color.chart.discovery.bold.[default]' | 'color.chart.discovery.bold.hovered' | 'color.chart.information.[default].[default]' | 'color.chart.information.[default].hovered' | 'color.chart.information.bold.[default]' | 'color.chart.information.bold.hovered' | 'elevation.surface.[default].[default]' | 'elevation.surface.[default].hovered' | 'elevation.surface.[default].pressed' | 'elevation.surface.overlay.[default]' | 'elevation.surface.overlay.hovered' | 'elevation.surface.overlay.pressed' | 'elevation.surface.raised.[default]' | 'elevation.surface.raised.hovered' | 'elevation.surface.raised.pressed' | 'elevation.surface.sunken' | 'elevation.shadow.overflow.[default]' | 'elevation.shadow.overflow.perimeter' | 'elevation.shadow.overflow.spread' | 'elevation.shadow.overlay' | 'elevation.shadow.raised' | 'opacity.disabled' | 'opacity.loading' | 'utility.UNSAFE.textTransformUppercase' | 'utility.UNSAFE.transparent' | 'utility.elevation.surface.current' | 'border.radius.050' | 'border.radius.[default]' | 'border.radius.100' | 'border.radius.200' | 'border.radius.300' | 'border.radius.400' | 'border.radius.circle' | 'border.width.[default]' | 'border.width.indicator' | 'border.width.outline' | 'space.0' | 'space.025' | 'space.050' | 'space.075' | 'space.100' | 'space.150' | 'space.200' | 'space.250' | 'space.300' | 'space.400' | 'space.500' | 'space.600' | 'space.800' | 'space.1000' | 'space.negative.025' | 'space.negative.050' | 'space.negative.075' | 'space.negative.100' | 'space.negative.150' | 'space.negative.200' | 'space.negative.250' | 'space.negative.300' | 'space.negative.400' | 'font.heading.xxlarge' | 'font.heading.xlarge' | 'font.heading.large' | 'font.heading.medium' | 'font.heading.small' | 'font.heading.xsmall' | 'font.heading.xxsmall' | 'font.body.large' | 'font.body.[default]' | 'font.body.small' | 'font.body.UNSAFE_small' | 'font.code.[default]' | 'font.weight.regular' | 'font.weight.medium' | 'font.weight.semibold' | 'font.weight.bold' | 'font.family.heading' | 'font.family.body' | 'font.family.code' | 'font.family.brand.heading' | 'font.family.brand.body';
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
3
- * @codegen <<SignedSource::7389308257e7ab749702535bb0edc0b5>>
3
+ * @codegen <<SignedSource::f18ac1c27f1c5b0e65357c7cc43503e8>>
4
4
  * @codegenCommand yarn build tokens
5
5
  */
6
6
  export type ActiveTokens = 'color.text' | 'color.text.accent.lime' | 'color.text.accent.lime.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.teal' | 'color.text.accent.teal.bolder' | 'color.text.accent.blue' | 'color.text.accent.blue.bolder' | 'color.text.accent.purple' | 'color.text.accent.purple.bolder' | 'color.text.accent.magenta' | 'color.text.accent.magenta.bolder' | 'color.text.accent.gray' | 'color.text.accent.gray.bolder' | 'color.text.disabled' | 'color.text.inverse' | 'color.text.selected' | 'color.text.brand' | 'color.text.danger' | 'color.text.warning' | 'color.text.warning.inverse' | 'color.text.success' | 'color.text.discovery' | 'color.text.information' | 'color.text.subtlest' | 'color.text.subtle' | 'color.link' | 'color.link.pressed' | 'color.link.visited' | 'color.link.visited.pressed' | 'color.icon' | 'color.icon.accent.lime' | 'color.icon.accent.red' | 'color.icon.accent.orange' | 'color.icon.accent.yellow' | 'color.icon.accent.green' | 'color.icon.accent.teal' | 'color.icon.accent.blue' | 'color.icon.accent.purple' | 'color.icon.accent.magenta' | 'color.icon.accent.gray' | 'color.icon.disabled' | 'color.icon.inverse' | 'color.icon.selected' | 'color.icon.brand' | 'color.icon.danger' | 'color.icon.warning' | 'color.icon.warning.inverse' | 'color.icon.success' | 'color.icon.discovery' | 'color.icon.information' | 'color.icon.subtle' | 'color.border' | 'color.border.accent.lime' | 'color.border.accent.red' | 'color.border.accent.orange' | 'color.border.accent.yellow' | 'color.border.accent.green' | 'color.border.accent.teal' | 'color.border.accent.blue' | 'color.border.accent.purple' | 'color.border.accent.magenta' | 'color.border.accent.gray' | 'color.border.disabled' | 'color.border.focused' | 'color.border.input' | 'color.border.inverse' | 'color.border.selected' | 'color.border.brand' | 'color.border.danger' | 'color.border.warning' | 'color.border.success' | 'color.border.discovery' | 'color.border.information' | 'color.border.bold' | 'color.background.accent.lime.subtlest' | 'color.background.accent.lime.subtlest.hovered' | 'color.background.accent.lime.subtlest.pressed' | 'color.background.accent.lime.subtler' | 'color.background.accent.lime.subtler.hovered' | 'color.background.accent.lime.subtler.pressed' | 'color.background.accent.lime.subtle' | 'color.background.accent.lime.subtle.hovered' | 'color.background.accent.lime.subtle.pressed' | 'color.background.accent.lime.bolder' | 'color.background.accent.lime.bolder.hovered' | 'color.background.accent.lime.bolder.pressed' | 'color.background.accent.red.subtlest' | 'color.background.accent.red.subtlest.hovered' | 'color.background.accent.red.subtlest.pressed' | 'color.background.accent.red.subtler' | 'color.background.accent.red.subtler.hovered' | 'color.background.accent.red.subtler.pressed' | 'color.background.accent.red.subtle' | 'color.background.accent.red.subtle.hovered' | 'color.background.accent.red.subtle.pressed' | 'color.background.accent.red.bolder' | 'color.background.accent.red.bolder.hovered' | 'color.background.accent.red.bolder.pressed' | 'color.background.accent.orange.subtlest' | 'color.background.accent.orange.subtlest.hovered' | 'color.background.accent.orange.subtlest.pressed' | 'color.background.accent.orange.subtler' | 'color.background.accent.orange.subtler.hovered' | 'color.background.accent.orange.subtler.pressed' | 'color.background.accent.orange.subtle' | 'color.background.accent.orange.subtle.hovered' | 'color.background.accent.orange.subtle.pressed' | 'color.background.accent.orange.bolder' | 'color.background.accent.orange.bolder.hovered' | 'color.background.accent.orange.bolder.pressed' | 'color.background.accent.yellow.subtlest' | 'color.background.accent.yellow.subtlest.hovered' | 'color.background.accent.yellow.subtlest.pressed' | 'color.background.accent.yellow.subtler' | 'color.background.accent.yellow.subtler.hovered' | 'color.background.accent.yellow.subtler.pressed' | 'color.background.accent.yellow.subtle' | 'color.background.accent.yellow.subtle.hovered' | 'color.background.accent.yellow.subtle.pressed' | 'color.background.accent.yellow.bolder' | 'color.background.accent.yellow.bolder.hovered' | 'color.background.accent.yellow.bolder.pressed' | 'color.background.accent.green.subtlest' | 'color.background.accent.green.subtlest.hovered' | 'color.background.accent.green.subtlest.pressed' | 'color.background.accent.green.subtler' | 'color.background.accent.green.subtler.hovered' | 'color.background.accent.green.subtler.pressed' | 'color.background.accent.green.subtle' | 'color.background.accent.green.subtle.hovered' | 'color.background.accent.green.subtle.pressed' | 'color.background.accent.green.bolder' | 'color.background.accent.green.bolder.hovered' | 'color.background.accent.green.bolder.pressed' | 'color.background.accent.teal.subtlest' | 'color.background.accent.teal.subtlest.hovered' | 'color.background.accent.teal.subtlest.pressed' | 'color.background.accent.teal.subtler' | 'color.background.accent.teal.subtler.hovered' | 'color.background.accent.teal.subtler.pressed' | 'color.background.accent.teal.subtle' | 'color.background.accent.teal.subtle.hovered' | 'color.background.accent.teal.subtle.pressed' | 'color.background.accent.teal.bolder' | 'color.background.accent.teal.bolder.hovered' | 'color.background.accent.teal.bolder.pressed' | 'color.background.accent.blue.subtlest' | 'color.background.accent.blue.subtlest.hovered' | 'color.background.accent.blue.subtlest.pressed' | 'color.background.accent.blue.subtler' | 'color.background.accent.blue.subtler.hovered' | 'color.background.accent.blue.subtler.pressed' | 'color.background.accent.blue.subtle' | 'color.background.accent.blue.subtle.hovered' | 'color.background.accent.blue.subtle.pressed' | 'color.background.accent.blue.bolder' | 'color.background.accent.blue.bolder.hovered' | 'color.background.accent.blue.bolder.pressed' | 'color.background.accent.purple.subtlest' | 'color.background.accent.purple.subtlest.hovered' | 'color.background.accent.purple.subtlest.pressed' | 'color.background.accent.purple.subtler' | 'color.background.accent.purple.subtler.hovered' | 'color.background.accent.purple.subtler.pressed' | 'color.background.accent.purple.subtle' | 'color.background.accent.purple.subtle.hovered' | 'color.background.accent.purple.subtle.pressed' | 'color.background.accent.purple.bolder' | 'color.background.accent.purple.bolder.hovered' | 'color.background.accent.purple.bolder.pressed' | 'color.background.accent.magenta.subtlest' | 'color.background.accent.magenta.subtlest.hovered' | 'color.background.accent.magenta.subtlest.pressed' | 'color.background.accent.magenta.subtler' | 'color.background.accent.magenta.subtler.hovered' | 'color.background.accent.magenta.subtler.pressed' | 'color.background.accent.magenta.subtle' | 'color.background.accent.magenta.subtle.hovered' | 'color.background.accent.magenta.subtle.pressed' | 'color.background.accent.magenta.bolder' | 'color.background.accent.magenta.bolder.hovered' | 'color.background.accent.magenta.bolder.pressed' | 'color.background.accent.gray.subtlest' | 'color.background.accent.gray.subtlest.hovered' | 'color.background.accent.gray.subtlest.pressed' | 'color.background.accent.gray.subtler' | 'color.background.accent.gray.subtler.hovered' | 'color.background.accent.gray.subtler.pressed' | 'color.background.accent.gray.subtle' | 'color.background.accent.gray.subtle.hovered' | 'color.background.accent.gray.subtle.pressed' | 'color.background.accent.gray.bolder' | 'color.background.accent.gray.bolder.hovered' | 'color.background.accent.gray.bolder.pressed' | 'color.background.disabled' | 'color.background.input' | 'color.background.input.hovered' | 'color.background.input.pressed' | 'color.background.inverse.subtle' | 'color.background.inverse.subtle.hovered' | 'color.background.inverse.subtle.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.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.brand.subtlest' | 'color.background.brand.subtlest.hovered' | 'color.background.brand.subtlest.pressed' | 'color.background.brand.bold' | 'color.background.brand.bold.hovered' | 'color.background.brand.bold.pressed' | 'color.background.brand.boldest' | 'color.background.brand.boldest.hovered' | 'color.background.brand.boldest.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.interaction.hovered' | 'color.interaction.pressed' | 'color.skeleton' | 'color.skeleton.subtle' | '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.lime.bold' | 'color.chart.lime.bold.hovered' | 'color.chart.lime.bolder' | 'color.chart.lime.bolder.hovered' | 'color.chart.lime.boldest' | 'color.chart.lime.boldest.hovered' | 'color.chart.neutral' | 'color.chart.neutral.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.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.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.chart.brand' | 'color.chart.brand.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.success' | 'color.chart.success.hovered' | 'color.chart.success.bold' | 'color.chart.success.bold.hovered' | 'color.chart.discovery' | 'color.chart.discovery.hovered' | 'color.chart.discovery.bold' | 'color.chart.discovery.bold.hovered' | 'color.chart.information' | 'color.chart.information.hovered' | 'color.chart.information.bold' | 'color.chart.information.bold.hovered' | 'elevation.surface' | 'elevation.surface.hovered' | 'elevation.surface.pressed' | 'elevation.surface.overlay' | 'elevation.surface.overlay.hovered' | 'elevation.surface.overlay.pressed' | 'elevation.surface.raised' | 'elevation.surface.raised.hovered' | 'elevation.surface.raised.pressed' | 'elevation.surface.sunken' | 'elevation.shadow.overflow' | 'elevation.shadow.overflow.perimeter' | 'elevation.shadow.overflow.spread' | 'elevation.shadow.overlay' | 'elevation.shadow.raised' | 'opacity.disabled' | 'opacity.loading' | 'utility.UNSAFE.textTransformUppercase' | 'utility.UNSAFE.transparent' | 'utility.elevation.surface.current' | 'border.radius.050' | 'border.radius' | 'border.radius.100' | 'border.radius.200' | 'border.radius.300' | 'border.radius.400' | 'border.radius.circle' | 'border.width' | 'border.width.indicator' | 'border.width.outline' | 'space.0' | 'space.025' | 'space.050' | 'space.075' | 'space.100' | 'space.150' | 'space.200' | 'space.250' | 'space.300' | 'space.400' | 'space.500' | 'space.600' | 'space.800' | 'space.1000' | 'space.negative.025' | 'space.negative.050' | 'space.negative.075' | 'space.negative.100' | 'space.negative.150' | 'space.negative.200' | 'space.negative.250' | 'space.negative.300' | 'space.negative.400' | 'font.heading.xxlarge' | 'font.heading.xlarge' | 'font.heading.large' | 'font.heading.medium' | 'font.heading.small' | 'font.heading.xsmall' | 'font.heading.xxsmall' | 'font.body.large' | 'font.body' | 'font.body.small' | 'font.body.UNSAFE_small' | 'font.code' | 'font.weight.regular' | 'font.weight.medium' | 'font.weight.semibold' | 'font.weight.bold' | 'font.family.heading' | 'font.family.body' | 'font.family.code' | 'font.family.brand.heading' | 'font.family.brand.body';
@@ -1,4 +1,4 @@
1
- import { NodePath } from '@babel/traverse';
1
+ import { type NodePath } from '@babel/traverse';
2
2
  import * as t from '@babel/types';
3
3
  type DefaultColorTheme = 'light' | 'legacy-light';
4
4
  export default function plugin(): {
@@ -1,5 +1,5 @@
1
- import { ThemeStyles } from './get-theme-styles';
2
- import { ThemeOptionsSchema, ThemeState } from './theme-config';
1
+ import { type ThemeStyles } from './get-theme-styles';
2
+ import { type ThemeOptionsSchema, type ThemeState } from './theme-config';
3
3
  export declare const CUSTOM_STYLE_ELEMENTS_SIZE_THRESHOLD = 10;
4
4
  /**
5
5
  *
@@ -1,5 +1,5 @@
1
- import { UnbindFn } from 'bind-event-listener';
2
- import { ThemeIdsWithOverrides, ThemeState } from './theme-config';
1
+ import { type UnbindFn } from 'bind-event-listener';
2
+ import { type ThemeIdsWithOverrides, type ThemeState } from './theme-config';
3
3
  /**
4
4
  * Synchronously sets the theme globally at runtime. Themes are not loaded;
5
5
  * use `getThemeStyles` and other server-side utilities to generate and load them.
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * Strict design token based typedef representing a subset of safe CSS properties.
5
5
  *
6
- * @codegen <<SignedSource::4b4e9818ad6c92bfc09b29fe6f15235f>>
6
+ * @codegen <<SignedSource::d6db772743ab5a9b0a9f8ae71d16ede7>>
7
7
  * @codegenCommand yarn build tokens
8
8
  */
9
9
  export type BackgroundColor = '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-bold)' | 'var(--ds-background-warning)' | 'var(--ds-background-warning-bold)' | 'var(--ds-background-success)' | 'var(--ds-background-success-bold)' | 'var(--ds-background-discovery)' | 'var(--ds-background-discovery-bold)' | 'var(--ds-background-information)' | 'var(--ds-background-information-bold)' | 'var(--ds-skeleton)' | 'var(--ds-skeleton-subtle)' | 'var(--ds-surface)' | 'var(--ds-surface-overlay)' | 'var(--ds-surface-raised)' | 'var(--ds-surface-sunken)' | 'var(--ds-elevation-surface-current)';
@@ -1 +1 @@
1
- export { getCSSCustomProperty, getTokenId, getFullyQualifiedTokenId, } from '../utils/token-ids';
1
+ export { getCSSCustomProperty, getTokenId, getFullyQualifiedTokenId } from '../utils/token-ids';
@@ -1,3 +1,3 @@
1
- import { ActiveThemeState } from './theme-config';
1
+ import { type ActiveThemeState } from './theme-config';
2
2
  declare const getGlobalTheme: () => Partial<ActiveThemeState>;
3
3
  export default getGlobalTheme;
@@ -1,4 +1,4 @@
1
- import { ThemeState } from './theme-config';
1
+ import { type ThemeState } from './theme-config';
2
2
  /**
3
3
  * Provides a script that, when executed before paint, sets the `data-color-mode` attribute based on the current system theme,
4
4
  * to enable SSR support for automatic theme switching, avoid a flash of un-themed content on first paint.
@@ -1,4 +1,4 @@
1
- import { ThemeState } from './theme-config';
1
+ import { type ThemeState } from './theme-config';
2
2
  /**
3
3
  * Server-side rendering utility. Generates the valid HTML attributes for a given theme.
4
4
  * Note: this utility does not handle automatic theme switching.
@@ -1,4 +1,4 @@
1
- import { ThemeIdsWithOverrides, ThemeState } from './theme-config';
1
+ import { type ThemeIdsWithOverrides, type ThemeState } from './theme-config';
2
2
  export interface ThemeStyles {
3
3
  id: ThemeIdsWithOverrides;
4
4
  attrs: Record<string, string>;
@@ -1,4 +1,4 @@
1
- import tokens, { CSSTokenMap } from './artifacts/token-names';
1
+ import tokens, { type CSSTokenMap } from './artifacts/token-names';
2
2
  type Tokens = typeof tokens;
3
3
  /**
4
4
  * Takes a dot-separated token name and an optional fallback, and returns the CSS custom property for the corresponding token.
@@ -9,7 +9,7 @@ export { default as getSSRAutoScript } from './get-ssr-auto-script';
9
9
  export { default as useThemeObserver } from './use-theme-observer';
10
10
  export { default as ThemeMutationObserver } from './theme-mutation-observer';
11
11
  export { default as getGlobalTheme } from './get-global-theme';
12
- export { themeStringToObject, themeObjectToString, } from './theme-state-transformer';
12
+ export { themeStringToObject, themeObjectToString } from './theme-state-transformer';
13
13
  export type { CSSToken } from './artifacts/token-names';
14
14
  export type { ActiveTokens } from './artifacts/types';
15
15
  export type { ThemeColorModes, Themes, ThemeFileNames, ThemeIds, ThemeOptionsSchema, ThemeState, } from './theme-config';
@@ -1,4 +1,4 @@
1
- import { ThemeState } from './theme-config';
1
+ import { type ThemeState } from './theme-config';
2
2
  /**
3
3
  * Synchronously generates and applies custom theme styles to the page.
4
4
  *
@@ -1,5 +1,5 @@
1
- import { UnbindFn } from 'bind-event-listener';
2
- import { ThemeIdsWithOverrides, ThemeState } from './theme-config';
1
+ import { type UnbindFn } from 'bind-event-listener';
2
+ import { type ThemeIdsWithOverrides, type ThemeState } from './theme-config';
3
3
  /**
4
4
  * Sets the theme globally at runtime. This updates the `data-theme` and `data-color-mode` attributes on your page's <html> tag.
5
5
  *
@@ -1,4 +1,4 @@
1
- import { ThemeState } from './theme-config';
1
+ import { type ThemeState } from './theme-config';
2
2
  /**
3
3
  * Converts a string that is formatted for the `data-theme` HTML attribute
4
4
  * to an object that can be passed to `setGlobalTheme`.
@@ -1,4 +1,4 @@
1
- import { ShadowToken } from '../types';
1
+ import { type ShadowToken } from '../types';
2
2
  export declare const hexToRGBAValues: (hex: string) => {
3
3
  r: number;
4
4
  g: number;
@@ -1,4 +1,4 @@
1
- import { UnbindFn } from 'bind-event-listener';
1
+ import { type UnbindFn } from 'bind-event-listener';
2
2
  declare class ColorModeObserver {
3
3
  unbindThemeChangeListener: UnbindFn | null;
4
4
  getColorMode(): "light" | "dark";
@@ -1,4 +1,4 @@
1
- import { ThemeState } from '../theme-config';
1
+ import { type ThemeState } from '../theme-config';
2
2
  /**
3
3
  * Given ThemeState, sets appropriate html attributes on the documentElement,
4
4
  * adds a listener to keep colorMode updated, and returns a function to unbind.
@@ -1,4 +1,4 @@
1
- import { UnbindFn } from 'bind-event-listener';
1
+ import { type UnbindFn } from 'bind-event-listener';
2
2
  declare class ContrastModeObserver {
3
3
  unbindContrastChangeListener: UnbindFn | null;
4
4
  getContrastMode(): "more" | "no-preference";
@@ -1,5 +1,5 @@
1
1
  import tokens from '../artifacts/token-names';
2
- import { ThemeColorModes, ThemeOptionsSchema } from '../theme-config';
2
+ import { type ThemeColorModes, type ThemeOptionsSchema } from '../theme-config';
3
3
  type Token = keyof typeof tokens;
4
4
  type ThemeAttributeId = 'light' | 'dark';
5
5
  export declare function findMissingCustomStyleElements(UNSAFE_themeOptions: ThemeOptionsSchema, mode: ThemeColorModes): ThemeAttributeId[];
@@ -1,4 +1,4 @@
1
- import tokens from '../artifacts/token-names';
1
+ import type tokens from '../artifacts/token-names';
2
2
  type Token = keyof typeof tokens;
3
3
  interface AdditionalContrastCheck {
4
4
  foreground: Token;
@@ -1,5 +1,5 @@
1
- import tokens from '../artifacts/token-names';
2
- import { CSSColor, ThemeColorModes } from '../theme-config';
1
+ import type tokens from '../artifacts/token-names';
2
+ import { type CSSColor, type ThemeColorModes } from '../theme-config';
3
3
  type Token = keyof typeof tokens;
4
4
  type TokenMap = {
5
5
  [key in Token]?: number | string;
@@ -1,4 +1,4 @@
1
- import { ThemeIds, ThemeOverrideIds } from '../theme-config';
1
+ import { type ThemeIds, type ThemeOverrideIds } from '../theme-config';
2
2
  /**
3
3
  * Finds any matching increased contrast theme available for a selected theme.
4
4
  */
@@ -1,3 +1,3 @@
1
- import { ThemeIdsWithOverrides, ThemeState } from '../theme-config';
1
+ import { type ThemeIdsWithOverrides, type ThemeState } from '../theme-config';
2
2
  export declare const getThemePreferences: (themeState: ThemeState) => ThemeIdsWithOverrides[];
3
3
  export declare const getThemeOverridePreferences: (themeState: ThemeState) => ThemeIdsWithOverrides[];
@@ -1,4 +1,4 @@
1
- import { ThemeIdsWithOverrides } from '../theme-config';
1
+ import { type ThemeIdsWithOverrides } from '../theme-config';
2
2
  export declare const loadAndAppendThemeCss: (themeId: ThemeIdsWithOverrides) => Promise<void>;
3
3
  export declare const loadThemeCss: (themeId: ThemeIdsWithOverrides) => Promise<string>;
4
4
  export declare const darkModeMediaQuery = "(prefers-color-scheme: dark)";
package/package.json CHANGED
@@ -1,141 +1,139 @@
1
1
  {
2
- "name": "@atlaskit/tokens",
3
- "version": "1.49.1",
4
- "description": "Design tokens are the single source of truth to name and store design decisions.",
5
- "publishConfig": {
6
- "registry": "https://registry.npmjs.org/"
7
- },
8
- "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
9
- "author": "Atlassian Pty Ltd",
10
- "license": "Apache-2.0",
11
- "main": "dist/cjs/index.js",
12
- "module": "dist/esm/index.js",
13
- "module:es2019": "dist/es2019/index.js",
14
- "types": "dist/types/index.d.ts",
15
- "sideEffects": [
16
- "**/*.css"
17
- ],
18
- "atlaskit:src": "src/index.tsx",
19
- "atlassian": {
20
- "team": "Design System Team",
21
- "productPushConsumption": [
22
- "jira"
23
- ],
24
- "releaseModel": "continuous",
25
- "runReact18": true,
26
- "website": {
27
- "name": "Design tokens",
28
- "category": "Libraries"
29
- }
30
- },
31
- "scripts": {
32
- "prebuilt": "yes | cp -R $(npx repo-root)/packages/design-system/tokens/dist/cjs/* $(npx repo-root)/packages/design-system/tokens/prebuilt/",
33
- "ak-postbuild": "yarn prebuilt && (cd $(npx repo-root) && yarn build @atlassian/codegen -d cjs,esm,es2019) && yarn workspace @atlaskit/tokens codegen-tokens && yarn workspace @atlaskit/tokens check-clean-git",
34
- "check-clean-git": "git diff --exit-code -- packages/design-system/tokens/ || (echo 'tokens are out of date, run yarn build tokens' && false)",
35
- "codegen-tokens": "ts-node --project $(npx repo-root)/tsconfig.node.json ./scripts/style-dictionary/build && cd $(npx repo-root)/packages/design-system/primitives && yarn codegen-styles && cd $(npx repo-root)/packages/design-system/ds-explorations && yarn codegen-styles && cd $(npx repo-root)/packages/design-system/heading && yarn codegen"
36
- },
37
- "dependencies": {
38
- "@atlaskit/ds-lib": "^2.3.0",
39
- "@atlaskit/platform-feature-flags": "^0.2.0",
40
- "@babel/runtime": "^7.0.0",
41
- "@babel/traverse": "^7.23.2",
42
- "@babel/types": "^7.20.0",
43
- "bind-event-listener": "^3.0.0"
44
- },
45
- "peerDependencies": {
46
- "react": "^16.8.0 || ^17.0.0 || ~18.2.0"
47
- },
48
- "devDependencies": {
49
- "@af/accessibility-testing": "*",
50
- "@af/formatting": "*",
51
- "@atlaskit/calendar": "^14.2.0",
52
- "@atlaskit/checkbox": "^13.3.0",
53
- "@atlaskit/radio": "^6.3.0",
54
- "@atlaskit/textfield": "^6.3.0",
55
- "@atlaskit/tooltip": "^18.4.0",
56
- "@atlaskit/visual-regression": "*",
57
- "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
58
- "@atlassian/codegen": "^0.1.0",
59
- "@atlassian/feature-flags-test-utils": "*",
60
- "@babel/core": "^7.20.0",
61
- "@emotion/react": "^11.7.1",
62
- "@hypermod/utils": "^0.4.2",
63
- "@testing-library/dom": "^8.17.1",
64
- "@testing-library/react": "^12.1.5",
65
- "@testing-library/react-hooks": "^8.0.1",
66
- "@testing-library/user-event": "^14.4.3",
67
- "@types/chrome": "^0.0.171",
68
- "color-blend": "^4.0.0",
69
- "copy-webpack-plugin": "^6.4.0",
70
- "echarts": "^5.4.1",
71
- "echarts-for-react": "^3.0.2",
72
- "fuse.js": "^6.6.2",
73
- "jscodeshift": "^0.13.0",
74
- "lodash": "^4.17.21",
75
- "postcss": "^8.4.7",
76
- "postcss-less": "^6.0.0",
77
- "prettier": "^3.2.5",
78
- "react": "^16.8.0",
79
- "react-use-clipboard": "^1.0.0",
80
- "react-window": "^1.8.8",
81
- "recharts": "^1.8.5",
82
- "style-dictionary": "^3.8.0",
83
- "ts-node": "^10.9.1",
84
- "typescript": "~5.4.2"
85
- },
86
- "techstack": {
87
- "@atlassian/frontend": {
88
- "import-structure": "atlassian-conventions",
89
- "circular-dependencies": "file-and-folder-level"
90
- },
91
- "@repo/internal": {
92
- "dom-events": "use-bind-event-listener",
93
- "design-system": "v1",
94
- "ui-components": "lite-mode",
95
- "deprecation": "no-deprecated-imports",
96
- "styling": [
97
- "emotion"
98
- ]
99
- }
100
- },
101
- "hypermod": {
102
- "dependencies": [
103
- "@hypermod/utils",
104
- "postcss",
105
- "postcss-less"
106
- ]
107
- },
108
- "typesVersions": {
109
- ">=4.5 <4.9": {
110
- "*": [
111
- "dist/types-ts4.5/*",
112
- "dist/types-ts4.5/index.d.ts"
113
- ]
114
- }
115
- },
116
- "af:exports": {
117
- ".": "./src/index.tsx",
118
- "./custom-themes": "./src/entry-points/custom-themes.tsx",
119
- "./figma/atlassian-light.json": "./figma/atlassian-light.json",
120
- "./figma/atlassian-dark.json": "./figma/atlassian-dark.json",
121
- "./palettes-raw": "./src/entry-points/palettes-raw.tsx",
122
- "./tokens-raw": "./src/entry-points/tokens-raw.tsx",
123
- "./token-ids": "./src/entry-points/token-ids.tsx",
124
- "./token-names": "./src/entry-points/token-names.tsx",
125
- "./token-order": "./src/entry-points/token-order.tsx",
126
- "./token-default-values": "./src/entry-points/token-default-values.tsx",
127
- "./rename-mapping": "./src/entry-points/rename-mapping.tsx",
128
- "./babel-plugin": "./src/entry-points/babel-plugin.tsx",
129
- "./css-type-schema": "./src/entry-points/css-type-schema.codegen.tsx"
130
- },
131
- "platform-feature-flags": {
132
- "platform.design-system-team.increased-contrast-themes": {
133
- "type": "boolean"
134
- },
135
- "platform.design-system-team.mutation-observer-performance-improvement_8usdg": {
136
- "type": "boolean"
137
- }
138
- },
139
- "homepage": "https://atlassian.design/components/tokens",
140
- "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"
141
- }
2
+ "name": "@atlaskit/tokens",
3
+ "version": "1.51.0",
4
+ "description": "Design tokens are the single source of truth to name and store design decisions.",
5
+ "publishConfig": {
6
+ "registry": "https://registry.npmjs.org/"
7
+ },
8
+ "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
9
+ "author": "Atlassian Pty Ltd",
10
+ "license": "Apache-2.0",
11
+ "main": "dist/cjs/index.js",
12
+ "module": "dist/esm/index.js",
13
+ "module:es2019": "dist/es2019/index.js",
14
+ "types": "dist/types/index.d.ts",
15
+ "sideEffects": [
16
+ "**/*.css"
17
+ ],
18
+ "atlaskit:src": "src/index.tsx",
19
+ "atlassian": {
20
+ "team": "Design System Team",
21
+ "productPushConsumption": [
22
+ "jira"
23
+ ],
24
+ "releaseModel": "continuous",
25
+ "runReact18": true,
26
+ "website": {
27
+ "name": "Design tokens",
28
+ "category": "Libraries"
29
+ }
30
+ },
31
+ "scripts": {
32
+ "prebuilt": "yes | cp -R $(npx repo-root)/packages/design-system/tokens/dist/cjs/* $(npx repo-root)/packages/design-system/tokens/prebuilt/",
33
+ "ak-postbuild": "yarn prebuilt && (cd $(npx repo-root) && yarn build @atlassian/codegen -d cjs,esm,es2019) && yarn workspace @atlaskit/tokens codegen-tokens && yarn workspace @atlaskit/tokens check-clean-git",
34
+ "check-clean-git": "git diff --exit-code -- packages/design-system/tokens/ || (echo 'tokens are out of date, run yarn build tokens' && false)",
35
+ "codegen-tokens": "ts-node --project $(npx repo-root)/tsconfig.node.json ./scripts/style-dictionary/build && cd $(npx repo-root)/packages/design-system/primitives && yarn codegen-styles && cd $(npx repo-root)/packages/design-system/ds-explorations && yarn codegen-styles && cd $(npx repo-root)/packages/design-system/heading && yarn codegen"
36
+ },
37
+ "dependencies": {
38
+ "@atlaskit/ds-lib": "^2.3.0",
39
+ "@atlaskit/platform-feature-flags": "^0.2.0",
40
+ "@babel/runtime": "^7.0.0",
41
+ "@babel/traverse": "^7.23.2",
42
+ "@babel/types": "^7.20.0",
43
+ "bind-event-listener": "^3.0.0"
44
+ },
45
+ "peerDependencies": {
46
+ "react": "^16.8.0 || ^17.0.0 || ~18.2.0"
47
+ },
48
+ "devDependencies": {
49
+ "@af/accessibility-testing": "*",
50
+ "@af/formatting": "*",
51
+ "@atlaskit/calendar": "^14.2.0",
52
+ "@atlaskit/checkbox": "^13.4.0",
53
+ "@atlaskit/radio": "^6.3.0",
54
+ "@atlaskit/textfield": "^6.4.0",
55
+ "@atlaskit/tooltip": "^18.5.0",
56
+ "@atlaskit/visual-regression": "*",
57
+ "@atlassian/codegen": "^0.1.0",
58
+ "@atlassian/feature-flags-test-utils": "*",
59
+ "@babel/core": "^7.20.0",
60
+ "@emotion/react": "^11.7.1",
61
+ "@hypermod/utils": "^0.4.2",
62
+ "@testing-library/dom": "^8.17.1",
63
+ "@testing-library/react": "^12.1.5",
64
+ "@testing-library/react-hooks": "^8.0.1",
65
+ "@testing-library/user-event": "^14.4.3",
66
+ "@types/chrome": "^0.0.171",
67
+ "color-blend": "^4.0.0",
68
+ "copy-webpack-plugin": "^6.4.0",
69
+ "echarts": "^5.4.1",
70
+ "echarts-for-react": "^3.0.2",
71
+ "fuse.js": "^6.6.2",
72
+ "jscodeshift": "^0.13.0",
73
+ "lodash": "^4.17.21",
74
+ "postcss": "^8.4.7",
75
+ "postcss-less": "^6.0.0",
76
+ "prettier": "^3.2.5",
77
+ "react": "^16.8.0",
78
+ "react-use-clipboard": "^1.0.0",
79
+ "react-window": "^1.8.8",
80
+ "recharts": "^1.8.5",
81
+ "style-dictionary": "^3.8.0",
82
+ "ts-node": "^10.9.1",
83
+ "typescript": "~5.4.2"
84
+ },
85
+ "techstack": {
86
+ "@atlassian/frontend": {
87
+ "import-structure": "atlassian-conventions",
88
+ "circular-dependencies": "file-and-folder-level"
89
+ },
90
+ "@repo/internal": {
91
+ "dom-events": "use-bind-event-listener",
92
+ "design-system": "v1",
93
+ "ui-components": "lite-mode",
94
+ "deprecation": "no-deprecated-imports",
95
+ "styling": [
96
+ "emotion"
97
+ ]
98
+ }
99
+ },
100
+ "hypermod": {
101
+ "dependencies": [
102
+ "@hypermod/utils",
103
+ "postcss",
104
+ "postcss-less"
105
+ ]
106
+ },
107
+ "typesVersions": {
108
+ ">=4.5 <4.9": {
109
+ "*": [
110
+ "dist/types-ts4.5/*",
111
+ "dist/types-ts4.5/index.d.ts"
112
+ ]
113
+ }
114
+ },
115
+ "af:exports": {
116
+ ".": "./src/index.tsx",
117
+ "./custom-themes": "./src/entry-points/custom-themes.tsx",
118
+ "./figma/atlassian-light.json": "./figma/atlassian-light.json",
119
+ "./figma/atlassian-dark.json": "./figma/atlassian-dark.json",
120
+ "./palettes-raw": "./src/entry-points/palettes-raw.tsx",
121
+ "./tokens-raw": "./src/entry-points/tokens-raw.tsx",
122
+ "./token-ids": "./src/entry-points/token-ids.tsx",
123
+ "./token-names": "./src/entry-points/token-names.tsx",
124
+ "./token-order": "./src/entry-points/token-order.tsx",
125
+ "./token-default-values": "./src/entry-points/token-default-values.tsx",
126
+ "./rename-mapping": "./src/entry-points/rename-mapping.tsx",
127
+ "./babel-plugin": "./src/entry-points/babel-plugin.tsx",
128
+ "./css-type-schema": "./src/entry-points/css-type-schema.codegen.tsx"
129
+ },
130
+ "platform-feature-flags": {
131
+ "platform.design-system-team.increased-contrast-themes": {
132
+ "type": "boolean"
133
+ },
134
+ "platform.design-system-team.mutation-observer-performance-improvement_8usdg": {
135
+ "type": "boolean"
136
+ }
137
+ },
138
+ "homepage": "https://atlassian.design/components/tokens"
139
+ }