@atlaskit/tokens 13.0.4 → 13.1.1
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 +16 -0
- package/codemods/css-to-design-tokens/lib/colors.tsx +3 -8
- package/codemods/css-to-design-tokens/lib/declaration.tsx +3 -13
- package/codemods/css-to-design-tokens/lib/extract-between-parentheses.tsx +4 -0
- package/codemods/css-to-design-tokens/lib/extract-less-var-name.tsx +3 -0
- package/codemods/css-to-design-tokens/lib/get-css-var-meta.tsx +13 -0
- package/codemods/css-to-design-tokens/lib/get-named-color-meta.tsx +5 -0
- package/codemods/css-to-design-tokens/lib/get-raw-color-meta.tsx +11 -0
- package/codemods/css-to-design-tokens/lib/is-css-declaration.tsx +3 -0
- package/codemods/css-to-design-tokens/lib/is-known-css-variable.tsx +5 -0
- package/codemods/css-to-design-tokens/lib/known-named-colors.tsx +150 -0
- package/codemods/css-to-design-tokens/lib/known-raw-colors.tsx +17 -0
- package/codemods/css-to-design-tokens/lib/known-variables.tsx +167 -0
- package/codemods/css-to-design-tokens/lib/legacy-colors.tsx +3 -335
- package/codemods/css-to-design-tokens/lib/meta.tsx +3 -28
- package/codemods/css-to-design-tokens/lib/split-css-value.tsx +4 -0
- package/codemods/css-to-design-tokens/lib/value.tsx +6 -9
- package/codemods/css-to-design-tokens/transform.tsx +3 -1
- package/dist/cjs/artifacts/palettes-raw/palette.js +35 -1
- 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/constants.js +1 -0
- package/dist/cjs/entry-points/theme-state-transformer.js +4 -3
- package/dist/cjs/entry-points/token-metadata.codegen.js +2 -2
- package/dist/cjs/get-custom-theme-styles.js +7 -6
- 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 +27 -27
- package/dist/cjs/index.js +4 -3
- package/dist/cjs/is-color-mode.js +9 -0
- package/dist/cjs/is-theme-ids.js +12 -0
- package/dist/cjs/is-theme-kind.js +12 -0
- package/dist/cjs/set-global-theme.js +32 -31
- package/dist/cjs/theme-config.js +9 -43
- package/dist/cjs/theme-object-to-string.js +42 -0
- package/dist/cjs/theme-options-schema.js +1 -0
- package/dist/cjs/theme-state-defaults.js +39 -0
- package/dist/cjs/theme-state.js +5 -0
- package/dist/cjs/theme-string-to-object.js +51 -0
- package/dist/cjs/utils/additional-contrast-checker.js +43 -0
- package/dist/cjs/utils/custom-theme-loading-utils.js +0 -20
- package/dist/cjs/utils/custom-theme-token-contrast-check.js +2 -38
- package/dist/cjs/utils/delta-e.js +26 -0
- package/dist/cjs/utils/generate-colors.js +47 -0
- package/dist/cjs/utils/generate-token-map-with-contrast-check.js +32 -0
- package/dist/cjs/utils/{generate-custom-color-ramp.js → generate-token-map.js} +6 -71
- package/dist/cjs/utils/get-closest-color-index.js +3 -2
- package/dist/cjs/utils/get-contrast-ratio.js +22 -0
- package/dist/cjs/utils/hct-color-utils/alpha-from-argb.js +12 -0
- package/dist/cjs/utils/hct-color-utils/argb-from-linrgb.js +17 -0
- package/dist/cjs/utils/hct-color-utils/argb-from-lstar.js +21 -0
- package/dist/cjs/utils/hct-color-utils/argb-from-rgba.js +24 -0
- package/dist/cjs/utils/hct-color-utils/argb-from-xyz.js +29 -0
- package/dist/cjs/utils/hct-color-utils/blue-from-argb.js +12 -0
- package/dist/cjs/utils/hct-color-utils/clamp-component.js +15 -0
- package/dist/cjs/utils/hct-color-utils/contrast.js +10 -11
- package/dist/cjs/utils/hct-color-utils/green-from-argb.js +12 -0
- package/dist/cjs/utils/hct-color-utils/hct.js +18 -12
- package/dist/cjs/utils/hct-color-utils/index.js +4 -3
- package/dist/cjs/utils/hct-color-utils/lab-f.js +15 -0
- package/dist/cjs/utils/hct-color-utils/lab-invf.js +16 -0
- package/dist/cjs/utils/hct-color-utils/lstar-from-argb.js +34 -0
- package/dist/cjs/utils/hct-color-utils/lstar-from-y.js +21 -0
- package/dist/cjs/utils/hct-color-utils/red-from-argb.js +12 -0
- package/dist/cjs/utils/hct-color-utils/rgba-from-argb.js +28 -0
- package/dist/cjs/utils/hct-color-utils/rgba.js +1 -0
- package/dist/cjs/utils/hct-color-utils/viewing-conditions.js +5 -4
- package/dist/cjs/utils/hct-color-utils/white-point-d65.js +14 -0
- package/dist/cjs/utils/hct-color-utils/y-from-lstar.js +21 -0
- package/dist/cjs/utils/hex-to-hsl.js +52 -0
- package/dist/cjs/utils/hex-to-rgb-a.js +20 -0
- package/dist/cjs/utils/hex-to-rgb.js +19 -0
- package/dist/cjs/utils/is-valid-hex.js +10 -0
- package/dist/cjs/utils/load-theme-css.js +4 -4
- package/dist/cjs/utils/reduce-token-map.js +18 -0
- package/dist/cjs/utils/rgb-to-lab.js +24 -0
- package/dist/cjs/utils/theme-loading.js +8 -8
- package/dist/es2019/artifacts/palettes-raw/palette.js +35 -1
- 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/constants.js +1 -0
- package/dist/es2019/entry-points/theme-state-transformer.js +2 -1
- package/dist/es2019/entry-points/token-metadata.codegen.js +2 -2
- package/dist/es2019/get-custom-theme-styles.js +3 -2
- package/dist/es2019/get-global-theme.js +1 -1
- package/dist/es2019/get-theme-html-attrs.js +1 -1
- package/dist/es2019/index.js +2 -1
- package/dist/es2019/is-color-mode.js +3 -0
- package/dist/es2019/is-theme-ids.js +4 -0
- package/dist/es2019/is-theme-kind.js +4 -0
- package/dist/es2019/theme-config.js +5 -44
- package/dist/es2019/theme-object-to-string.js +28 -0
- package/dist/es2019/theme-options-schema.js +0 -0
- package/dist/es2019/theme-state-defaults.js +34 -0
- package/dist/es2019/theme-state.js +1 -0
- package/dist/es2019/theme-string-to-object.js +38 -0
- package/dist/es2019/utils/additional-contrast-checker.js +39 -0
- package/dist/es2019/utils/custom-theme-loading-utils.js +1 -9
- package/dist/es2019/utils/custom-theme-token-contrast-check.js +1 -39
- package/dist/es2019/utils/delta-e.js +20 -0
- package/dist/es2019/utils/generate-colors.js +39 -0
- package/dist/es2019/utils/generate-token-map-with-contrast-check.js +21 -0
- package/dist/es2019/utils/{generate-custom-color-ramp.js → generate-token-map.js} +3 -59
- package/dist/es2019/utils/get-closest-color-index.js +2 -1
- package/dist/es2019/utils/get-contrast-ratio.js +16 -0
- package/dist/es2019/utils/hct-color-utils/alpha-from-argb.js +6 -0
- package/dist/es2019/utils/hct-color-utils/argb-from-linrgb.js +12 -0
- package/dist/es2019/utils/hct-color-utils/argb-from-lstar.js +16 -0
- package/dist/es2019/utils/hct-color-utils/argb-from-rgba.js +19 -0
- package/dist/es2019/utils/hct-color-utils/argb-from-xyz.js +24 -0
- package/dist/es2019/utils/hct-color-utils/blue-from-argb.js +6 -0
- package/dist/es2019/utils/hct-color-utils/clamp-component.js +9 -0
- package/dist/es2019/utils/hct-color-utils/contrast.js +10 -10
- package/dist/es2019/utils/hct-color-utils/green-from-argb.js +6 -0
- package/dist/es2019/utils/hct-color-utils/hct.js +19 -12
- package/dist/es2019/utils/hct-color-utils/index.js +2 -1
- package/dist/es2019/utils/hct-color-utils/lab-f.js +9 -0
- package/dist/es2019/utils/hct-color-utils/lab-invf.js +10 -0
- package/dist/es2019/utils/hct-color-utils/lstar-from-argb.js +28 -0
- package/dist/es2019/utils/hct-color-utils/lstar-from-y.js +16 -0
- package/dist/es2019/utils/hct-color-utils/red-from-argb.js +6 -0
- package/dist/es2019/utils/hct-color-utils/rgba-from-argb.js +22 -0
- package/dist/es2019/utils/hct-color-utils/rgba.js +0 -0
- package/dist/es2019/utils/hct-color-utils/viewing-conditions.js +4 -3
- package/dist/es2019/utils/hct-color-utils/white-point-d65.js +8 -0
- package/dist/es2019/utils/hct-color-utils/y-from-lstar.js +16 -0
- package/dist/es2019/utils/hex-to-hsl.js +46 -0
- package/dist/es2019/utils/hex-to-rgb-a.js +14 -0
- package/dist/es2019/utils/hex-to-rgb.js +13 -0
- package/dist/es2019/utils/is-valid-hex.js +2 -0
- package/dist/es2019/utils/reduce-token-map.js +7 -0
- package/dist/es2019/utils/rgb-to-lab.js +18 -0
- package/dist/esm/artifacts/palettes-raw/palette.js +35 -1
- 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/constants.js +1 -0
- package/dist/esm/entry-points/theme-state-transformer.js +2 -1
- package/dist/esm/entry-points/token-metadata.codegen.js +2 -2
- package/dist/esm/get-custom-theme-styles.js +3 -2
- 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 +26 -26
- package/dist/esm/index.js +2 -1
- package/dist/esm/is-color-mode.js +3 -0
- package/dist/esm/is-theme-ids.js +6 -0
- package/dist/esm/is-theme-kind.js +6 -0
- package/dist/esm/set-global-theme.js +31 -30
- package/dist/esm/theme-config.js +5 -44
- package/dist/esm/theme-object-to-string.js +35 -0
- package/dist/esm/theme-options-schema.js +0 -0
- package/dist/esm/theme-state-defaults.js +34 -0
- package/dist/esm/theme-state.js +1 -0
- package/dist/esm/theme-string-to-object.js +44 -0
- package/dist/esm/utils/additional-contrast-checker.js +36 -0
- package/dist/esm/utils/custom-theme-loading-utils.js +1 -13
- package/dist/esm/utils/custom-theme-token-contrast-check.js +1 -36
- package/dist/esm/utils/delta-e.js +20 -0
- package/dist/esm/utils/generate-colors.js +40 -0
- package/dist/esm/utils/generate-token-map-with-contrast-check.js +25 -0
- package/dist/esm/utils/{generate-custom-color-ramp.js → generate-token-map.js} +3 -63
- package/dist/esm/utils/get-closest-color-index.js +2 -1
- package/dist/esm/utils/get-contrast-ratio.js +16 -0
- package/dist/esm/utils/hct-color-utils/alpha-from-argb.js +6 -0
- package/dist/esm/utils/hct-color-utils/argb-from-linrgb.js +12 -0
- package/dist/esm/utils/hct-color-utils/argb-from-lstar.js +16 -0
- package/dist/esm/utils/hct-color-utils/argb-from-rgba.js +18 -0
- package/dist/esm/utils/hct-color-utils/argb-from-xyz.js +24 -0
- package/dist/esm/utils/hct-color-utils/blue-from-argb.js +6 -0
- package/dist/esm/utils/hct-color-utils/clamp-component.js +9 -0
- package/dist/esm/utils/hct-color-utils/contrast.js +10 -10
- package/dist/esm/utils/hct-color-utils/green-from-argb.js +6 -0
- package/dist/esm/utils/hct-color-utils/hct.js +19 -12
- package/dist/esm/utils/hct-color-utils/index.js +2 -1
- package/dist/esm/utils/hct-color-utils/lab-f.js +9 -0
- package/dist/esm/utils/hct-color-utils/lab-invf.js +10 -0
- package/dist/esm/utils/hct-color-utils/lstar-from-argb.js +28 -0
- package/dist/esm/utils/hct-color-utils/lstar-from-y.js +16 -0
- package/dist/esm/utils/hct-color-utils/red-from-argb.js +6 -0
- package/dist/esm/utils/hct-color-utils/rgba-from-argb.js +22 -0
- package/dist/esm/utils/hct-color-utils/rgba.js +0 -0
- package/dist/esm/utils/hct-color-utils/viewing-conditions.js +5 -4
- package/dist/esm/utils/hct-color-utils/white-point-d65.js +8 -0
- package/dist/esm/utils/hct-color-utils/y-from-lstar.js +16 -0
- package/dist/esm/utils/hex-to-hsl.js +46 -0
- package/dist/esm/utils/hex-to-rgb-a.js +14 -0
- package/dist/esm/utils/hex-to-rgb.js +13 -0
- package/dist/esm/utils/is-valid-hex.js +4 -0
- package/dist/esm/utils/load-theme-css.js +4 -4
- package/dist/esm/utils/reduce-token-map.js +11 -0
- package/dist/esm/utils/rgb-to-lab.js +18 -0
- package/dist/esm/utils/theme-loading.js +8 -8
- package/dist/types/artifacts/palettes-raw/palette.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/entry-points/theme-state-transformer.d.ts +2 -1
- package/dist/types/entry-points/token-metadata.codegen.d.ts +1 -1
- package/dist/types/index.d.ts +2 -1
- package/dist/types/is-color-mode.d.ts +2 -0
- package/dist/types/is-theme-ids.d.ts +2 -0
- package/dist/types/is-theme-kind.d.ts +4 -0
- package/dist/types/theme-color-modes.d.ts +1 -0
- package/dist/types/theme-config.d.ts +8 -40
- package/dist/types/theme-ids.d.ts +1 -0
- package/dist/types/theme-object-to-string.d.ts +13 -0
- package/dist/types/theme-options-schema.d.ts +7 -0
- package/dist/types/theme-state-defaults.d.ts +14 -0
- package/dist/types/theme-state.d.ts +17 -0
- package/dist/types/{theme-state-transformer.d.ts → theme-string-to-object.d.ts} +0 -12
- package/dist/types/utils/additional-contrast-checker.d.ts +9 -0
- package/dist/types/utils/custom-theme-loading-utils.d.ts +1 -6
- package/dist/types/utils/custom-theme-token-contrast-check.d.ts +0 -9
- package/dist/types/utils/delta-e.d.ts +1 -0
- package/dist/types/utils/generate-colors.d.ts +5 -0
- package/dist/types/utils/{generate-custom-color-ramp.d.ts → generate-token-map-with-contrast-check.d.ts} +1 -6
- package/dist/types/utils/generate-token-map.d.ts +9 -0
- package/dist/types/utils/get-contrast-ratio.d.ts +1 -0
- package/dist/types/utils/hct-color-utils/alpha-from-argb.d.ts +4 -0
- package/dist/types/utils/hct-color-utils/argb-from-linrgb.d.ts +4 -0
- package/dist/types/utils/hct-color-utils/argb-from-lstar.d.ts +8 -0
- package/dist/types/utils/hct-color-utils/argb-from-rgba.d.ts +8 -0
- package/dist/types/utils/hct-color-utils/argb-from-xyz.d.ts +4 -0
- package/dist/types/utils/hct-color-utils/blue-from-argb.d.ts +4 -0
- package/dist/types/utils/hct-color-utils/clamp-component.d.ts +1 -0
- package/dist/types/utils/hct-color-utils/green-from-argb.d.ts +4 -0
- package/dist/types/utils/hct-color-utils/index.d.ts +2 -1
- package/dist/types/utils/hct-color-utils/lab-f.d.ts +1 -0
- package/dist/types/utils/hct-color-utils/lab-invf.d.ts +1 -0
- package/dist/types/utils/hct-color-utils/lstar-from-argb.d.ts +7 -0
- package/dist/types/utils/hct-color-utils/lstar-from-y.d.ts +12 -0
- package/dist/types/utils/hct-color-utils/red-from-argb.d.ts +4 -0
- package/dist/types/utils/hct-color-utils/rgba-from-argb.d.ts +8 -0
- package/dist/types/utils/hct-color-utils/rgba.d.ts +14 -0
- package/dist/types/utils/hct-color-utils/white-point-d65.d.ts +6 -0
- package/dist/types/utils/hct-color-utils/y-from-lstar.d.ts +12 -0
- package/dist/types/utils/hex-to-hsl.d.ts +1 -0
- package/dist/types/utils/hex-to-rgb-a.d.ts +1 -0
- package/dist/types/utils/hex-to-rgb.d.ts +1 -0
- package/dist/types/utils/is-valid-hex.d.ts +1 -0
- package/dist/types/utils/reduce-token-map.d.ts +6 -0
- package/dist/types/utils/rgb-to-lab.d.ts +1 -0
- package/dist/types-ts4.5/artifacts/palettes-raw/palette.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/entry-points/theme-state-transformer.d.ts +2 -1
- package/dist/types-ts4.5/entry-points/token-metadata.codegen.d.ts +1 -1
- package/dist/types-ts4.5/index.d.ts +2 -1
- package/dist/types-ts4.5/is-color-mode.d.ts +2 -0
- package/dist/types-ts4.5/is-theme-ids.d.ts +2 -0
- package/dist/types-ts4.5/is-theme-kind.d.ts +11 -0
- package/dist/types-ts4.5/theme-color-modes.d.ts +1 -0
- package/dist/types-ts4.5/theme-config.d.ts +8 -40
- package/dist/types-ts4.5/theme-ids.d.ts +1 -0
- package/dist/types-ts4.5/theme-object-to-string.d.ts +13 -0
- package/dist/types-ts4.5/theme-options-schema.d.ts +7 -0
- package/dist/types-ts4.5/theme-state-defaults.d.ts +14 -0
- package/dist/types-ts4.5/theme-state.d.ts +17 -0
- package/dist/types-ts4.5/{theme-state-transformer.d.ts → theme-string-to-object.d.ts} +0 -12
- package/dist/types-ts4.5/utils/additional-contrast-checker.d.ts +9 -0
- package/dist/types-ts4.5/utils/custom-theme-loading-utils.d.ts +1 -6
- package/dist/types-ts4.5/utils/custom-theme-token-contrast-check.d.ts +0 -9
- package/dist/types-ts4.5/utils/delta-e.d.ts +1 -0
- package/dist/types-ts4.5/utils/generate-colors.d.ts +5 -0
- package/dist/types-ts4.5/utils/{generate-custom-color-ramp.d.ts → generate-token-map-with-contrast-check.d.ts} +1 -8
- package/dist/types-ts4.5/utils/generate-token-map.d.ts +11 -0
- package/dist/types-ts4.5/utils/get-contrast-ratio.d.ts +1 -0
- package/dist/types-ts4.5/utils/hct-color-utils/alpha-from-argb.d.ts +4 -0
- package/dist/types-ts4.5/utils/hct-color-utils/argb-from-linrgb.d.ts +4 -0
- package/dist/types-ts4.5/utils/hct-color-utils/argb-from-lstar.d.ts +8 -0
- package/dist/types-ts4.5/utils/hct-color-utils/argb-from-rgba.d.ts +8 -0
- package/dist/types-ts4.5/utils/hct-color-utils/argb-from-xyz.d.ts +4 -0
- package/dist/types-ts4.5/utils/hct-color-utils/blue-from-argb.d.ts +4 -0
- package/dist/types-ts4.5/utils/hct-color-utils/clamp-component.d.ts +1 -0
- package/dist/types-ts4.5/utils/hct-color-utils/green-from-argb.d.ts +4 -0
- package/dist/types-ts4.5/utils/hct-color-utils/index.d.ts +2 -1
- package/dist/types-ts4.5/utils/hct-color-utils/lab-f.d.ts +1 -0
- package/dist/types-ts4.5/utils/hct-color-utils/lab-invf.d.ts +1 -0
- package/dist/types-ts4.5/utils/hct-color-utils/lstar-from-argb.d.ts +7 -0
- package/dist/types-ts4.5/utils/hct-color-utils/lstar-from-y.d.ts +12 -0
- package/dist/types-ts4.5/utils/hct-color-utils/red-from-argb.d.ts +4 -0
- package/dist/types-ts4.5/utils/hct-color-utils/rgba-from-argb.d.ts +8 -0
- package/dist/types-ts4.5/utils/hct-color-utils/rgba.d.ts +14 -0
- package/dist/types-ts4.5/utils/hct-color-utils/white-point-d65.d.ts +6 -0
- package/dist/types-ts4.5/utils/hct-color-utils/y-from-lstar.d.ts +12 -0
- package/dist/types-ts4.5/utils/hex-to-hsl.d.ts +5 -0
- package/dist/types-ts4.5/utils/hex-to-rgb-a.d.ts +6 -0
- package/dist/types-ts4.5/utils/hex-to-rgb.d.ts +5 -0
- package/dist/types-ts4.5/utils/is-valid-hex.d.ts +1 -0
- package/dist/types-ts4.5/utils/reduce-token-map.d.ts +6 -0
- package/dist/types-ts4.5/utils/rgb-to-lab.d.ts +5 -0
- 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
- package/dist/cjs/theme-state-transformer.js +0 -92
- package/dist/cjs/utils/color-utils.js +0 -168
- package/dist/cjs/utils/hct-color-utils/color-utils.js +0 -271
- package/dist/es2019/theme-state-transformer.js +0 -69
- package/dist/es2019/utils/color-utils.js +0 -128
- package/dist/es2019/utils/hct-color-utils/color-utils.js +0 -241
- package/dist/esm/theme-state-transformer.js +0 -85
- package/dist/esm/utils/color-utils.js +0 -130
- package/dist/esm/utils/hct-color-utils/color-utils.js +0 -240
- package/dist/types/utils/color-utils.d.ts +0 -10
- package/dist/types/utils/hct-color-utils/color-utils.d.ts +0 -88
- package/dist/types-ts4.5/utils/color-utils.d.ts +0 -23
- package/dist/types-ts4.5/utils/hct-color-utils/color-utils.d.ts +0 -88
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { argbFromRgb } from './argb-from-rgb';
|
|
2
|
+
import { delinearized } from './delinearized';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* Color science utilities.
|
|
6
|
+
*
|
|
7
|
+
* Utility methods for color science constants and color space
|
|
8
|
+
* conversions that aren't HCT or CAM16.
|
|
9
|
+
*/
|
|
10
|
+
const XYZ_TO_SRGB = [[3.2413774792388685, -1.5376652402851851, -0.49885366846268053], [-0.9691452513005321, 1.8758853451067872, 0.04156585616912061], [0.05562093689691305, -0.20395524564742123, 1.0571799111220335]];
|
|
11
|
+
|
|
12
|
+
/**
|
|
13
|
+
* Converts a color from ARGB to XYZ.
|
|
14
|
+
*/
|
|
15
|
+
export function argbFromXyz(x, y, z) {
|
|
16
|
+
const matrix = XYZ_TO_SRGB;
|
|
17
|
+
const linearR = matrix[0][0] * x + matrix[0][1] * y + matrix[0][2] * z;
|
|
18
|
+
const linearG = matrix[1][0] * x + matrix[1][1] * y + matrix[1][2] * z;
|
|
19
|
+
const linearB = matrix[2][0] * x + matrix[2][1] * y + matrix[2][2] * z;
|
|
20
|
+
const r = delinearized(linearR);
|
|
21
|
+
const g = delinearized(linearG);
|
|
22
|
+
const b = delinearized(linearB);
|
|
23
|
+
return argbFromRgb(r, g, b);
|
|
24
|
+
}
|
|
@@ -26,9 +26,9 @@
|
|
|
26
26
|
//
|
|
27
27
|
// tslint:disable:class-as-namespace
|
|
28
28
|
|
|
29
|
-
import
|
|
30
|
-
import
|
|
31
|
-
|
|
29
|
+
import { clampDouble } from './clamp-double';
|
|
30
|
+
import { lstarFromY } from './lstar-from-y';
|
|
31
|
+
import { yFromLstar } from './y-from-lstar';
|
|
32
32
|
/**
|
|
33
33
|
* Utility methods for calculating contrast given two colors, or calculating a
|
|
34
34
|
* color given one color and a contrast ratio.
|
|
@@ -49,9 +49,9 @@ export class Contrast {
|
|
|
49
49
|
* @param toneB Tone between 0 and 100. Values outside will be clamped.
|
|
50
50
|
*/
|
|
51
51
|
static ratioOfTones(toneA, toneB) {
|
|
52
|
-
toneA =
|
|
53
|
-
toneB =
|
|
54
|
-
return Contrast.ratioOfYs(
|
|
52
|
+
toneA = clampDouble(0.0, 100.0, toneA);
|
|
53
|
+
toneB = clampDouble(0.0, 100.0, toneB);
|
|
54
|
+
return Contrast.ratioOfYs(yFromLstar(toneA), yFromLstar(toneB));
|
|
55
55
|
}
|
|
56
56
|
static ratioOfYs(y1, y2) {
|
|
57
57
|
const lighter = y1 > y2 ? y1 : y2;
|
|
@@ -73,7 +73,7 @@ export class Contrast {
|
|
|
73
73
|
if (tone < 0.0 || tone > 100.0) {
|
|
74
74
|
return -1.0;
|
|
75
75
|
}
|
|
76
|
-
const darkY =
|
|
76
|
+
const darkY = yFromLstar(tone);
|
|
77
77
|
const lightY = ratio * (darkY + 5.0) - 5.0;
|
|
78
78
|
const realContrast = Contrast.ratioOfYs(lightY, darkY);
|
|
79
79
|
const delta = Math.abs(realContrast - ratio);
|
|
@@ -83,7 +83,7 @@ export class Contrast {
|
|
|
83
83
|
|
|
84
84
|
// Ensure gamut mapping, which requires a 'range' on tone, will still result
|
|
85
85
|
// the correct ratio by darkening slightly.
|
|
86
|
-
const returnValue =
|
|
86
|
+
const returnValue = lstarFromY(lightY) + 0.4;
|
|
87
87
|
if (returnValue < 0 || returnValue > 100) {
|
|
88
88
|
return -1;
|
|
89
89
|
}
|
|
@@ -104,7 +104,7 @@ export class Contrast {
|
|
|
104
104
|
if (tone < 0.0 || tone > 100.0) {
|
|
105
105
|
return -1.0;
|
|
106
106
|
}
|
|
107
|
-
const lightY =
|
|
107
|
+
const lightY = yFromLstar(tone);
|
|
108
108
|
const darkY = (lightY + 5.0) / ratio - 5.0;
|
|
109
109
|
const realContrast = Contrast.ratioOfYs(lightY, darkY);
|
|
110
110
|
const delta = Math.abs(realContrast - ratio);
|
|
@@ -114,7 +114,7 @@ export class Contrast {
|
|
|
114
114
|
|
|
115
115
|
// Ensure gamut mapping, which requires a 'range' on tone, will still result
|
|
116
116
|
// the correct ratio by darkening slightly.
|
|
117
|
-
const returnValue =
|
|
117
|
+
const returnValue = lstarFromY(darkY) - 0.4;
|
|
118
118
|
if (returnValue < 0 || returnValue > 100) {
|
|
119
119
|
return -1;
|
|
120
120
|
}
|
|
@@ -21,9 +21,16 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
|
21
21
|
* limitations under the License.
|
|
22
22
|
*/
|
|
23
23
|
|
|
24
|
-
import
|
|
24
|
+
import { argbFromLinrgb } from './argb-from-linrgb';
|
|
25
|
+
import { argbFromLstar } from './argb-from-lstar';
|
|
26
|
+
import { argbFromXyz } from './argb-from-xyz';
|
|
27
|
+
import { linearized } from './linearized';
|
|
28
|
+
import { lstarFromArgb } from './lstar-from-argb';
|
|
29
|
+
import { lstarFromY } from './lstar-from-y';
|
|
25
30
|
import * as math from './math-utils';
|
|
26
31
|
import { ViewingConditions } from './viewing-conditions';
|
|
32
|
+
import { yFromLstar } from './y-from-lstar';
|
|
33
|
+
|
|
27
34
|
/**
|
|
28
35
|
* A color system built using CAM16 hue and chroma, and L* from
|
|
29
36
|
* L*a*b*.
|
|
@@ -119,13 +126,13 @@ export class Hct {
|
|
|
119
126
|
const cam = Cam16.fromInt(argb);
|
|
120
127
|
this.internalHue = cam.hue;
|
|
121
128
|
this.internalChroma = cam.chroma;
|
|
122
|
-
this.internalTone =
|
|
129
|
+
this.internalTone = lstarFromArgb(argb);
|
|
123
130
|
}
|
|
124
131
|
setInternalState(argb) {
|
|
125
132
|
const cam = Cam16.fromInt(argb);
|
|
126
133
|
this.internalHue = cam.hue;
|
|
127
134
|
this.internalChroma = cam.chroma;
|
|
128
|
-
this.internalTone =
|
|
135
|
+
this.internalTone = lstarFromArgb(argb);
|
|
129
136
|
this.argb = argb;
|
|
130
137
|
}
|
|
131
138
|
|
|
@@ -154,7 +161,7 @@ export class Hct {
|
|
|
154
161
|
// 3. Create HCT from:
|
|
155
162
|
// - CAM16 using default VC with XYZ coordinates in specified VC.
|
|
156
163
|
// - L* converted from Y in XYZ coordinates in specified VC.
|
|
157
|
-
const recastHct = Hct.from(recastInVc.hue, recastInVc.chroma,
|
|
164
|
+
const recastHct = Hct.from(recastInVc.hue, recastInVc.chroma, lstarFromY(viewedInVc[1]));
|
|
158
165
|
return recastHct;
|
|
159
166
|
}
|
|
160
167
|
}
|
|
@@ -243,9 +250,9 @@ class Cam16 {
|
|
|
243
250
|
const red = (argb & 0x00ff0000) >> 16;
|
|
244
251
|
const green = (argb & 0x0000ff00) >> 8;
|
|
245
252
|
const blue = argb & 0x000000ff;
|
|
246
|
-
const redL =
|
|
247
|
-
const greenL =
|
|
248
|
-
const blueL =
|
|
253
|
+
const redL = linearized(red);
|
|
254
|
+
const greenL = linearized(green);
|
|
255
|
+
const blueL = linearized(blue);
|
|
249
256
|
const x = 0.41233895 * redL + 0.35762064 * greenL + 0.18051042 * blueL;
|
|
250
257
|
const y = 0.2126 * redL + 0.7152 * greenL + 0.0722 * blueL;
|
|
251
258
|
const z = 0.01932141 * redL + 0.11916382 * greenL + 0.95034478 * blueL;
|
|
@@ -392,7 +399,7 @@ class Cam16 {
|
|
|
392
399
|
const x = 1.86206786 * rF - 1.01125463 * gF + 0.14918677 * bF;
|
|
393
400
|
const y = 0.38752654 * rF + 0.62144744 * gF - 0.00897398 * bF;
|
|
394
401
|
const z = -0.0158415 * rF - 0.03412294 * gF + 1.04996444 * bF;
|
|
395
|
-
const argb =
|
|
402
|
+
const argb = argbFromXyz(x, y, z);
|
|
396
403
|
return argb;
|
|
397
404
|
}
|
|
398
405
|
|
|
@@ -801,7 +808,7 @@ class HctSolver {
|
|
|
801
808
|
if (linrgb[0] > 100.01 || linrgb[1] > 100.01 || linrgb[2] > 100.01) {
|
|
802
809
|
return 0;
|
|
803
810
|
}
|
|
804
|
-
return
|
|
811
|
+
return argbFromLinrgb(linrgb);
|
|
805
812
|
}
|
|
806
813
|
// Iterates with Newton method,
|
|
807
814
|
// Using 2 * fn(j) / j as the approximation of fn'(j)
|
|
@@ -824,17 +831,17 @@ class HctSolver {
|
|
|
824
831
|
*/
|
|
825
832
|
static solveToInt(hueDegrees, chroma, lstar) {
|
|
826
833
|
if (chroma < 0.0001 || lstar < 0.0001 || lstar > 99.9999) {
|
|
827
|
-
return
|
|
834
|
+
return argbFromLstar(lstar);
|
|
828
835
|
}
|
|
829
836
|
hueDegrees = math.sanitizeDegreesDouble(hueDegrees);
|
|
830
837
|
const hueRadians = hueDegrees / 180 * Math.PI;
|
|
831
|
-
const y =
|
|
838
|
+
const y = yFromLstar(lstar);
|
|
832
839
|
const exactAnswer = HctSolver.findResultByJ(hueRadians, chroma, y);
|
|
833
840
|
if (exactAnswer !== 0) {
|
|
834
841
|
return exactAnswer;
|
|
835
842
|
}
|
|
836
843
|
const linrgb = HctSolver.bisectToLimit(y, hueRadians);
|
|
837
|
-
return
|
|
844
|
+
return argbFromLinrgb(linrgb);
|
|
838
845
|
}
|
|
839
846
|
|
|
840
847
|
/**
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { blueFromArgb } from './blue-from-argb';
|
|
2
|
+
import { greenFromArgb } from './green-from-argb';
|
|
3
|
+
import { labF } from './lab-f';
|
|
4
|
+
import { linearized } from './linearized';
|
|
5
|
+
import { matrixMultiply } from './matrix-multiply';
|
|
6
|
+
import { redFromArgb } from './red-from-argb';
|
|
7
|
+
const SRGB_TO_XYZ = [[0.41233895, 0.35762064, 0.18051042], [0.2126, 0.7152, 0.0722], [0.01932141, 0.11916382, 0.95034478]];
|
|
8
|
+
|
|
9
|
+
/**
|
|
10
|
+
* Converts a color from XYZ to ARGB.
|
|
11
|
+
*/
|
|
12
|
+
function xyzFromArgb(argb) {
|
|
13
|
+
const r = linearized(redFromArgb(argb));
|
|
14
|
+
const g = linearized(greenFromArgb(argb));
|
|
15
|
+
const b = linearized(blueFromArgb(argb));
|
|
16
|
+
return matrixMultiply([r, g, b], SRGB_TO_XYZ);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
/**
|
|
20
|
+
* Computes the L* value of a color in ARGB representation.
|
|
21
|
+
*
|
|
22
|
+
* @param argb ARGB representation of a color
|
|
23
|
+
* @return L*, from L*a*b*, coordinate of the color
|
|
24
|
+
*/
|
|
25
|
+
export function lstarFromArgb(argb) {
|
|
26
|
+
const y = xyzFromArgb(argb)[1];
|
|
27
|
+
return 116.0 * labF(y / 100.0) - 16.0;
|
|
28
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { labF } from './lab-f';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Converts a Y value to an L* value.
|
|
5
|
+
*
|
|
6
|
+
* L* in L*a*b* and Y in XYZ measure the same quantity, luminance.
|
|
7
|
+
*
|
|
8
|
+
* L* measures perceptual luminance, a linear scale. Y in XYZ
|
|
9
|
+
* measures relative luminance, a logarithmic scale.
|
|
10
|
+
*
|
|
11
|
+
* @param y Y in XYZ
|
|
12
|
+
* @return L* in L*a*b*
|
|
13
|
+
*/
|
|
14
|
+
export function lstarFromY(y) {
|
|
15
|
+
return labF(y / 100.0) * 116.0 - 16.0;
|
|
16
|
+
}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { alphaFromArgb } from './alpha-from-argb';
|
|
2
|
+
import { blueFromArgb } from './blue-from-argb';
|
|
3
|
+
import { greenFromArgb } from './green-from-argb';
|
|
4
|
+
import { redFromArgb } from './red-from-argb';
|
|
5
|
+
/**
|
|
6
|
+
* Return RGBA from a given int32 color
|
|
7
|
+
*
|
|
8
|
+
* @param argb ARGB representation of a int32 color.
|
|
9
|
+
* @return RGBA representation of a int32 color.
|
|
10
|
+
*/
|
|
11
|
+
export function rgbaFromArgb(argb) {
|
|
12
|
+
const r = redFromArgb(argb);
|
|
13
|
+
const g = greenFromArgb(argb);
|
|
14
|
+
const b = blueFromArgb(argb);
|
|
15
|
+
const a = alphaFromArgb(argb);
|
|
16
|
+
return {
|
|
17
|
+
r,
|
|
18
|
+
g,
|
|
19
|
+
b,
|
|
20
|
+
a
|
|
21
|
+
};
|
|
22
|
+
}
|
|
File without changes
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
2
|
var _ViewingConditions;
|
|
3
|
-
import * as utils from './color-utils';
|
|
4
3
|
import * as math from './math-utils';
|
|
4
|
+
import { whitePointD65 } from './white-point-d65';
|
|
5
|
+
import { yFromLstar } from './y-from-lstar';
|
|
5
6
|
export class ViewingConditions {
|
|
6
7
|
/**
|
|
7
8
|
* Create ViewingConditions from a simple, physically relevant, set of
|
|
@@ -25,7 +26,7 @@ export class ViewingConditions {
|
|
|
25
26
|
* default = false, the eye does not perform this process on
|
|
26
27
|
* self-luminous objects like displays.
|
|
27
28
|
*/
|
|
28
|
-
static make(whitePoint =
|
|
29
|
+
static make(whitePoint = whitePointD65(), adaptingLuminance = 200.0 / Math.PI * yFromLstar(50.0) / 100.0, backgroundLstar = 50.0, surround = 2.0, discountingIlluminant = false) {
|
|
29
30
|
const xyz = whitePoint;
|
|
30
31
|
const rW = xyz[0] * 0.401288 + xyz[1] * 0.650173 + xyz[2] * -0.051461;
|
|
31
32
|
const gW = xyz[0] * -0.250268 + xyz[1] * 1.204414 + xyz[2] * 0.045854;
|
|
@@ -40,7 +41,7 @@ export class ViewingConditions {
|
|
|
40
41
|
const k4 = k * k * k * k;
|
|
41
42
|
const k4F = 1.0 - k4;
|
|
42
43
|
const fl = k4 * adaptingLuminance + 0.1 * k4F * k4F * Math.cbrt(5.0 * adaptingLuminance);
|
|
43
|
-
const n =
|
|
44
|
+
const n = yFromLstar(backgroundLstar) / whitePoint[1];
|
|
44
45
|
const z = 1.48 + Math.sqrt(n);
|
|
45
46
|
const nbb = 0.725 / Math.pow(n, 0.2);
|
|
46
47
|
const ncb = nbb;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { labInvf } from './lab-invf';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Converts an L* value to a Y value.
|
|
5
|
+
*
|
|
6
|
+
* L* in L*a*b* and Y in XYZ measure the same quantity, luminance.
|
|
7
|
+
*
|
|
8
|
+
* L* measures perceptual luminance, a linear scale. Y in XYZ
|
|
9
|
+
* measures relative luminance, a logarithmic scale.
|
|
10
|
+
*
|
|
11
|
+
* @param lstar L* in L*a*b*
|
|
12
|
+
* @return Y in XYZ
|
|
13
|
+
*/
|
|
14
|
+
export function yFromLstar(lstar) {
|
|
15
|
+
return 100.0 * labInvf((lstar + 16.0) / 116.0);
|
|
16
|
+
}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { isValidHex } from './is-valid-hex';
|
|
2
|
+
export function hexToHSL(hex) {
|
|
3
|
+
if (!isValidHex(hex)) {
|
|
4
|
+
throw new Error('Invalid HEX');
|
|
5
|
+
}
|
|
6
|
+
let r = 0,
|
|
7
|
+
g = 0,
|
|
8
|
+
b = 0;
|
|
9
|
+
if (hex.length === 4) {
|
|
10
|
+
r = '0x' + hex[1] + hex[1];
|
|
11
|
+
g = '0x' + hex[2] + hex[2];
|
|
12
|
+
b = '0x' + hex[3] + hex[3];
|
|
13
|
+
} else if (hex.length === 7) {
|
|
14
|
+
r = '0x' + hex[1] + hex[2];
|
|
15
|
+
g = '0x' + hex[3] + hex[4];
|
|
16
|
+
b = '0x' + hex[5] + hex[6];
|
|
17
|
+
}
|
|
18
|
+
// Then to HSL
|
|
19
|
+
r /= 255;
|
|
20
|
+
g /= 255;
|
|
21
|
+
b /= 255;
|
|
22
|
+
let cmin = Math.min(r, g, b),
|
|
23
|
+
cmax = Math.max(r, g, b),
|
|
24
|
+
delta = cmax - cmin,
|
|
25
|
+
h = 0,
|
|
26
|
+
s = 0,
|
|
27
|
+
l = 0;
|
|
28
|
+
if (delta === 0) {
|
|
29
|
+
h = 0;
|
|
30
|
+
} else if (cmax === r) {
|
|
31
|
+
h = (g - b) / delta % 6;
|
|
32
|
+
} else if (cmax === g) {
|
|
33
|
+
h = (b - r) / delta + 2;
|
|
34
|
+
} else {
|
|
35
|
+
h = (r - g) / delta + 4;
|
|
36
|
+
}
|
|
37
|
+
h = Math.round(h * 60);
|
|
38
|
+
if (h < 0) {
|
|
39
|
+
h += 360;
|
|
40
|
+
}
|
|
41
|
+
l = (cmax + cmin) / 2;
|
|
42
|
+
s = delta === 0 ? 0 : delta / (1 - Math.abs(2 * l - 1));
|
|
43
|
+
s = +(s * 100).toFixed(1);
|
|
44
|
+
l = +(l * 100).toFixed(1);
|
|
45
|
+
return [h, s, l];
|
|
46
|
+
}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { getAlpha } from './get-alpha';
|
|
2
|
+
import { isValidHex } from './is-valid-hex';
|
|
3
|
+
export function hexToRgbA(hex) {
|
|
4
|
+
if (!isValidHex(hex)) {
|
|
5
|
+
throw new Error('Invalid HEX');
|
|
6
|
+
}
|
|
7
|
+
let c;
|
|
8
|
+
c = hex.substring(1).split('');
|
|
9
|
+
if (c.length === 3) {
|
|
10
|
+
c = [c[0], c[0], c[1], c[1], c[2], c[2]];
|
|
11
|
+
}
|
|
12
|
+
c = '0x' + c.join('');
|
|
13
|
+
return [c >> 16 & 255, c >> 8 & 255, c & 255, getAlpha(hex)];
|
|
14
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { isValidHex } from './is-valid-hex';
|
|
2
|
+
export function hexToRgb(hex) {
|
|
3
|
+
if (!isValidHex(hex)) {
|
|
4
|
+
throw new Error('Invalid HEX');
|
|
5
|
+
}
|
|
6
|
+
let c;
|
|
7
|
+
c = hex.substring(1).split('');
|
|
8
|
+
if (c.length === 3) {
|
|
9
|
+
c = [c[0], c[0], c[1], c[1], c[2], c[2]];
|
|
10
|
+
}
|
|
11
|
+
c = '0x' + c.join('');
|
|
12
|
+
return [c >> 16 & 255, c >> 8 & 255, c & 255];
|
|
13
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import tokens from '../artifacts/token-names';
|
|
2
|
+
export function reduceTokenMap(tokenMap, themeRamp) {
|
|
3
|
+
return Object.entries(tokenMap).reduce((acc, [key, value]) => {
|
|
4
|
+
const cssVar = tokens[key];
|
|
5
|
+
return cssVar ? `${acc}\n ${cssVar}: ${typeof value === 'string' ? value : themeRamp[value]};` : acc;
|
|
6
|
+
}, '');
|
|
7
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
export function rgbToLab(rgb) {
|
|
2
|
+
let r = rgb[0] / 255,
|
|
3
|
+
g = rgb[1] / 255,
|
|
4
|
+
b = rgb[2] / 255,
|
|
5
|
+
x,
|
|
6
|
+
y,
|
|
7
|
+
z;
|
|
8
|
+
r = r > 0.04045 ? Math.pow((r + 0.055) / 1.055, 2.4) : r / 12.92;
|
|
9
|
+
g = g > 0.04045 ? Math.pow((g + 0.055) / 1.055, 2.4) : g / 12.92;
|
|
10
|
+
b = b > 0.04045 ? Math.pow((b + 0.055) / 1.055, 2.4) : b / 12.92;
|
|
11
|
+
x = (r * 0.4124 + g * 0.3576 + b * 0.1805) / 0.95047;
|
|
12
|
+
y = (r * 0.2126 + g * 0.7152 + b * 0.0722) / 1.0;
|
|
13
|
+
z = (r * 0.0193 + g * 0.1192 + b * 0.9505) / 1.08883;
|
|
14
|
+
x = x > 0.008856 ? Math.pow(x, 1 / 3) : 7.787 * x + 16 / 116;
|
|
15
|
+
y = y > 0.008856 ? Math.pow(y, 1 / 3) : 7.787 * y + 16 / 116;
|
|
16
|
+
z = z > 0.008856 ? Math.pow(z, 1 / 3) : 7.787 * z + 16 / 116;
|
|
17
|
+
return [116 * y - 16, 500 * (x - y), 200 * (y - z)];
|
|
18
|
+
}
|
|
@@ -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::
|
|
3
|
+
* @codegen <<SignedSource::53794f446833e9543b9fc09809fc6844>>
|
|
4
4
|
* @codegenCommand yarn build tokens
|
|
5
5
|
*/
|
|
6
6
|
|
|
@@ -2044,6 +2044,23 @@ var tokens = [{
|
|
|
2044
2044
|
},
|
|
2045
2045
|
"name": "color.palette.Neutral1100",
|
|
2046
2046
|
"path": ["color", "palette", "Neutral1100"]
|
|
2047
|
+
}, {
|
|
2048
|
+
"value": "#000000",
|
|
2049
|
+
"attributes": {
|
|
2050
|
+
"group": "palette",
|
|
2051
|
+
"category": "light mode neutral"
|
|
2052
|
+
},
|
|
2053
|
+
"filePath": "schema/palettes/palette.tsx",
|
|
2054
|
+
"isSource": true,
|
|
2055
|
+
"original": {
|
|
2056
|
+
"value": "#000000",
|
|
2057
|
+
"attributes": {
|
|
2058
|
+
"group": "palette",
|
|
2059
|
+
"category": "light mode neutral"
|
|
2060
|
+
}
|
|
2061
|
+
},
|
|
2062
|
+
"name": "color.palette.Neutral1200",
|
|
2063
|
+
"path": ["color", "palette", "Neutral1200"]
|
|
2047
2064
|
}, {
|
|
2048
2065
|
"value": "#17171708",
|
|
2049
2066
|
"attributes": {
|
|
@@ -2384,6 +2401,23 @@ var tokens = [{
|
|
|
2384
2401
|
},
|
|
2385
2402
|
"name": "color.palette.DarkNeutral1100",
|
|
2386
2403
|
"path": ["color", "palette", "DarkNeutral1100"]
|
|
2404
|
+
}, {
|
|
2405
|
+
"value": "#FFFFFF",
|
|
2406
|
+
"attributes": {
|
|
2407
|
+
"group": "palette",
|
|
2408
|
+
"category": "dark mode neutral"
|
|
2409
|
+
},
|
|
2410
|
+
"filePath": "schema/palettes/palette.tsx",
|
|
2411
|
+
"isSource": true,
|
|
2412
|
+
"original": {
|
|
2413
|
+
"value": "#FFFFFF",
|
|
2414
|
+
"attributes": {
|
|
2415
|
+
"group": "palette",
|
|
2416
|
+
"category": "dark mode neutral"
|
|
2417
|
+
}
|
|
2418
|
+
},
|
|
2419
|
+
"name": "color.palette.DarkNeutral1200",
|
|
2420
|
+
"path": ["color", "palette", "DarkNeutral1200"]
|
|
2387
2421
|
}, {
|
|
2388
2422
|
"value": "#01040475",
|
|
2389
2423
|
"attributes": {
|
|
@@ -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::
|
|
3
|
+
* @codegen <<SignedSource::0c49cd7b99ff49fecf0ecfa056c603c4>>
|
|
4
4
|
* @codegenCommand yarn build tokens
|
|
5
5
|
*/
|
|
6
|
-
export default "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:dark-increased-contrast\"], [data-subtree-theme][data-color-mode=\"light\"][data-theme~=\"light:dark-increased-contrast\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:dark-increased-contrast\"], [data-subtree-theme][data-color-mode=\"dark\"][data-theme~=\"dark:dark-increased-contrast\"],\nhtml[data-color-mode=\"light\"][data-contrast-mode=\"more\"][data-theme~=\"light:dark\"],\nhtml[data-color-mode=\"dark\"][data-contrast-mode=\"more\"][data-theme~=\"dark:dark\"] {\n color-scheme: dark;\n --ds-text: #E2E3E4;\n --ds-text-accent-lime: #D3F1A7;\n --ds-text-accent-lime-bolder: #EFFFD6;\n --ds-text-accent-red: #FFD5D2;\n --ds-text-accent-red-bolder: #FFECEB;\n --ds-text-accent-orange: #FCE4A6;\n --ds-text-accent-orange-bolder: #FFF5DB;\n --ds-text-accent-yellow: #F5E989;\n --ds-text-accent-yellow-bolder: #FEF7C8;\n --ds-text-accent-green: #BAF3DB;\n --ds-text-accent-green-bolder: #DCFFF1;\n --ds-text-accent-teal: #C6EDFB;\n --ds-text-accent-teal-bolder: #E7F9FF;\n --ds-text-accent-blue: #CFE1FD;\n --ds-text-accent-blue-bolder: #E9F2FE;\n --ds-text-accent-purple: #EED7FC;\n --ds-text-accent-purple-bolder: #F8EEFE;\n --ds-text-accent-magenta: #FDD0EC;\n --ds-text-accent-magenta-bolder: #FFECF8;\n --ds-text-accent-gray: #BFC1C4;\n --ds-text-accent-gray-bolder: #E2E3E4;\n --ds-text-disabled: #E5E9F640;\n --ds-text-inverse: #1F1F21;\n --ds-text-selected: #CFE1FD;\n --ds-text-brand: #CFE1FD;\n --ds-text-danger: #FFD5D2;\n --ds-text-danger-bolder: #FFECEB;\n --ds-text-warning: #FCE4A6;\n --ds-text-warning-inverse: #18191A;\n --ds-text-warning-bolder: #FFF5DB;\n --ds-text-success: #BAF3DB;\n --ds-text-success-bolder: #DCFFF1;\n --ds-text-discovery: #EED7FC;\n --ds-text-discovery-bolder: #F8EEFE;\n --ds-text-information: #CFE1FD;\n --ds-text-information-bolder: #E9F2FE;\n --ds-text-subtlest: #BFC1C4;\n --ds-text-subtle: #CECFD2;\n --ds-link: #CFE1FD;\n --ds-link-pressed: #CFE1FD;\n --ds-link-visited: #D8A0F7;\n --ds-link-visited-pressed: #EED7FC;\n --ds-icon: #CECFD2;\n --ds-icon-accent-lime: #B3DF72;\n --ds-icon-accent-red: #FD9891;\n --ds-icon-accent-orange: #FBC828;\n --ds-icon-accent-yellow: #EED12B;\n --ds-icon-accent-green: #7EE2B8;\n --ds-icon-accent-teal: #9DD9EE;\n --ds-icon-accent-blue: #8FB8F6;\n --ds-icon-accent-purple: #D8A0F7;\n --ds-icon-accent-magenta: #F797D2;\n --ds-icon-accent-gray: #A9ABAF;\n --ds-icon-disabled: #E5E9F640;\n --ds-icon-inverse: #1F1F21;\n --ds-icon-selected: #8FB8F6;\n --ds-icon-brand: #8FB8F6;\n --ds-icon-danger: #F87168;\n --ds-icon-warning: #FBC828;\n --ds-icon-warning-inverse: #18191A;\n --ds-icon-success: #7EE2B8;\n --ds-icon-discovery: #C97CF4;\n --ds-icon-information: #8FB8F6;\n --ds-icon-subtlest: #BFC1C4;\n --ds-icon-subtle: #BFC1C4;\n --ds-border: #E9F0FB5C;\n --ds-border-accent-lime: #B3DF72;\n --ds-border-accent-red: #FD9891;\n --ds-border-accent-orange: #FBC828;\n --ds-border-accent-yellow: #EED12B;\n --ds-border-accent-green: #7EE2B8;\n --ds-border-accent-teal: #9DD9EE;\n --ds-border-accent-blue: #8FB8F6;\n --ds-border-accent-purple: #D8A0F7;\n --ds-border-accent-magenta: #F797D2;\n --ds-border-accent-gray: #A9ABAF;\n --ds-border-disabled: #E3E4F21F;\n --ds-border-focused: #8FB8F6;\n --ds-border-input: #A9ABAF;\n --ds-border-inverse: #18191A;\n --ds-border-selected: #8FB8F6;\n --ds-border-brand: #8FB8F6;\n --ds-border-danger: #F87168;\n --ds-border-warning: #FBC828;\n --ds-border-success: #7EE2B8;\n --ds-border-discovery: #C97CF4;\n --ds-border-information: #8FB8F6;\n --ds-border-bold: #A9ABAF;\n --ds-background-accent-lime-subtlest: #28311B;\n --ds-background-accent-lime-subtlest-hovered: #37471F;\n --ds-background-accent-lime-subtlest-pressed: #3F5224;\n --ds-background-accent-lime-subtler: #37471F;\n --ds-background-accent-lime-subtler-hovered: #3F5224;\n --ds-background-accent-lime-subtler-pressed: #4C6B1F;\n --ds-background-accent-lime-subtle: #4C6B1F;\n --ds-background-accent-lime-subtle-hovered: #3F5224;\n --ds-background-accent-lime-subtle-pressed: #37471F;\n --ds-background-accent-lime-bolder: #D3F1A7;\n --ds-background-accent-lime-bolder-hovered: #EFFFD6;\n --ds-background-accent-lime-bolder-pressed: #BDE97C;\n --ds-background-accent-red-subtlest: #42221F;\n --ds-background-accent-red-subtlest-hovered: #5D1F1A;\n --ds-background-accent-red-subtlest-pressed: #872821;\n --ds-background-accent-red-subtler: #5D1F1A;\n --ds-background-accent-red-subtler-hovered: #872821;\n --ds-background-accent-red-subtler-pressed: #AE2E24;\n --ds-background-accent-red-subtle: #AE2E24;\n --ds-background-accent-red-subtle-hovered: #872821;\n --ds-background-accent-red-subtle-pressed: #5D1F1A;\n --ds-background-accent-red-bolder: #FFD5D2;\n --ds-background-accent-red-bolder-hovered: #FFECEB;\n --ds-background-accent-red-bolder-pressed: #FFB8B2;\n --ds-background-accent-orange-subtlest: #3A2C1F;\n --ds-background-accent-orange-subtlest-hovered: #693200;\n --ds-background-accent-orange-subtlest-pressed: #7A3B00;\n --ds-background-accent-orange-subtler: #693200;\n --ds-background-accent-orange-subtler-hovered: #7A3B00;\n --ds-background-accent-orange-subtler-pressed: #9E4C00;\n --ds-background-accent-orange-subtle: #9E4C00;\n --ds-background-accent-orange-subtle-hovered: #7A3B00;\n --ds-background-accent-orange-subtle-pressed: #693200;\n --ds-background-accent-orange-bolder: #FCE4A6;\n --ds-background-accent-orange-bolder-hovered: #FFF5DB;\n --ds-background-accent-orange-bolder-pressed: #FBD779;\n --ds-background-accent-yellow-subtlest: #332E1B;\n --ds-background-accent-yellow-subtlest-hovered: #533F04;\n --ds-background-accent-yellow-subtlest-pressed: #614A05;\n --ds-background-accent-yellow-subtler: #533F04;\n --ds-background-accent-yellow-subtler-hovered: #614A05;\n --ds-background-accent-yellow-subtler-pressed: #7F5F01;\n --ds-background-accent-yellow-subtle: #7F5F01;\n --ds-background-accent-yellow-subtle-hovered: #614A05;\n --ds-background-accent-yellow-subtle-pressed: #533F04;\n --ds-background-accent-yellow-bolder: #F5E989;\n --ds-background-accent-yellow-bolder-hovered: #FEF7C8;\n --ds-background-accent-yellow-bolder-pressed: #EFDD4E;\n --ds-background-accent-green-subtlest: #1C3329;\n --ds-background-accent-green-subtlest-hovered: #164B35;\n --ds-background-accent-green-subtlest-pressed: #19573D;\n --ds-background-accent-green-subtler: #164B35;\n --ds-background-accent-green-subtler-hovered: #19573D;\n --ds-background-accent-green-subtler-pressed: #216E4E;\n --ds-background-accent-green-subtle: #216E4E;\n --ds-background-accent-green-subtle-hovered: #19573D;\n --ds-background-accent-green-subtle-pressed: #164B35;\n --ds-background-accent-green-bolder: #BAF3DB;\n --ds-background-accent-green-bolder-hovered: #DCFFF1;\n --ds-background-accent-green-bolder-pressed: #97EDC9;\n --ds-background-accent-teal-subtlest: #1E3137;\n --ds-background-accent-teal-subtlest-hovered: #164555;\n --ds-background-accent-teal-subtlest-pressed: #1A5265;\n --ds-background-accent-teal-subtler: #164555;\n --ds-background-accent-teal-subtler-hovered: #1A5265;\n --ds-background-accent-teal-subtler-pressed: #206A83;\n --ds-background-accent-teal-subtle: #206A83;\n --ds-background-accent-teal-subtle-hovered: #1A5265;\n --ds-background-accent-teal-subtle-pressed: #164555;\n --ds-background-accent-teal-bolder: #C6EDFB;\n --ds-background-accent-teal-bolder-hovered: #E7F9FF;\n --ds-background-accent-teal-bolder-pressed: #B1E4F7;\n --ds-background-accent-blue-subtlest: #1C2B42;\n --ds-background-accent-blue-subtlest-hovered: #123263;\n --ds-background-accent-blue-subtlest-pressed: #144794;\n --ds-background-accent-blue-subtler: #123263;\n --ds-background-accent-blue-subtler-hovered: #144794;\n --ds-background-accent-blue-subtler-pressed: #1558BC;\n --ds-background-accent-blue-subtle: #1558BC;\n --ds-background-accent-blue-subtle-hovered: #144794;\n --ds-background-accent-blue-subtle-pressed: #123263;\n --ds-background-accent-blue-bolder: #669DF1;\n --ds-background-accent-blue-bolder-hovered: #8FB8F6;\n --ds-background-accent-blue-bolder-pressed: #ADCBFB;\n --ds-background-accent-purple-subtlest: #35243F;\n --ds-background-accent-purple-subtlest-hovered: #48245D;\n --ds-background-accent-purple-subtlest-pressed: #673286;\n --ds-background-accent-purple-subtler: #48245D;\n --ds-background-accent-purple-subtler-hovered: #673286;\n --ds-background-accent-purple-subtler-pressed: #803FA5;\n --ds-background-accent-purple-subtle: #803FA5;\n --ds-background-accent-purple-subtle-hovered: #673286;\n --ds-background-accent-purple-subtle-pressed: #48245D;\n --ds-background-accent-purple-bolder: #EED7FC;\n --ds-background-accent-purple-bolder-hovered: #F8EEFE;\n --ds-background-accent-purple-bolder-pressed: #E3BDFA;\n --ds-background-accent-magenta-subtlest: #3D2232;\n --ds-background-accent-magenta-subtlest-hovered: #50253F;\n --ds-background-accent-magenta-subtlest-pressed: #77325B;\n --ds-background-accent-magenta-subtler: #50253F;\n --ds-background-accent-magenta-subtler-hovered: #77325B;\n --ds-background-accent-magenta-subtler-pressed: #943D73;\n --ds-background-accent-magenta-subtle: #943D73;\n --ds-background-accent-magenta-subtle-hovered: #77325B;\n --ds-background-accent-magenta-subtle-pressed: #50253F;\n --ds-background-accent-magenta-bolder: #FDD0EC;\n --ds-background-accent-magenta-bolder-hovered: #FFECF8;\n --ds-background-accent-magenta-bolder-pressed: #FCB6E1;\n --ds-background-accent-gray-subtlest: #303134;\n --ds-background-accent-gray-subtlest-hovered: #3D3F43;\n --ds-background-accent-gray-subtlest-pressed: #4B4D51;\n --ds-background-accent-gray-subtler: #4B4D51;\n --ds-background-accent-gray-subtler-hovered: #63666B;\n --ds-background-accent-gray-subtler-pressed: #7E8188;\n --ds-background-accent-gray-subtle: #4B4D51;\n --ds-background-accent-gray-subtle-hovered: #303134;\n --ds-background-accent-gray-subtle-pressed: #242528;\n --ds-background-accent-gray-bolder: #A9ABAF;\n --ds-background-accent-gray-bolder-hovered: #BFC1C4;\n --ds-background-accent-gray-bolder-pressed: #CECFD2;\n --ds-background-disabled: #BDBDBD0A;\n --ds-background-input: #242528;\n --ds-background-input-hovered: #2B2C2F;\n --ds-background-input-pressed: #242528;\n --ds-background-inverse-subtle: #FFFFFF29;\n --ds-background-inverse-subtle-hovered: #FFFFFF3D;\n --ds-background-inverse-subtle-pressed: #FFFFFF52;\n --ds-background-neutral: #CECED912;\n --ds-background-neutral-hovered: #E3E4F21F;\n --ds-background-neutral-pressed: #E5E9F640;\n --ds-background-neutral-subtle: #00000000;\n --ds-background-neutral-subtle-hovered: #CECED912;\n --ds-background-neutral-subtle-pressed: #E3E4F21F;\n --ds-background-neutral-bold: #CECFD2;\n --ds-background-neutral-bold-hovered: #BFC1C4;\n --ds-background-neutral-bold-pressed: #A9ABAF;\n --ds-background-selected: #1C2B42;\n --ds-background-selected-hovered: #123263;\n --ds-background-selected-pressed: #1558BC;\n --ds-background-selected-bold: #CFE1FD;\n --ds-background-selected-bold-hovered: #E9F2FE;\n --ds-background-selected-bold-pressed: #E2E3E4;\n --ds-background-brand-subtlest: #1C2B42;\n --ds-background-brand-subtlest-hovered: #123263;\n --ds-background-brand-subtlest-pressed: #144794;\n --ds-background-brand-bold: #CFE1FD;\n --ds-background-brand-bold-hovered: #E9F2FE;\n --ds-background-brand-bold-pressed: #E2E3E4;\n --ds-background-brand-boldest: #E9F2FE;\n --ds-background-brand-boldest-hovered: #CFE1FD;\n --ds-background-brand-boldest-pressed: #ADCBFB;\n --ds-background-danger: #42221F;\n --ds-background-danger-hovered: #5D1F1A;\n --ds-background-danger-pressed: #872821;\n --ds-background-danger-subtler: #5D1F1A;\n --ds-background-danger-subtler-hovered: #872821;\n --ds-background-danger-subtler-pressed: #AE2E24;\n --ds-background-danger-bold: #FFD5D2;\n --ds-background-danger-bold-hovered: #FFECEB;\n --ds-background-danger-bold-pressed: #E2E3E4;\n --ds-background-warning: #3A2C1F;\n --ds-background-warning-hovered: #693200;\n --ds-background-warning-pressed: #7A3B00;\n --ds-background-warning-subtler: #693200;\n --ds-background-warning-subtler-hovered: #7A3B00;\n --ds-background-warning-subtler-pressed: #9E4C00;\n --ds-background-warning-bold: #F5E989;\n --ds-background-warning-bold-hovered: #FEF7C8;\n --ds-background-warning-bold-pressed: #E2E3E4;\n --ds-background-success: #28311B;\n --ds-background-success-hovered: #37471F;\n --ds-background-success-pressed: #3F5224;\n --ds-background-success-subtler: #37471F;\n --ds-background-success-subtler-hovered: #3F5224;\n --ds-background-success-subtler-pressed: #4C6B1F;\n --ds-background-success-bold: #BAF3DB;\n --ds-background-success-bold-hovered: #DCFFF1;\n --ds-background-success-bold-pressed: #E2E3E4;\n --ds-background-discovery: #35243F;\n --ds-background-discovery-hovered: #48245D;\n --ds-background-discovery-pressed: #673286;\n --ds-background-discovery-subtler: #48245D;\n --ds-background-discovery-subtler-hovered: #673286;\n --ds-background-discovery-subtler-pressed: #803FA5;\n --ds-background-discovery-bold: #EED7FC;\n --ds-background-discovery-bold-hovered: #F8EEFE;\n --ds-background-discovery-bold-pressed: #E2E3E4;\n --ds-background-information: #1C2B42;\n --ds-background-information-hovered: #123263;\n --ds-background-information-pressed: #144794;\n --ds-background-information-subtler: #123263;\n --ds-background-information-subtler-hovered: #144794;\n --ds-background-information-subtler-pressed: #1558BC;\n --ds-background-information-bold: #CFE1FD;\n --ds-background-information-bold-hovered: #E9F2FE;\n --ds-background-information-bold-pressed: #E2E3E4;\n --ds-blanket: #10121499;\n --ds-blanket-selected: #1D7AFC14;\n --ds-blanket-danger: #E3493514;\n --ds-interaction-hovered: #ffffff33;\n --ds-interaction-pressed: #ffffff5c;\n --ds-skeleton: #CECED912;\n --ds-skeleton-subtle: #BDBDBD0A;\n --ds-chart-categorical-1: #9DD9EE;\n --ds-chart-categorical-1-hovered: #C6EDFB;\n --ds-chart-categorical-2: #94C748;\n --ds-chart-categorical-2-hovered: #B3DF72;\n --ds-chart-categorical-3: #FBC828;\n --ds-chart-categorical-3-hovered: #FCE4A6;\n --ds-chart-categorical-4: #FCA700;\n --ds-chart-categorical-4-hovered: #FBC828;\n --ds-chart-categorical-5: #1558BC;\n --ds-chart-categorical-5-hovered: #1868DB;\n --ds-chart-categorical-6: #D8A0F7;\n --ds-chart-categorical-6-hovered: #EED7FC;\n --ds-chart-categorical-7: #42B2D7;\n --ds-chart-categorical-7-hovered: #6CC3E0;\n --ds-chart-categorical-8: #E06C00;\n --ds-chart-categorical-8-hovered: #FBD779;\n --ds-chart-lime-bold: #B3DF72;\n --ds-chart-lime-bold-hovered: #D3F1A7;\n --ds-chart-lime-bolder: #D3F1A7;\n --ds-chart-lime-bolder-hovered: #EFFFD6;\n --ds-chart-lime-boldest: #EFFFD6;\n --ds-chart-lime-boldest-hovered: #D3F1A7;\n --ds-chart-neutral: #96999E;\n --ds-chart-neutral-hovered: #A9ABAF;\n --ds-chart-red-bold: #FD9891;\n --ds-chart-red-bold-hovered: #FFD5D2;\n --ds-chart-red-bolder: #FFD5D2;\n --ds-chart-red-bolder-hovered: #FFECEB;\n --ds-chart-red-boldest: #FFECEB;\n --ds-chart-red-boldest-hovered: #FFD5D2;\n --ds-chart-orange-bold: #FBC828;\n --ds-chart-orange-bold-hovered: #FCE4A6;\n --ds-chart-orange-bolder: #FCE4A6;\n --ds-chart-orange-bolder-hovered: #FFF5DB;\n --ds-chart-orange-boldest: #FFF5DB;\n --ds-chart-orange-boldest-hovered: #FCE4A6;\n --ds-chart-yellow-bold: #EED12B;\n --ds-chart-yellow-bold-hovered: #F5E989;\n --ds-chart-yellow-bolder: #F5E989;\n --ds-chart-yellow-bolder-hovered: #FEF7C8;\n --ds-chart-yellow-boldest: #FEF7C8;\n --ds-chart-yellow-boldest-hovered: #F5E989;\n --ds-chart-green-bold: #7EE2B8;\n --ds-chart-green-bold-hovered: #4BCE97;\n --ds-chart-green-bolder: #BAF3DB;\n --ds-chart-green-bolder-hovered: #DCFFF1;\n --ds-chart-green-boldest: #DCFFF1;\n --ds-chart-green-boldest-hovered: #BAF3DB;\n --ds-chart-teal-bold: #9DD9EE;\n --ds-chart-teal-bold-hovered: #C6EDFB;\n --ds-chart-teal-bolder: #C6EDFB;\n --ds-chart-teal-bolder-hovered: #E7F9FF;\n --ds-chart-teal-boldest: #E7F9FF;\n --ds-chart-teal-boldest-hovered: #C6EDFB;\n --ds-chart-blue-bold: #8FB8F6;\n --ds-chart-blue-bold-hovered: #CFE1FD;\n --ds-chart-blue-bolder: #CFE1FD;\n --ds-chart-blue-bolder-hovered: #E9F2FE;\n --ds-chart-blue-boldest: #E9F2FE;\n --ds-chart-blue-boldest-hovered: #CFE1FD;\n --ds-chart-purple-bold: #D8A0F7;\n --ds-chart-purple-bold-hovered: #EED7FC;\n --ds-chart-purple-bolder: #EED7FC;\n --ds-chart-purple-bolder-hovered: #F8EEFE;\n --ds-chart-purple-boldest: #F8EEFE;\n --ds-chart-purple-boldest-hovered: #EED7FC;\n --ds-chart-magenta-bold: #F797D2;\n --ds-chart-magenta-bold-hovered: #FDD0EC;\n --ds-chart-magenta-bolder: #FDD0EC;\n --ds-chart-magenta-bolder-hovered: #FFECF8;\n --ds-chart-magenta-boldest: #FFECF8;\n --ds-chart-magenta-boldest-hovered: #FDD0EC;\n --ds-chart-gray-bold: #96999E;\n --ds-chart-gray-bold-hovered: #A9ABAF;\n --ds-chart-gray-bolder: #A9ABAF;\n --ds-chart-gray-bolder-hovered: #BFC1C4;\n --ds-chart-gray-boldest: #BFC1C4;\n --ds-chart-gray-boldest-hovered: #CECFD2;\n --ds-chart-brand: #669DF1;\n --ds-chart-brand-hovered: #8FB8F6;\n --ds-chart-danger: #F87168;\n --ds-chart-danger-hovered: #F15B50;\n --ds-chart-danger-bold: #FFB8B2;\n --ds-chart-danger-bold-hovered: #FD9891;\n --ds-chart-warning: #F68909;\n --ds-chart-warning-hovered: #FCA700;\n --ds-chart-warning-bold: #FBC828;\n --ds-chart-warning-bold-hovered: #FCE4A6;\n --ds-chart-success: #82B536;\n --ds-chart-success-hovered: #94C748;\n --ds-chart-success-bold: #B3DF72;\n --ds-chart-success-bold-hovered: #D3F1A7;\n --ds-chart-discovery: #C97CF4;\n --ds-chart-discovery-hovered: #C97CF4;\n --ds-chart-discovery-bold: #D8A0F7;\n --ds-chart-discovery-bold-hovered: #EED7FC;\n --ds-chart-information: #669DF1;\n --ds-chart-information-hovered: #669DF1;\n --ds-chart-information-bold: #8FB8F6;\n --ds-chart-information-bold-hovered: #CFE1FD;\n --ds-surface: #1F1F21;\n --ds-surface-hovered: #242528;\n --ds-surface-pressed: #2B2C2F;\n --ds-surface-overlay: #2B2C2F;\n --ds-surface-overlay-hovered: #303134;\n --ds-surface-overlay-pressed: #3D3F43;\n --ds-surface-raised: #242528;\n --ds-surface-raised-hovered: #2B2C2F;\n --ds-surface-raised-pressed: #303134;\n --ds-surface-sunken: #18191A;\n --ds-shadow-overflow: 0px 0px 12px #0104048F;\n --ds-shadow-overflow-perimeter: #01040480;\n --ds-shadow-overflow-spread: #0104048f;\n --ds-shadow-overlay: inset 0px 0px 0px 1px #E9F0FB80;\n --ds-shadow-raised: inset 0px 0px 0px 1px #E9F0FB80;\n --ds-opacity-disabled: 0.4;\n --ds-opacity-loading: 0.2;\n --ds-UNSAFE-transparent: transparent;\n --ds-elevation-surface-current: #1F1F21;\n}\n";
|
|
6
|
+
export default "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:dark-increased-contrast\"], [data-subtree-theme][data-color-mode=\"light\"][data-theme~=\"light:dark-increased-contrast\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:dark-increased-contrast\"], [data-subtree-theme][data-color-mode=\"dark\"][data-theme~=\"dark:dark-increased-contrast\"],\nhtml[data-color-mode=\"light\"][data-contrast-mode=\"more\"][data-theme~=\"light:dark\"],\nhtml[data-color-mode=\"dark\"][data-contrast-mode=\"more\"][data-theme~=\"dark:dark\"] {\n color-scheme: dark;\n --ds-text: #E2E3E4;\n --ds-text-accent-lime: #D3F1A7;\n --ds-text-accent-lime-bolder: #EFFFD6;\n --ds-text-accent-red: #FFD5D2;\n --ds-text-accent-red-bolder: #FFECEB;\n --ds-text-accent-orange: #FCE4A6;\n --ds-text-accent-orange-bolder: #FFF5DB;\n --ds-text-accent-yellow: #F5E989;\n --ds-text-accent-yellow-bolder: #FEF7C8;\n --ds-text-accent-green: #BAF3DB;\n --ds-text-accent-green-bolder: #DCFFF1;\n --ds-text-accent-teal: #C6EDFB;\n --ds-text-accent-teal-bolder: #E7F9FF;\n --ds-text-accent-blue: #CFE1FD;\n --ds-text-accent-blue-bolder: #E9F2FE;\n --ds-text-accent-purple: #EED7FC;\n --ds-text-accent-purple-bolder: #F8EEFE;\n --ds-text-accent-magenta: #FDD0EC;\n --ds-text-accent-magenta-bolder: #FFECF8;\n --ds-text-accent-gray: #BFC1C4;\n --ds-text-accent-gray-bolder: #E2E3E4;\n --ds-text-disabled: #E5E9F640;\n --ds-text-inverse: #1F1F21;\n --ds-text-selected: #CFE1FD;\n --ds-text-brand: #CFE1FD;\n --ds-text-danger: #FFD5D2;\n --ds-text-danger-bolder: #FFECEB;\n --ds-text-warning: #FCE4A6;\n --ds-text-warning-inverse: #18191A;\n --ds-text-warning-bolder: #FFF5DB;\n --ds-text-success: #BAF3DB;\n --ds-text-success-bolder: #DCFFF1;\n --ds-text-discovery: #EED7FC;\n --ds-text-discovery-bolder: #F8EEFE;\n --ds-text-information: #CFE1FD;\n --ds-text-information-bolder: #E9F2FE;\n --ds-text-subtlest: #BFC1C4;\n --ds-text-subtle: #CECFD2;\n --ds-link: #CFE1FD;\n --ds-link-pressed: #CFE1FD;\n --ds-link-visited: #D8A0F7;\n --ds-link-visited-pressed: #EED7FC;\n --ds-icon: #CECFD2;\n --ds-icon-accent-lime: #B3DF72;\n --ds-icon-accent-red: #FD9891;\n --ds-icon-accent-orange: #FBC828;\n --ds-icon-accent-yellow: #EED12B;\n --ds-icon-accent-green: #7EE2B8;\n --ds-icon-accent-teal: #9DD9EE;\n --ds-icon-accent-blue: #8FB8F6;\n --ds-icon-accent-purple: #D8A0F7;\n --ds-icon-accent-magenta: #F797D2;\n --ds-icon-accent-gray: #A9ABAF;\n --ds-icon-disabled: #E5E9F640;\n --ds-icon-inverse: #1F1F21;\n --ds-icon-selected: #8FB8F6;\n --ds-icon-brand: #8FB8F6;\n --ds-icon-danger: #F87168;\n --ds-icon-warning: #FBC828;\n --ds-icon-warning-inverse: #18191A;\n --ds-icon-success: #7EE2B8;\n --ds-icon-discovery: #C97CF4;\n --ds-icon-information: #8FB8F6;\n --ds-icon-subtlest: #BFC1C4;\n --ds-icon-subtle: #BFC1C4;\n --ds-border: #E9F0FB5C;\n --ds-border-accent-lime: #B3DF72;\n --ds-border-accent-red: #FD9891;\n --ds-border-accent-orange: #FBC828;\n --ds-border-accent-yellow: #EED12B;\n --ds-border-accent-green: #7EE2B8;\n --ds-border-accent-teal: #9DD9EE;\n --ds-border-accent-blue: #8FB8F6;\n --ds-border-accent-purple: #D8A0F7;\n --ds-border-accent-magenta: #F797D2;\n --ds-border-accent-gray: #A9ABAF;\n --ds-border-disabled: #E3E4F21F;\n --ds-border-focused: #8FB8F6;\n --ds-border-input: #A9ABAF;\n --ds-border-inverse: #18191A;\n --ds-border-selected: #8FB8F6;\n --ds-border-brand: #8FB8F6;\n --ds-border-danger: #F87168;\n --ds-border-warning: #FBC828;\n --ds-border-success: #7EE2B8;\n --ds-border-discovery: #C97CF4;\n --ds-border-information: #8FB8F6;\n --ds-border-bold: #A9ABAF;\n --ds-background-accent-lime-subtlest: #28311B;\n --ds-background-accent-lime-subtlest-hovered: #37471F;\n --ds-background-accent-lime-subtlest-pressed: #3F5224;\n --ds-background-accent-lime-subtler: #37471F;\n --ds-background-accent-lime-subtler-hovered: #3F5224;\n --ds-background-accent-lime-subtler-pressed: #4C6B1F;\n --ds-background-accent-lime-subtle: #4C6B1F;\n --ds-background-accent-lime-subtle-hovered: #3F5224;\n --ds-background-accent-lime-subtle-pressed: #37471F;\n --ds-background-accent-lime-bolder: #D3F1A7;\n --ds-background-accent-lime-bolder-hovered: #EFFFD6;\n --ds-background-accent-lime-bolder-pressed: #BDE97C;\n --ds-background-accent-red-subtlest: #42221F;\n --ds-background-accent-red-subtlest-hovered: #5D1F1A;\n --ds-background-accent-red-subtlest-pressed: #872821;\n --ds-background-accent-red-subtler: #5D1F1A;\n --ds-background-accent-red-subtler-hovered: #872821;\n --ds-background-accent-red-subtler-pressed: #AE2E24;\n --ds-background-accent-red-subtle: #AE2E24;\n --ds-background-accent-red-subtle-hovered: #872821;\n --ds-background-accent-red-subtle-pressed: #5D1F1A;\n --ds-background-accent-red-bolder: #FFD5D2;\n --ds-background-accent-red-bolder-hovered: #FFECEB;\n --ds-background-accent-red-bolder-pressed: #FFB8B2;\n --ds-background-accent-orange-subtlest: #3A2C1F;\n --ds-background-accent-orange-subtlest-hovered: #693200;\n --ds-background-accent-orange-subtlest-pressed: #7A3B00;\n --ds-background-accent-orange-subtler: #693200;\n --ds-background-accent-orange-subtler-hovered: #7A3B00;\n --ds-background-accent-orange-subtler-pressed: #9E4C00;\n --ds-background-accent-orange-subtle: #9E4C00;\n --ds-background-accent-orange-subtle-hovered: #7A3B00;\n --ds-background-accent-orange-subtle-pressed: #693200;\n --ds-background-accent-orange-bolder: #FCE4A6;\n --ds-background-accent-orange-bolder-hovered: #FFF5DB;\n --ds-background-accent-orange-bolder-pressed: #FBD779;\n --ds-background-accent-yellow-subtlest: #332E1B;\n --ds-background-accent-yellow-subtlest-hovered: #533F04;\n --ds-background-accent-yellow-subtlest-pressed: #614A05;\n --ds-background-accent-yellow-subtler: #533F04;\n --ds-background-accent-yellow-subtler-hovered: #614A05;\n --ds-background-accent-yellow-subtler-pressed: #7F5F01;\n --ds-background-accent-yellow-subtle: #7F5F01;\n --ds-background-accent-yellow-subtle-hovered: #614A05;\n --ds-background-accent-yellow-subtle-pressed: #533F04;\n --ds-background-accent-yellow-bolder: #F5E989;\n --ds-background-accent-yellow-bolder-hovered: #FEF7C8;\n --ds-background-accent-yellow-bolder-pressed: #EFDD4E;\n --ds-background-accent-green-subtlest: #1C3329;\n --ds-background-accent-green-subtlest-hovered: #164B35;\n --ds-background-accent-green-subtlest-pressed: #19573D;\n --ds-background-accent-green-subtler: #164B35;\n --ds-background-accent-green-subtler-hovered: #19573D;\n --ds-background-accent-green-subtler-pressed: #216E4E;\n --ds-background-accent-green-subtle: #216E4E;\n --ds-background-accent-green-subtle-hovered: #19573D;\n --ds-background-accent-green-subtle-pressed: #164B35;\n --ds-background-accent-green-bolder: #BAF3DB;\n --ds-background-accent-green-bolder-hovered: #DCFFF1;\n --ds-background-accent-green-bolder-pressed: #97EDC9;\n --ds-background-accent-teal-subtlest: #1E3137;\n --ds-background-accent-teal-subtlest-hovered: #164555;\n --ds-background-accent-teal-subtlest-pressed: #1A5265;\n --ds-background-accent-teal-subtler: #164555;\n --ds-background-accent-teal-subtler-hovered: #1A5265;\n --ds-background-accent-teal-subtler-pressed: #206A83;\n --ds-background-accent-teal-subtle: #206A83;\n --ds-background-accent-teal-subtle-hovered: #1A5265;\n --ds-background-accent-teal-subtle-pressed: #164555;\n --ds-background-accent-teal-bolder: #C6EDFB;\n --ds-background-accent-teal-bolder-hovered: #E7F9FF;\n --ds-background-accent-teal-bolder-pressed: #B1E4F7;\n --ds-background-accent-blue-subtlest: #1C2B42;\n --ds-background-accent-blue-subtlest-hovered: #123263;\n --ds-background-accent-blue-subtlest-pressed: #144794;\n --ds-background-accent-blue-subtler: #123263;\n --ds-background-accent-blue-subtler-hovered: #144794;\n --ds-background-accent-blue-subtler-pressed: #1558BC;\n --ds-background-accent-blue-subtle: #1558BC;\n --ds-background-accent-blue-subtle-hovered: #144794;\n --ds-background-accent-blue-subtle-pressed: #123263;\n --ds-background-accent-blue-bolder: #669DF1;\n --ds-background-accent-blue-bolder-hovered: #8FB8F6;\n --ds-background-accent-blue-bolder-pressed: #ADCBFB;\n --ds-background-accent-purple-subtlest: #35243F;\n --ds-background-accent-purple-subtlest-hovered: #48245D;\n --ds-background-accent-purple-subtlest-pressed: #673286;\n --ds-background-accent-purple-subtler: #48245D;\n --ds-background-accent-purple-subtler-hovered: #673286;\n --ds-background-accent-purple-subtler-pressed: #803FA5;\n --ds-background-accent-purple-subtle: #803FA5;\n --ds-background-accent-purple-subtle-hovered: #673286;\n --ds-background-accent-purple-subtle-pressed: #48245D;\n --ds-background-accent-purple-bolder: #EED7FC;\n --ds-background-accent-purple-bolder-hovered: #F8EEFE;\n --ds-background-accent-purple-bolder-pressed: #E3BDFA;\n --ds-background-accent-magenta-subtlest: #3D2232;\n --ds-background-accent-magenta-subtlest-hovered: #50253F;\n --ds-background-accent-magenta-subtlest-pressed: #77325B;\n --ds-background-accent-magenta-subtler: #50253F;\n --ds-background-accent-magenta-subtler-hovered: #77325B;\n --ds-background-accent-magenta-subtler-pressed: #943D73;\n --ds-background-accent-magenta-subtle: #943D73;\n --ds-background-accent-magenta-subtle-hovered: #77325B;\n --ds-background-accent-magenta-subtle-pressed: #50253F;\n --ds-background-accent-magenta-bolder: #FDD0EC;\n --ds-background-accent-magenta-bolder-hovered: #FFECF8;\n --ds-background-accent-magenta-bolder-pressed: #FCB6E1;\n --ds-background-accent-gray-subtlest: #303134;\n --ds-background-accent-gray-subtlest-hovered: #3D3F43;\n --ds-background-accent-gray-subtlest-pressed: #4B4D51;\n --ds-background-accent-gray-subtler: #4B4D51;\n --ds-background-accent-gray-subtler-hovered: #63666B;\n --ds-background-accent-gray-subtler-pressed: #7E8188;\n --ds-background-accent-gray-subtle: #4B4D51;\n --ds-background-accent-gray-subtle-hovered: #303134;\n --ds-background-accent-gray-subtle-pressed: #242528;\n --ds-background-accent-gray-bolder: #A9ABAF;\n --ds-background-accent-gray-bolder-hovered: #BFC1C4;\n --ds-background-accent-gray-bolder-pressed: #CECFD2;\n --ds-background-disabled: #E3E4F21F;\n --ds-background-input: #242528;\n --ds-background-input-hovered: #2B2C2F;\n --ds-background-input-pressed: #242528;\n --ds-background-inverse-subtle: #FFFFFF29;\n --ds-background-inverse-subtle-hovered: #FFFFFF3D;\n --ds-background-inverse-subtle-pressed: #FFFFFF52;\n --ds-background-neutral: #CECED912;\n --ds-background-neutral-hovered: #E3E4F21F;\n --ds-background-neutral-pressed: #E5E9F640;\n --ds-background-neutral-subtle: #00000000;\n --ds-background-neutral-subtle-hovered: #CECED912;\n --ds-background-neutral-subtle-pressed: #E3E4F21F;\n --ds-background-neutral-bold: #CECFD2;\n --ds-background-neutral-bold-hovered: #BFC1C4;\n --ds-background-neutral-bold-pressed: #A9ABAF;\n --ds-background-selected: #1C2B42;\n --ds-background-selected-hovered: #123263;\n --ds-background-selected-pressed: #1558BC;\n --ds-background-selected-bold: #CFE1FD;\n --ds-background-selected-bold-hovered: #E9F2FE;\n --ds-background-selected-bold-pressed: #E2E3E4;\n --ds-background-brand-subtlest: #1C2B42;\n --ds-background-brand-subtlest-hovered: #123263;\n --ds-background-brand-subtlest-pressed: #144794;\n --ds-background-brand-bold: #CFE1FD;\n --ds-background-brand-bold-hovered: #E9F2FE;\n --ds-background-brand-bold-pressed: #E2E3E4;\n --ds-background-brand-boldest: #E9F2FE;\n --ds-background-brand-boldest-hovered: #CFE1FD;\n --ds-background-brand-boldest-pressed: #ADCBFB;\n --ds-background-danger: #42221F;\n --ds-background-danger-hovered: #5D1F1A;\n --ds-background-danger-pressed: #872821;\n --ds-background-danger-subtler: #5D1F1A;\n --ds-background-danger-subtler-hovered: #872821;\n --ds-background-danger-subtler-pressed: #AE2E24;\n --ds-background-danger-bold: #FFD5D2;\n --ds-background-danger-bold-hovered: #FFECEB;\n --ds-background-danger-bold-pressed: #E2E3E4;\n --ds-background-warning: #3A2C1F;\n --ds-background-warning-hovered: #693200;\n --ds-background-warning-pressed: #7A3B00;\n --ds-background-warning-subtler: #693200;\n --ds-background-warning-subtler-hovered: #7A3B00;\n --ds-background-warning-subtler-pressed: #9E4C00;\n --ds-background-warning-bold: #F5E989;\n --ds-background-warning-bold-hovered: #FEF7C8;\n --ds-background-warning-bold-pressed: #E2E3E4;\n --ds-background-success: #28311B;\n --ds-background-success-hovered: #37471F;\n --ds-background-success-pressed: #3F5224;\n --ds-background-success-subtler: #37471F;\n --ds-background-success-subtler-hovered: #3F5224;\n --ds-background-success-subtler-pressed: #4C6B1F;\n --ds-background-success-bold: #BAF3DB;\n --ds-background-success-bold-hovered: #DCFFF1;\n --ds-background-success-bold-pressed: #E2E3E4;\n --ds-background-discovery: #35243F;\n --ds-background-discovery-hovered: #48245D;\n --ds-background-discovery-pressed: #673286;\n --ds-background-discovery-subtler: #48245D;\n --ds-background-discovery-subtler-hovered: #673286;\n --ds-background-discovery-subtler-pressed: #803FA5;\n --ds-background-discovery-bold: #EED7FC;\n --ds-background-discovery-bold-hovered: #F8EEFE;\n --ds-background-discovery-bold-pressed: #E2E3E4;\n --ds-background-information: #1C2B42;\n --ds-background-information-hovered: #123263;\n --ds-background-information-pressed: #144794;\n --ds-background-information-subtler: #123263;\n --ds-background-information-subtler-hovered: #144794;\n --ds-background-information-subtler-pressed: #1558BC;\n --ds-background-information-bold: #CFE1FD;\n --ds-background-information-bold-hovered: #E9F2FE;\n --ds-background-information-bold-pressed: #E2E3E4;\n --ds-blanket: #10121499;\n --ds-blanket-selected: #1D7AFC14;\n --ds-blanket-danger: #E3493514;\n --ds-interaction-hovered: #ffffff33;\n --ds-interaction-pressed: #ffffff5c;\n --ds-skeleton: #CECED912;\n --ds-skeleton-subtle: #BDBDBD0A;\n --ds-chart-categorical-1: #9DD9EE;\n --ds-chart-categorical-1-hovered: #C6EDFB;\n --ds-chart-categorical-2: #94C748;\n --ds-chart-categorical-2-hovered: #B3DF72;\n --ds-chart-categorical-3: #FBC828;\n --ds-chart-categorical-3-hovered: #FCE4A6;\n --ds-chart-categorical-4: #FCA700;\n --ds-chart-categorical-4-hovered: #FBC828;\n --ds-chart-categorical-5: #1558BC;\n --ds-chart-categorical-5-hovered: #1868DB;\n --ds-chart-categorical-6: #D8A0F7;\n --ds-chart-categorical-6-hovered: #EED7FC;\n --ds-chart-categorical-7: #42B2D7;\n --ds-chart-categorical-7-hovered: #6CC3E0;\n --ds-chart-categorical-8: #E06C00;\n --ds-chart-categorical-8-hovered: #FBD779;\n --ds-chart-lime-bold: #B3DF72;\n --ds-chart-lime-bold-hovered: #D3F1A7;\n --ds-chart-lime-bolder: #D3F1A7;\n --ds-chart-lime-bolder-hovered: #EFFFD6;\n --ds-chart-lime-boldest: #EFFFD6;\n --ds-chart-lime-boldest-hovered: #D3F1A7;\n --ds-chart-neutral: #96999E;\n --ds-chart-neutral-hovered: #A9ABAF;\n --ds-chart-red-bold: #FD9891;\n --ds-chart-red-bold-hovered: #FFD5D2;\n --ds-chart-red-bolder: #FFD5D2;\n --ds-chart-red-bolder-hovered: #FFECEB;\n --ds-chart-red-boldest: #FFECEB;\n --ds-chart-red-boldest-hovered: #FFD5D2;\n --ds-chart-orange-bold: #FBC828;\n --ds-chart-orange-bold-hovered: #FCE4A6;\n --ds-chart-orange-bolder: #FCE4A6;\n --ds-chart-orange-bolder-hovered: #FFF5DB;\n --ds-chart-orange-boldest: #FFF5DB;\n --ds-chart-orange-boldest-hovered: #FCE4A6;\n --ds-chart-yellow-bold: #EED12B;\n --ds-chart-yellow-bold-hovered: #F5E989;\n --ds-chart-yellow-bolder: #F5E989;\n --ds-chart-yellow-bolder-hovered: #FEF7C8;\n --ds-chart-yellow-boldest: #FEF7C8;\n --ds-chart-yellow-boldest-hovered: #F5E989;\n --ds-chart-green-bold: #7EE2B8;\n --ds-chart-green-bold-hovered: #4BCE97;\n --ds-chart-green-bolder: #BAF3DB;\n --ds-chart-green-bolder-hovered: #DCFFF1;\n --ds-chart-green-boldest: #DCFFF1;\n --ds-chart-green-boldest-hovered: #BAF3DB;\n --ds-chart-teal-bold: #9DD9EE;\n --ds-chart-teal-bold-hovered: #C6EDFB;\n --ds-chart-teal-bolder: #C6EDFB;\n --ds-chart-teal-bolder-hovered: #E7F9FF;\n --ds-chart-teal-boldest: #E7F9FF;\n --ds-chart-teal-boldest-hovered: #C6EDFB;\n --ds-chart-blue-bold: #8FB8F6;\n --ds-chart-blue-bold-hovered: #CFE1FD;\n --ds-chart-blue-bolder: #CFE1FD;\n --ds-chart-blue-bolder-hovered: #E9F2FE;\n --ds-chart-blue-boldest: #E9F2FE;\n --ds-chart-blue-boldest-hovered: #CFE1FD;\n --ds-chart-purple-bold: #D8A0F7;\n --ds-chart-purple-bold-hovered: #EED7FC;\n --ds-chart-purple-bolder: #EED7FC;\n --ds-chart-purple-bolder-hovered: #F8EEFE;\n --ds-chart-purple-boldest: #F8EEFE;\n --ds-chart-purple-boldest-hovered: #EED7FC;\n --ds-chart-magenta-bold: #F797D2;\n --ds-chart-magenta-bold-hovered: #FDD0EC;\n --ds-chart-magenta-bolder: #FDD0EC;\n --ds-chart-magenta-bolder-hovered: #FFECF8;\n --ds-chart-magenta-boldest: #FFECF8;\n --ds-chart-magenta-boldest-hovered: #FDD0EC;\n --ds-chart-gray-bold: #96999E;\n --ds-chart-gray-bold-hovered: #A9ABAF;\n --ds-chart-gray-bolder: #A9ABAF;\n --ds-chart-gray-bolder-hovered: #BFC1C4;\n --ds-chart-gray-boldest: #BFC1C4;\n --ds-chart-gray-boldest-hovered: #CECFD2;\n --ds-chart-brand: #669DF1;\n --ds-chart-brand-hovered: #8FB8F6;\n --ds-chart-danger: #F87168;\n --ds-chart-danger-hovered: #F15B50;\n --ds-chart-danger-bold: #FFB8B2;\n --ds-chart-danger-bold-hovered: #FD9891;\n --ds-chart-warning: #F68909;\n --ds-chart-warning-hovered: #FCA700;\n --ds-chart-warning-bold: #FBC828;\n --ds-chart-warning-bold-hovered: #FCE4A6;\n --ds-chart-success: #82B536;\n --ds-chart-success-hovered: #94C748;\n --ds-chart-success-bold: #B3DF72;\n --ds-chart-success-bold-hovered: #D3F1A7;\n --ds-chart-discovery: #C97CF4;\n --ds-chart-discovery-hovered: #C97CF4;\n --ds-chart-discovery-bold: #D8A0F7;\n --ds-chart-discovery-bold-hovered: #EED7FC;\n --ds-chart-information: #669DF1;\n --ds-chart-information-hovered: #669DF1;\n --ds-chart-information-bold: #8FB8F6;\n --ds-chart-information-bold-hovered: #CFE1FD;\n --ds-surface: #1F1F21;\n --ds-surface-hovered: #242528;\n --ds-surface-pressed: #2B2C2F;\n --ds-surface-overlay: #2B2C2F;\n --ds-surface-overlay-hovered: #303134;\n --ds-surface-overlay-pressed: #3D3F43;\n --ds-surface-raised: #242528;\n --ds-surface-raised-hovered: #2B2C2F;\n --ds-surface-raised-pressed: #303134;\n --ds-surface-sunken: #18191A;\n --ds-shadow-overflow: 0px 0px 12px #0104048F;\n --ds-shadow-overflow-perimeter: #01040480;\n --ds-shadow-overflow-spread: #0104048f;\n --ds-shadow-overlay: inset 0px 0px 0px 1px #E9F0FB80;\n --ds-shadow-raised: inset 0px 0px 0px 1px #E9F0FB80;\n --ds-opacity-disabled: 0.4;\n --ds-opacity-loading: 0.2;\n --ds-UNSAFE-transparent: transparent;\n --ds-elevation-surface-current: #1F1F21;\n}\n";
|