@atlaskit/tokens 13.0.4 → 13.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- 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/token-metadata.codegen.js +2 -2
- package/dist/cjs/get-theme-styles.js +27 -27
- package/dist/cjs/set-global-theme.js +32 -31
- package/dist/cjs/theme-config.js +2 -0
- package/dist/cjs/theme-state-transformer.js +1 -0
- package/dist/cjs/utils/color-utils.js +8 -0
- package/dist/cjs/utils/custom-theme-loading-utils.js +2 -0
- package/dist/cjs/utils/custom-theme-token-contrast-check.js +2 -0
- package/dist/cjs/utils/generate-custom-color-ramp.js +4 -0
- package/dist/cjs/utils/hct-color-utils/color-utils.js +8 -0
- package/dist/cjs/utils/load-theme-css.js +4 -4
- package/dist/cjs/utils/theme-loading.js +8 -8
- 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/token-metadata.codegen.js +2 -2
- package/dist/es2019/theme-config.js +2 -0
- package/dist/es2019/theme-state-transformer.js +1 -0
- package/dist/es2019/utils/color-utils.js +8 -0
- package/dist/es2019/utils/custom-theme-loading-utils.js +2 -0
- package/dist/es2019/utils/custom-theme-token-contrast-check.js +2 -0
- package/dist/es2019/utils/generate-custom-color-ramp.js +4 -0
- package/dist/es2019/utils/hct-color-utils/color-utils.js +8 -0
- 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/token-metadata.codegen.js +2 -2
- package/dist/esm/get-theme-styles.js +26 -26
- package/dist/esm/set-global-theme.js +31 -30
- package/dist/esm/theme-config.js +2 -0
- package/dist/esm/theme-state-transformer.js +1 -0
- package/dist/esm/utils/color-utils.js +8 -0
- package/dist/esm/utils/custom-theme-loading-utils.js +2 -0
- package/dist/esm/utils/custom-theme-token-contrast-check.js +2 -0
- package/dist/esm/utils/generate-custom-color-ramp.js +4 -0
- package/dist/esm/utils/hct-color-utils/color-utils.js +8 -0
- package/dist/esm/utils/load-theme-css.js +4 -4
- package/dist/esm/utils/theme-loading.js +8 -8
- 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/token-metadata.codegen.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/token-metadata.codegen.d.ts +1 -1
- 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 +11 -11
- package/tokens.docs.tsx +48 -46
|
@@ -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::2aeda6082601f2aa47e90f990174849f>>
|
|
4
4
|
* @codegenCommand yarn build tokens
|
|
5
5
|
*/
|
|
6
|
-
export default "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:light\"], [data-subtree-theme][data-color-mode=\"light\"][data-theme~=\"light:light\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:light\"], [data-subtree-theme][data-color-mode=\"dark\"][data-theme~=\"dark:light\"] {\n color-scheme: light;\n --ds-text: #292A2E;\n --ds-text-accent-lime: #4C6B1F;\n --ds-text-accent-lime-bolder: #37471F;\n --ds-text-accent-red: #AE2E24;\n --ds-text-accent-red-bolder: #5D1F1A;\n --ds-text-accent-orange: #9E4C00;\n --ds-text-accent-orange-bolder: #693200;\n --ds-text-accent-yellow: #7F5F01;\n --ds-text-accent-yellow-bolder: #533F04;\n --ds-text-accent-green: #216E4E;\n --ds-text-accent-green-bolder: #164B35;\n --ds-text-accent-teal: #206A83;\n --ds-text-accent-teal-bolder: #164555;\n --ds-text-accent-blue: #1558BC;\n --ds-text-accent-blue-bolder: #123263;\n --ds-text-accent-purple: #803FA5;\n --ds-text-accent-purple-bolder: #48245D;\n --ds-text-accent-magenta: #943D73;\n --ds-text-accent-magenta-bolder: #50253F;\n --ds-text-accent-gray: #505258;\n --ds-text-accent-gray-bolder: #1E1F21;\n --ds-text-disabled: #080F214A;\n --ds-text-inverse: #FFFFFF;\n --ds-text-selected: #1868DB;\n --ds-text-brand: #1868DB;\n --ds-text-danger: #AE2E24;\n --ds-text-danger-bolder: #5D1F1A;\n --ds-text-warning: #9E4C00;\n --ds-text-warning-inverse: #292A2E;\n --ds-text-warning-bolder: #693200;\n --ds-text-success: #4C6B1F;\n --ds-text-success-bolder: #37471F;\n --ds-text-discovery: #803FA5;\n --ds-text-discovery-bolder: #48245D;\n --ds-text-information: #1558BC;\n --ds-text-information-bolder: #123263;\n --ds-text-subtlest: #6B6E76;\n --ds-text-subtle: #505258;\n --ds-link: #1868DB;\n --ds-link-pressed: #1558BC;\n --ds-link-visited: #803FA5;\n --ds-link-visited-pressed: #48245D;\n --ds-icon: #292A2E;\n --ds-icon-accent-lime: #6A9A23;\n --ds-icon-accent-red: #C9372C;\n --ds-icon-accent-orange: #E06C00;\n --ds-icon-accent-yellow: #B38600;\n --ds-icon-accent-green: #22A06B;\n --ds-icon-accent-teal: #2898BD;\n --ds-icon-accent-blue: #357DE8;\n --ds-icon-accent-purple: #AF59E1;\n --ds-icon-accent-magenta: #CD519D;\n --ds-icon-accent-gray: #7D818A;\n --ds-icon-disabled: #080F214A;\n --ds-icon-inverse: #FFFFFF;\n --ds-icon-selected: #1868DB;\n --ds-icon-brand: #1868DB;\n --ds-icon-danger: #C9372C;\n --ds-icon-warning: #E06C00;\n --ds-icon-warning-inverse: #292A2E;\n --ds-icon-success: #6A9A23;\n --ds-icon-discovery: #AF59E1;\n --ds-icon-information: #357DE8;\n --ds-icon-subtlest: #6B6E76;\n --ds-icon-subtle: #505258;\n --ds-border: #0B120E24;\n --ds-border-accent-lime: #6A9A23;\n --ds-border-accent-red: #E2483D;\n --ds-border-accent-orange: #E06C00;\n --ds-border-accent-yellow: #B38600;\n --ds-border-accent-green: #22A06B;\n --ds-border-accent-teal: #2898BD;\n --ds-border-accent-blue: #357DE8;\n --ds-border-accent-purple: #AF59E1;\n --ds-border-accent-magenta: #CD519D;\n --ds-border-accent-gray: #7D818A;\n --ds-border-disabled: #0515240F;\n --ds-border-focused: #4688EC;\n --ds-border-input: #8C8F97;\n --ds-border-inverse: #FFFFFF;\n --ds-border-selected: #1868DB;\n --ds-border-brand: #1868DB;\n --ds-border-danger: #E2483D;\n --ds-border-warning: #E06C00;\n --ds-border-success: #6A9A23;\n --ds-border-discovery: #AF59E1;\n --ds-border-information: #357DE8;\n --ds-border-bold: #7D818A;\n --ds-background-accent-lime-subtlest: #EFFFD6;\n --ds-background-accent-lime-subtlest-hovered: #D3F1A7;\n --ds-background-accent-lime-subtlest-pressed: #BDE97C;\n --ds-background-accent-lime-subtler: #D3F1A7;\n --ds-background-accent-lime-subtler-hovered: #BDE97C;\n --ds-background-accent-lime-subtler-pressed: #B3DF72;\n --ds-background-accent-lime-subtle: #94C748;\n --ds-background-accent-lime-subtle-hovered: #B3DF72;\n --ds-background-accent-lime-subtle-pressed: #BDE97C;\n --ds-background-accent-lime-bolder: #5B7F24;\n --ds-background-accent-lime-bolder-hovered: #4C6B1F;\n --ds-background-accent-lime-bolder-pressed: #3F5224;\n --ds-background-accent-red-subtlest: #FFECEB;\n --ds-background-accent-red-subtlest-hovered: #FFD5D2;\n --ds-background-accent-red-subtlest-pressed: #FFB8B2;\n --ds-background-accent-red-subtler: #FFD5D2;\n --ds-background-accent-red-subtler-hovered: #FFB8B2;\n --ds-background-accent-red-subtler-pressed: #FD9891;\n --ds-background-accent-red-subtle: #F87168;\n --ds-background-accent-red-subtle-hovered: #FD9891;\n --ds-background-accent-red-subtle-pressed: #FFB8B2;\n --ds-background-accent-red-bolder: #C9372C;\n --ds-background-accent-red-bolder-hovered: #AE2E24;\n --ds-background-accent-red-bolder-pressed: #872821;\n --ds-background-accent-orange-subtlest: #FFF5DB;\n --ds-background-accent-orange-subtlest-hovered: #FCE4A6;\n --ds-background-accent-orange-subtlest-pressed: #FBD779;\n --ds-background-accent-orange-subtler: #FCE4A6;\n --ds-background-accent-orange-subtler-hovered: #FBD779;\n --ds-background-accent-orange-subtler-pressed: #FBC828;\n --ds-background-accent-orange-subtle: #FCA700;\n --ds-background-accent-orange-subtle-hovered: #FBC828;\n --ds-background-accent-orange-subtle-pressed: #FBD779;\n --ds-background-accent-orange-bolder: #BD5B00;\n --ds-background-accent-orange-bolder-hovered: #9E4C00;\n --ds-background-accent-orange-bolder-pressed: #7A3B00;\n --ds-background-accent-yellow-subtlest: #FEF7C8;\n --ds-background-accent-yellow-subtlest-hovered: #F5E989;\n --ds-background-accent-yellow-subtlest-pressed: #EFDD4E;\n --ds-background-accent-yellow-subtler: #F5E989;\n --ds-background-accent-yellow-subtler-hovered: #EFDD4E;\n --ds-background-accent-yellow-subtler-pressed: #EED12B;\n --ds-background-accent-yellow-subtle: #EED12B;\n --ds-background-accent-yellow-subtle-hovered: #DDB30E;\n --ds-background-accent-yellow-subtle-pressed: #EFDD4E;\n --ds-background-accent-yellow-bolder: #946F00;\n --ds-background-accent-yellow-bolder-hovered: #7F5F01;\n --ds-background-accent-yellow-bolder-pressed: #614A05;\n --ds-background-accent-green-subtlest: #DCFFF1;\n --ds-background-accent-green-subtlest-hovered: #BAF3DB;\n --ds-background-accent-green-subtlest-pressed: #97EDC9;\n --ds-background-accent-green-subtler: #BAF3DB;\n --ds-background-accent-green-subtler-hovered: #97EDC9;\n --ds-background-accent-green-subtler-pressed: #7EE2B8;\n --ds-background-accent-green-subtle: #4BCE97;\n --ds-background-accent-green-subtle-hovered: #7EE2B8;\n --ds-background-accent-green-subtle-pressed: #97EDC9;\n --ds-background-accent-green-bolder: #1F845A;\n --ds-background-accent-green-bolder-hovered: #216E4E;\n --ds-background-accent-green-bolder-pressed: #19573D;\n --ds-background-accent-teal-subtlest: #E7F9FF;\n --ds-background-accent-teal-subtlest-hovered: #C6EDFB;\n --ds-background-accent-teal-subtlest-pressed: #B1E4F7;\n --ds-background-accent-teal-subtler: #C6EDFB;\n --ds-background-accent-teal-subtler-hovered: #B1E4F7;\n --ds-background-accent-teal-subtler-pressed: #9DD9EE;\n --ds-background-accent-teal-subtle: #6CC3E0;\n --ds-background-accent-teal-subtle-hovered: #9DD9EE;\n --ds-background-accent-teal-subtle-pressed: #B1E4F7;\n --ds-background-accent-teal-bolder: #227D9B;\n --ds-background-accent-teal-bolder-hovered: #206A83;\n --ds-background-accent-teal-bolder-pressed: #1A5265;\n --ds-background-accent-blue-subtlest: #E9F2FE;\n --ds-background-accent-blue-subtlest-hovered: #CFE1FD;\n --ds-background-accent-blue-subtlest-pressed: #ADCBFB;\n --ds-background-accent-blue-subtler: #CFE1FD;\n --ds-background-accent-blue-subtler-hovered: #ADCBFB;\n --ds-background-accent-blue-subtler-pressed: #8FB8F6;\n --ds-background-accent-blue-subtle: #669DF1;\n --ds-background-accent-blue-subtle-hovered: #8FB8F6;\n --ds-background-accent-blue-subtle-pressed: #ADCBFB;\n --ds-background-accent-blue-bolder: #1868DB;\n --ds-background-accent-blue-bolder-hovered: #1558BC;\n --ds-background-accent-blue-bolder-pressed: #144794;\n --ds-background-accent-purple-subtlest: #F8EEFE;\n --ds-background-accent-purple-subtlest-hovered: #EED7FC;\n --ds-background-accent-purple-subtlest-pressed: #E3BDFA;\n --ds-background-accent-purple-subtler: #EED7FC;\n --ds-background-accent-purple-subtler-hovered: #E3BDFA;\n --ds-background-accent-purple-subtler-pressed: #D8A0F7;\n --ds-background-accent-purple-subtle: #C97CF4;\n --ds-background-accent-purple-subtle-hovered: #D8A0F7;\n --ds-background-accent-purple-subtle-pressed: #E3BDFA;\n --ds-background-accent-purple-bolder: #964AC0;\n --ds-background-accent-purple-bolder-hovered: #803FA5;\n --ds-background-accent-purple-bolder-pressed: #673286;\n --ds-background-accent-magenta-subtlest: #FFECF8;\n --ds-background-accent-magenta-subtlest-hovered: #FDD0EC;\n --ds-background-accent-magenta-subtlest-pressed: #FCB6E1;\n --ds-background-accent-magenta-subtler: #FDD0EC;\n --ds-background-accent-magenta-subtler-hovered: #FCB6E1;\n --ds-background-accent-magenta-subtler-pressed: #F797D2;\n --ds-background-accent-magenta-subtle: #E774BB;\n --ds-background-accent-magenta-subtle-hovered: #F797D2;\n --ds-background-accent-magenta-subtle-pressed: #FCB6E1;\n --ds-background-accent-magenta-bolder: #AE4787;\n --ds-background-accent-magenta-bolder-hovered: #943D73;\n --ds-background-accent-magenta-bolder-pressed: #77325B;\n --ds-background-accent-gray-subtlest: #F0F1F2;\n --ds-background-accent-gray-subtlest-hovered: #DDDEE1;\n --ds-background-accent-gray-subtlest-pressed: #B7B9BE;\n --ds-background-accent-gray-subtler: #DDDEE1;\n --ds-background-accent-gray-subtler-hovered: #B7B9BE;\n --ds-background-accent-gray-subtler-pressed: #8C8F97;\n --ds-background-accent-gray-subtle: #8C8F97;\n --ds-background-accent-gray-subtle-hovered: #B7B9BE;\n --ds-background-accent-gray-subtle-pressed: #DDDEE1;\n --ds-background-accent-gray-bolder: #6B6E76;\n --ds-background-accent-gray-bolder-hovered: #505258;\n --ds-background-accent-gray-bolder-pressed: #3B3D42;\n --ds-background-disabled: #17171708;\n --ds-background-input: #FFFFFF;\n --ds-background-input-hovered: #F8F8F8;\n --ds-background-input-pressed: #FFFFFF;\n --ds-background-inverse-subtle: #00000029;\n --ds-background-inverse-subtle-hovered: #0000003D;\n --ds-background-inverse-subtle-pressed: #00000052;\n --ds-background-neutral: #0515240F;\n --ds-background-neutral-hovered: #0B120E24;\n --ds-background-neutral-pressed: #080F214A;\n --ds-background-neutral-subtle: #00000000;\n --ds-background-neutral-subtle-hovered: #0515240F;\n --ds-background-neutral-subtle-pressed: #0B120E24;\n --ds-background-neutral-bold: #292A2E;\n --ds-background-neutral-bold-hovered: #3B3D42;\n --ds-background-neutral-bold-pressed: #505258;\n --ds-background-selected: #E9F2FE;\n --ds-background-selected-hovered: #CFE1FD;\n --ds-background-selected-pressed: #8FB8F6;\n --ds-background-selected-bold: #1868DB;\n --ds-background-selected-bold-hovered: #1558BC;\n --ds-background-selected-bold-pressed: #123263;\n --ds-background-brand-subtlest: #E9F2FE;\n --ds-background-brand-subtlest-hovered: #CFE1FD;\n --ds-background-brand-subtlest-pressed: #ADCBFB;\n --ds-background-brand-bold: #1868DB;\n --ds-background-brand-bold-hovered: #1558BC;\n --ds-background-brand-bold-pressed: #144794;\n --ds-background-brand-boldest: #1C2B42;\n --ds-background-brand-boldest-hovered: #123263;\n --ds-background-brand-boldest-pressed: #144794;\n --ds-background-danger: #FFECEB;\n --ds-background-danger-hovered: #FFD5D2;\n --ds-background-danger-pressed: #FFB8B2;\n --ds-background-danger-subtler: #FFD5D2;\n --ds-background-danger-subtler-hovered: #FFB8B2;\n --ds-background-danger-subtler-pressed: #FD9891;\n --ds-background-danger-bold: #C9372C;\n --ds-background-danger-bold-hovered: #AE2E24;\n --ds-background-danger-bold-pressed: #872821;\n --ds-background-warning: #FFF5DB;\n --ds-background-warning-hovered: #FCE4A6;\n --ds-background-warning-pressed: #FBD779;\n --ds-background-warning-subtler: #FCE4A6;\n --ds-background-warning-subtler-hovered: #FBD779;\n --ds-background-warning-subtler-pressed: #FBC828;\n --ds-background-warning-bold: #FBC828;\n --ds-background-warning-bold-hovered: #FCA700;\n --ds-background-warning-bold-pressed: #F68909;\n --ds-background-success: #EFFFD6;\n --ds-background-success-hovered: #D3F1A7;\n --ds-background-success-pressed: #BDE97C;\n --ds-background-success-subtler: #D3F1A7;\n --ds-background-success-subtler-hovered: #BDE97C;\n --ds-background-success-subtler-pressed: #B3DF72;\n --ds-background-success-bold: #5B7F24;\n --ds-background-success-bold-hovered: #4C6B1F;\n --ds-background-success-bold-pressed: #3F5224;\n --ds-background-discovery: #F8EEFE;\n --ds-background-discovery-hovered: #EED7FC;\n --ds-background-discovery-pressed: #E3BDFA;\n --ds-background-discovery-subtler: #EED7FC;\n --ds-background-discovery-subtler-hovered: #E3BDFA;\n --ds-background-discovery-subtler-pressed: #D8A0F7;\n --ds-background-discovery-bold: #964AC0;\n --ds-background-discovery-bold-hovered: #803FA5;\n --ds-background-discovery-bold-pressed: #673286;\n --ds-background-information: #E9F2FE;\n --ds-background-information-hovered: #CFE1FD;\n --ds-background-information-pressed: #ADCBFB;\n --ds-background-information-subtler: #CFE1FD;\n --ds-background-information-subtler-hovered: #ADCBFB;\n --ds-background-information-subtler-pressed: #8FB8F6;\n --ds-background-information-bold: #1868DB;\n --ds-background-information-bold-hovered: #1558BC;\n --ds-background-information-bold-pressed: #144794;\n --ds-blanket: #050C1F75;\n --ds-blanket-selected: #388BFF14;\n --ds-blanket-danger: #EF5C4814;\n --ds-interaction-hovered: #00000029;\n --ds-interaction-pressed: #00000052;\n --ds-skeleton: #0515240F;\n --ds-skeleton-subtle: #17171708;\n --ds-chart-categorical-1: #357DE8;\n --ds-chart-categorical-1-hovered: #1868DB;\n --ds-chart-categorical-2: #82B536;\n --ds-chart-categorical-2-hovered: #6A9A23;\n --ds-chart-categorical-3: #BF63F3;\n --ds-chart-categorical-3-hovered: #AF59E1;\n --ds-chart-categorical-4: #F68909;\n --ds-chart-categorical-4-hovered: #E06C00;\n --ds-chart-categorical-5: #1558BC;\n --ds-chart-categorical-5-hovered: #123263;\n --ds-chart-categorical-6: #964AC0;\n --ds-chart-categorical-6-hovered: #803FA5;\n --ds-chart-categorical-7: #42B2D7;\n --ds-chart-categorical-7-hovered: #2898BD;\n --ds-chart-categorical-8: #BD5B00;\n --ds-chart-categorical-8-hovered: #7A3B00;\n --ds-chart-lime-bold: #6A9A23;\n --ds-chart-lime-bold-hovered: #5B7F24;\n --ds-chart-lime-bolder: #5B7F24;\n --ds-chart-lime-bolder-hovered: #4C6B1F;\n --ds-chart-lime-boldest: #4C6B1F;\n --ds-chart-lime-boldest-hovered: #37471F;\n --ds-chart-neutral: #8C8F97;\n --ds-chart-neutral-hovered: #7D818A;\n --ds-chart-red-bold: #F15B50;\n --ds-chart-red-bold-hovered: #E2483D;\n --ds-chart-red-bolder: #E2483D;\n --ds-chart-red-bolder-hovered: #C9372C;\n --ds-chart-red-boldest: #AE2E24;\n --ds-chart-red-boldest-hovered: #5D1F1A;\n --ds-chart-orange-bold: #E06C00;\n --ds-chart-orange-bold-hovered: #BD5B00;\n --ds-chart-orange-bolder: #BD5B00;\n --ds-chart-orange-bolder-hovered: #9E4C00;\n --ds-chart-orange-boldest: #7A3B00;\n --ds-chart-orange-boldest-hovered: #693200;\n --ds-chart-yellow-bold: #B38600;\n --ds-chart-yellow-bold-hovered: #946F00;\n --ds-chart-yellow-bolder: #946F00;\n --ds-chart-yellow-bolder-hovered: #7F5F01;\n --ds-chart-yellow-boldest: #7F5F01;\n --ds-chart-yellow-boldest-hovered: #533F04;\n --ds-chart-green-bold: #22A06B;\n --ds-chart-green-bold-hovered: #1F845A;\n --ds-chart-green-bolder: #1F845A;\n --ds-chart-green-bolder-hovered: #216E4E;\n --ds-chart-green-boldest: #216E4E;\n --ds-chart-green-boldest-hovered: #164B35;\n --ds-chart-teal-bold: #2898BD;\n --ds-chart-teal-bold-hovered: #227D9B;\n --ds-chart-teal-bolder: #227D9B;\n --ds-chart-teal-bolder-hovered: #206A83;\n --ds-chart-teal-boldest: #206A83;\n --ds-chart-teal-boldest-hovered: #164555;\n --ds-chart-blue-bold: #4688EC;\n --ds-chart-blue-bold-hovered: #357DE8;\n --ds-chart-blue-bolder: #357DE8;\n --ds-chart-blue-bolder-hovered: #1868DB;\n --ds-chart-blue-boldest: #1558BC;\n --ds-chart-blue-boldest-hovered: #123263;\n --ds-chart-purple-bold: #BF63F3;\n --ds-chart-purple-bold-hovered: #AF59E1;\n --ds-chart-purple-bolder: #AF59E1;\n --ds-chart-purple-bolder-hovered: #964AC0;\n --ds-chart-purple-boldest: #803FA5;\n --ds-chart-purple-boldest-hovered: #48245D;\n --ds-chart-magenta-bold: #DA62AC;\n --ds-chart-magenta-bold-hovered: #CD519D;\n --ds-chart-magenta-bolder: #CD519D;\n --ds-chart-magenta-bolder-hovered: #AE4787;\n --ds-chart-magenta-boldest: #943D73;\n --ds-chart-magenta-boldest-hovered: #50253F;\n --ds-chart-gray-bold: #8C8F97;\n --ds-chart-gray-bold-hovered: #7D818A;\n --ds-chart-gray-bolder: #7D818A;\n --ds-chart-gray-bolder-hovered: #6B6E76;\n --ds-chart-gray-boldest: #505258;\n --ds-chart-gray-boldest-hovered: #3B3D42;\n --ds-chart-brand: #357DE8;\n --ds-chart-brand-hovered: #1868DB;\n --ds-chart-danger: #E2483D;\n --ds-chart-danger-hovered: #C9372C;\n --ds-chart-danger-bold: #872821;\n --ds-chart-danger-bold-hovered: #5D1F1A;\n --ds-chart-warning: #F68909;\n --ds-chart-warning-hovered: #E06C00;\n --ds-chart-warning-bold: #BD5B00;\n --ds-chart-warning-bold-hovered: #9E4C00;\n --ds-chart-success: #82B536;\n --ds-chart-success-hovered: #6A9A23;\n --ds-chart-success-bold: #5B7F24;\n --ds-chart-success-bold-hovered: #4C6B1F;\n --ds-chart-discovery: #BF63F3;\n --ds-chart-discovery-hovered: #AF59E1;\n --ds-chart-discovery-bold: #803FA5;\n --ds-chart-discovery-bold-hovered: #964AC0;\n --ds-chart-information: #357DE8;\n --ds-chart-information-hovered: #1868DB;\n --ds-chart-information-bold: #1558BC;\n --ds-chart-information-bold-hovered: #123263;\n --ds-surface: #FFFFFF;\n --ds-surface-hovered: #F0F1F2;\n --ds-surface-pressed: #DDDEE1;\n --ds-surface-overlay: #FFFFFF;\n --ds-surface-overlay-hovered: #F0F1F2;\n --ds-surface-overlay-pressed: #DDDEE1;\n --ds-surface-raised: #FFFFFF;\n --ds-surface-raised-hovered: #F0F1F2;\n --ds-surface-raised-pressed: #DDDEE1;\n --ds-surface-sunken: #F8F8F8;\n --ds-shadow-overflow: 0px 0px 8px #1E1F2129, 0px 0px 1px #1E1F211F;\n --ds-shadow-overflow-perimeter: #1E1F211f;\n --ds-shadow-overflow-spread: #1E1F2129;\n --ds-shadow-overlay: 0px 8px 12px #1E1F2126, 0px 0px 1px #1E1F214F;\n --ds-shadow-raised: 0px 1px 1px #1E1F2140, 0px 0px 1px #1E1F214F;\n --ds-opacity-disabled: 0.4;\n --ds-opacity-loading: 0.2;\n --ds-UNSAFE-transparent: transparent;\n --ds-elevation-surface-current: #FFFFFF;\n}\n";
|
|
6
|
+
export default "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:light\"], [data-subtree-theme][data-color-mode=\"light\"][data-theme~=\"light:light\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:light\"], [data-subtree-theme][data-color-mode=\"dark\"][data-theme~=\"dark:light\"] {\n color-scheme: light;\n --ds-text: #292A2E;\n --ds-text-accent-lime: #4C6B1F;\n --ds-text-accent-lime-bolder: #37471F;\n --ds-text-accent-red: #AE2E24;\n --ds-text-accent-red-bolder: #5D1F1A;\n --ds-text-accent-orange: #9E4C00;\n --ds-text-accent-orange-bolder: #693200;\n --ds-text-accent-yellow: #7F5F01;\n --ds-text-accent-yellow-bolder: #533F04;\n --ds-text-accent-green: #216E4E;\n --ds-text-accent-green-bolder: #164B35;\n --ds-text-accent-teal: #206A83;\n --ds-text-accent-teal-bolder: #164555;\n --ds-text-accent-blue: #1558BC;\n --ds-text-accent-blue-bolder: #123263;\n --ds-text-accent-purple: #803FA5;\n --ds-text-accent-purple-bolder: #48245D;\n --ds-text-accent-magenta: #943D73;\n --ds-text-accent-magenta-bolder: #50253F;\n --ds-text-accent-gray: #505258;\n --ds-text-accent-gray-bolder: #1E1F21;\n --ds-text-disabled: #080F214A;\n --ds-text-inverse: #FFFFFF;\n --ds-text-selected: #1868DB;\n --ds-text-brand: #1868DB;\n --ds-text-danger: #AE2E24;\n --ds-text-danger-bolder: #5D1F1A;\n --ds-text-warning: #9E4C00;\n --ds-text-warning-inverse: #292A2E;\n --ds-text-warning-bolder: #693200;\n --ds-text-success: #4C6B1F;\n --ds-text-success-bolder: #37471F;\n --ds-text-discovery: #803FA5;\n --ds-text-discovery-bolder: #48245D;\n --ds-text-information: #1558BC;\n --ds-text-information-bolder: #123263;\n --ds-text-subtlest: #6B6E76;\n --ds-text-subtle: #505258;\n --ds-link: #1868DB;\n --ds-link-pressed: #1558BC;\n --ds-link-visited: #803FA5;\n --ds-link-visited-pressed: #48245D;\n --ds-icon: #292A2E;\n --ds-icon-accent-lime: #6A9A23;\n --ds-icon-accent-red: #C9372C;\n --ds-icon-accent-orange: #E06C00;\n --ds-icon-accent-yellow: #B38600;\n --ds-icon-accent-green: #22A06B;\n --ds-icon-accent-teal: #2898BD;\n --ds-icon-accent-blue: #357DE8;\n --ds-icon-accent-purple: #AF59E1;\n --ds-icon-accent-magenta: #CD519D;\n --ds-icon-accent-gray: #7D818A;\n --ds-icon-disabled: #080F214A;\n --ds-icon-inverse: #FFFFFF;\n --ds-icon-selected: #1868DB;\n --ds-icon-brand: #1868DB;\n --ds-icon-danger: #C9372C;\n --ds-icon-warning: #E06C00;\n --ds-icon-warning-inverse: #292A2E;\n --ds-icon-success: #6A9A23;\n --ds-icon-discovery: #AF59E1;\n --ds-icon-information: #357DE8;\n --ds-icon-subtlest: #6B6E76;\n --ds-icon-subtle: #505258;\n --ds-border: #0B120E24;\n --ds-border-accent-lime: #6A9A23;\n --ds-border-accent-red: #E2483D;\n --ds-border-accent-orange: #E06C00;\n --ds-border-accent-yellow: #B38600;\n --ds-border-accent-green: #22A06B;\n --ds-border-accent-teal: #2898BD;\n --ds-border-accent-blue: #357DE8;\n --ds-border-accent-purple: #AF59E1;\n --ds-border-accent-magenta: #CD519D;\n --ds-border-accent-gray: #7D818A;\n --ds-border-disabled: #0515240F;\n --ds-border-focused: #4688EC;\n --ds-border-input: #8C8F97;\n --ds-border-inverse: #FFFFFF;\n --ds-border-selected: #1868DB;\n --ds-border-brand: #1868DB;\n --ds-border-danger: #E2483D;\n --ds-border-warning: #E06C00;\n --ds-border-success: #6A9A23;\n --ds-border-discovery: #AF59E1;\n --ds-border-information: #357DE8;\n --ds-border-bold: #7D818A;\n --ds-background-accent-lime-subtlest: #EFFFD6;\n --ds-background-accent-lime-subtlest-hovered: #D3F1A7;\n --ds-background-accent-lime-subtlest-pressed: #BDE97C;\n --ds-background-accent-lime-subtler: #D3F1A7;\n --ds-background-accent-lime-subtler-hovered: #BDE97C;\n --ds-background-accent-lime-subtler-pressed: #B3DF72;\n --ds-background-accent-lime-subtle: #94C748;\n --ds-background-accent-lime-subtle-hovered: #B3DF72;\n --ds-background-accent-lime-subtle-pressed: #BDE97C;\n --ds-background-accent-lime-bolder: #5B7F24;\n --ds-background-accent-lime-bolder-hovered: #4C6B1F;\n --ds-background-accent-lime-bolder-pressed: #3F5224;\n --ds-background-accent-red-subtlest: #FFECEB;\n --ds-background-accent-red-subtlest-hovered: #FFD5D2;\n --ds-background-accent-red-subtlest-pressed: #FFB8B2;\n --ds-background-accent-red-subtler: #FFD5D2;\n --ds-background-accent-red-subtler-hovered: #FFB8B2;\n --ds-background-accent-red-subtler-pressed: #FD9891;\n --ds-background-accent-red-subtle: #F87168;\n --ds-background-accent-red-subtle-hovered: #FD9891;\n --ds-background-accent-red-subtle-pressed: #FFB8B2;\n --ds-background-accent-red-bolder: #C9372C;\n --ds-background-accent-red-bolder-hovered: #AE2E24;\n --ds-background-accent-red-bolder-pressed: #872821;\n --ds-background-accent-orange-subtlest: #FFF5DB;\n --ds-background-accent-orange-subtlest-hovered: #FCE4A6;\n --ds-background-accent-orange-subtlest-pressed: #FBD779;\n --ds-background-accent-orange-subtler: #FCE4A6;\n --ds-background-accent-orange-subtler-hovered: #FBD779;\n --ds-background-accent-orange-subtler-pressed: #FBC828;\n --ds-background-accent-orange-subtle: #FCA700;\n --ds-background-accent-orange-subtle-hovered: #FBC828;\n --ds-background-accent-orange-subtle-pressed: #FBD779;\n --ds-background-accent-orange-bolder: #BD5B00;\n --ds-background-accent-orange-bolder-hovered: #9E4C00;\n --ds-background-accent-orange-bolder-pressed: #7A3B00;\n --ds-background-accent-yellow-subtlest: #FEF7C8;\n --ds-background-accent-yellow-subtlest-hovered: #F5E989;\n --ds-background-accent-yellow-subtlest-pressed: #EFDD4E;\n --ds-background-accent-yellow-subtler: #F5E989;\n --ds-background-accent-yellow-subtler-hovered: #EFDD4E;\n --ds-background-accent-yellow-subtler-pressed: #EED12B;\n --ds-background-accent-yellow-subtle: #EED12B;\n --ds-background-accent-yellow-subtle-hovered: #DDB30E;\n --ds-background-accent-yellow-subtle-pressed: #EFDD4E;\n --ds-background-accent-yellow-bolder: #946F00;\n --ds-background-accent-yellow-bolder-hovered: #7F5F01;\n --ds-background-accent-yellow-bolder-pressed: #614A05;\n --ds-background-accent-green-subtlest: #DCFFF1;\n --ds-background-accent-green-subtlest-hovered: #BAF3DB;\n --ds-background-accent-green-subtlest-pressed: #97EDC9;\n --ds-background-accent-green-subtler: #BAF3DB;\n --ds-background-accent-green-subtler-hovered: #97EDC9;\n --ds-background-accent-green-subtler-pressed: #7EE2B8;\n --ds-background-accent-green-subtle: #4BCE97;\n --ds-background-accent-green-subtle-hovered: #7EE2B8;\n --ds-background-accent-green-subtle-pressed: #97EDC9;\n --ds-background-accent-green-bolder: #1F845A;\n --ds-background-accent-green-bolder-hovered: #216E4E;\n --ds-background-accent-green-bolder-pressed: #19573D;\n --ds-background-accent-teal-subtlest: #E7F9FF;\n --ds-background-accent-teal-subtlest-hovered: #C6EDFB;\n --ds-background-accent-teal-subtlest-pressed: #B1E4F7;\n --ds-background-accent-teal-subtler: #C6EDFB;\n --ds-background-accent-teal-subtler-hovered: #B1E4F7;\n --ds-background-accent-teal-subtler-pressed: #9DD9EE;\n --ds-background-accent-teal-subtle: #6CC3E0;\n --ds-background-accent-teal-subtle-hovered: #9DD9EE;\n --ds-background-accent-teal-subtle-pressed: #B1E4F7;\n --ds-background-accent-teal-bolder: #227D9B;\n --ds-background-accent-teal-bolder-hovered: #206A83;\n --ds-background-accent-teal-bolder-pressed: #1A5265;\n --ds-background-accent-blue-subtlest: #E9F2FE;\n --ds-background-accent-blue-subtlest-hovered: #CFE1FD;\n --ds-background-accent-blue-subtlest-pressed: #ADCBFB;\n --ds-background-accent-blue-subtler: #CFE1FD;\n --ds-background-accent-blue-subtler-hovered: #ADCBFB;\n --ds-background-accent-blue-subtler-pressed: #8FB8F6;\n --ds-background-accent-blue-subtle: #669DF1;\n --ds-background-accent-blue-subtle-hovered: #8FB8F6;\n --ds-background-accent-blue-subtle-pressed: #ADCBFB;\n --ds-background-accent-blue-bolder: #1868DB;\n --ds-background-accent-blue-bolder-hovered: #1558BC;\n --ds-background-accent-blue-bolder-pressed: #144794;\n --ds-background-accent-purple-subtlest: #F8EEFE;\n --ds-background-accent-purple-subtlest-hovered: #EED7FC;\n --ds-background-accent-purple-subtlest-pressed: #E3BDFA;\n --ds-background-accent-purple-subtler: #EED7FC;\n --ds-background-accent-purple-subtler-hovered: #E3BDFA;\n --ds-background-accent-purple-subtler-pressed: #D8A0F7;\n --ds-background-accent-purple-subtle: #C97CF4;\n --ds-background-accent-purple-subtle-hovered: #D8A0F7;\n --ds-background-accent-purple-subtle-pressed: #E3BDFA;\n --ds-background-accent-purple-bolder: #964AC0;\n --ds-background-accent-purple-bolder-hovered: #803FA5;\n --ds-background-accent-purple-bolder-pressed: #673286;\n --ds-background-accent-magenta-subtlest: #FFECF8;\n --ds-background-accent-magenta-subtlest-hovered: #FDD0EC;\n --ds-background-accent-magenta-subtlest-pressed: #FCB6E1;\n --ds-background-accent-magenta-subtler: #FDD0EC;\n --ds-background-accent-magenta-subtler-hovered: #FCB6E1;\n --ds-background-accent-magenta-subtler-pressed: #F797D2;\n --ds-background-accent-magenta-subtle: #E774BB;\n --ds-background-accent-magenta-subtle-hovered: #F797D2;\n --ds-background-accent-magenta-subtle-pressed: #FCB6E1;\n --ds-background-accent-magenta-bolder: #AE4787;\n --ds-background-accent-magenta-bolder-hovered: #943D73;\n --ds-background-accent-magenta-bolder-pressed: #77325B;\n --ds-background-accent-gray-subtlest: #F0F1F2;\n --ds-background-accent-gray-subtlest-hovered: #DDDEE1;\n --ds-background-accent-gray-subtlest-pressed: #B7B9BE;\n --ds-background-accent-gray-subtler: #DDDEE1;\n --ds-background-accent-gray-subtler-hovered: #B7B9BE;\n --ds-background-accent-gray-subtler-pressed: #8C8F97;\n --ds-background-accent-gray-subtle: #8C8F97;\n --ds-background-accent-gray-subtle-hovered: #B7B9BE;\n --ds-background-accent-gray-subtle-pressed: #DDDEE1;\n --ds-background-accent-gray-bolder: #6B6E76;\n --ds-background-accent-gray-bolder-hovered: #505258;\n --ds-background-accent-gray-bolder-pressed: #3B3D42;\n --ds-background-disabled: #0515240F;\n --ds-background-input: #FFFFFF;\n --ds-background-input-hovered: #F8F8F8;\n --ds-background-input-pressed: #FFFFFF;\n --ds-background-inverse-subtle: #00000029;\n --ds-background-inverse-subtle-hovered: #0000003D;\n --ds-background-inverse-subtle-pressed: #00000052;\n --ds-background-neutral: #0515240F;\n --ds-background-neutral-hovered: #0B120E24;\n --ds-background-neutral-pressed: #080F214A;\n --ds-background-neutral-subtle: #00000000;\n --ds-background-neutral-subtle-hovered: #0515240F;\n --ds-background-neutral-subtle-pressed: #0B120E24;\n --ds-background-neutral-bold: #292A2E;\n --ds-background-neutral-bold-hovered: #3B3D42;\n --ds-background-neutral-bold-pressed: #505258;\n --ds-background-selected: #E9F2FE;\n --ds-background-selected-hovered: #CFE1FD;\n --ds-background-selected-pressed: #8FB8F6;\n --ds-background-selected-bold: #1868DB;\n --ds-background-selected-bold-hovered: #1558BC;\n --ds-background-selected-bold-pressed: #123263;\n --ds-background-brand-subtlest: #E9F2FE;\n --ds-background-brand-subtlest-hovered: #CFE1FD;\n --ds-background-brand-subtlest-pressed: #ADCBFB;\n --ds-background-brand-bold: #1868DB;\n --ds-background-brand-bold-hovered: #1558BC;\n --ds-background-brand-bold-pressed: #144794;\n --ds-background-brand-boldest: #1C2B42;\n --ds-background-brand-boldest-hovered: #123263;\n --ds-background-brand-boldest-pressed: #144794;\n --ds-background-danger: #FFECEB;\n --ds-background-danger-hovered: #FFD5D2;\n --ds-background-danger-pressed: #FFB8B2;\n --ds-background-danger-subtler: #FFD5D2;\n --ds-background-danger-subtler-hovered: #FFB8B2;\n --ds-background-danger-subtler-pressed: #FD9891;\n --ds-background-danger-bold: #C9372C;\n --ds-background-danger-bold-hovered: #AE2E24;\n --ds-background-danger-bold-pressed: #872821;\n --ds-background-warning: #FFF5DB;\n --ds-background-warning-hovered: #FCE4A6;\n --ds-background-warning-pressed: #FBD779;\n --ds-background-warning-subtler: #FCE4A6;\n --ds-background-warning-subtler-hovered: #FBD779;\n --ds-background-warning-subtler-pressed: #FBC828;\n --ds-background-warning-bold: #FBC828;\n --ds-background-warning-bold-hovered: #FCA700;\n --ds-background-warning-bold-pressed: #F68909;\n --ds-background-success: #EFFFD6;\n --ds-background-success-hovered: #D3F1A7;\n --ds-background-success-pressed: #BDE97C;\n --ds-background-success-subtler: #D3F1A7;\n --ds-background-success-subtler-hovered: #BDE97C;\n --ds-background-success-subtler-pressed: #B3DF72;\n --ds-background-success-bold: #5B7F24;\n --ds-background-success-bold-hovered: #4C6B1F;\n --ds-background-success-bold-pressed: #3F5224;\n --ds-background-discovery: #F8EEFE;\n --ds-background-discovery-hovered: #EED7FC;\n --ds-background-discovery-pressed: #E3BDFA;\n --ds-background-discovery-subtler: #EED7FC;\n --ds-background-discovery-subtler-hovered: #E3BDFA;\n --ds-background-discovery-subtler-pressed: #D8A0F7;\n --ds-background-discovery-bold: #964AC0;\n --ds-background-discovery-bold-hovered: #803FA5;\n --ds-background-discovery-bold-pressed: #673286;\n --ds-background-information: #E9F2FE;\n --ds-background-information-hovered: #CFE1FD;\n --ds-background-information-pressed: #ADCBFB;\n --ds-background-information-subtler: #CFE1FD;\n --ds-background-information-subtler-hovered: #ADCBFB;\n --ds-background-information-subtler-pressed: #8FB8F6;\n --ds-background-information-bold: #1868DB;\n --ds-background-information-bold-hovered: #1558BC;\n --ds-background-information-bold-pressed: #144794;\n --ds-blanket: #050C1F75;\n --ds-blanket-selected: #388BFF14;\n --ds-blanket-danger: #EF5C4814;\n --ds-interaction-hovered: #00000029;\n --ds-interaction-pressed: #00000052;\n --ds-skeleton: #0515240F;\n --ds-skeleton-subtle: #17171708;\n --ds-chart-categorical-1: #357DE8;\n --ds-chart-categorical-1-hovered: #1868DB;\n --ds-chart-categorical-2: #82B536;\n --ds-chart-categorical-2-hovered: #6A9A23;\n --ds-chart-categorical-3: #BF63F3;\n --ds-chart-categorical-3-hovered: #AF59E1;\n --ds-chart-categorical-4: #F68909;\n --ds-chart-categorical-4-hovered: #E06C00;\n --ds-chart-categorical-5: #1558BC;\n --ds-chart-categorical-5-hovered: #123263;\n --ds-chart-categorical-6: #964AC0;\n --ds-chart-categorical-6-hovered: #803FA5;\n --ds-chart-categorical-7: #42B2D7;\n --ds-chart-categorical-7-hovered: #2898BD;\n --ds-chart-categorical-8: #BD5B00;\n --ds-chart-categorical-8-hovered: #7A3B00;\n --ds-chart-lime-bold: #6A9A23;\n --ds-chart-lime-bold-hovered: #5B7F24;\n --ds-chart-lime-bolder: #5B7F24;\n --ds-chart-lime-bolder-hovered: #4C6B1F;\n --ds-chart-lime-boldest: #4C6B1F;\n --ds-chart-lime-boldest-hovered: #37471F;\n --ds-chart-neutral: #8C8F97;\n --ds-chart-neutral-hovered: #7D818A;\n --ds-chart-red-bold: #F15B50;\n --ds-chart-red-bold-hovered: #E2483D;\n --ds-chart-red-bolder: #E2483D;\n --ds-chart-red-bolder-hovered: #C9372C;\n --ds-chart-red-boldest: #AE2E24;\n --ds-chart-red-boldest-hovered: #5D1F1A;\n --ds-chart-orange-bold: #E06C00;\n --ds-chart-orange-bold-hovered: #BD5B00;\n --ds-chart-orange-bolder: #BD5B00;\n --ds-chart-orange-bolder-hovered: #9E4C00;\n --ds-chart-orange-boldest: #7A3B00;\n --ds-chart-orange-boldest-hovered: #693200;\n --ds-chart-yellow-bold: #B38600;\n --ds-chart-yellow-bold-hovered: #946F00;\n --ds-chart-yellow-bolder: #946F00;\n --ds-chart-yellow-bolder-hovered: #7F5F01;\n --ds-chart-yellow-boldest: #7F5F01;\n --ds-chart-yellow-boldest-hovered: #533F04;\n --ds-chart-green-bold: #22A06B;\n --ds-chart-green-bold-hovered: #1F845A;\n --ds-chart-green-bolder: #1F845A;\n --ds-chart-green-bolder-hovered: #216E4E;\n --ds-chart-green-boldest: #216E4E;\n --ds-chart-green-boldest-hovered: #164B35;\n --ds-chart-teal-bold: #2898BD;\n --ds-chart-teal-bold-hovered: #227D9B;\n --ds-chart-teal-bolder: #227D9B;\n --ds-chart-teal-bolder-hovered: #206A83;\n --ds-chart-teal-boldest: #206A83;\n --ds-chart-teal-boldest-hovered: #164555;\n --ds-chart-blue-bold: #4688EC;\n --ds-chart-blue-bold-hovered: #357DE8;\n --ds-chart-blue-bolder: #357DE8;\n --ds-chart-blue-bolder-hovered: #1868DB;\n --ds-chart-blue-boldest: #1558BC;\n --ds-chart-blue-boldest-hovered: #123263;\n --ds-chart-purple-bold: #BF63F3;\n --ds-chart-purple-bold-hovered: #AF59E1;\n --ds-chart-purple-bolder: #AF59E1;\n --ds-chart-purple-bolder-hovered: #964AC0;\n --ds-chart-purple-boldest: #803FA5;\n --ds-chart-purple-boldest-hovered: #48245D;\n --ds-chart-magenta-bold: #DA62AC;\n --ds-chart-magenta-bold-hovered: #CD519D;\n --ds-chart-magenta-bolder: #CD519D;\n --ds-chart-magenta-bolder-hovered: #AE4787;\n --ds-chart-magenta-boldest: #943D73;\n --ds-chart-magenta-boldest-hovered: #50253F;\n --ds-chart-gray-bold: #8C8F97;\n --ds-chart-gray-bold-hovered: #7D818A;\n --ds-chart-gray-bolder: #7D818A;\n --ds-chart-gray-bolder-hovered: #6B6E76;\n --ds-chart-gray-boldest: #505258;\n --ds-chart-gray-boldest-hovered: #3B3D42;\n --ds-chart-brand: #357DE8;\n --ds-chart-brand-hovered: #1868DB;\n --ds-chart-danger: #E2483D;\n --ds-chart-danger-hovered: #C9372C;\n --ds-chart-danger-bold: #872821;\n --ds-chart-danger-bold-hovered: #5D1F1A;\n --ds-chart-warning: #F68909;\n --ds-chart-warning-hovered: #E06C00;\n --ds-chart-warning-bold: #BD5B00;\n --ds-chart-warning-bold-hovered: #9E4C00;\n --ds-chart-success: #82B536;\n --ds-chart-success-hovered: #6A9A23;\n --ds-chart-success-bold: #5B7F24;\n --ds-chart-success-bold-hovered: #4C6B1F;\n --ds-chart-discovery: #BF63F3;\n --ds-chart-discovery-hovered: #AF59E1;\n --ds-chart-discovery-bold: #803FA5;\n --ds-chart-discovery-bold-hovered: #964AC0;\n --ds-chart-information: #357DE8;\n --ds-chart-information-hovered: #1868DB;\n --ds-chart-information-bold: #1558BC;\n --ds-chart-information-bold-hovered: #123263;\n --ds-surface: #FFFFFF;\n --ds-surface-hovered: #F0F1F2;\n --ds-surface-pressed: #DDDEE1;\n --ds-surface-overlay: #FFFFFF;\n --ds-surface-overlay-hovered: #F0F1F2;\n --ds-surface-overlay-pressed: #DDDEE1;\n --ds-surface-raised: #FFFFFF;\n --ds-surface-raised-hovered: #F0F1F2;\n --ds-surface-raised-pressed: #DDDEE1;\n --ds-surface-sunken: #F8F8F8;\n --ds-shadow-overflow: 0px 0px 8px #1E1F2129, 0px 0px 1px #1E1F211F;\n --ds-shadow-overflow-perimeter: #1E1F211f;\n --ds-shadow-overflow-spread: #1E1F2129;\n --ds-shadow-overlay: 0px 8px 12px #1E1F2126, 0px 0px 1px #1E1F214F;\n --ds-shadow-raised: 0px 1px 1px #1E1F2140, 0px 0px 1px #1E1F214F;\n --ds-opacity-disabled: 0.4;\n --ds-opacity-loading: 0.2;\n --ds-UNSAFE-transparent: transparent;\n --ds-elevation-surface-current: #FFFFFF;\n}\n";
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
* Token names mapped to their value in the default Atlassian themes ('light').
|
|
8
8
|
* These default values are used by the Babel plugin to optionally provide automatic fallbacks.
|
|
9
9
|
*
|
|
10
|
-
* @codegen <<SignedSource::
|
|
10
|
+
* @codegen <<SignedSource::3873b297b6131bf7b9da06afc874cd80>>
|
|
11
11
|
* @codegenCommand yarn build tokens
|
|
12
12
|
*/
|
|
13
13
|
var defaultTokenValues = {
|
|
@@ -268,7 +268,7 @@ var defaultTokenValues = {
|
|
|
268
268
|
'color.background.accent.gray.bolder': '#6B6E76',
|
|
269
269
|
'color.background.accent.gray.bolder.hovered': '#505258',
|
|
270
270
|
'color.background.accent.gray.bolder.pressed': '#3B3D42',
|
|
271
|
-
'color.background.disabled': '#
|
|
271
|
+
'color.background.disabled': '#0515240F',
|
|
272
272
|
'color.background.input': '#FFFFFF',
|
|
273
273
|
'color.background.input.hovered': '#F8F8F8',
|
|
274
274
|
'color.background.input.pressed': '#FFFFFF',
|
|
@@ -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::07c07cb4fbd8c34128a7303a4b5bf336>>
|
|
4
4
|
* @codegenCommand yarn build tokens
|
|
5
5
|
*/
|
|
6
6
|
|
|
@@ -4581,7 +4581,7 @@ var tokens = [{
|
|
|
4581
4581
|
"path": ["color", "background", "accent", "gray", "bolder", "pressed"],
|
|
4582
4582
|
"cleanName": "color.background.accent.gray.bolder.pressed"
|
|
4583
4583
|
}, {
|
|
4584
|
-
"value": "#
|
|
4584
|
+
"value": "#E3E4F21F",
|
|
4585
4585
|
"filePath": "schema/themes/atlassian-dark/color/background.tsx",
|
|
4586
4586
|
"isSource": false,
|
|
4587
4587
|
"attributes": {
|
|
@@ -4591,7 +4591,7 @@ var tokens = [{
|
|
|
4591
4591
|
"description": "Use for backgrounds of elements in a disabled state."
|
|
4592
4592
|
},
|
|
4593
4593
|
"original": {
|
|
4594
|
-
"value": "
|
|
4594
|
+
"value": "DarkNeutral300A",
|
|
4595
4595
|
"attributes": {
|
|
4596
4596
|
"group": "paint",
|
|
4597
4597
|
"state": "active",
|
|
@@ -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::c7aa39eae7839f7e54fc07b5614a5359>>
|
|
4
4
|
* @codegenCommand yarn build tokens
|
|
5
5
|
*/
|
|
6
6
|
|
|
@@ -4587,7 +4587,7 @@ var tokens = [{
|
|
|
4587
4587
|
"introduced": "0.0.15",
|
|
4588
4588
|
"description": "Use for backgrounds of elements in a disabled state."
|
|
4589
4589
|
},
|
|
4590
|
-
"value": "#
|
|
4590
|
+
"value": "#E3E4F21F",
|
|
4591
4591
|
"filePath": "schema/themes/atlassian-dark/color/background.tsx",
|
|
4592
4592
|
"isSource": true,
|
|
4593
4593
|
"original": {
|
|
@@ -4597,7 +4597,7 @@ var tokens = [{
|
|
|
4597
4597
|
"introduced": "0.0.15",
|
|
4598
4598
|
"description": "Use for backgrounds of elements in a disabled state."
|
|
4599
4599
|
},
|
|
4600
|
-
"value": "
|
|
4600
|
+
"value": "DarkNeutral300A"
|
|
4601
4601
|
},
|
|
4602
4602
|
"name": "color.background.disabled",
|
|
4603
4603
|
"path": ["color", "background", "disabled"],
|
|
@@ -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::8a1fd8b52d543897e21443d4368692c4>>
|
|
4
4
|
* @codegenCommand yarn build tokens
|
|
5
5
|
*/
|
|
6
6
|
|
|
@@ -4581,7 +4581,7 @@ var tokens = [{
|
|
|
4581
4581
|
"path": ["color", "background", "accent", "gray", "bolder", "pressed"],
|
|
4582
4582
|
"cleanName": "color.background.accent.gray.bolder.pressed"
|
|
4583
4583
|
}, {
|
|
4584
|
-
"value": "#
|
|
4584
|
+
"value": "#0515240F",
|
|
4585
4585
|
"filePath": "schema/themes/atlassian-light/color/background.tsx",
|
|
4586
4586
|
"isSource": false,
|
|
4587
4587
|
"attributes": {
|
|
@@ -4591,7 +4591,7 @@ var tokens = [{
|
|
|
4591
4591
|
"description": "Use for backgrounds of elements in a disabled state."
|
|
4592
4592
|
},
|
|
4593
4593
|
"original": {
|
|
4594
|
-
"value": "
|
|
4594
|
+
"value": "Neutral200A",
|
|
4595
4595
|
"attributes": {
|
|
4596
4596
|
"group": "paint",
|
|
4597
4597
|
"state": "active",
|
|
@@ -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::d7798f5da9c5cb814cf6b4e2e6137397>>
|
|
4
4
|
* @codegenCommand yarn build tokens
|
|
5
5
|
*/
|
|
6
6
|
|
|
@@ -4587,7 +4587,7 @@ var tokens = [{
|
|
|
4587
4587
|
"introduced": "0.0.15",
|
|
4588
4588
|
"description": "Use for backgrounds of elements in a disabled state."
|
|
4589
4589
|
},
|
|
4590
|
-
"value": "#
|
|
4590
|
+
"value": "#0515240F",
|
|
4591
4591
|
"filePath": "schema/themes/atlassian-light/color/background.tsx",
|
|
4592
4592
|
"isSource": true,
|
|
4593
4593
|
"original": {
|
|
@@ -4597,7 +4597,7 @@ var tokens = [{
|
|
|
4597
4597
|
"introduced": "0.0.15",
|
|
4598
4598
|
"description": "Use for backgrounds of elements in a disabled state."
|
|
4599
4599
|
},
|
|
4600
|
-
"value": "
|
|
4600
|
+
"value": "Neutral200A"
|
|
4601
4601
|
},
|
|
4602
4602
|
"name": "color.background.disabled",
|
|
4603
4603
|
"path": ["color", "background", "disabled"],
|
package/dist/esm/constants.js
CHANGED
|
@@ -6,4 +6,5 @@ export var CUSTOM_THEME_ATTRIBUTE = 'data-custom-theme';
|
|
|
6
6
|
export var CSS_PREFIX = 'ds';
|
|
7
7
|
export var CSS_VAR_FULL = ['opacity', 'font', 'space', 'border', 'radius'];
|
|
8
8
|
export var TOKEN_NOT_FOUND_CSS_VAR = "--".concat(CSS_PREFIX, "-token-not-found");
|
|
9
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
9
10
|
export var CURRENT_SURFACE_CSS_VAR = "--".concat(CSS_PREFIX, "-elevation-surface-current");
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*
|
|
4
4
|
* Metadata for generation of `@atlaskit/ads-mcp` and https://atlassian.design/llms-tokens.txt.
|
|
5
5
|
*
|
|
6
|
-
* @codegen <<SignedSource::
|
|
6
|
+
* @codegen <<SignedSource::ecdf4f84ae7b36849943b200af52ee54>>
|
|
7
7
|
* @codegenCommand yarn build tokens
|
|
8
8
|
*/
|
|
9
9
|
|
|
@@ -2315,7 +2315,7 @@ export var tokens = [{
|
|
|
2315
2315
|
name: 'color.background.disabled',
|
|
2316
2316
|
path: ['color', 'background', 'disabled'],
|
|
2317
2317
|
description: 'Use for backgrounds of elements in a disabled state.',
|
|
2318
|
-
exampleValue: '#
|
|
2318
|
+
exampleValue: '#0515240F',
|
|
2319
2319
|
usageGuidelines: {
|
|
2320
2320
|
usage: 'The color for backgrounds. Use for areas behind content (e.g. color.background.neutral, color.background.selected)',
|
|
2321
2321
|
cssProperties: ['background-color']
|
|
@@ -27,7 +27,7 @@ import { loadThemeCss } from './utils/load-theme-css';
|
|
|
27
27
|
var getThemeStyles = /*#__PURE__*/function () {
|
|
28
28
|
var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(preferences) {
|
|
29
29
|
var themePreferences, themeOverridePreferences, themeState, results;
|
|
30
|
-
return _regeneratorRuntime.wrap(function
|
|
30
|
+
return _regeneratorRuntime.wrap(function (_context3) {
|
|
31
31
|
while (1) switch (_context3.prev = _context3.next) {
|
|
32
32
|
case 0:
|
|
33
33
|
themeOverridePreferences = [];
|
|
@@ -54,17 +54,17 @@ var getThemeStyles = /*#__PURE__*/function () {
|
|
|
54
54
|
themePreferences = getThemePreferences(themeState);
|
|
55
55
|
themeOverridePreferences = getThemeOverridePreferences(themeState);
|
|
56
56
|
}
|
|
57
|
-
_context3.next =
|
|
57
|
+
_context3.next = 1;
|
|
58
58
|
return Promise.all([].concat(_toConsumableArray([].concat(_toConsumableArray(themePreferences), _toConsumableArray(themeOverridePreferences)).map( /*#__PURE__*/function () {
|
|
59
59
|
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(themeId) {
|
|
60
|
-
var css;
|
|
61
|
-
return _regeneratorRuntime.wrap(function
|
|
60
|
+
var css, _t;
|
|
61
|
+
return _regeneratorRuntime.wrap(function (_context) {
|
|
62
62
|
while (1) switch (_context.prev = _context.next) {
|
|
63
63
|
case 0:
|
|
64
64
|
_context.prev = 0;
|
|
65
|
-
_context.next =
|
|
65
|
+
_context.next = 1;
|
|
66
66
|
return loadThemeCss(themeId);
|
|
67
|
-
case
|
|
67
|
+
case 1:
|
|
68
68
|
css = _context.sent;
|
|
69
69
|
return _context.abrupt("return", {
|
|
70
70
|
id: themeId,
|
|
@@ -73,15 +73,15 @@ var getThemeStyles = /*#__PURE__*/function () {
|
|
|
73
73
|
},
|
|
74
74
|
css: css
|
|
75
75
|
});
|
|
76
|
-
case
|
|
77
|
-
_context.prev =
|
|
78
|
-
|
|
76
|
+
case 2:
|
|
77
|
+
_context.prev = 2;
|
|
78
|
+
_t = _context["catch"](0);
|
|
79
79
|
return _context.abrupt("return", undefined);
|
|
80
|
-
case
|
|
80
|
+
case 3:
|
|
81
81
|
case "end":
|
|
82
82
|
return _context.stop();
|
|
83
83
|
}
|
|
84
|
-
}, _callee, null, [[0,
|
|
84
|
+
}, _callee, null, [[0, 2]]);
|
|
85
85
|
}));
|
|
86
86
|
return function (_x2) {
|
|
87
87
|
return _ref2.apply(this, arguments);
|
|
@@ -90,47 +90,47 @@ var getThemeStyles = /*#__PURE__*/function () {
|
|
|
90
90
|
// Add custom themes if they're present
|
|
91
91
|
_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
|
|
92
92
|
var _preferences$UNSAFE_t;
|
|
93
|
-
var _yield$import, getCustomThemeStyles, customThemeStyles;
|
|
94
|
-
return _regeneratorRuntime.wrap(function
|
|
93
|
+
var _yield$import, getCustomThemeStyles, customThemeStyles, _t2;
|
|
94
|
+
return _regeneratorRuntime.wrap(function (_context2) {
|
|
95
95
|
while (1) switch (_context2.prev = _context2.next) {
|
|
96
96
|
case 0:
|
|
97
97
|
if (!(preferences !== 'all' && preferences !== null && preferences !== void 0 && preferences.UNSAFE_themeOptions && isValidBrandHex(preferences === null || preferences === void 0 || (_preferences$UNSAFE_t = preferences.UNSAFE_themeOptions) === null || _preferences$UNSAFE_t === void 0 ? void 0 : _preferences$UNSAFE_t.brandColor))) {
|
|
98
|
-
_context2.next =
|
|
98
|
+
_context2.next = 5;
|
|
99
99
|
break;
|
|
100
100
|
}
|
|
101
101
|
_context2.prev = 1;
|
|
102
|
-
_context2.next =
|
|
102
|
+
_context2.next = 2;
|
|
103
103
|
return import( /* webpackChunkName: "@atlaskit-internal_atlassian-custom-theme" */
|
|
104
104
|
'./custom-theme');
|
|
105
|
-
case
|
|
105
|
+
case 2:
|
|
106
106
|
_yield$import = _context2.sent;
|
|
107
107
|
getCustomThemeStyles = _yield$import.getCustomThemeStyles;
|
|
108
|
-
_context2.next =
|
|
108
|
+
_context2.next = 3;
|
|
109
109
|
return getCustomThemeStyles({
|
|
110
110
|
colorMode: (preferences === null || preferences === void 0 ? void 0 : preferences.colorMode) || themeStateDefaults['colorMode'],
|
|
111
111
|
UNSAFE_themeOptions: preferences === null || preferences === void 0 ? void 0 : preferences.UNSAFE_themeOptions
|
|
112
112
|
});
|
|
113
|
-
case
|
|
113
|
+
case 3:
|
|
114
114
|
customThemeStyles = _context2.sent;
|
|
115
115
|
return _context2.abrupt("return", customThemeStyles);
|
|
116
|
-
case
|
|
117
|
-
_context2.prev =
|
|
118
|
-
|
|
116
|
+
case 4:
|
|
117
|
+
_context2.prev = 4;
|
|
118
|
+
_t2 = _context2["catch"](1);
|
|
119
119
|
return _context2.abrupt("return", undefined);
|
|
120
|
-
case
|
|
120
|
+
case 5:
|
|
121
121
|
return _context2.abrupt("return", undefined);
|
|
122
|
-
case
|
|
122
|
+
case 6:
|
|
123
123
|
case "end":
|
|
124
124
|
return _context2.stop();
|
|
125
125
|
}
|
|
126
|
-
}, _callee2, null, [[1,
|
|
126
|
+
}, _callee2, null, [[1, 4]]);
|
|
127
127
|
}))()]));
|
|
128
|
-
case
|
|
128
|
+
case 1:
|
|
129
129
|
results = _context3.sent;
|
|
130
130
|
return _context3.abrupt("return", results.flat().filter(function (theme) {
|
|
131
131
|
return theme !== undefined;
|
|
132
132
|
}));
|
|
133
|
-
case
|
|
133
|
+
case 2:
|
|
134
134
|
case "end":
|
|
135
135
|
return _context3.stop();
|
|
136
136
|
}
|
|
@@ -72,8 +72,9 @@ var setGlobalTheme = /*#__PURE__*/function () {
|
|
|
72
72
|
_step,
|
|
73
73
|
themeId,
|
|
74
74
|
autoUnbind,
|
|
75
|
-
_args3 = arguments
|
|
76
|
-
|
|
75
|
+
_args3 = arguments,
|
|
76
|
+
_t;
|
|
77
|
+
return _regeneratorRuntime.wrap(function (_context3) {
|
|
77
78
|
while (1) switch (_context3.prev = _context3.next) {
|
|
78
79
|
case 0:
|
|
79
80
|
nextThemeState = _args3.length > 0 && _args3[0] !== undefined ? _args3[0] : {};
|
|
@@ -107,14 +108,14 @@ var setGlobalTheme = /*#__PURE__*/function () {
|
|
|
107
108
|
loadingStrategy = themeLoader ? themeLoader : loadAndAppendThemeCss; // Load standard themes
|
|
108
109
|
loadingTasks = themePreferences.map( /*#__PURE__*/function () {
|
|
109
110
|
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(themeId) {
|
|
110
|
-
return _regeneratorRuntime.wrap(function
|
|
111
|
+
return _regeneratorRuntime.wrap(function (_context) {
|
|
111
112
|
while (1) switch (_context.prev = _context.next) {
|
|
112
113
|
case 0:
|
|
113
|
-
_context.next =
|
|
114
|
+
_context.next = 1;
|
|
114
115
|
return loadingStrategy(themeId);
|
|
115
|
-
case
|
|
116
|
+
case 1:
|
|
116
117
|
return _context.abrupt("return", _context.sent);
|
|
117
|
-
case
|
|
118
|
+
case 2:
|
|
118
119
|
case "end":
|
|
119
120
|
return _context.stop();
|
|
120
121
|
}
|
|
@@ -131,13 +132,13 @@ var setGlobalTheme = /*#__PURE__*/function () {
|
|
|
131
132
|
// Load custom theme styles
|
|
132
133
|
loadingTasks.push(_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
|
|
133
134
|
var _yield$import, loadAndAppendCustomThemeCss;
|
|
134
|
-
return _regeneratorRuntime.wrap(function
|
|
135
|
+
return _regeneratorRuntime.wrap(function (_context2) {
|
|
135
136
|
while (1) switch (_context2.prev = _context2.next) {
|
|
136
137
|
case 0:
|
|
137
|
-
_context2.next =
|
|
138
|
+
_context2.next = 1;
|
|
138
139
|
return import( /* webpackChunkName: "@atlaskit-internal_atlassian-custom-theme" */
|
|
139
140
|
'./custom-theme');
|
|
140
|
-
case
|
|
141
|
+
case 1:
|
|
141
142
|
_yield$import = _context2.sent;
|
|
142
143
|
loadAndAppendCustomThemeCss = _yield$import.loadAndAppendCustomThemeCss;
|
|
143
144
|
loadAndAppendCustomThemeCss({
|
|
@@ -146,7 +147,7 @@ var setGlobalTheme = /*#__PURE__*/function () {
|
|
|
146
147
|
attrOfMissingCustomStyles[0],
|
|
147
148
|
UNSAFE_themeOptions: UNSAFE_themeOptions
|
|
148
149
|
});
|
|
149
|
-
case
|
|
150
|
+
case 2:
|
|
150
151
|
case "end":
|
|
151
152
|
return _context2.stop();
|
|
152
153
|
}
|
|
@@ -154,44 +155,44 @@ var setGlobalTheme = /*#__PURE__*/function () {
|
|
|
154
155
|
}))());
|
|
155
156
|
}
|
|
156
157
|
}
|
|
157
|
-
_context3.next =
|
|
158
|
+
_context3.next = 1;
|
|
158
159
|
return Promise.all(loadingTasks);
|
|
159
|
-
case
|
|
160
|
+
case 1:
|
|
160
161
|
// Load override themes after standard themes
|
|
161
162
|
themeOverridePreferences = getThemeOverridePreferences(themeState);
|
|
162
163
|
_iterator = _createForOfIteratorHelper(themeOverridePreferences);
|
|
163
|
-
_context3.prev =
|
|
164
|
+
_context3.prev = 2;
|
|
164
165
|
_iterator.s();
|
|
165
|
-
case
|
|
166
|
+
case 3:
|
|
166
167
|
if ((_step = _iterator.n()).done) {
|
|
167
|
-
_context3.next =
|
|
168
|
+
_context3.next = 5;
|
|
168
169
|
break;
|
|
169
170
|
}
|
|
170
171
|
themeId = _step.value;
|
|
171
|
-
_context3.next =
|
|
172
|
+
_context3.next = 4;
|
|
172
173
|
return loadingStrategy(themeId);
|
|
173
|
-
case
|
|
174
|
-
_context3.next =
|
|
174
|
+
case 4:
|
|
175
|
+
_context3.next = 3;
|
|
175
176
|
break;
|
|
176
|
-
case
|
|
177
|
-
_context3.next =
|
|
177
|
+
case 5:
|
|
178
|
+
_context3.next = 7;
|
|
178
179
|
break;
|
|
179
|
-
case
|
|
180
|
-
_context3.prev =
|
|
181
|
-
|
|
182
|
-
_iterator.e(
|
|
183
|
-
case
|
|
184
|
-
_context3.prev =
|
|
180
|
+
case 6:
|
|
181
|
+
_context3.prev = 6;
|
|
182
|
+
_t = _context3["catch"](2);
|
|
183
|
+
_iterator.e(_t);
|
|
184
|
+
case 7:
|
|
185
|
+
_context3.prev = 7;
|
|
185
186
|
_iterator.f();
|
|
186
|
-
return _context3.finish(
|
|
187
|
-
case
|
|
187
|
+
return _context3.finish(7);
|
|
188
|
+
case 8:
|
|
188
189
|
autoUnbind = configurePage(themeState);
|
|
189
190
|
return _context3.abrupt("return", autoUnbind);
|
|
190
|
-
case
|
|
191
|
+
case 9:
|
|
191
192
|
case "end":
|
|
192
193
|
return _context3.stop();
|
|
193
194
|
}
|
|
194
|
-
}, _callee3, null, [[
|
|
195
|
+
}, _callee3, null, [[2, 6, 7, 8]]);
|
|
195
196
|
}));
|
|
196
197
|
return function setGlobalTheme() {
|
|
197
198
|
return _ref.apply(this, arguments);
|
package/dist/esm/theme-config.js
CHANGED
|
@@ -176,6 +176,7 @@ function getMotionDefault() {
|
|
|
176
176
|
/**
|
|
177
177
|
* themeStateDefaults: the default values for ThemeState used by theming utilities
|
|
178
178
|
*/
|
|
179
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
179
180
|
export var themeStateDefaults = {
|
|
180
181
|
colorMode: 'auto',
|
|
181
182
|
contrastMode: 'auto',
|
|
@@ -193,6 +194,7 @@ export var themeStateDefaults = {
|
|
|
193
194
|
* (the page doesn't have an "auto" color mode, it's either light or dark)
|
|
194
195
|
*/
|
|
195
196
|
|
|
197
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
196
198
|
export default themeConfig;
|
|
197
199
|
export { themeColorModes } from './theme-color-modes';
|
|
198
200
|
export { themeIds } from './theme-ids';
|
|
@@ -66,6 +66,7 @@ export var themeStringToObject = function themeStringToObject(themeState) {
|
|
|
66
66
|
* // returns 'dark:dark light:light spacing:spacing'
|
|
67
67
|
* ```
|
|
68
68
|
*/
|
|
69
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
69
70
|
export var themeObjectToString = function themeObjectToString(themeState) {
|
|
70
71
|
return Object.entries(themeState).reduce(function (themeString, _ref3) {
|
|
71
72
|
var _ref4 = _slicedToArray(_ref3, 2),
|
|
@@ -16,6 +16,8 @@ export function hexToRgbA(hex) {
|
|
|
16
16
|
c = '0x' + c.join('');
|
|
17
17
|
return [c >> 16 & 255, c >> 8 & 255, c & 255, getAlpha(hex)];
|
|
18
18
|
}
|
|
19
|
+
|
|
20
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
19
21
|
export function hexToRgb(hex) {
|
|
20
22
|
if (!isValidHex(hex)) {
|
|
21
23
|
throw new Error('Invalid HEX');
|
|
@@ -28,6 +30,8 @@ export function hexToRgb(hex) {
|
|
|
28
30
|
c = '0x' + c.join('');
|
|
29
31
|
return [c >> 16 & 255, c >> 8 & 255, c & 255];
|
|
30
32
|
}
|
|
33
|
+
|
|
34
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
31
35
|
export function hexToHSL(hex) {
|
|
32
36
|
if (!isValidHex(hex)) {
|
|
33
37
|
throw new Error('Invalid HEX');
|
|
@@ -73,6 +77,8 @@ export function hexToHSL(hex) {
|
|
|
73
77
|
l = +(l * 100).toFixed(1);
|
|
74
78
|
return [h, s, l];
|
|
75
79
|
}
|
|
80
|
+
|
|
81
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
76
82
|
export function getContrastRatio(foreground, background) {
|
|
77
83
|
if (!isValidHex(foreground) || !isValidHex(background)) {
|
|
78
84
|
throw new Error('Invalid HEX');
|
|
@@ -86,6 +92,8 @@ export function getContrastRatio(foreground, background) {
|
|
|
86
92
|
var darkest = Math.min(foregroundLuminance, backgroundLuminance);
|
|
87
93
|
return (brightest + 0.05) / (darkest + 0.05);
|
|
88
94
|
}
|
|
95
|
+
|
|
96
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
89
97
|
export function deltaE(rgbA, rgbB) {
|
|
90
98
|
var labA = rgbToLab(rgbA);
|
|
91
99
|
var labB = rgbToLab(rgbB);
|
|
@@ -17,6 +17,8 @@ export function findMissingCustomStyleElements(UNSAFE_themeOptions, mode) {
|
|
|
17
17
|
});
|
|
18
18
|
return attrOfMissingCustomStyles;
|
|
19
19
|
}
|
|
20
|
+
|
|
21
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
20
22
|
export function reduceTokenMap(tokenMap, themeRamp) {
|
|
21
23
|
return Object.entries(tokenMap).reduce(function (acc, _ref) {
|
|
22
24
|
var _ref2 = _slicedToArray(_ref, 2),
|
|
@@ -46,6 +46,8 @@ export var additionalChecks = [{
|
|
|
46
46
|
var getColorFromTokenRaw = function getColorFromTokenRaw(tokenName, mode) {
|
|
47
47
|
return mode === 'light' ? tokenValuesLight[tokenName] : tokenValuesDark[tokenName];
|
|
48
48
|
};
|
|
49
|
+
|
|
50
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
49
51
|
export var additionalContrastChecker = function additionalContrastChecker(_ref) {
|
|
50
52
|
var customThemeTokenMap = _ref.customThemeTokenMap,
|
|
51
53
|
mode = _ref.mode,
|
|
@@ -63,6 +63,8 @@ function getInteractionStates(rampPosition, number, colors) {
|
|
|
63
63
|
}
|
|
64
64
|
return result;
|
|
65
65
|
}
|
|
66
|
+
|
|
67
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
66
68
|
export var generateTokenMap = function generateTokenMap(brandColor, mode, themeRamp) {
|
|
67
69
|
var _generateColors = generateColors(brandColor),
|
|
68
70
|
ramp = _generateColors.ramp,
|
|
@@ -202,6 +204,8 @@ export var generateTokenMap = function generateTokenMap(brandColor, mode, themeR
|
|
|
202
204
|
dark: customThemeTokenMapDark
|
|
203
205
|
};
|
|
204
206
|
};
|
|
207
|
+
|
|
208
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
205
209
|
export var generateTokenMapWithContrastCheck = function generateTokenMapWithContrastCheck(brandColor, mode, themeRamp) {
|
|
206
210
|
var colors = themeRamp || generateColors(brandColor).ramp;
|
|
207
211
|
var tokenMaps = generateTokenMap(brandColor, mode, colors);
|
|
@@ -78,6 +78,7 @@ function blueFromArgb(argb) {
|
|
|
78
78
|
/**
|
|
79
79
|
* Converts a color from ARGB to XYZ.
|
|
80
80
|
*/
|
|
81
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
81
82
|
export function argbFromXyz(x, y, z) {
|
|
82
83
|
var matrix = XYZ_TO_SRGB;
|
|
83
84
|
var linearR = matrix[0][0] * x + matrix[0][1] * y + matrix[0][2] * z;
|
|
@@ -106,6 +107,7 @@ function xyzFromArgb(argb) {
|
|
|
106
107
|
* @return ARGB representation of grayscale color with lightness
|
|
107
108
|
* matching L*
|
|
108
109
|
*/
|
|
110
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
109
111
|
export function argbFromLstar(lstar) {
|
|
110
112
|
var y = yFromLstar(lstar);
|
|
111
113
|
var component = delinearized(y);
|
|
@@ -118,6 +120,7 @@ export function argbFromLstar(lstar) {
|
|
|
118
120
|
* @param argb ARGB representation of a color
|
|
119
121
|
* @return L*, from L*a*b*, coordinate of the color
|
|
120
122
|
*/
|
|
123
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
121
124
|
export function lstarFromArgb(argb) {
|
|
122
125
|
var y = xyzFromArgb(argb)[1];
|
|
123
126
|
return 116.0 * labF(y / 100.0) - 16.0;
|
|
@@ -134,6 +137,7 @@ export function lstarFromArgb(argb) {
|
|
|
134
137
|
* @param lstar L* in L*a*b*
|
|
135
138
|
* @return Y in XYZ
|
|
136
139
|
*/
|
|
140
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
137
141
|
export function yFromLstar(lstar) {
|
|
138
142
|
return 100.0 * labInvf((lstar + 16.0) / 116.0);
|
|
139
143
|
}
|
|
@@ -149,6 +153,7 @@ export function yFromLstar(lstar) {
|
|
|
149
153
|
* @param y Y in XYZ
|
|
150
154
|
* @return L* in L*a*b*
|
|
151
155
|
*/
|
|
156
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
152
157
|
export function lstarFromY(y) {
|
|
153
158
|
return labF(y / 100.0) * 116.0 - 16.0;
|
|
154
159
|
}
|
|
@@ -158,6 +163,7 @@ export function lstarFromY(y) {
|
|
|
158
163
|
*
|
|
159
164
|
* @return The white point
|
|
160
165
|
*/
|
|
166
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
161
167
|
export function whitePointD65() {
|
|
162
168
|
return WHITE_POINT_D65;
|
|
163
169
|
}
|
|
@@ -177,6 +183,7 @@ export function whitePointD65() {
|
|
|
177
183
|
* @param argb ARGB representation of a int32 color.
|
|
178
184
|
* @return RGBA representation of a int32 color.
|
|
179
185
|
*/
|
|
186
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
180
187
|
export function rgbaFromArgb(argb) {
|
|
181
188
|
var r = redFromArgb(argb);
|
|
182
189
|
var g = greenFromArgb(argb);
|
|
@@ -196,6 +203,7 @@ export function rgbaFromArgb(argb) {
|
|
|
196
203
|
* @param rgba RGBA representation of a int32 color.
|
|
197
204
|
* @returns ARGB representation of a int32 color.
|
|
198
205
|
*/
|
|
206
|
+
// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
|
|
199
207
|
export function argbFromRgba(_ref) {
|
|
200
208
|
var r = _ref.r,
|
|
201
209
|
g = _ref.g,
|