@atlaskit/tokens 13.0.3 → 13.1.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.
- package/CHANGELOG.md +15 -0
- package/codemods/css-to-design-tokens/lib/meta.tsx +1 -1
- package/codemods/css-to-design-tokens/lib/tokens.tsx +1 -1
- package/codemods/theme-to-design-tokens/transform.tsx +16 -14
- package/codemods/theme-to-design-tokens/utils/ast-meta.tsx +2 -151
- package/codemods/theme-to-design-tokens/utils/ast.tsx +3 -35
- package/codemods/theme-to-design-tokens/utils/clean-meta.tsx +63 -0
- package/codemods/theme-to-design-tokens/utils/color.tsx +3 -11
- package/codemods/theme-to-design-tokens/utils/contains-replaceable-css-declarations.tsx +13 -0
- package/codemods/theme-to-design-tokens/utils/css-utils.tsx +2 -35
- package/codemods/theme-to-design-tokens/utils/find-end-index-of-css-expression.tsx +21 -0
- package/codemods/theme-to-design-tokens/utils/find-first-nonspace-index-after.tsx +9 -0
- package/codemods/theme-to-design-tokens/utils/get-closest-decendant-of-type.tsx +10 -0
- package/codemods/theme-to-design-tokens/utils/get-meta-from-ancestors.tsx +87 -0
- package/codemods/theme-to-design-tokens/utils/is-bold-color.tsx +4 -0
- package/codemods/theme-to-design-tokens/utils/is-decendant-of-token.tsx +14 -0
- package/codemods/theme-to-design-tokens/utils/is-legacy-color.tsx +4 -0
- package/codemods/theme-to-design-tokens/utils/is-legacy-named-color.tsx +4 -0
- package/codemods/theme-to-design-tokens/utils/is-parent-of-token.tsx +13 -0
- package/codemods/theme-to-design-tokens/utils/kebabize.tsx +2 -0
- package/codemods/theme-to-design-tokens/utils/legacy-color-meta-map.tsx +88 -0
- package/codemods/theme-to-design-tokens/utils/legacy-color-mixins.tsx +26 -0
- package/codemods/theme-to-design-tokens/utils/legacy-colors.tsx +2 -115
- package/codemods/theme-to-design-tokens/utils/split-at-index.tsx +3 -0
- package/codemods/theme-to-design-tokens/utils/string-utils.tsx +3 -16
- package/codemods/utils/active-tokens.tsx +284 -0
- package/codemods/utils/tokens.tsx +2 -376
- package/codemods/utils/unique-words-from-tokens.tsx +91 -0
- package/dist/cjs/artifacts/replacement-mapping.js +5 -2
- package/dist/cjs/artifacts/themes/atlassian-dark-increased-contrast.js +2 -2
- package/dist/cjs/artifacts/themes/atlassian-dark.js +2 -2
- package/dist/cjs/artifacts/themes/atlassian-light-increased-contrast.js +2 -2
- package/dist/cjs/artifacts/themes/atlassian-light.js +2 -2
- package/dist/cjs/artifacts/token-default-values.js +2 -2
- package/dist/cjs/artifacts/tokens-raw/atlassian-dark-increased-contrast.js +3 -3
- package/dist/cjs/artifacts/tokens-raw/atlassian-dark.js +3 -3
- package/dist/cjs/artifacts/tokens-raw/atlassian-light-increased-contrast.js +3 -3
- package/dist/cjs/artifacts/tokens-raw/atlassian-light.js +3 -3
- package/dist/cjs/artifacts/tokens-raw/atlassian-motion.js +3 -3
- package/dist/cjs/constants.js +1 -0
- package/dist/cjs/custom-theme.js +10 -60
- package/dist/cjs/entry-points/token-metadata.codegen.js +2 -11
- package/dist/cjs/get-custom-theme-styles.js +57 -0
- package/dist/cjs/get-global-theme.js +2 -2
- package/dist/cjs/get-theme-html-attrs.js +2 -2
- package/dist/cjs/get-theme-styles.js +33 -32
- package/dist/cjs/load-custom-theme-styles.js +2 -2
- package/dist/cjs/set-global-theme.js +36 -34
- package/dist/cjs/theme-color-modes.js +13 -0
- package/dist/cjs/theme-config.js +21 -16
- package/dist/cjs/theme-ids.js +13 -0
- package/dist/cjs/theme-state-transformer.js +3 -2
- package/dist/cjs/utils/color-detection.js +9 -12
- package/dist/cjs/utils/color-utils.js +45 -46
- package/dist/cjs/utils/custom-theme-loading-utils.js +9 -11
- package/dist/cjs/utils/custom-theme-token-contrast-check.js +2 -0
- package/dist/cjs/utils/generate-custom-color-ramp.js +20 -19
- package/dist/cjs/utils/get-alpha.js +13 -0
- package/dist/cjs/utils/get-closest-color-index.js +20 -0
- package/dist/cjs/utils/get-css-custom-property.js +32 -0
- package/dist/cjs/utils/get-fully-qualified-token-id.js +19 -0
- package/dist/cjs/utils/get-theme-override-preferences.js +12 -0
- package/dist/cjs/utils/get-theme-preferences.js +8 -5
- package/dist/cjs/utils/get-token-id.js +26 -0
- package/dist/cjs/utils/hct-color-utils/argb-from-rgb.js +12 -0
- package/dist/cjs/utils/hct-color-utils/clamp-double.js +20 -0
- package/dist/cjs/utils/hct-color-utils/clamp-int.js +20 -0
- package/dist/cjs/utils/hct-color-utils/color-utils.js +42 -59
- package/dist/cjs/utils/hct-color-utils/delinearized.js +27 -0
- package/dist/cjs/utils/hct-color-utils/hct.js +19 -95
- package/dist/cjs/utils/hct-color-utils/lerp.js +14 -0
- package/dist/cjs/utils/hct-color-utils/linearized.js +22 -0
- package/dist/cjs/utils/hct-color-utils/math-utils.js +38 -107
- package/dist/cjs/utils/hct-color-utils/matrix-multiply.js +15 -0
- package/dist/cjs/utils/hct-color-utils/sanitize-degrees-double.js +19 -0
- package/dist/cjs/utils/hct-color-utils/signum.js +20 -0
- package/dist/cjs/utils/hct-color-utils/viewing-conditions.js +98 -0
- package/dist/cjs/utils/hex-to-rgba-values.js +15 -0
- package/dist/cjs/utils/hsl-to-rgb.js +18 -0
- package/dist/cjs/utils/is-valid-brand-hex.js +9 -0
- package/dist/cjs/utils/limit-size-of-custom-style-elements.js +16 -0
- package/dist/cjs/utils/load-theme-css.js +32 -0
- package/dist/cjs/utils/relative-luminance-w3-c.js +18 -0
- package/dist/cjs/utils/rgb-to-hex.js +9 -0
- package/dist/cjs/utils/theme-loading.js +18 -33
- package/dist/cjs/utils/token-ids.js +21 -62
- package/dist/es2019/artifacts/replacement-mapping.js +5 -2
- package/dist/es2019/artifacts/themes/atlassian-dark-increased-contrast.js +2 -2
- package/dist/es2019/artifacts/themes/atlassian-dark.js +2 -2
- package/dist/es2019/artifacts/themes/atlassian-light-increased-contrast.js +2 -2
- package/dist/es2019/artifacts/themes/atlassian-light.js +2 -2
- package/dist/es2019/artifacts/token-default-values.js +2 -2
- package/dist/es2019/artifacts/tokens-raw/atlassian-dark-increased-contrast.js +3 -3
- package/dist/es2019/artifacts/tokens-raw/atlassian-dark.js +3 -3
- package/dist/es2019/artifacts/tokens-raw/atlassian-light-increased-contrast.js +3 -3
- package/dist/es2019/artifacts/tokens-raw/atlassian-light.js +3 -3
- package/dist/es2019/artifacts/tokens-raw/atlassian-motion.js +3 -3
- package/dist/es2019/constants.js +1 -0
- package/dist/es2019/custom-theme.js +4 -66
- package/dist/es2019/entry-points/token-metadata.codegen.js +2 -11
- package/dist/es2019/get-custom-theme-styles.js +60 -0
- package/dist/es2019/get-global-theme.js +1 -1
- package/dist/es2019/get-theme-html-attrs.js +1 -1
- package/dist/es2019/get-theme-styles.js +4 -3
- package/dist/es2019/load-custom-theme-styles.js +1 -1
- package/dist/es2019/set-global-theme.js +3 -2
- package/dist/es2019/theme-color-modes.js +7 -0
- package/dist/es2019/theme-config.js +6 -16
- package/dist/es2019/theme-ids.js +7 -0
- package/dist/es2019/theme-state-transformer.js +2 -1
- package/dist/es2019/utils/color-detection.js +3 -11
- package/dist/es2019/utils/color-utils.js +15 -33
- package/dist/es2019/utils/custom-theme-loading-utils.js +4 -8
- package/dist/es2019/utils/custom-theme-token-contrast-check.js +2 -0
- package/dist/es2019/utils/generate-custom-color-ramp.js +11 -15
- package/dist/es2019/utils/get-alpha.js +7 -0
- package/dist/es2019/utils/get-closest-color-index.js +14 -0
- package/dist/es2019/utils/get-css-custom-property.js +23 -0
- package/dist/es2019/utils/get-fully-qualified-token-id.js +11 -0
- package/dist/es2019/utils/get-theme-override-preferences.js +4 -0
- package/dist/es2019/utils/get-theme-preferences.js +1 -4
- package/dist/es2019/utils/get-token-id.js +18 -0
- package/dist/es2019/utils/hct-color-utils/argb-from-rgb.js +6 -0
- package/dist/es2019/utils/hct-color-utils/clamp-double.js +14 -0
- package/dist/es2019/utils/hct-color-utils/clamp-int.js +14 -0
- package/dist/es2019/utils/hct-color-utils/color-utils.js +15 -45
- package/dist/es2019/utils/hct-color-utils/delinearized.js +20 -0
- package/dist/es2019/utils/hct-color-utils/hct.js +3 -76
- package/dist/es2019/utils/hct-color-utils/lerp.js +8 -0
- package/dist/es2019/utils/hct-color-utils/linearized.js +16 -0
- package/dist/es2019/utils/hct-color-utils/math-utils.js +6 -105
- package/dist/es2019/utils/hct-color-utils/matrix-multiply.js +9 -0
- package/dist/es2019/utils/hct-color-utils/sanitize-degrees-double.js +13 -0
- package/dist/es2019/utils/hct-color-utils/signum.js +14 -0
- package/dist/es2019/utils/hct-color-utils/viewing-conditions.js +78 -0
- package/dist/es2019/utils/hex-to-rgba-values.js +9 -0
- package/dist/es2019/utils/hsl-to-rgb.js +8 -0
- package/dist/es2019/utils/is-valid-brand-hex.js +1 -0
- package/dist/es2019/utils/limit-size-of-custom-style-elements.js +8 -0
- package/dist/es2019/utils/load-theme-css.js +7 -0
- package/dist/es2019/utils/relative-luminance-w3-c.js +12 -0
- package/dist/es2019/utils/rgb-to-hex.js +3 -0
- package/dist/es2019/utils/theme-loading.js +3 -8
- package/dist/es2019/utils/token-ids.js +3 -54
- package/dist/esm/artifacts/replacement-mapping.js +5 -2
- package/dist/esm/artifacts/themes/atlassian-dark-increased-contrast.js +2 -2
- package/dist/esm/artifacts/themes/atlassian-dark.js +2 -2
- package/dist/esm/artifacts/themes/atlassian-light-increased-contrast.js +2 -2
- package/dist/esm/artifacts/themes/atlassian-light.js +2 -2
- package/dist/esm/artifacts/token-default-values.js +2 -2
- package/dist/esm/artifacts/tokens-raw/atlassian-dark-increased-contrast.js +3 -3
- package/dist/esm/artifacts/tokens-raw/atlassian-dark.js +3 -3
- package/dist/esm/artifacts/tokens-raw/atlassian-light-increased-contrast.js +3 -3
- package/dist/esm/artifacts/tokens-raw/atlassian-light.js +3 -3
- package/dist/esm/artifacts/tokens-raw/atlassian-motion.js +3 -3
- package/dist/esm/constants.js +1 -0
- package/dist/esm/custom-theme.js +4 -58
- package/dist/esm/entry-points/token-metadata.codegen.js +2 -11
- package/dist/esm/get-custom-theme-styles.js +52 -0
- package/dist/esm/get-global-theme.js +1 -1
- package/dist/esm/get-theme-html-attrs.js +1 -1
- package/dist/esm/get-theme-styles.js +30 -29
- package/dist/esm/load-custom-theme-styles.js +1 -1
- package/dist/esm/set-global-theme.js +34 -32
- package/dist/esm/theme-color-modes.js +7 -0
- package/dist/esm/theme-config.js +8 -17
- package/dist/esm/theme-ids.js +7 -0
- package/dist/esm/theme-state-transformer.js +2 -1
- package/dist/esm/utils/color-detection.js +3 -11
- package/dist/esm/utils/color-utils.js +15 -39
- package/dist/esm/utils/custom-theme-loading-utils.js +4 -11
- package/dist/esm/utils/custom-theme-token-contrast-check.js +2 -0
- package/dist/esm/utils/generate-custom-color-ramp.js +11 -15
- package/dist/esm/utils/get-alpha.js +7 -0
- package/dist/esm/utils/get-closest-color-index.js +14 -0
- package/dist/esm/utils/get-css-custom-property.js +26 -0
- package/dist/esm/utils/get-fully-qualified-token-id.js +13 -0
- package/dist/esm/utils/get-theme-override-preferences.js +5 -0
- package/dist/esm/utils/get-theme-preferences.js +1 -4
- package/dist/esm/utils/get-token-id.js +20 -0
- package/dist/esm/utils/hct-color-utils/argb-from-rgb.js +6 -0
- package/dist/esm/utils/hct-color-utils/clamp-double.js +14 -0
- package/dist/esm/utils/hct-color-utils/clamp-int.js +14 -0
- package/dist/esm/utils/hct-color-utils/color-utils.js +15 -45
- package/dist/esm/utils/hct-color-utils/delinearized.js +20 -0
- package/dist/esm/utils/hct-color-utils/hct.js +5 -87
- package/dist/esm/utils/hct-color-utils/lerp.js +8 -0
- package/dist/esm/utils/hct-color-utils/linearized.js +16 -0
- package/dist/esm/utils/hct-color-utils/math-utils.js +6 -105
- package/dist/esm/utils/hct-color-utils/matrix-multiply.js +9 -0
- package/dist/esm/utils/hct-color-utils/sanitize-degrees-double.js +13 -0
- package/dist/esm/utils/hct-color-utils/signum.js +14 -0
- package/dist/esm/utils/hct-color-utils/viewing-conditions.js +89 -0
- package/dist/esm/utils/hex-to-rgba-values.js +9 -0
- package/dist/esm/utils/hsl-to-rgb.js +12 -0
- package/dist/esm/utils/is-valid-brand-hex.js +3 -0
- package/dist/esm/utils/limit-size-of-custom-style-elements.js +10 -0
- package/dist/esm/utils/load-theme-css.js +25 -0
- package/dist/esm/utils/relative-luminance-w3-c.js +12 -0
- package/dist/esm/utils/rgb-to-hex.js +3 -0
- package/dist/esm/utils/theme-loading.js +11 -32
- package/dist/esm/utils/token-ids.js +3 -61
- package/dist/types/artifacts/replacement-mapping.d.ts +1 -1
- package/dist/types/artifacts/themes/atlassian-dark-increased-contrast.d.ts +2 -2
- package/dist/types/artifacts/themes/atlassian-dark.d.ts +2 -2
- package/dist/types/artifacts/themes/atlassian-light-increased-contrast.d.ts +2 -2
- package/dist/types/artifacts/themes/atlassian-light.d.ts +2 -2
- package/dist/types/artifacts/token-default-values.d.ts +2 -2
- package/dist/types/artifacts/tokens-raw/atlassian-dark-increased-contrast.d.ts +1 -1
- package/dist/types/artifacts/tokens-raw/atlassian-dark.d.ts +1 -1
- package/dist/types/artifacts/tokens-raw/atlassian-light-increased-contrast.d.ts +1 -1
- package/dist/types/artifacts/tokens-raw/atlassian-light.d.ts +1 -1
- package/dist/types/artifacts/tokens-raw/atlassian-motion.d.ts +1 -1
- package/dist/types/artifacts/types-internal.d.ts +2 -2
- package/dist/types/artifacts/types.d.ts +2 -2
- package/dist/types/custom-theme.d.ts +1 -20
- package/dist/types/entry-points/token-metadata.codegen.d.ts +1 -1
- package/dist/types/get-custom-theme-styles.d.ts +16 -0
- package/dist/types/get-global-theme.d.ts +1 -1
- package/dist/types/theme-color-modes.d.ts +7 -0
- package/dist/types/theme-config.d.ts +4 -14
- package/dist/types/theme-ids.d.ts +7 -0
- package/dist/types/theme-state-transformer.d.ts +1 -1
- package/dist/types/utils/color-detection.d.ts +1 -6
- package/dist/types/utils/color-utils.d.ts +5 -5
- package/dist/types/utils/custom-theme-loading-utils.d.ts +1 -2
- package/dist/types/utils/generate-custom-color-ramp.d.ts +1 -2
- package/dist/types/utils/get-alpha.d.ts +1 -0
- package/dist/types/utils/get-closest-color-index.d.ts +2 -0
- package/dist/types/utils/get-css-custom-property.d.ts +15 -0
- package/dist/types/utils/get-fully-qualified-token-id.d.ts +11 -0
- package/dist/types/utils/get-theme-override-preferences.d.ts +2 -0
- package/dist/types/utils/get-theme-preferences.d.ts +1 -1
- package/dist/types/utils/get-token-id.d.ts +15 -0
- package/dist/types/utils/hct-color-utils/argb-from-rgb.d.ts +4 -0
- package/dist/types/utils/hct-color-utils/clamp-double.d.ts +7 -0
- package/dist/types/utils/hct-color-utils/clamp-int.d.ts +7 -0
- package/dist/types/utils/hct-color-utils/color-utils.d.ts +3 -23
- package/dist/types/utils/hct-color-utils/delinearized.d.ts +9 -0
- package/dist/types/utils/hct-color-utils/hct.d.ts +3 -48
- package/dist/types/utils/hct-color-utils/lerp.d.ts +6 -0
- package/dist/types/utils/hct-color-utils/linearized.d.ts +9 -0
- package/dist/types/utils/hct-color-utils/math-utils.d.ts +6 -60
- package/dist/types/utils/hct-color-utils/matrix-multiply.d.ts +4 -0
- package/dist/types/utils/hct-color-utils/sanitize-degrees-double.d.ts +7 -0
- package/dist/types/utils/hct-color-utils/signum.d.ts +6 -0
- package/dist/types/utils/hct-color-utils/viewing-conditions.d.ts +47 -0
- package/dist/types/utils/hex-to-rgba-values.d.ts +6 -0
- package/dist/types/utils/hsl-to-rgb.d.ts +1 -0
- package/dist/types/utils/is-valid-brand-hex.d.ts +1 -0
- package/dist/types/utils/limit-size-of-custom-style-elements.d.ts +1 -0
- package/dist/types/utils/load-theme-css.d.ts +2 -0
- package/dist/types/utils/relative-luminance-w3-c.d.ts +1 -0
- package/dist/types/utils/rgb-to-hex.d.ts +1 -0
- package/dist/types/utils/theme-loading.d.ts +1 -1
- package/dist/types/utils/token-ids.d.ts +3 -41
- package/dist/types-ts4.5/artifacts/replacement-mapping.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/themes/atlassian-dark-increased-contrast.d.ts +2 -2
- package/dist/types-ts4.5/artifacts/themes/atlassian-dark.d.ts +2 -2
- package/dist/types-ts4.5/artifacts/themes/atlassian-light-increased-contrast.d.ts +2 -2
- package/dist/types-ts4.5/artifacts/themes/atlassian-light.d.ts +2 -2
- package/dist/types-ts4.5/artifacts/token-default-values.d.ts +2 -2
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark-increased-contrast.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light-increased-contrast.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-motion.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/types-internal.d.ts +2 -2
- package/dist/types-ts4.5/artifacts/types.d.ts +2 -2
- package/dist/types-ts4.5/custom-theme.d.ts +1 -20
- package/dist/types-ts4.5/entry-points/token-metadata.codegen.d.ts +1 -1
- package/dist/types-ts4.5/get-custom-theme-styles.d.ts +16 -0
- package/dist/types-ts4.5/get-global-theme.d.ts +1 -1
- package/dist/types-ts4.5/theme-color-modes.d.ts +11 -0
- package/dist/types-ts4.5/theme-config.d.ts +4 -29
- package/dist/types-ts4.5/theme-ids.d.ts +18 -0
- package/dist/types-ts4.5/theme-state-transformer.d.ts +1 -1
- package/dist/types-ts4.5/utils/color-detection.d.ts +1 -6
- package/dist/types-ts4.5/utils/color-utils.d.ts +5 -9
- package/dist/types-ts4.5/utils/custom-theme-loading-utils.d.ts +1 -2
- package/dist/types-ts4.5/utils/generate-custom-color-ramp.d.ts +1 -2
- package/dist/types-ts4.5/utils/get-alpha.d.ts +1 -0
- package/dist/types-ts4.5/utils/get-closest-color-index.d.ts +2 -0
- package/dist/types-ts4.5/utils/get-css-custom-property.d.ts +15 -0
- package/dist/types-ts4.5/utils/get-fully-qualified-token-id.d.ts +11 -0
- package/dist/types-ts4.5/utils/get-theme-override-preferences.d.ts +2 -0
- package/dist/types-ts4.5/utils/get-theme-preferences.d.ts +1 -1
- package/dist/types-ts4.5/utils/get-token-id.d.ts +15 -0
- package/dist/types-ts4.5/utils/hct-color-utils/argb-from-rgb.d.ts +4 -0
- package/dist/types-ts4.5/utils/hct-color-utils/clamp-double.d.ts +7 -0
- package/dist/types-ts4.5/utils/hct-color-utils/clamp-int.d.ts +7 -0
- package/dist/types-ts4.5/utils/hct-color-utils/color-utils.d.ts +3 -23
- package/dist/types-ts4.5/utils/hct-color-utils/delinearized.d.ts +9 -0
- package/dist/types-ts4.5/utils/hct-color-utils/hct.d.ts +3 -48
- package/dist/types-ts4.5/utils/hct-color-utils/lerp.d.ts +6 -0
- package/dist/types-ts4.5/utils/hct-color-utils/linearized.d.ts +9 -0
- package/dist/types-ts4.5/utils/hct-color-utils/math-utils.d.ts +6 -60
- package/dist/types-ts4.5/utils/hct-color-utils/matrix-multiply.d.ts +4 -0
- package/dist/types-ts4.5/utils/hct-color-utils/sanitize-degrees-double.d.ts +7 -0
- package/dist/types-ts4.5/utils/hct-color-utils/signum.d.ts +6 -0
- package/dist/types-ts4.5/utils/hct-color-utils/viewing-conditions.d.ts +47 -0
- package/dist/types-ts4.5/utils/hex-to-rgba-values.d.ts +6 -0
- package/dist/types-ts4.5/utils/hsl-to-rgb.d.ts +5 -0
- package/dist/types-ts4.5/utils/is-valid-brand-hex.d.ts +1 -0
- package/dist/types-ts4.5/utils/limit-size-of-custom-style-elements.d.ts +1 -0
- package/dist/types-ts4.5/utils/load-theme-css.d.ts +2 -0
- package/dist/types-ts4.5/utils/relative-luminance-w3-c.d.ts +1 -0
- package/dist/types-ts4.5/utils/rgb-to-hex.d.ts +1 -0
- package/dist/types-ts4.5/utils/theme-loading.d.ts +1 -1
- package/dist/types-ts4.5/utils/token-ids.d.ts +3 -41
- package/figma/atlassian-dark-increased-contrast.json +1 -1
- package/figma/atlassian-dark.json +1 -1
- package/figma/atlassian-light-increased-contrast.json +1 -1
- package/figma/atlassian-light.json +1 -1
- package/package.json +12 -12
- package/tokens.docs.tsx +48 -46
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
export declare class ViewingConditions {
|
|
2
|
+
/**
|
|
3
|
+
* sRGB-like viewing conditions.
|
|
4
|
+
*/
|
|
5
|
+
static DEFAULT: ViewingConditions;
|
|
6
|
+
/**
|
|
7
|
+
* Create ViewingConditions from a simple, physically relevant, set of
|
|
8
|
+
* parameters.
|
|
9
|
+
*
|
|
10
|
+
* @param whitePoint White point, measured in the XYZ color space.
|
|
11
|
+
* default = D65, or sunny day afternoon
|
|
12
|
+
* @param adaptingLuminance The luminance of the adapting field. Informally,
|
|
13
|
+
* how bright it is in the room where the color is viewed. Can be
|
|
14
|
+
* calculated from lux by multiplying lux by 0.0586. default = 11.72,
|
|
15
|
+
* or 200 lux.
|
|
16
|
+
* @param backgroundLstar The lightness of the area surrounding the color.
|
|
17
|
+
* measured by L* in L*a*b*. default = 50.0
|
|
18
|
+
* @param surround A general description of the lighting surrounding the
|
|
19
|
+
* color. 0 is pitch dark, like watching a movie in a theater. 1.0 is a
|
|
20
|
+
* dimly light room, like watching TV at home at night. 2.0 means there
|
|
21
|
+
* is no difference between the lighting on the color and around it.
|
|
22
|
+
* default = 2.0
|
|
23
|
+
* @param discountingIlluminant Whether the eye accounts for the tint of the
|
|
24
|
+
* ambient lighting, such as knowing an apple is still red in green light.
|
|
25
|
+
* default = false, the eye does not perform this process on
|
|
26
|
+
* self-luminous objects like displays.
|
|
27
|
+
*/
|
|
28
|
+
static make(whitePoint?: number[], adaptingLuminance?: number, backgroundLstar?: number, surround?: number, discountingIlluminant?: boolean): ViewingConditions;
|
|
29
|
+
/**
|
|
30
|
+
* Parameters are intermediate values of the CAM16 conversion process. Their
|
|
31
|
+
* names are shorthand for technical color science terminology, this class
|
|
32
|
+
* would not benefit from documenting them individually. A brief overview
|
|
33
|
+
* is available in the CAM16 specification, and a complete overview requires
|
|
34
|
+
* a color science textbook, such as Fairchild's Color Appearance Models.
|
|
35
|
+
*/
|
|
36
|
+
n: number;
|
|
37
|
+
aw: number;
|
|
38
|
+
nbb: number;
|
|
39
|
+
ncb: number;
|
|
40
|
+
c: number;
|
|
41
|
+
nc: number;
|
|
42
|
+
rgbD: number[];
|
|
43
|
+
fl: number;
|
|
44
|
+
fLRoot: number;
|
|
45
|
+
z: number;
|
|
46
|
+
private constructor();
|
|
47
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const isValidBrandHex: (hex: string) => boolean;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function limitSizeOfCustomStyleElements(sizeThreshold: number): void;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function relativeLuminanceW3C(r: number, g: number, b: number): number;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function rgbToHex(r: number, g: number, b: number): string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { type ThemeIdsWithOverrides } from '../theme-config';
|
|
2
2
|
export declare const loadAndAppendThemeCss: (themeId: ThemeIdsWithOverrides) => Promise<void>;
|
|
3
|
-
export declare const loadThemeCss: (themeId: ThemeIdsWithOverrides) => Promise<string>;
|
|
4
3
|
export declare const darkModeMediaQuery = "(prefers-color-scheme: dark)";
|
|
5
4
|
export declare const moreContrastMediaQuery = "(prefers-contrast: more)";
|
|
5
|
+
export { loadThemeCss } from './load-theme-css';
|
|
@@ -1,41 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
* A css prefix will be prepended and all [default] key words will be omitted
|
|
5
|
-
* from the path
|
|
6
|
-
*
|
|
7
|
-
* @example <caption>Passing a path as an array</caption>
|
|
8
|
-
* // Returns ds-background-bold
|
|
9
|
-
* getCSSCustomProperty(['color', 'background', 'bold', '[default]'])
|
|
10
|
-
*
|
|
11
|
-
* @example <caption>Passing a path as a string</caption>
|
|
12
|
-
* // Returns ds-background-bold
|
|
13
|
-
* getCSSCustomProperty('color.background.bold.[default]')
|
|
14
|
-
*/
|
|
15
|
-
export declare const getCSSCustomProperty: (path: string | string[]) => string;
|
|
16
|
-
/**
|
|
17
|
-
* Transforms a style dictionary token path to a shorthand token id
|
|
18
|
-
* These ids will be typically be how tokens are interacted with via typescript and css
|
|
19
|
-
*
|
|
20
|
-
* All [default] key words will be omitted from the path
|
|
21
|
-
*
|
|
22
|
-
* @example <caption>Passing a path as an array</caption>
|
|
23
|
-
* // Returns color.background.bold
|
|
24
|
-
* getTokenId(['color', 'background', 'bold', '[default]'])
|
|
25
|
-
*
|
|
26
|
-
* @example <caption>Passing a path as a string</caption>
|
|
27
|
-
* // Returns color.background.bold
|
|
28
|
-
* getTokenId('color.background.bold.[default]')
|
|
29
|
-
*/
|
|
30
|
-
export declare const getTokenId: (path: string | string[]) => string;
|
|
31
|
-
/**
|
|
32
|
-
* Transforms a style dictionary token path to a fully qualified token id
|
|
33
|
-
* These Ids are intended to be used internal to this package by style-dictionary
|
|
34
|
-
*
|
|
35
|
-
* [default] key words will NOT be omitted from the path
|
|
36
|
-
*
|
|
37
|
-
* @example <caption>Passing a path as a string</caption>
|
|
38
|
-
* // Returns color.background.bold.[default]
|
|
39
|
-
* getFullyQualifiedTokenId(['color', 'background', 'bold', '[default]'])
|
|
40
|
-
*/
|
|
41
|
-
export declare const getFullyQualifiedTokenId: (path: string[]) => string;
|
|
1
|
+
export { getCSSCustomProperty } from './get-css-custom-property';
|
|
2
|
+
export { getTokenId } from './get-token-id';
|
|
3
|
+
export { getFullyQualifiedTokenId } from './get-fully-qualified-token-id';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/tokens",
|
|
3
|
-
"version": "13.0
|
|
3
|
+
"version": "13.1.0",
|
|
4
4
|
"description": "Design tokens are the single source of truth to name and store design decisions.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -50,33 +50,33 @@
|
|
|
50
50
|
"devDependencies": {
|
|
51
51
|
"@af/formatting": "workspace:^",
|
|
52
52
|
"@af/visual-regression": "workspace:^",
|
|
53
|
-
"@atlaskit/avatar": "^25.
|
|
53
|
+
"@atlaskit/avatar": "^25.15.0",
|
|
54
54
|
"@atlaskit/button": "^23.11.0",
|
|
55
55
|
"@atlaskit/calendar": "^17.2.0",
|
|
56
56
|
"@atlaskit/checkbox": "^17.3.0",
|
|
57
57
|
"@atlaskit/code": "^17.5.0",
|
|
58
58
|
"@atlaskit/css": "^0.19.0",
|
|
59
59
|
"@atlaskit/docs": "^11.8.0",
|
|
60
|
-
"@atlaskit/dropdown-menu": "^16.
|
|
60
|
+
"@atlaskit/dropdown-menu": "^16.9.0",
|
|
61
61
|
"@atlaskit/dynamic-table": "^18.4.0",
|
|
62
62
|
"@atlaskit/form": "^15.5.0",
|
|
63
63
|
"@atlaskit/heading": "^5.4.0",
|
|
64
|
-
"@atlaskit/icon": "^
|
|
64
|
+
"@atlaskit/icon": "^35.3.0",
|
|
65
65
|
"@atlaskit/inline-message": "^15.6.0",
|
|
66
66
|
"@atlaskit/link": "^3.4.0",
|
|
67
67
|
"@atlaskit/lozenge": "^13.8.0",
|
|
68
|
-
"@atlaskit/popup": "^4.
|
|
68
|
+
"@atlaskit/popup": "^4.22.0",
|
|
69
69
|
"@atlaskit/primitives": "^19.0.0",
|
|
70
70
|
"@atlaskit/radio": "^8.6.0",
|
|
71
|
-
"@atlaskit/section-message": "^8.
|
|
72
|
-
"@atlaskit/select": "^21.
|
|
73
|
-
"@atlaskit/tag": "^14.
|
|
71
|
+
"@atlaskit/section-message": "^8.13.0",
|
|
72
|
+
"@atlaskit/select": "^21.12.0",
|
|
73
|
+
"@atlaskit/tag": "^14.14.0",
|
|
74
74
|
"@atlaskit/textarea": "^8.3.0",
|
|
75
75
|
"@atlaskit/textfield": "^8.3.0",
|
|
76
|
-
"@atlaskit/theme": "^
|
|
77
|
-
"@atlaskit/tooltip": "^
|
|
76
|
+
"@atlaskit/theme": "^25.0.0",
|
|
77
|
+
"@atlaskit/tooltip": "^22.4.0",
|
|
78
78
|
"@atlassian/codegen": "^0.2.0",
|
|
79
|
-
"@atlassian/feature-flags-test-utils": "^1.
|
|
79
|
+
"@atlassian/feature-flags-test-utils": "^1.1.0",
|
|
80
80
|
"@atlassian/react-compiler-gating": "workspace:^",
|
|
81
81
|
"@atlassian/structured-docs-types": "workspace:^",
|
|
82
82
|
"@atlassian/ts-loader": "^0.1.0",
|
|
@@ -92,7 +92,7 @@
|
|
|
92
92
|
"lodash": "^4.17.21",
|
|
93
93
|
"postcss": "^8.4.7",
|
|
94
94
|
"postcss-less": "^6.0.0",
|
|
95
|
-
"react": "^
|
|
95
|
+
"react": "^19.0.0",
|
|
96
96
|
"react-window": "^1.8.8",
|
|
97
97
|
"style-dictionary": "^3.8.0"
|
|
98
98
|
},
|
package/tokens.docs.tsx
CHANGED
|
@@ -1,53 +1,55 @@
|
|
|
1
1
|
import path from 'path';
|
|
2
2
|
|
|
3
|
-
import type {
|
|
3
|
+
import type { StructuredContentSource } from '@atlassian/structured-docs-types/types';
|
|
4
4
|
|
|
5
|
-
const documentation:
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
description:
|
|
9
|
-
'Design tokens provide consistent, semantic values for colors, spacing, typography, motion, and other design properties across the Atlassian Design System. Use tokens instead of hardcoded values to ensure consistency and proper theming.',
|
|
10
|
-
status: 'general-availability',
|
|
11
|
-
import: {
|
|
5
|
+
const documentation: StructuredContentSource = {
|
|
6
|
+
components: [
|
|
7
|
+
{
|
|
12
8
|
name: 'token',
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
],
|
|
23
|
-
accessibilityGuidelines: [
|
|
24
|
-
'Use color tokens to ensure proper contrast ratios',
|
|
25
|
-
'Test color combinations for accessibility compliance',
|
|
26
|
-
'Use semantic color names (success, warning, danger) for better meaning',
|
|
27
|
-
],
|
|
28
|
-
examples: [
|
|
29
|
-
{
|
|
30
|
-
name: 'Basic',
|
|
31
|
-
description: 'Basic example',
|
|
32
|
-
source: path.resolve(__dirname, './examples/ai/basic.tsx'),
|
|
9
|
+
description:
|
|
10
|
+
'Design tokens provide consistent, semantic values for colors, spacing, typography, motion, and other design properties across the Atlassian Design System. Use tokens instead of hardcoded values to ensure consistency and proper theming.',
|
|
11
|
+
status: 'general-availability',
|
|
12
|
+
import: {
|
|
13
|
+
name: 'token',
|
|
14
|
+
package: '@atlaskit/tokens',
|
|
15
|
+
type: 'named',
|
|
16
|
+
packagePath: path.resolve(__dirname),
|
|
17
|
+
packageJson: require('./package.json'),
|
|
33
18
|
},
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
19
|
+
usageGuidelines: [
|
|
20
|
+
'AVOID hardcoding any CSS values where a token exists for that type; in many cases you may be forced to use a token',
|
|
21
|
+
'Use the `token()` function with CSS-in-JS',
|
|
22
|
+
'Use semantic token names for better maintainability',
|
|
23
|
+
],
|
|
24
|
+
accessibilityGuidelines: [
|
|
25
|
+
'Use color tokens to ensure proper contrast ratios',
|
|
26
|
+
'Test color combinations for accessibility compliance',
|
|
27
|
+
'Use semantic color names (success, warning, danger) for better meaning',
|
|
28
|
+
],
|
|
29
|
+
examples: [
|
|
30
|
+
{
|
|
31
|
+
name: 'Basic',
|
|
32
|
+
description: 'Basic example',
|
|
33
|
+
source: path.resolve(__dirname, './examples/ai/basic.tsx'),
|
|
34
|
+
},
|
|
35
|
+
],
|
|
36
|
+
keywords: [
|
|
37
|
+
'token',
|
|
38
|
+
'design',
|
|
39
|
+
'system',
|
|
40
|
+
'color',
|
|
41
|
+
'motion',
|
|
42
|
+
'spacing',
|
|
43
|
+
'typography',
|
|
44
|
+
'radius',
|
|
45
|
+
'theme',
|
|
46
|
+
'css',
|
|
47
|
+
'style',
|
|
48
|
+
'variable',
|
|
49
|
+
],
|
|
50
|
+
categories: ['tokens'],
|
|
51
|
+
},
|
|
52
|
+
],
|
|
53
|
+
};
|
|
52
54
|
|
|
53
55
|
export default documentation;
|