@atlaskit/tokens 1.54.1 → 1.56.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 +17 -0
- package/dist/cjs/artifacts/generated-pairs.js +2 -2
- package/dist/cjs/artifacts/palettes-raw/palette-brand-refresh.js +2257 -0
- package/dist/cjs/artifacts/theme-import-map.js +13 -1
- package/dist/cjs/artifacts/themes/atlassian-dark-brand-refresh.js +12 -0
- package/dist/cjs/artifacts/themes/atlassian-light-brand-refresh.js +12 -0
- package/dist/cjs/artifacts/themes/atlassian-typography-minor3.js +2 -2
- package/dist/cjs/artifacts/token-default-values.js +2 -1
- package/dist/cjs/artifacts/token-names.js +2 -1
- package/dist/cjs/artifacts/tokens-raw/atlassian-dark-brand-refresh.js +8727 -0
- package/dist/cjs/artifacts/tokens-raw/atlassian-light-brand-refresh.js +8689 -0
- package/dist/cjs/artifacts/tokens-raw/atlassian-typography-adg3.js +9 -17
- package/dist/cjs/artifacts/tokens-raw/atlassian-typography-minor3.js +9 -17
- package/dist/cjs/get-theme-styles.js +4 -1
- package/dist/cjs/get-token-value.js +8 -2
- package/dist/cjs/get-token.js +8 -2
- package/dist/cjs/set-global-theme.js +1 -1
- package/dist/cjs/theme-config.js +19 -1
- package/dist/cjs/utils/get-theme-preferences.js +2 -2
- package/dist/cjs/utils/theme-loading.js +7 -3
- package/dist/es2019/artifacts/generated-pairs.js +2 -2
- package/dist/es2019/artifacts/palettes-raw/palette-brand-refresh.js +2251 -0
- package/dist/es2019/artifacts/theme-import-map.js +6 -2
- package/dist/es2019/artifacts/themes/atlassian-dark-brand-refresh.js +401 -0
- package/dist/es2019/artifacts/themes/atlassian-light-brand-refresh.js +401 -0
- package/dist/es2019/artifacts/themes/atlassian-typography-minor3.js +1 -7
- package/dist/es2019/artifacts/token-default-values.js +2 -1
- package/dist/es2019/artifacts/token-names.js +2 -1
- package/dist/es2019/artifacts/tokens-raw/atlassian-dark-brand-refresh.js +8721 -0
- package/dist/es2019/artifacts/tokens-raw/atlassian-light-brand-refresh.js +8683 -0
- package/dist/es2019/artifacts/tokens-raw/atlassian-typography-adg3.js +9 -17
- package/dist/es2019/artifacts/tokens-raw/atlassian-typography-minor3.js +9 -17
- package/dist/es2019/get-theme-styles.js +3 -2
- package/dist/es2019/get-token-value.js +8 -2
- package/dist/es2019/get-token.js +8 -2
- package/dist/es2019/set-global-theme.js +2 -2
- package/dist/es2019/theme-config.js +19 -1
- package/dist/es2019/utils/get-theme-preferences.js +3 -3
- package/dist/es2019/utils/theme-loading.js +4 -0
- package/dist/esm/artifacts/generated-pairs.js +2 -2
- package/dist/esm/artifacts/palettes-raw/palette-brand-refresh.js +2251 -0
- package/dist/esm/artifacts/theme-import-map.js +9 -1
- package/dist/esm/artifacts/themes/atlassian-dark-brand-refresh.js +6 -0
- package/dist/esm/artifacts/themes/atlassian-light-brand-refresh.js +6 -0
- package/dist/esm/artifacts/themes/atlassian-typography-minor3.js +2 -2
- package/dist/esm/artifacts/token-default-values.js +2 -1
- package/dist/esm/artifacts/token-names.js +2 -1
- package/dist/esm/artifacts/tokens-raw/atlassian-dark-brand-refresh.js +8721 -0
- package/dist/esm/artifacts/tokens-raw/atlassian-light-brand-refresh.js +8683 -0
- package/dist/esm/artifacts/tokens-raw/atlassian-typography-adg3.js +9 -17
- package/dist/esm/artifacts/tokens-raw/atlassian-typography-minor3.js +9 -17
- package/dist/esm/get-theme-styles.js +5 -2
- package/dist/esm/get-token-value.js +8 -2
- package/dist/esm/get-token.js +8 -2
- package/dist/esm/set-global-theme.js +2 -2
- package/dist/esm/theme-config.js +19 -1
- package/dist/esm/utils/get-theme-preferences.js +3 -3
- package/dist/esm/utils/theme-loading.js +7 -3
- package/dist/types/artifacts/generated-pairs.d.ts +1 -1
- package/dist/types/artifacts/palettes-raw/palette-brand-refresh.d.ts +41 -0
- package/dist/types/artifacts/theme-import-map.d.ts +1 -1
- package/dist/types/artifacts/themes/atlassian-dark-brand-refresh.d.ts +7 -0
- package/dist/types/artifacts/themes/atlassian-light-brand-refresh.d.ts +7 -0
- package/dist/types/artifacts/themes/atlassian-typography-minor3.d.ts +2 -2
- package/dist/types/artifacts/token-default-values.d.ts +2 -1
- package/dist/types/artifacts/token-names.d.ts +3 -1
- package/dist/types/artifacts/tokens-raw/atlassian-dark-brand-refresh.d.ts +109 -0
- package/dist/types/artifacts/tokens-raw/atlassian-light-brand-refresh.d.ts +89 -0
- package/dist/types/artifacts/tokens-raw/atlassian-typography-adg3.d.ts +1 -40
- package/dist/types/artifacts/tokens-raw/atlassian-typography-minor3.d.ts +1 -40
- 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 +2 -2
- package/dist/types/theme-config.d.ts +6 -6
- package/dist/types/types.d.ts +23 -18
- package/dist/types-ts4.5/artifacts/generated-pairs.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/palettes-raw/palette-brand-refresh.d.ts +41 -0
- package/dist/types-ts4.5/artifacts/theme-import-map.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/themes/atlassian-dark-brand-refresh.d.ts +7 -0
- package/dist/types-ts4.5/artifacts/themes/atlassian-light-brand-refresh.d.ts +7 -0
- package/dist/types-ts4.5/artifacts/themes/atlassian-typography-minor3.d.ts +2 -2
- package/dist/types-ts4.5/artifacts/token-default-values.d.ts +2 -1
- package/dist/types-ts4.5/artifacts/token-names.d.ts +3 -1
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark-brand-refresh.d.ts +109 -0
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light-brand-refresh.d.ts +89 -0
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-typography-adg3.d.ts +1 -40
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-typography-minor3.d.ts +1 -40
- package/dist/types-ts4.5/artifacts/types-internal.d.ts +2 -2
- package/dist/types-ts4.5/artifacts/types.d.ts +2 -2
- package/dist/types-ts4.5/entry-points/css-type-schema.codegen.d.ts +2 -2
- package/dist/types-ts4.5/theme-config.d.ts +8 -4
- package/dist/types-ts4.5/types.d.ts +23 -18
- package/figma/atlassian-dark-brand-refresh.json +3558 -0
- package/figma/atlassian-light-brand-refresh.json +3537 -0
- package/package.json +5 -1
|
@@ -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::4e47e59f97f2e7d43911658468035bca>>
|
|
4
4
|
* @codegenCommand yarn build tokens
|
|
5
5
|
*/
|
|
6
6
|
var tokens = [{
|
|
@@ -150,8 +150,7 @@ var tokens = [{
|
|
|
150
150
|
"group": "typography",
|
|
151
151
|
"state": "active",
|
|
152
152
|
"introduced": "1.14.0",
|
|
153
|
-
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H900 to Heading XXL."
|
|
154
|
-
"responsiveSmallerVariant": "font.heading.xlarge"
|
|
153
|
+
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H900 to Heading XXL."
|
|
155
154
|
},
|
|
156
155
|
"value": "normal 500 35px/40px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
|
|
157
156
|
"filePath": "schema/themes/atlassian-typography-adg3/theme.tsx",
|
|
@@ -161,8 +160,7 @@ var tokens = [{
|
|
|
161
160
|
"group": "typography",
|
|
162
161
|
"state": "active",
|
|
163
162
|
"introduced": "1.14.0",
|
|
164
|
-
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H900 to Heading XXL."
|
|
165
|
-
"responsiveSmallerVariant": "font.heading.xlarge"
|
|
163
|
+
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H900 to Heading XXL."
|
|
166
164
|
},
|
|
167
165
|
"value": {
|
|
168
166
|
"fontWeight": "FontWeight500",
|
|
@@ -181,8 +179,7 @@ var tokens = [{
|
|
|
181
179
|
"group": "typography",
|
|
182
180
|
"state": "active",
|
|
183
181
|
"introduced": "1.14.0",
|
|
184
|
-
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H800 to Heading XL."
|
|
185
|
-
"responsiveSmallerVariant": "font.heading.large"
|
|
182
|
+
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H800 to Heading XL."
|
|
186
183
|
},
|
|
187
184
|
"value": "normal 600 29px/32px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
|
|
188
185
|
"filePath": "schema/themes/atlassian-typography-adg3/theme.tsx",
|
|
@@ -192,8 +189,7 @@ var tokens = [{
|
|
|
192
189
|
"group": "typography",
|
|
193
190
|
"state": "active",
|
|
194
191
|
"introduced": "1.14.0",
|
|
195
|
-
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H800 to Heading XL."
|
|
196
|
-
"responsiveSmallerVariant": "font.heading.large"
|
|
192
|
+
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H800 to Heading XL."
|
|
197
193
|
},
|
|
198
194
|
"value": {
|
|
199
195
|
"fontWeight": "FontWeight600",
|
|
@@ -212,8 +208,7 @@ var tokens = [{
|
|
|
212
208
|
"group": "typography",
|
|
213
209
|
"state": "active",
|
|
214
210
|
"introduced": "1.14.0",
|
|
215
|
-
"description": "Product page titles, such as forms. Migrate instances of H700 to Heading L."
|
|
216
|
-
"responsiveSmallerVariant": "font.heading.medium"
|
|
211
|
+
"description": "Product page titles, such as forms. Migrate instances of H700 to Heading L."
|
|
217
212
|
},
|
|
218
213
|
"value": "normal 500 24px/28px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
|
|
219
214
|
"filePath": "schema/themes/atlassian-typography-adg3/theme.tsx",
|
|
@@ -223,8 +218,7 @@ var tokens = [{
|
|
|
223
218
|
"group": "typography",
|
|
224
219
|
"state": "active",
|
|
225
220
|
"introduced": "1.14.0",
|
|
226
|
-
"description": "Product page titles, such as forms. Migrate instances of H700 to Heading L."
|
|
227
|
-
"responsiveSmallerVariant": "font.heading.medium"
|
|
221
|
+
"description": "Product page titles, such as forms. Migrate instances of H700 to Heading L."
|
|
228
222
|
},
|
|
229
223
|
"value": {
|
|
230
224
|
"fontWeight": "FontWeight500",
|
|
@@ -243,8 +237,7 @@ var tokens = [{
|
|
|
243
237
|
"group": "typography",
|
|
244
238
|
"state": "active",
|
|
245
239
|
"introduced": "1.14.0",
|
|
246
|
-
"description": "Headers in large components, such as modal dialogs. Migrate instances of H600 to Heading M."
|
|
247
|
-
"responsiveSmallerVariant": "font.heading.small"
|
|
240
|
+
"description": "Headers in large components, such as modal dialogs. Migrate instances of H600 to Heading M."
|
|
248
241
|
},
|
|
249
242
|
"value": "normal 500 20px/24px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
|
|
250
243
|
"filePath": "schema/themes/atlassian-typography-adg3/theme.tsx",
|
|
@@ -254,8 +247,7 @@ var tokens = [{
|
|
|
254
247
|
"group": "typography",
|
|
255
248
|
"state": "active",
|
|
256
249
|
"introduced": "1.14.0",
|
|
257
|
-
"description": "Headers in large components, such as modal dialogs. Migrate instances of H600 to Heading M."
|
|
258
|
-
"responsiveSmallerVariant": "font.heading.small"
|
|
250
|
+
"description": "Headers in large components, such as modal dialogs. Migrate instances of H600 to Heading M."
|
|
259
251
|
},
|
|
260
252
|
"value": {
|
|
261
253
|
"fontWeight": "FontWeight500",
|
|
@@ -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::9266e08ae662e609b2e76306cf8df17e>>
|
|
4
4
|
* @codegenCommand yarn build tokens
|
|
5
5
|
*/
|
|
6
6
|
var tokens = [{
|
|
@@ -150,8 +150,7 @@ var tokens = [{
|
|
|
150
150
|
"group": "typography",
|
|
151
151
|
"state": "active",
|
|
152
152
|
"introduced": "1.14.0",
|
|
153
|
-
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H900 to Heading XXL."
|
|
154
|
-
"responsiveSmallerVariant": "font.heading.xlarge"
|
|
153
|
+
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H900 to Heading XXL."
|
|
155
154
|
},
|
|
156
155
|
"value": "normal 700 32px/36px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
|
|
157
156
|
"filePath": "schema/themes/atlassian-typography-minor3/theme.tsx",
|
|
@@ -161,8 +160,7 @@ var tokens = [{
|
|
|
161
160
|
"group": "typography",
|
|
162
161
|
"state": "active",
|
|
163
162
|
"introduced": "1.14.0",
|
|
164
|
-
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H900 to Heading XXL."
|
|
165
|
-
"responsiveSmallerVariant": "font.heading.xlarge"
|
|
163
|
+
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H900 to Heading XXL."
|
|
166
164
|
},
|
|
167
165
|
"value": {
|
|
168
166
|
"fontWeight": "FontWeight700",
|
|
@@ -181,8 +179,7 @@ var tokens = [{
|
|
|
181
179
|
"group": "typography",
|
|
182
180
|
"state": "active",
|
|
183
181
|
"introduced": "1.14.0",
|
|
184
|
-
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H800 to Heading XL."
|
|
185
|
-
"responsiveSmallerVariant": "font.heading.large"
|
|
182
|
+
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H800 to Heading XL."
|
|
186
183
|
},
|
|
187
184
|
"value": "normal 700 28px/32px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
|
|
188
185
|
"filePath": "schema/themes/atlassian-typography-minor3/theme.tsx",
|
|
@@ -192,8 +189,7 @@ var tokens = [{
|
|
|
192
189
|
"group": "typography",
|
|
193
190
|
"state": "active",
|
|
194
191
|
"introduced": "1.14.0",
|
|
195
|
-
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H800 to Heading XL."
|
|
196
|
-
"responsiveSmallerVariant": "font.heading.large"
|
|
192
|
+
"description": "For overlapping brand with product promotions, such as marketplace content. Migrate instances of H800 to Heading XL."
|
|
197
193
|
},
|
|
198
194
|
"value": {
|
|
199
195
|
"fontWeight": "FontWeight700",
|
|
@@ -212,8 +208,7 @@ var tokens = [{
|
|
|
212
208
|
"group": "typography",
|
|
213
209
|
"state": "active",
|
|
214
210
|
"introduced": "1.14.0",
|
|
215
|
-
"description": "Product page titles, such as forms. Migrate instances of H700 to Heading L."
|
|
216
|
-
"responsiveSmallerVariant": "font.heading.medium"
|
|
211
|
+
"description": "Product page titles, such as forms. Migrate instances of H700 to Heading L."
|
|
217
212
|
},
|
|
218
213
|
"value": "normal 700 24px/28px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
|
|
219
214
|
"filePath": "schema/themes/atlassian-typography-minor3/theme.tsx",
|
|
@@ -223,8 +218,7 @@ var tokens = [{
|
|
|
223
218
|
"group": "typography",
|
|
224
219
|
"state": "active",
|
|
225
220
|
"introduced": "1.14.0",
|
|
226
|
-
"description": "Product page titles, such as forms. Migrate instances of H700 to Heading L."
|
|
227
|
-
"responsiveSmallerVariant": "font.heading.medium"
|
|
221
|
+
"description": "Product page titles, such as forms. Migrate instances of H700 to Heading L."
|
|
228
222
|
},
|
|
229
223
|
"value": {
|
|
230
224
|
"fontWeight": "FontWeight700",
|
|
@@ -243,8 +237,7 @@ var tokens = [{
|
|
|
243
237
|
"group": "typography",
|
|
244
238
|
"state": "active",
|
|
245
239
|
"introduced": "1.14.0",
|
|
246
|
-
"description": "Headers in large components, such as modal dialogs. Migrate instances of H600 to Heading M."
|
|
247
|
-
"responsiveSmallerVariant": "font.heading.small"
|
|
240
|
+
"description": "Headers in large components, such as modal dialogs. Migrate instances of H600 to Heading M."
|
|
248
241
|
},
|
|
249
242
|
"value": "normal 700 20px/24px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif",
|
|
250
243
|
"filePath": "schema/themes/atlassian-typography-minor3/theme.tsx",
|
|
@@ -254,8 +247,7 @@ var tokens = [{
|
|
|
254
247
|
"group": "typography",
|
|
255
248
|
"state": "active",
|
|
256
249
|
"introduced": "1.14.0",
|
|
257
|
-
"description": "Headers in large components, such as modal dialogs. Migrate instances of H600 to Heading M."
|
|
258
|
-
"responsiveSmallerVariant": "font.heading.small"
|
|
250
|
+
"description": "Headers in large components, such as modal dialogs. Migrate instances of H600 to Heading M."
|
|
259
251
|
},
|
|
260
252
|
"value": {
|
|
261
253
|
"fontWeight": "FontWeight700",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
|
|
2
2
|
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
|
|
3
3
|
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
4
|
-
import {
|
|
4
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
5
5
|
import { themeIdsWithOverrides, themeStateDefaults } from './theme-config';
|
|
6
6
|
import { isValidBrandHex } from './utils/color-utils';
|
|
7
7
|
import { getThemeOverridePreferences, getThemePreferences } from './utils/get-theme-preferences';
|
|
@@ -33,11 +33,14 @@ var getThemeStyles = /*#__PURE__*/function () {
|
|
|
33
33
|
themePreferences = themeIdsWithOverrides;
|
|
34
34
|
|
|
35
35
|
// CLEANUP: Remove
|
|
36
|
-
if (!
|
|
36
|
+
if (!fg('platform.design-system-team.increased-contrast-themes')) {
|
|
37
37
|
themePreferences = themePreferences.filter(function (n) {
|
|
38
38
|
return n !== 'light-increased-contrast' && n !== 'dark-increased-contrast';
|
|
39
39
|
});
|
|
40
40
|
}
|
|
41
|
+
themePreferences = themePreferences.filter(function (n) {
|
|
42
|
+
return n !== 'light-brand-refresh' && n !== 'dark-brand-refresh';
|
|
43
|
+
});
|
|
41
44
|
} else {
|
|
42
45
|
themeState = {
|
|
43
46
|
colorMode: (preferences === null || preferences === void 0 ? void 0 : preferences.colorMode) || themeStateDefaults['colorMode'],
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import warnOnce from '@atlaskit/ds-lib/warn-once';
|
|
2
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
2
3
|
import tokens from './artifacts/token-names';
|
|
3
4
|
/**
|
|
4
5
|
* Takes a dot-separated token name and and an optional fallback, and returns the current computed CSS value for the
|
|
@@ -25,8 +26,13 @@ function getTokenValue(tokenId) {
|
|
|
25
26
|
var fallback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
|
26
27
|
var token = tokens[tokenId];
|
|
27
28
|
var tokenValue = fallback;
|
|
28
|
-
if (typeof process !== 'undefined' && process.env.NODE_ENV !== 'production'
|
|
29
|
-
|
|
29
|
+
if (typeof process !== 'undefined' && process.env.NODE_ENV !== 'production') {
|
|
30
|
+
if (!token) {
|
|
31
|
+
warnOnce("Unknown token id at path: ".concat(tokenId, " in @atlaskit/tokens"));
|
|
32
|
+
}
|
|
33
|
+
if (token === '--ds-icon-subtlest' && !fg('platform-component-visual-refresh')) {
|
|
34
|
+
warnOnce("Token \"color.icon.subtlest\" is only available when feature flag \"platform-component-visual-refresh\" is on, don't use it if the flag can't be turned on on this page");
|
|
35
|
+
}
|
|
30
36
|
}
|
|
31
37
|
if (typeof window === 'undefined') {
|
|
32
38
|
return tokenValue;
|
package/dist/esm/get-token.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import warnOnce from '@atlaskit/ds-lib/warn-once';
|
|
2
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
2
3
|
import tokens from './artifacts/token-names';
|
|
3
4
|
import { TOKEN_NOT_FOUND_CSS_VAR } from './constants';
|
|
4
5
|
/**
|
|
@@ -25,8 +26,13 @@ import { TOKEN_NOT_FOUND_CSS_VAR } from './constants';
|
|
|
25
26
|
*/
|
|
26
27
|
function token(path, fallback) {
|
|
27
28
|
var token = tokens[path];
|
|
28
|
-
if (typeof process !== 'undefined' && process.env.NODE_ENV !== 'production'
|
|
29
|
-
|
|
29
|
+
if (typeof process !== 'undefined' && process.env.NODE_ENV !== 'production') {
|
|
30
|
+
if (!token) {
|
|
31
|
+
warnOnce("Unknown token id at path: ".concat(path, " in @atlaskit/tokens"));
|
|
32
|
+
}
|
|
33
|
+
if (token === '--ds-icon-subtlest' && !fg('platform-component-visual-refresh')) {
|
|
34
|
+
warnOnce("Token \"color.icon.subtlest\" is only available when feature flag \"platform-component-visual-refresh\" is on, don't use it if the flag can't be turned on on this page");
|
|
35
|
+
}
|
|
30
36
|
}
|
|
31
37
|
|
|
32
38
|
// if the token is not found - replacing it with variable name without any value, to avoid it being undefined which would result in invalid css
|
|
@@ -3,7 +3,7 @@ function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol
|
|
|
3
3
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
4
4
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
5
5
|
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
6
|
-
import {
|
|
6
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
7
7
|
import { themeStateDefaults } from './theme-config';
|
|
8
8
|
import { isValidBrandHex } from './utils/color-utils';
|
|
9
9
|
import configurePage from './utils/configure-page';
|
|
@@ -71,7 +71,7 @@ var setGlobalTheme = /*#__PURE__*/function () {
|
|
|
71
71
|
themeLoader = _args3.length > 1 ? _args3[1] : undefined;
|
|
72
72
|
// CLEANUP: Remove. This blocks application of increased contrast themes
|
|
73
73
|
// without the feature flag enabled.
|
|
74
|
-
if (!
|
|
74
|
+
if (!fg('platform.design-system-team.increased-contrast-themes')) {
|
|
75
75
|
if (light === 'light-increased-contrast') {
|
|
76
76
|
light = 'light';
|
|
77
77
|
}
|
package/dist/esm/theme-config.js
CHANGED
|
@@ -38,7 +38,7 @@ export var themeContrastModes = ['more', 'no-preference', 'auto'];
|
|
|
38
38
|
*
|
|
39
39
|
* These ids must be kebab case
|
|
40
40
|
*/
|
|
41
|
-
export var themeIds = ['light-increased-contrast', 'light', 'light-future', 'dark', 'dark-future', 'dark-increased-contrast', 'legacy-light', 'legacy-dark', 'spacing', 'shape', 'typography-adg3', 'typography-minor3'];
|
|
41
|
+
export var themeIds = ['light-increased-contrast', 'light', 'light-future', 'light-brand-refresh', 'dark', 'dark-future', 'dark-increased-contrast', 'dark-brand-refresh', 'legacy-light', 'legacy-dark', 'spacing', 'shape', 'typography-adg3', 'typography-minor3'];
|
|
42
42
|
/**
|
|
43
43
|
* Theme override ids: the equivalent of themeIds for theme overrides.
|
|
44
44
|
* Theme overrides are temporary and there may not be any defined at times.
|
|
@@ -173,6 +173,24 @@ var themeConfig = {
|
|
|
173
173
|
attributes: {
|
|
174
174
|
type: 'typography'
|
|
175
175
|
}
|
|
176
|
+
},
|
|
177
|
+
'atlassian-light-brand-refresh': {
|
|
178
|
+
id: 'light-brand-refresh',
|
|
179
|
+
displayName: 'Light theme (Brand refresh)',
|
|
180
|
+
palette: 'brandRefreshPalette',
|
|
181
|
+
attributes: {
|
|
182
|
+
type: 'color',
|
|
183
|
+
mode: 'light'
|
|
184
|
+
}
|
|
185
|
+
},
|
|
186
|
+
'atlassian-dark-brand-refresh': {
|
|
187
|
+
id: 'dark-brand-refresh',
|
|
188
|
+
displayName: 'Dark theme (Brand refresh)',
|
|
189
|
+
palette: 'brandRefreshPalette',
|
|
190
|
+
attributes: {
|
|
191
|
+
type: 'color',
|
|
192
|
+
mode: 'dark'
|
|
193
|
+
}
|
|
176
194
|
}
|
|
177
195
|
};
|
|
178
196
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
|
|
2
|
-
import {
|
|
2
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
3
3
|
import getIncreasedContrastTheme from './get-increased-contrast-theme';
|
|
4
4
|
export var getThemePreferences = function getThemePreferences(themeState) {
|
|
5
5
|
var colorMode = themeState.colorMode,
|
|
@@ -12,7 +12,7 @@ export var getThemePreferences = function getThemePreferences(themeState) {
|
|
|
12
12
|
var autoColorModeThemes = [light, dark];
|
|
13
13
|
var themePreferences = [];
|
|
14
14
|
if (colorMode === 'auto') {
|
|
15
|
-
if (contrastMode !== 'no-preference' &&
|
|
15
|
+
if (contrastMode !== 'no-preference' && fg('platform.design-system-team.increased-contrast-themes')) {
|
|
16
16
|
autoColorModeThemes.forEach(function (normalTheme) {
|
|
17
17
|
var increasedContrastTheme = getIncreasedContrastTheme(normalTheme);
|
|
18
18
|
if (increasedContrastTheme) {
|
|
@@ -23,7 +23,7 @@ export var getThemePreferences = function getThemePreferences(themeState) {
|
|
|
23
23
|
themePreferences.push.apply(themePreferences, autoColorModeThemes);
|
|
24
24
|
} else {
|
|
25
25
|
themePreferences.push(themeState[colorMode]);
|
|
26
|
-
if (contrastMode !== 'no-preference' &&
|
|
26
|
+
if (contrastMode !== 'no-preference' && fg('platform.design-system-team.increased-contrast-themes')) {
|
|
27
27
|
var increasedContrastTheme = getIncreasedContrastTheme(themeState[colorMode]);
|
|
28
28
|
if (increasedContrastTheme) {
|
|
29
29
|
themePreferences.push(increasedContrastTheme);
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
|
|
2
2
|
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
3
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
3
4
|
import themeImportMap from '../artifacts/theme-import-map';
|
|
4
5
|
import { CUSTOM_THEME_ATTRIBUTE, THEME_DATA_ATTRIBUTE } from '../constants';
|
|
5
6
|
export var loadAndAppendThemeCss = /*#__PURE__*/function () {
|
|
@@ -44,13 +45,16 @@ export var loadThemeCss = /*#__PURE__*/function () {
|
|
|
44
45
|
return _regeneratorRuntime.wrap(function _callee2$(_context2) {
|
|
45
46
|
while (1) switch (_context2.prev = _context2.next) {
|
|
46
47
|
case 0:
|
|
47
|
-
|
|
48
|
+
if ((themeId === 'light' || themeId === 'dark') && fg('platform-component-visual-refresh')) {
|
|
49
|
+
themeId += '-brand-refresh';
|
|
50
|
+
}
|
|
51
|
+
_context2.next = 3;
|
|
48
52
|
return themeImportMap[themeId]();
|
|
49
|
-
case
|
|
53
|
+
case 3:
|
|
50
54
|
_yield$themeImportMap = _context2.sent;
|
|
51
55
|
themeCss = _yield$themeImportMap.default;
|
|
52
56
|
return _context2.abrupt("return", themeCss);
|
|
53
|
-
case
|
|
57
|
+
case 6:
|
|
54
58
|
case "end":
|
|
55
59
|
return _context2.stop();
|
|
56
60
|
}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
* Auto-generated list of token pairings that may need to have sufficient contrast.
|
|
5
5
|
* Not currently used by tests, but is used by the custom theme contrast checker example
|
|
6
6
|
*
|
|
7
|
-
* @codegen <<SignedSource::
|
|
7
|
+
* @codegen <<SignedSource::212fdb181eea8d32d157a5b9f8ea363d>>
|
|
8
8
|
* @codegenCommand yarn build tokens
|
|
9
9
|
*/
|
|
10
10
|
export declare const generatedPairs: ({
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
3
|
+
* @codegen <<SignedSource::a06fa043504c1e55d9871df9eab477b6>>
|
|
4
|
+
* @codegenCommand yarn build tokens
|
|
5
|
+
*/
|
|
6
|
+
declare const tokens: ({
|
|
7
|
+
value: string;
|
|
8
|
+
attributes: {
|
|
9
|
+
group: string;
|
|
10
|
+
category: string;
|
|
11
|
+
};
|
|
12
|
+
filePath: string;
|
|
13
|
+
isSource: boolean;
|
|
14
|
+
original: {
|
|
15
|
+
value: string;
|
|
16
|
+
attributes: {
|
|
17
|
+
group: string;
|
|
18
|
+
category: string;
|
|
19
|
+
};
|
|
20
|
+
};
|
|
21
|
+
name: string;
|
|
22
|
+
path: string[];
|
|
23
|
+
} | {
|
|
24
|
+
value: number;
|
|
25
|
+
attributes: {
|
|
26
|
+
group: string;
|
|
27
|
+
category: string;
|
|
28
|
+
};
|
|
29
|
+
filePath: string;
|
|
30
|
+
isSource: boolean;
|
|
31
|
+
original: {
|
|
32
|
+
value: number;
|
|
33
|
+
attributes: {
|
|
34
|
+
group: string;
|
|
35
|
+
category: string;
|
|
36
|
+
};
|
|
37
|
+
};
|
|
38
|
+
name: string;
|
|
39
|
+
path: string[];
|
|
40
|
+
})[];
|
|
41
|
+
export default tokens;
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
* This allows users to compose their themes and only use the tokens that are requested.
|
|
7
7
|
* When a new theme is created, the import should automatically be added to the map
|
|
8
8
|
*
|
|
9
|
-
* @codegen <<SignedSource::
|
|
9
|
+
* @codegen <<SignedSource::22d7bb0d6046d2d20f2a8f82afc0acb7>>
|
|
10
10
|
* @codegenCommand yarn build tokens
|
|
11
11
|
*/
|
|
12
12
|
import { type ThemeIds, type ThemeOverrideIds } from '../theme-config';
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
3
|
+
* @codegen <<SignedSource::0678a328ef2c86a4586191f72626cb51>>
|
|
4
|
+
* @codegenCommand yarn build tokens
|
|
5
|
+
*/
|
|
6
|
+
declare const _default: "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:dark\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:dark\"] {\n color-scheme: dark;\n --ds-text: #BFC1C4;\n --ds-text-accent-lime: #B3DF72;\n --ds-text-accent-lime-bolder: #D3F1A7;\n --ds-text-accent-red: #FD9891;\n --ds-text-accent-red-bolder: #FFD5D2;\n --ds-text-accent-orange: #FBC828;\n --ds-text-accent-orange-bolder: #FCE4A6;\n --ds-text-accent-yellow: #EED12B;\n --ds-text-accent-yellow-bolder: #F5E989;\n --ds-text-accent-green: #7EE2B8;\n --ds-text-accent-green-bolder: #BAF3DB;\n --ds-text-accent-teal: #9DD9EE;\n --ds-text-accent-teal-bolder: #C6EDFB;\n --ds-text-accent-blue: #8FB8F6;\n --ds-text-accent-blue-bolder: #CFE1FD;\n --ds-text-accent-purple: #D8A0F7;\n --ds-text-accent-purple-bolder: #EED7FC;\n --ds-text-accent-magenta: #F797D2;\n --ds-text-accent-magenta-bolder: #FDD0EC;\n --ds-text-accent-gray: #A9ABAF;\n --ds-text-accent-gray-bolder: #E2E3E4;\n --ds-text-disabled: #E5E9F640;\n --ds-text-inverse: #1F1F21;\n --ds-text-selected: #669DF1;\n --ds-text-brand: #669DF1;\n --ds-text-danger: #FD9891;\n --ds-text-warning: #FBC828;\n --ds-text-warning-inverse: #1F1F21;\n --ds-text-success: #B3DF72;\n --ds-text-discovery: #D8A0F7;\n --ds-text-information: #8FB8F6;\n --ds-text-subtlest: #96999E;\n --ds-text-subtle: #A9ABAF;\n --ds-link: #669DF1;\n --ds-link-pressed: #8FB8F6;\n --ds-link-visited: #D8A0F7;\n --ds-link-visited-pressed: #EED7FC;\n --ds-icon: #CECFD2;\n --ds-icon-accent-lime: #82B536;\n --ds-icon-accent-red: #E2483D;\n --ds-icon-accent-orange: #F68909;\n --ds-icon-accent-yellow: #EED12B;\n --ds-icon-accent-green: #2ABB7F;\n --ds-icon-accent-teal: #42B2D7;\n --ds-icon-accent-blue: #4688EC;\n --ds-icon-accent-purple: #BF63F3;\n --ds-icon-accent-magenta: #DA62AC;\n --ds-icon-accent-gray: #7E8188;\n --ds-icon-disabled: #E5E9F640;\n --ds-icon-inverse: #1F1F21;\n --ds-icon-selected: #669DF1;\n --ds-icon-brand: #669DF1;\n --ds-icon-danger: #F15B50;\n --ds-icon-warning: #FBC828;\n --ds-icon-warning-inverse: #1F1F21;\n --ds-icon-success: #B3DF72;\n --ds-icon-discovery: #BF63F3;\n --ds-icon-information: #4688EC;\n --ds-icon-subtlest: #96999E;\n --ds-icon-subtle: #A9ABAF;\n --ds-border: #E3E4F21F;\n --ds-border-accent-lime: #82B536;\n --ds-border-accent-red: #F15B50;\n --ds-border-accent-orange: #F68909;\n --ds-border-accent-yellow: #CF9F02;\n --ds-border-accent-green: #2ABB7F;\n --ds-border-accent-teal: #42B2D7;\n --ds-border-accent-blue: #4688EC;\n --ds-border-accent-purple: #BF63F3;\n --ds-border-accent-magenta: #DA62AC;\n --ds-border-accent-gray: #7E8188;\n --ds-border-disabled: #CECED912;\n --ds-border-focused: #8FB8F6;\n --ds-border-input: #7E8188;\n --ds-border-inverse: #18191A;\n --ds-border-selected: #669DF1;\n --ds-border-brand: #669DF1;\n --ds-border-danger: #F15B50;\n --ds-border-warning: #F68909;\n --ds-border-success: #82B536;\n --ds-border-discovery: #BF63F3;\n --ds-border-information: #4688EC;\n --ds-border-bold: #7E8188;\n --ds-background-accent-lime-subtlest: #28311B;\n --ds-background-accent-lime-subtlest-hovered: #37471F;\n --ds-background-accent-lime-subtlest-pressed: #4C6B1F;\n --ds-background-accent-lime-subtler: #37471F;\n --ds-background-accent-lime-subtler-hovered: #4C6B1F;\n --ds-background-accent-lime-subtler-pressed: #5B7F24;\n --ds-background-accent-lime-subtle: #4C6B1F;\n --ds-background-accent-lime-subtle-hovered: #37471F;\n --ds-background-accent-lime-subtle-pressed: #28311B;\n --ds-background-accent-lime-bolder: #94C748;\n --ds-background-accent-lime-bolder-hovered: #B3DF72;\n --ds-background-accent-lime-bolder-pressed: #D3F1A7;\n --ds-background-accent-red-subtlest: #42221F;\n --ds-background-accent-red-subtlest-hovered: #5D1F1A;\n --ds-background-accent-red-subtlest-pressed: #AE2E24;\n --ds-background-accent-red-subtler: #5D1F1A;\n --ds-background-accent-red-subtler-hovered: #AE2E24;\n --ds-background-accent-red-subtler-pressed: #C9372C;\n --ds-background-accent-red-subtle: #AE2E24;\n --ds-background-accent-red-subtle-hovered: #5D1F1A;\n --ds-background-accent-red-subtle-pressed: #42221F;\n --ds-background-accent-red-bolder: #F87168;\n --ds-background-accent-red-bolder-hovered: #FD9891;\n --ds-background-accent-red-bolder-pressed: #FFD5D2;\n --ds-background-accent-orange-subtlest: #3A2C1F;\n --ds-background-accent-orange-subtlest-hovered: #693200;\n --ds-background-accent-orange-subtlest-pressed: #9E4C00;\n --ds-background-accent-orange-subtler: #693200;\n --ds-background-accent-orange-subtler-hovered: #9E4C00;\n --ds-background-accent-orange-subtler-pressed: #BD5B00;\n --ds-background-accent-orange-subtle: #9E4C00;\n --ds-background-accent-orange-subtle-hovered: #693200;\n --ds-background-accent-orange-subtle-pressed: #3A2C1F;\n --ds-background-accent-orange-bolder: #FCA700;\n --ds-background-accent-orange-bolder-hovered: #FBC828;\n --ds-background-accent-orange-bolder-pressed: #FCE4A6;\n --ds-background-accent-yellow-subtlest: #332E1B;\n --ds-background-accent-yellow-subtlest-hovered: #533F04;\n --ds-background-accent-yellow-subtlest-pressed: #7F5F01;\n --ds-background-accent-yellow-subtler: #533F04;\n --ds-background-accent-yellow-subtler-hovered: #7F5F01;\n --ds-background-accent-yellow-subtler-pressed: #946F00;\n --ds-background-accent-yellow-subtle: #7F5F01;\n --ds-background-accent-yellow-subtle-hovered: #533F04;\n --ds-background-accent-yellow-subtle-pressed: #332E1B;\n --ds-background-accent-yellow-bolder: #DDB30E;\n --ds-background-accent-yellow-bolder-hovered: #EED12B;\n --ds-background-accent-yellow-bolder-pressed: #F5E989;\n --ds-background-accent-green-subtlest: #1C3329;\n --ds-background-accent-green-subtlest-hovered: #164B35;\n --ds-background-accent-green-subtlest-pressed: #216E4E;\n --ds-background-accent-green-subtler: #164B35;\n --ds-background-accent-green-subtler-hovered: #216E4E;\n --ds-background-accent-green-subtler-pressed: #1F845A;\n --ds-background-accent-green-subtle: #216E4E;\n --ds-background-accent-green-subtle-hovered: #164B35;\n --ds-background-accent-green-subtle-pressed: #1C3329;\n --ds-background-accent-green-bolder: #4BCE97;\n --ds-background-accent-green-bolder-hovered: #7EE2B8;\n --ds-background-accent-green-bolder-pressed: #BAF3DB;\n --ds-background-accent-teal-subtlest: #1E3137;\n --ds-background-accent-teal-subtlest-hovered: #164555;\n --ds-background-accent-teal-subtlest-pressed: #206A83;\n --ds-background-accent-teal-subtler: #164555;\n --ds-background-accent-teal-subtler-hovered: #206A83;\n --ds-background-accent-teal-subtler-pressed: #227D9B;\n --ds-background-accent-teal-subtle: #206A83;\n --ds-background-accent-teal-subtle-hovered: #164555;\n --ds-background-accent-teal-subtle-pressed: #1E3137;\n --ds-background-accent-teal-bolder: #6CC3E0;\n --ds-background-accent-teal-bolder-hovered: #9DD9EE;\n --ds-background-accent-teal-bolder-pressed: #C6EDFB;\n --ds-background-accent-blue-subtlest: #1C2B42;\n --ds-background-accent-blue-subtlest-hovered: #123263;\n --ds-background-accent-blue-subtlest-pressed: #1558BC;\n --ds-background-accent-blue-subtler: #123263;\n --ds-background-accent-blue-subtler-hovered: #1558BC;\n --ds-background-accent-blue-subtler-pressed: #1868DB;\n --ds-background-accent-blue-subtle: #1558BC;\n --ds-background-accent-blue-subtle-hovered: #123263;\n --ds-background-accent-blue-subtle-pressed: #1C2B42;\n --ds-background-accent-blue-bolder: #669DF1;\n --ds-background-accent-blue-bolder-hovered: #8FB8F6;\n --ds-background-accent-blue-bolder-pressed: #CFE1FD;\n --ds-background-accent-purple-subtlest: #35243F;\n --ds-background-accent-purple-subtlest-hovered: #48245D;\n --ds-background-accent-purple-subtlest-pressed: #803FA5;\n --ds-background-accent-purple-subtler: #48245D;\n --ds-background-accent-purple-subtler-hovered: #803FA5;\n --ds-background-accent-purple-subtler-pressed: #964AC0;\n --ds-background-accent-purple-subtle: #803FA5;\n --ds-background-accent-purple-subtle-hovered: #48245D;\n --ds-background-accent-purple-subtle-pressed: #35243F;\n --ds-background-accent-purple-bolder: #C97CF4;\n --ds-background-accent-purple-bolder-hovered: #D8A0F7;\n --ds-background-accent-purple-bolder-pressed: #EED7FC;\n --ds-background-accent-magenta-subtlest: #3D2232;\n --ds-background-accent-magenta-subtlest-hovered: #50253F;\n --ds-background-accent-magenta-subtlest-pressed: #943D73;\n --ds-background-accent-magenta-subtler: #50253F;\n --ds-background-accent-magenta-subtler-hovered: #943D73;\n --ds-background-accent-magenta-subtler-pressed: #AE4787;\n --ds-background-accent-magenta-subtle: #943D73;\n --ds-background-accent-magenta-subtle-hovered: #50253F;\n --ds-background-accent-magenta-subtle-pressed: #3D2232;\n --ds-background-accent-magenta-bolder: #E774BB;\n --ds-background-accent-magenta-bolder-hovered: #F797D2;\n --ds-background-accent-magenta-bolder-pressed: #FDD0EC;\n --ds-background-accent-gray-subtlest: #303134;\n --ds-background-accent-gray-subtlest-hovered: #3D3F43;\n --ds-background-accent-gray-subtlest-pressed: #4B4D51;\n --ds-background-accent-gray-subtler: #4B4D51;\n --ds-background-accent-gray-subtler-hovered: #63666B;\n --ds-background-accent-gray-subtler-pressed: #7E8188;\n --ds-background-accent-gray-subtle: #63666B;\n --ds-background-accent-gray-subtle-hovered: #4B4D51;\n --ds-background-accent-gray-subtle-pressed: #3D3F43;\n --ds-background-accent-gray-bolder: #96999E;\n --ds-background-accent-gray-bolder-hovered: #A9ABAF;\n --ds-background-accent-gray-bolder-pressed: #BFC1C4;\n --ds-background-disabled: #BDBDBD0A;\n --ds-background-input: #242528;\n --ds-background-input-hovered: #2B2C2F;\n --ds-background-input-pressed: #242528;\n --ds-background-inverse-subtle: #FFFFFF29;\n --ds-background-inverse-subtle-hovered: #FFFFFF3D;\n --ds-background-inverse-subtle-pressed: #FFFFFF52;\n --ds-background-neutral: #CECED912;\n --ds-background-neutral-hovered: #E3E4F21F;\n --ds-background-neutral-pressed: #E5E9F640;\n --ds-background-neutral-subtle: #00000000;\n --ds-background-neutral-subtle-hovered: #CECED912;\n --ds-background-neutral-subtle-pressed: #E3E4F21F;\n --ds-background-neutral-bold: #CECFD2;\n --ds-background-neutral-bold-hovered: #BFC1C4;\n --ds-background-neutral-bold-pressed: #A9ABAF;\n --ds-background-selected: #1C2B42;\n --ds-background-selected-hovered: #123263;\n --ds-background-selected-pressed: #1558BC;\n --ds-background-selected-bold: #669DF1;\n --ds-background-selected-bold-hovered: #8FB8F6;\n --ds-background-selected-bold-pressed: #CFE1FD;\n --ds-background-brand-subtlest: #1C2B42;\n --ds-background-brand-subtlest-hovered: #123263;\n --ds-background-brand-subtlest-pressed: #1558BC;\n --ds-background-brand-bold: #669DF1;\n --ds-background-brand-bold-hovered: #8FB8F6;\n --ds-background-brand-bold-pressed: #CFE1FD;\n --ds-background-brand-boldest: #E9F2FE;\n --ds-background-brand-boldest-hovered: #CFE1FD;\n --ds-background-brand-boldest-pressed: #8FB8F6;\n --ds-background-danger: #42221F;\n --ds-background-danger-hovered: #5D1F1A;\n --ds-background-danger-pressed: #AE2E24;\n --ds-background-danger-bold: #F87168;\n --ds-background-danger-bold-hovered: #FD9891;\n --ds-background-danger-bold-pressed: #FFD5D2;\n --ds-background-warning: #3A2C1F;\n --ds-background-warning-hovered: #693200;\n --ds-background-warning-pressed: #9E4C00;\n --ds-background-warning-bold: #FBC828;\n --ds-background-warning-bold-hovered: #FCA700;\n --ds-background-warning-bold-pressed: #F68909;\n --ds-background-success: #28311B;\n --ds-background-success-hovered: #37471F;\n --ds-background-success-pressed: #4C6B1F;\n --ds-background-success-bold: #94C748;\n --ds-background-success-bold-hovered: #B3DF72;\n --ds-background-success-bold-pressed: #D3F1A7;\n --ds-background-discovery: #35243F;\n --ds-background-discovery-hovered: #48245D;\n --ds-background-discovery-pressed: #803FA5;\n --ds-background-discovery-bold: #C97CF4;\n --ds-background-discovery-bold-hovered: #D8A0F7;\n --ds-background-discovery-bold-pressed: #EED7FC;\n --ds-background-information: #1C2B42;\n --ds-background-information-hovered: #123263;\n --ds-background-information-pressed: #1558BC;\n --ds-background-information-bold: #669DF1;\n --ds-background-information-bold-hovered: #8FB8F6;\n --ds-background-information-bold-pressed: #CFE1FD;\n --ds-blanket: #10121499;\n --ds-blanket-selected: #1D7AFC14;\n --ds-blanket-danger: #E3493514;\n --ds-interaction-hovered: #ffffff33;\n --ds-interaction-pressed: #ffffff5c;\n --ds-skeleton: #CECED912;\n --ds-skeleton-subtle: #BDBDBD0A;\n --ds-chart-categorical-1: #2898BD;\n --ds-chart-categorical-1-hovered: #42B2D7;\n --ds-chart-categorical-2: #D8A0F7;\n --ds-chart-categorical-2-hovered: #EED7FC;\n --ds-chart-categorical-3: #E06C00;\n --ds-chart-categorical-3-hovered: #F68909;\n --ds-chart-categorical-4: #F797D2;\n --ds-chart-categorical-4-hovered: #FDD0EC;\n --ds-chart-categorical-5: #CFE1FD;\n --ds-chart-categorical-5-hovered: #E9F2FE;\n --ds-chart-categorical-6: #AF59E1;\n --ds-chart-categorical-6-hovered: #BF63F3;\n --ds-chart-categorical-7: #FDD0EC;\n --ds-chart-categorical-7-hovered: #FFECF8;\n --ds-chart-categorical-8: #FBC828;\n --ds-chart-categorical-8-hovered: #FCE4A6;\n --ds-chart-lime-bold: #82B536;\n --ds-chart-lime-bold-hovered: #94C748;\n --ds-chart-lime-bolder: #94C748;\n --ds-chart-lime-bolder-hovered: #B3DF72;\n --ds-chart-lime-boldest: #B3DF72;\n --ds-chart-lime-boldest-hovered: #D3F1A7;\n --ds-chart-neutral: #7E8188;\n --ds-chart-neutral-hovered: #96999E;\n --ds-chart-red-bold: #E2483D;\n --ds-chart-red-bold-hovered: #F15B50;\n --ds-chart-red-bolder: #F15B50;\n --ds-chart-red-bolder-hovered: #F87168;\n --ds-chart-red-boldest: #FD9891;\n --ds-chart-red-boldest-hovered: #FFD5D2;\n --ds-chart-orange-bold: #F68909;\n --ds-chart-orange-bold-hovered: #FCA700;\n --ds-chart-orange-bolder: #FCA700;\n --ds-chart-orange-bolder-hovered: #FBC828;\n --ds-chart-orange-boldest: #FBC828;\n --ds-chart-orange-boldest-hovered: #FCE4A6;\n --ds-chart-yellow-bold: #CF9F02;\n --ds-chart-yellow-bold-hovered: #DDB30E;\n --ds-chart-yellow-bolder: #DDB30E;\n --ds-chart-yellow-bolder-hovered: #EED12B;\n --ds-chart-yellow-boldest: #EED12B;\n --ds-chart-yellow-boldest-hovered: #F5E989;\n --ds-chart-green-bold: #2ABB7F;\n --ds-chart-green-bold-hovered: #4BCE97;\n --ds-chart-green-bolder: #4BCE97;\n --ds-chart-green-bolder-hovered: #7EE2B8;\n --ds-chart-green-boldest: #7EE2B8;\n --ds-chart-green-boldest-hovered: #BAF3DB;\n --ds-chart-teal-bold: #42B2D7;\n --ds-chart-teal-bold-hovered: #6CC3E0;\n --ds-chart-teal-bolder: #6CC3E0;\n --ds-chart-teal-bolder-hovered: #9DD9EE;\n --ds-chart-teal-boldest: #9DD9EE;\n --ds-chart-teal-boldest-hovered: #C6EDFB;\n --ds-chart-blue-bold: #357DE8;\n --ds-chart-blue-bold-hovered: #4688EC;\n --ds-chart-blue-bolder: #4688EC;\n --ds-chart-blue-bolder-hovered: #669DF1;\n --ds-chart-blue-boldest: #8FB8F6;\n --ds-chart-blue-boldest-hovered: #CFE1FD;\n --ds-chart-purple-bold: #AF59E1;\n --ds-chart-purple-bold-hovered: #BF63F3;\n --ds-chart-purple-bolder: #BF63F3;\n --ds-chart-purple-bolder-hovered: #C97CF4;\n --ds-chart-purple-boldest: #D8A0F7;\n --ds-chart-purple-boldest-hovered: #EED7FC;\n --ds-chart-magenta-bold: #CD519D;\n --ds-chart-magenta-bold-hovered: #DA62AC;\n --ds-chart-magenta-bolder: #DA62AC;\n --ds-chart-magenta-bolder-hovered: #E774BB;\n --ds-chart-magenta-boldest: #F797D2;\n --ds-chart-magenta-boldest-hovered: #FDD0EC;\n --ds-chart-gray-bold: #7E8188;\n --ds-chart-gray-bold-hovered: #96999E;\n --ds-chart-gray-bolder: #96999E;\n --ds-chart-gray-bolder-hovered: #A9ABAF;\n --ds-chart-gray-boldest: #A9ABAF;\n --ds-chart-gray-boldest-hovered: #BFC1C4;\n --ds-chart-brand: #4688EC;\n --ds-chart-brand-hovered: #669DF1;\n --ds-chart-danger: #E2483D;\n --ds-chart-danger-hovered: #F15B50;\n --ds-chart-danger-bold: #FD9891;\n --ds-chart-danger-bold-hovered: #FFD5D2;\n --ds-chart-warning: #FCA700;\n --ds-chart-warning-hovered: #FBC828;\n --ds-chart-warning-bold: #FCE4A6;\n --ds-chart-warning-bold-hovered: #FFF5DB;\n --ds-chart-success: #82B536;\n --ds-chart-success-hovered: #94C748;\n --ds-chart-success-bold: #B3DF72;\n --ds-chart-success-bold-hovered: #D3F1A7;\n --ds-chart-discovery: #AF59E1;\n --ds-chart-discovery-hovered: #BF63F3;\n --ds-chart-discovery-bold: #D8A0F7;\n --ds-chart-discovery-bold-hovered: #EED7FC;\n --ds-chart-information: #357DE8;\n --ds-chart-information-hovered: #4688EC;\n --ds-chart-information-bold: #8FB8F6;\n --ds-chart-information-bold-hovered: #CFE1FD;\n --ds-surface: #1F1F21;\n --ds-surface-hovered: #242528;\n --ds-surface-pressed: #2B2C2F;\n --ds-surface-overlay: #2B2C2F;\n --ds-surface-overlay-hovered: #303134;\n --ds-surface-overlay-pressed: #3D3F43;\n --ds-surface-raised: #242528;\n --ds-surface-raised-hovered: #2B2C2F;\n --ds-surface-raised-pressed: #303134;\n --ds-surface-sunken: #18191A;\n --ds-shadow-overflow: 0px 0px 12px #0304048F, 0px 0px 1px #03040480;\n --ds-shadow-overflow-perimeter: #03040480;\n --ds-shadow-overflow-spread: #0304048f;\n --ds-shadow-overlay: 0px 0px 0px 1px #39424a, 0px 8px 12px #0104045C, 0px 0px 1px 1px #01040480;\n --ds-shadow-raised: 0px 0px 0px 1px #00000000, 0px 1px 1px #01040480, 0px 0px 1px #01040480;\n --ds-opacity-disabled: 0.4;\n --ds-opacity-loading: 0.2;\n --ds-UNSAFE-transparent: transparent;\n --ds-elevation-surface-current: #1F1F21;\n}\n";
|
|
7
|
+
export default _default;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
3
|
+
* @codegen <<SignedSource::0b925a67d0ae748979d521dfc3ce5662>>
|
|
4
|
+
* @codegenCommand yarn build tokens
|
|
5
|
+
*/
|
|
6
|
+
declare const _default: "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:light\"],\nhtml[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-warning: #9E4C00;\n --ds-text-warning-inverse: #292A2E;\n --ds-text-success: #4C6B1F;\n --ds-text-discovery: #803FA5;\n --ds-text-information: #1558BC;\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: #B3DF72;\n --ds-background-accent-lime-subtler: #D3F1A7;\n --ds-background-accent-lime-subtler-hovered: #B3DF72;\n --ds-background-accent-lime-subtler-pressed: #94C748;\n --ds-background-accent-lime-subtle: #94C748;\n --ds-background-accent-lime-subtle-hovered: #B3DF72;\n --ds-background-accent-lime-subtle-pressed: #D3F1A7;\n --ds-background-accent-lime-bolder: #5B7F24;\n --ds-background-accent-lime-bolder-hovered: #4C6B1F;\n --ds-background-accent-lime-bolder-pressed: #37471F;\n --ds-background-accent-red-subtlest: #FFECEB;\n --ds-background-accent-red-subtlest-hovered: #FFD5D2;\n --ds-background-accent-red-subtlest-pressed: #FD9891;\n --ds-background-accent-red-subtler: #FFD5D2;\n --ds-background-accent-red-subtler-hovered: #FD9891;\n --ds-background-accent-red-subtler-pressed: #F87168;\n --ds-background-accent-red-subtle: #F87168;\n --ds-background-accent-red-subtle-hovered: #FD9891;\n --ds-background-accent-red-subtle-pressed: #FFD5D2;\n --ds-background-accent-red-bolder: #C9372C;\n --ds-background-accent-red-bolder-hovered: #AE2E24;\n --ds-background-accent-red-bolder-pressed: #5D1F1A;\n --ds-background-accent-orange-subtlest: #FFF5DB;\n --ds-background-accent-orange-subtlest-hovered: #FCE4A6;\n --ds-background-accent-orange-subtlest-pressed: #FBC828;\n --ds-background-accent-orange-subtler: #FCE4A6;\n --ds-background-accent-orange-subtler-hovered: #FBC828;\n --ds-background-accent-orange-subtler-pressed: #FCA700;\n --ds-background-accent-orange-subtle: #FCA700;\n --ds-background-accent-orange-subtle-hovered: #FBC828;\n --ds-background-accent-orange-subtle-pressed: #FCE4A6;\n --ds-background-accent-orange-bolder: #BD5B00;\n --ds-background-accent-orange-bolder-hovered: #9E4C00;\n --ds-background-accent-orange-bolder-pressed: #693200;\n --ds-background-accent-yellow-subtlest: #FEF7C8;\n --ds-background-accent-yellow-subtlest-hovered: #F5E989;\n --ds-background-accent-yellow-subtlest-pressed: #EED12B;\n --ds-background-accent-yellow-subtler: #F5E989;\n --ds-background-accent-yellow-subtler-hovered: #EED12B;\n --ds-background-accent-yellow-subtler-pressed: #DDB30E;\n --ds-background-accent-yellow-subtle: #EED12B;\n --ds-background-accent-yellow-subtle-hovered: #DDB30E;\n --ds-background-accent-yellow-subtle-pressed: #CF9F02;\n --ds-background-accent-yellow-bolder: #946F00;\n --ds-background-accent-yellow-bolder-hovered: #7F5F01;\n --ds-background-accent-yellow-bolder-pressed: #533F04;\n --ds-background-accent-green-subtlest: #DCFFF1;\n --ds-background-accent-green-subtlest-hovered: #BAF3DB;\n --ds-background-accent-green-subtlest-pressed: #7EE2B8;\n --ds-background-accent-green-subtler: #BAF3DB;\n --ds-background-accent-green-subtler-hovered: #7EE2B8;\n --ds-background-accent-green-subtler-pressed: #4BCE97;\n --ds-background-accent-green-subtle: #4BCE97;\n --ds-background-accent-green-subtle-hovered: #7EE2B8;\n --ds-background-accent-green-subtle-pressed: #BAF3DB;\n --ds-background-accent-green-bolder: #1F845A;\n --ds-background-accent-green-bolder-hovered: #216E4E;\n --ds-background-accent-green-bolder-pressed: #164B35;\n --ds-background-accent-teal-subtlest: #E7F9FF;\n --ds-background-accent-teal-subtlest-hovered: #C6EDFB;\n --ds-background-accent-teal-subtlest-pressed: #9DD9EE;\n --ds-background-accent-teal-subtler: #C6EDFB;\n --ds-background-accent-teal-subtler-hovered: #9DD9EE;\n --ds-background-accent-teal-subtler-pressed: #6CC3E0;\n --ds-background-accent-teal-subtle: #6CC3E0;\n --ds-background-accent-teal-subtle-hovered: #9DD9EE;\n --ds-background-accent-teal-subtle-pressed: #C6EDFB;\n --ds-background-accent-teal-bolder: #227D9B;\n --ds-background-accent-teal-bolder-hovered: #206A83;\n --ds-background-accent-teal-bolder-pressed: #164555;\n --ds-background-accent-blue-subtlest: #E9F2FE;\n --ds-background-accent-blue-subtlest-hovered: #CFE1FD;\n --ds-background-accent-blue-subtlest-pressed: #8FB8F6;\n --ds-background-accent-blue-subtler: #CFE1FD;\n --ds-background-accent-blue-subtler-hovered: #8FB8F6;\n --ds-background-accent-blue-subtler-pressed: #669DF1;\n --ds-background-accent-blue-subtle: #669DF1;\n --ds-background-accent-blue-subtle-hovered: #8FB8F6;\n --ds-background-accent-blue-subtle-pressed: #CFE1FD;\n --ds-background-accent-blue-bolder: #1868DB;\n --ds-background-accent-blue-bolder-hovered: #1558BC;\n --ds-background-accent-blue-bolder-pressed: #123263;\n --ds-background-accent-purple-subtlest: #F8EEFE;\n --ds-background-accent-purple-subtlest-hovered: #EED7FC;\n --ds-background-accent-purple-subtlest-pressed: #D8A0F7;\n --ds-background-accent-purple-subtler: #EED7FC;\n --ds-background-accent-purple-subtler-hovered: #D8A0F7;\n --ds-background-accent-purple-subtler-pressed: #C97CF4;\n --ds-background-accent-purple-subtle: #C97CF4;\n --ds-background-accent-purple-subtle-hovered: #D8A0F7;\n --ds-background-accent-purple-subtle-pressed: #EED7FC;\n --ds-background-accent-purple-bolder: #964AC0;\n --ds-background-accent-purple-bolder-hovered: #803FA5;\n --ds-background-accent-purple-bolder-pressed: #48245D;\n --ds-background-accent-magenta-subtlest: #FFECF8;\n --ds-background-accent-magenta-subtlest-hovered: #FDD0EC;\n --ds-background-accent-magenta-subtlest-pressed: #F797D2;\n --ds-background-accent-magenta-subtler: #FDD0EC;\n --ds-background-accent-magenta-subtler-hovered: #F797D2;\n --ds-background-accent-magenta-subtler-pressed: #E774BB;\n --ds-background-accent-magenta-subtle: #E774BB;\n --ds-background-accent-magenta-subtle-hovered: #F797D2;\n --ds-background-accent-magenta-subtle-pressed: #FDD0EC;\n --ds-background-accent-magenta-bolder: #AE4787;\n --ds-background-accent-magenta-bolder-hovered: #943D73;\n --ds-background-accent-magenta-bolder-pressed: #50253F;\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: #8FB8F6;\n --ds-background-brand-bold: #1868DB;\n --ds-background-brand-bold-hovered: #1558BC;\n --ds-background-brand-bold-pressed: #123263;\n --ds-background-brand-boldest: #1C2B42;\n --ds-background-brand-boldest-hovered: #123263;\n --ds-background-brand-boldest-pressed: #1558BC;\n --ds-background-danger: #FFECEB;\n --ds-background-danger-hovered: #FFD5D2;\n --ds-background-danger-pressed: #FD9891;\n --ds-background-danger-bold: #C9372C;\n --ds-background-danger-bold-hovered: #AE2E24;\n --ds-background-danger-bold-pressed: #5D1F1A;\n --ds-background-warning: #FFF5DB;\n --ds-background-warning-hovered: #FCE4A6;\n --ds-background-warning-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: #B3DF72;\n --ds-background-success-bold: #5B7F24;\n --ds-background-success-bold-hovered: #4C6B1F;\n --ds-background-success-bold-pressed: #37471F;\n --ds-background-discovery: #F8EEFE;\n --ds-background-discovery-hovered: #EED7FC;\n --ds-background-discovery-pressed: #D8A0F7;\n --ds-background-discovery-bold: #964AC0;\n --ds-background-discovery-bold-hovered: #803FA5;\n --ds-background-discovery-bold-pressed: #48245D;\n --ds-background-information: #E9F2FE;\n --ds-background-information-hovered: #CFE1FD;\n --ds-background-information-pressed: #8FB8F6;\n --ds-background-information-bold: #1868DB;\n --ds-background-information-bold-hovered: #1558BC;\n --ds-background-information-bold-pressed: #123263;\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: #2898BD;\n --ds-chart-categorical-1-hovered: #227D9B;\n --ds-chart-categorical-2: #803FA5;\n --ds-chart-categorical-2-hovered: #48245D;\n --ds-chart-categorical-3: #E06C00;\n --ds-chart-categorical-3-hovered: #BD5B00;\n --ds-chart-categorical-4: #943D73;\n --ds-chart-categorical-4-hovered: #50253F;\n --ds-chart-categorical-5: #123263;\n --ds-chart-categorical-5-hovered: #1C2B42;\n --ds-chart-categorical-6: #BF63F3;\n --ds-chart-categorical-6-hovered: #AF59E1;\n --ds-chart-categorical-7: #50253F;\n --ds-chart-categorical-7-hovered: #3D2232;\n --ds-chart-categorical-8: #9E4C00;\n --ds-chart-categorical-8-hovered: #693200;\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: #9E4C00;\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: #F15B50;\n --ds-chart-danger-hovered: #E2483D;\n --ds-chart-danger-bold: #AE2E24;\n --ds-chart-danger-bold-hovered: #5D1F1A;\n --ds-chart-warning: #E06C00;\n --ds-chart-warning-hovered: #BD5B00;\n --ds-chart-warning-bold: #9E4C00;\n --ds-chart-warning-bold-hovered: #693200;\n --ds-chart-success: #6A9A23;\n --ds-chart-success-hovered: #5B7F24;\n --ds-chart-success-bold: #4C6B1F;\n --ds-chart-success-bold-hovered: #37471F;\n --ds-chart-discovery: #BF63F3;\n --ds-chart-discovery-hovered: #AF59E1;\n --ds-chart-discovery-bold: #803FA5;\n --ds-chart-discovery-bold-hovered: #48245D;\n --ds-chart-information: #4688EC;\n --ds-chart-information-hovered: #357DE8;\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: #091e421f;\n --ds-shadow-overflow-spread: #091e4229;\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
|
+
export default _default;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
3
|
-
* @codegen <<SignedSource::
|
|
3
|
+
* @codegen <<SignedSource::c505470e7888b85984c3420b424a4de7>>
|
|
4
4
|
* @codegenCommand yarn build tokens
|
|
5
5
|
*/
|
|
6
|
-
declare const _default: "\nhtml[data-theme~=\"typography:typography-minor3\"] {\n --ds-UNSAFE-textTransformUppercase: uppercase;\n --ds-font-letterSpacing-0: 0;\n --ds-font-letterSpacing-100: 0;\n --ds-font-letterSpacing-200: 0;\n --ds-font-letterSpacing-300: 0;\n --ds-font-letterSpacing-400: 0;\n --ds-font-heading-xxlarge: normal 700 2rem/2.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-xlarge: normal 700 1.75rem/2rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-large: normal 700 1.5rem/1.75rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-medium: normal 700 1.25rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-small: normal 700 1rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-xsmall: normal 700 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-xxsmall: normal 700 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-body-large: normal 400 1rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-body: normal 400 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-body-small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-body-UNSAFE_small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-code: normal 400 0.875em/1 ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n --ds-font-weight-regular: 400;\n --ds-font-weight-medium: 500;\n --ds-font-weight-semibold: 600;\n --ds-font-weight-bold: 700;\n --ds-font-family-heading: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-family-body: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-family-code: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n --ds-font-family-monospace: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n --ds-font-family-sans: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-family-brand-heading: \"Charlie Display\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-family-brand-body: \"Charlie Text\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n
|
|
6
|
+
declare const _default: "\nhtml[data-theme~=\"typography:typography-minor3\"] {\n --ds-UNSAFE-textTransformUppercase: uppercase;\n --ds-font-letterSpacing-0: 0;\n --ds-font-letterSpacing-100: 0;\n --ds-font-letterSpacing-200: 0;\n --ds-font-letterSpacing-300: 0;\n --ds-font-letterSpacing-400: 0;\n --ds-font-heading-xxlarge: normal 700 2rem/2.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-xlarge: normal 700 1.75rem/2rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-large: normal 700 1.5rem/1.75rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-medium: normal 700 1.25rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-small: normal 700 1rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-xsmall: normal 700 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-heading-xxsmall: normal 700 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-body-large: normal 400 1rem/1.5rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-body: normal 400 0.875rem/1.25rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-body-small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-body-UNSAFE_small: normal 400 0.75rem/1rem ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-code: normal 400 0.875em/1 ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n --ds-font-weight-regular: 400;\n --ds-font-weight-medium: 500;\n --ds-font-weight-semibold: 600;\n --ds-font-weight-bold: 700;\n --ds-font-family-heading: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-family-body: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-family-code: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n --ds-font-family-monospace: ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace;\n --ds-font-family-sans: ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-family-brand-heading: \"Charlie Display\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n --ds-font-family-brand-body: \"Charlie Text\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif;\n}\n";
|
|
7
7
|
export default _default;
|
|
@@ -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::87f24db9e5a21c11b8a5aef68c034395>>
|
|
11
11
|
* @codegenCommand yarn build tokens
|
|
12
12
|
*/
|
|
13
13
|
declare const defaultTokenValues: {
|
|
@@ -69,6 +69,7 @@ declare const defaultTokenValues: {
|
|
|
69
69
|
readonly 'color.icon.success': "#22A06B";
|
|
70
70
|
readonly 'color.icon.discovery': "#8270DB";
|
|
71
71
|
readonly 'color.icon.information': "#1D7AFC";
|
|
72
|
+
readonly 'color.icon.subtlest': "#626F86";
|
|
72
73
|
readonly 'color.icon.subtle': "#626F86";
|
|
73
74
|
readonly 'color.border': "#091E4224";
|
|
74
75
|
readonly 'color.border.accent.lime': "#6A9A23";
|
|
@@ -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::db26fca19e3969bcba2e77bc6fe6eb89>>
|
|
4
4
|
* @codegenCommand yarn build tokens
|
|
5
5
|
*/
|
|
6
6
|
declare const tokens: {
|
|
@@ -62,6 +62,7 @@ declare const tokens: {
|
|
|
62
62
|
readonly 'color.icon.success': "--ds-icon-success";
|
|
63
63
|
readonly 'color.icon.discovery': "--ds-icon-discovery";
|
|
64
64
|
readonly 'color.icon.information': "--ds-icon-information";
|
|
65
|
+
readonly 'color.icon.subtlest': "--ds-icon-subtlest";
|
|
65
66
|
readonly 'color.icon.subtle': "--ds-icon-subtle";
|
|
66
67
|
readonly 'color.border': "--ds-border";
|
|
67
68
|
readonly 'color.border.accent.lime': "--ds-border-accent-lime";
|
|
@@ -531,6 +532,7 @@ export type CSSTokenMap = {
|
|
|
531
532
|
'color.icon.success': 'var(--ds-icon-success)';
|
|
532
533
|
'color.icon.discovery': 'var(--ds-icon-discovery)';
|
|
533
534
|
'color.icon.information': 'var(--ds-icon-information)';
|
|
535
|
+
'color.icon.subtlest': 'var(--ds-icon-subtlest)';
|
|
534
536
|
'color.icon.subtle': 'var(--ds-icon-subtle)';
|
|
535
537
|
'color.border': 'var(--ds-border)';
|
|
536
538
|
'color.border.accent.lime': 'var(--ds-border-accent-lime)';
|