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