@atlaskit/tokens 1.8.1 → 1.9.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +12 -0
- package/dist/cjs/artifacts/generated-pairs.js +3 -6593
- package/dist/cjs/artifacts/palettes-raw/palette.js +87 -19
- package/dist/cjs/artifacts/theme-import-map.js +1 -7
- package/dist/cjs/artifacts/themes/atlassian-dark.js +2 -2
- package/dist/cjs/artifacts/themes/atlassian-light.js +2 -2
- package/dist/cjs/artifacts/token-default-values.js +3 -3
- package/dist/cjs/artifacts/tokens-raw/atlassian-dark.js +57 -57
- package/dist/cjs/artifacts/tokens-raw/atlassian-light.js +3 -3
- package/dist/cjs/entry-points/token-default-values.js +13 -0
- package/dist/cjs/get-token-value.js +1 -1
- package/dist/cjs/get-token.js +1 -1
- package/dist/cjs/palettes/palette.js +39 -9
- package/dist/cjs/set-global-theme.js +4 -36
- package/dist/cjs/theme-config.js +17 -17
- package/dist/cjs/tokens/atlassian-dark/color/background.js +5 -4
- package/dist/cjs/tokens/atlassian-dark/color/icon.js +2 -2
- package/dist/cjs/tokens/atlassian-dark/color/text.js +3 -3
- package/dist/cjs/tokens/atlassian-dark/elevation/shadow.js +1 -1
- package/dist/cjs/tokens/atlassian-dark/elevation/surface.js +8 -8
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/artifacts/generated-pairs.js +2 -6584
- package/dist/es2019/artifacts/palettes-raw/palette.js +87 -19
- package/dist/es2019/artifacts/theme-import-map.js +1 -3
- package/dist/es2019/artifacts/themes/atlassian-dark.js +39 -39
- package/dist/es2019/artifacts/themes/atlassian-light.js +3 -3
- package/dist/es2019/artifacts/token-default-values.js +3 -3
- package/dist/es2019/artifacts/tokens-raw/atlassian-dark.js +57 -57
- package/dist/es2019/artifacts/tokens-raw/atlassian-light.js +3 -3
- package/dist/es2019/entry-points/token-default-values.js +1 -0
- package/dist/es2019/get-token-value.js +1 -1
- package/dist/es2019/get-token.js +1 -1
- package/dist/es2019/palettes/palette.js +39 -9
- package/dist/es2019/set-global-theme.js +0 -18
- package/dist/es2019/theme-config.js +14 -14
- package/dist/es2019/tokens/atlassian-dark/color/background.js +5 -4
- package/dist/es2019/tokens/atlassian-dark/color/icon.js +2 -2
- package/dist/es2019/tokens/atlassian-dark/color/text.js +3 -3
- package/dist/es2019/tokens/atlassian-dark/elevation/shadow.js +1 -1
- package/dist/es2019/tokens/atlassian-dark/elevation/surface.js +8 -8
- package/dist/es2019/version.json +1 -1
- package/dist/esm/artifacts/generated-pairs.js +2 -6584
- package/dist/esm/artifacts/palettes-raw/palette.js +87 -19
- package/dist/esm/artifacts/theme-import-map.js +1 -5
- package/dist/esm/artifacts/themes/atlassian-dark.js +2 -2
- package/dist/esm/artifacts/themes/atlassian-light.js +2 -2
- package/dist/esm/artifacts/token-default-values.js +3 -3
- package/dist/esm/artifacts/tokens-raw/atlassian-dark.js +57 -57
- package/dist/esm/artifacts/tokens-raw/atlassian-light.js +3 -3
- package/dist/esm/entry-points/token-default-values.js +1 -0
- package/dist/esm/get-token-value.js +1 -1
- package/dist/esm/get-token.js +1 -1
- package/dist/esm/palettes/palette.js +39 -9
- package/dist/esm/set-global-theme.js +4 -36
- package/dist/esm/theme-config.js +14 -14
- package/dist/esm/tokens/atlassian-dark/color/background.js +5 -4
- package/dist/esm/tokens/atlassian-dark/color/icon.js +2 -2
- package/dist/esm/tokens/atlassian-dark/color/text.js +3 -3
- package/dist/esm/tokens/atlassian-dark/elevation/shadow.js +1 -1
- package/dist/esm/tokens/atlassian-dark/elevation/surface.js +8 -8
- package/dist/esm/version.json +1 -1
- package/dist/types/artifacts/generated-pairs.d.ts +9 -3
- package/dist/types/artifacts/palettes-raw/palette.d.ts +1 -1
- package/dist/types/artifacts/theme-import-map.d.ts +1 -1
- package/dist/types/artifacts/themes/atlassian-dark.d.ts +2 -2
- package/dist/types/artifacts/themes/atlassian-light.d.ts +2 -2
- package/dist/types/artifacts/token-default-values.d.ts +3 -3
- package/dist/types/artifacts/tokens-raw/atlassian-dark.d.ts +1 -1
- package/dist/types/artifacts/tokens-raw/atlassian-light.d.ts +1 -1
- package/dist/types/entry-points/token-default-values.d.ts +1 -0
- package/dist/types/palettes/palette.d.ts +1 -1
- package/dist/types/theme-config.d.ts +16 -36
- package/dist/types/tokens/atlassian-dark/utility/utility.d.ts +1 -1
- package/dist/types/tokens/atlassian-light/utility/utility.d.ts +1 -1
- package/dist/types/tokens/default/utility/utility.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/generated-pairs.d.ts +9 -3
- package/dist/types-ts4.5/artifacts/palettes-raw/palette.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/theme-import-map.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/themes/atlassian-dark.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 +3 -3
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark.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-default-values.d.ts +1 -0
- package/dist/types-ts4.5/palettes/palette.d.ts +1 -1
- package/dist/types-ts4.5/theme-config.d.ts +19 -36
- package/dist/types-ts4.5/tokens/atlassian-dark/utility/utility.d.ts +1 -1
- package/dist/types-ts4.5/tokens/atlassian-light/utility/utility.d.ts +1 -1
- package/dist/types-ts4.5/tokens/default/utility/utility.d.ts +1 -1
- package/figma/atlassian-dark-new-input-border.json +15 -0
- package/figma/atlassian-dark.json +38 -38
- package/figma/atlassian-light-new-input-border.json +15 -0
- package/figma/atlassian-light.json +2 -2
- package/package.json +5 -8
- package/report.api.md +18 -2
- package/tmp/api-report-tmp.d.ts +13 -2
- package/token-default-values/package.json +17 -0
- package/dist/cjs/tokens/atlassian-dark-iteration/color/accent.js +0 -70
- package/dist/cjs/tokens/atlassian-dark-iteration/color/background.js +0 -80
- package/dist/cjs/tokens/atlassian-dark-iteration/color/chart.js +0 -34
- package/dist/cjs/tokens/atlassian-dark-iteration/color/icon.js +0 -26
- package/dist/cjs/tokens/atlassian-dark-iteration/color/text.js +0 -29
- package/dist/cjs/tokens/atlassian-dark-iteration/elevation/shadow.js +0 -45
- package/dist/cjs/tokens/atlassian-dark-iteration/elevation/surface.js +0 -48
- package/dist/es2019/tokens/atlassian-dark-iteration/color/accent.js +0 -63
- package/dist/es2019/tokens/atlassian-dark-iteration/color/background.js +0 -73
- package/dist/es2019/tokens/atlassian-dark-iteration/color/chart.js +0 -27
- package/dist/es2019/tokens/atlassian-dark-iteration/color/icon.js +0 -19
- package/dist/es2019/tokens/atlassian-dark-iteration/color/text.js +0 -22
- package/dist/es2019/tokens/atlassian-dark-iteration/elevation/shadow.js +0 -38
- package/dist/es2019/tokens/atlassian-dark-iteration/elevation/surface.js +0 -41
- package/dist/esm/tokens/atlassian-dark-iteration/color/accent.js +0 -63
- package/dist/esm/tokens/atlassian-dark-iteration/color/background.js +0 -73
- package/dist/esm/tokens/atlassian-dark-iteration/color/chart.js +0 -27
- package/dist/esm/tokens/atlassian-dark-iteration/color/icon.js +0 -19
- package/dist/esm/tokens/atlassian-dark-iteration/color/text.js +0 -22
- package/dist/esm/tokens/atlassian-dark-iteration/elevation/shadow.js +0 -38
- package/dist/esm/tokens/atlassian-dark-iteration/elevation/surface.js +0 -41
- package/dist/types/tokens/atlassian-dark-iteration/color/accent.d.ts +0 -4
- package/dist/types/tokens/atlassian-dark-iteration/color/background.d.ts +0 -4
- package/dist/types/tokens/atlassian-dark-iteration/color/chart.d.ts +0 -4
- package/dist/types/tokens/atlassian-dark-iteration/color/icon.d.ts +0 -4
- package/dist/types/tokens/atlassian-dark-iteration/color/text.d.ts +0 -4
- package/dist/types/tokens/atlassian-dark-iteration/elevation/shadow.d.ts +0 -4
- package/dist/types/tokens/atlassian-dark-iteration/elevation/surface.d.ts +0 -4
- package/dist/types-ts4.5/tokens/atlassian-dark-iteration/color/accent.d.ts +0 -4
- package/dist/types-ts4.5/tokens/atlassian-dark-iteration/color/background.d.ts +0 -4
- package/dist/types-ts4.5/tokens/atlassian-dark-iteration/color/chart.d.ts +0 -4
- package/dist/types-ts4.5/tokens/atlassian-dark-iteration/color/icon.d.ts +0 -4
- package/dist/types-ts4.5/tokens/atlassian-dark-iteration/color/text.d.ts +0 -4
- package/dist/types-ts4.5/tokens/atlassian-dark-iteration/elevation/shadow.d.ts +0 -4
- package/dist/types-ts4.5/tokens/atlassian-dark-iteration/elevation/surface.d.ts +0 -4
|
@@ -139,29 +139,6 @@ var setGlobalTheme = /*#__PURE__*/function () {
|
|
|
139
139
|
};
|
|
140
140
|
}()));
|
|
141
141
|
case 4:
|
|
142
|
-
if (!themePreferences.includes('dark')) {
|
|
143
|
-
_context2.next = 13;
|
|
144
|
-
break;
|
|
145
|
-
}
|
|
146
|
-
if (!
|
|
147
|
-
// eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
|
|
148
|
-
(0, _platformFeatureFlags.getBooleanFF)('design-system-team.dark-theme-iteration_dk1ln')) {
|
|
149
|
-
_context2.next = 10;
|
|
150
|
-
break;
|
|
151
|
-
}
|
|
152
|
-
_context2.next = 8;
|
|
153
|
-
return (0, _themeLoading.loadAndAppendThemeCss)('dark-iteration');
|
|
154
|
-
case 8:
|
|
155
|
-
_context2.next = 13;
|
|
156
|
-
break;
|
|
157
|
-
case 10:
|
|
158
|
-
if (!(0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.dark-iteration-confluence_e2t22')) {
|
|
159
|
-
_context2.next = 13;
|
|
160
|
-
break;
|
|
161
|
-
}
|
|
162
|
-
_context2.next = 13;
|
|
163
|
-
return (0, _themeLoading.loadAndAppendThemeCss)('dark-iteration');
|
|
164
|
-
case 13:
|
|
165
142
|
if (colorMode === 'auto' && darkModeMql) {
|
|
166
143
|
colorMode = darkModeMql.matches ? 'dark' : 'light';
|
|
167
144
|
// Add an event listener for changes to the system theme.
|
|
@@ -188,7 +165,7 @@ var setGlobalTheme = /*#__PURE__*/function () {
|
|
|
188
165
|
document.documentElement.setAttribute(key, value);
|
|
189
166
|
});
|
|
190
167
|
return _context2.abrupt("return", unbindThemeChangeListener);
|
|
191
|
-
case
|
|
168
|
+
case 8:
|
|
192
169
|
case "end":
|
|
193
170
|
return _context2.stop();
|
|
194
171
|
}
|
|
@@ -243,16 +220,7 @@ var getThemeStyles = /*#__PURE__*/function () {
|
|
|
243
220
|
spacing: spacing,
|
|
244
221
|
typography: typography
|
|
245
222
|
});
|
|
246
|
-
|
|
247
|
-
if (
|
|
248
|
-
// eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
|
|
249
|
-
(0, _platformFeatureFlags.getBooleanFF)('design-system-team.dark-theme-iteration_dk1ln')) {
|
|
250
|
-
themePreferences.push('dark-iteration');
|
|
251
|
-
} else if ((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.dark-iteration-confluence_e2t22')) {
|
|
252
|
-
themePreferences.push('dark-iteration');
|
|
253
|
-
}
|
|
254
|
-
}
|
|
255
|
-
_context4.next = 5;
|
|
223
|
+
_context4.next = 4;
|
|
256
224
|
return Promise.all(themePreferences.map( /*#__PURE__*/function () {
|
|
257
225
|
var _ref8 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(themeId) {
|
|
258
226
|
var css;
|
|
@@ -285,12 +253,12 @@ var getThemeStyles = /*#__PURE__*/function () {
|
|
|
285
253
|
return _ref8.apply(this, arguments);
|
|
286
254
|
};
|
|
287
255
|
}()));
|
|
288
|
-
case
|
|
256
|
+
case 4:
|
|
289
257
|
results = _context4.sent;
|
|
290
258
|
return _context4.abrupt("return", results.filter(function (theme) {
|
|
291
259
|
return theme !== undefined;
|
|
292
260
|
}));
|
|
293
|
-
case
|
|
261
|
+
case 6:
|
|
294
262
|
case "end":
|
|
295
263
|
return _context4.stop();
|
|
296
264
|
}
|
package/dist/cjs/theme-config.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.themeOverrideIds = exports.themeIds = exports.themeColorModes = exports.default = void 0;
|
|
7
7
|
/**
|
|
8
8
|
* This file contains the source of truth for themes and all associated meta data.
|
|
9
9
|
*/
|
|
@@ -14,6 +14,13 @@ exports.themeOverrideConfig = exports.themeIds = exports.themeColorModes = expor
|
|
|
14
14
|
* style-dictionary will attempt to locate these in the file-system.
|
|
15
15
|
*/
|
|
16
16
|
|
|
17
|
+
/**
|
|
18
|
+
* ThemeOverrides: The internal identifier of a theme override. Which are themes that contain
|
|
19
|
+
* a subset of tokens intended to override an existing theme. These ids are what the actual
|
|
20
|
+
* theme files/folders are called. style-dictionary will attempt to locate these in the file-system.
|
|
21
|
+
* Theme overrides are temporary and there may not be any defined at times.
|
|
22
|
+
*/
|
|
23
|
+
|
|
17
24
|
/**
|
|
18
25
|
* Theme kinds: The type of theme.
|
|
19
26
|
* Some themes are entirely focused on Color, whilst others are purely focused on spacing.
|
|
@@ -35,6 +42,12 @@ exports.themeColorModes = themeColorModes;
|
|
|
35
42
|
* These ids must be kebab case
|
|
36
43
|
*/
|
|
37
44
|
var themeIds = ['light', 'dark', 'legacy-light', 'legacy-dark', 'spacing', 'typography', 'shape'];
|
|
45
|
+
exports.themeIds = themeIds;
|
|
46
|
+
/**
|
|
47
|
+
* Theme override ids: the equivalent of themeIds for theme overrides.
|
|
48
|
+
* Theme overrides are temporary and there may not be any defined at times.
|
|
49
|
+
*/
|
|
50
|
+
var themeOverrideIds = ['light-new-input-border', 'dark-new-input-border'];
|
|
38
51
|
|
|
39
52
|
/**
|
|
40
53
|
* Theme to use a base. This will create the theme as
|
|
@@ -52,7 +65,7 @@ var themeIds = ['light', 'dark', 'legacy-light', 'legacy-dark', 'spacing', 'typo
|
|
|
52
65
|
* ThemeConfig: the source of truth for all theme meta-data.
|
|
53
66
|
* This object should be used whenever interfacing with themes.
|
|
54
67
|
*/
|
|
55
|
-
exports.
|
|
68
|
+
exports.themeOverrideIds = themeOverrideIds;
|
|
56
69
|
var themeConfig = {
|
|
57
70
|
'atlassian-light': {
|
|
58
71
|
id: 'light',
|
|
@@ -113,24 +126,12 @@ var themeConfig = {
|
|
|
113
126
|
attributes: {
|
|
114
127
|
type: 'shape'
|
|
115
128
|
}
|
|
116
|
-
}
|
|
117
|
-
};
|
|
118
|
-
var themeOverrideConfig = {
|
|
119
|
-
'atlassian-dark-iteration': {
|
|
120
|
-
id: 'dark-iteration',
|
|
121
|
-
displayName: 'Dark Theme Iteration',
|
|
122
|
-
palette: 'defaultPalette',
|
|
123
|
-
overrideTheme: 'dark',
|
|
124
|
-
attributes: {
|
|
125
|
-
type: 'color',
|
|
126
|
-
mode: 'dark'
|
|
127
|
-
}
|
|
128
129
|
},
|
|
129
130
|
'atlassian-light-new-input-border': {
|
|
130
131
|
id: 'light-new-input-border',
|
|
131
132
|
displayName: 'Light Theme New Input Border',
|
|
132
133
|
palette: 'defaultPalette',
|
|
133
|
-
|
|
134
|
+
override: 'light',
|
|
134
135
|
attributes: {
|
|
135
136
|
type: 'color',
|
|
136
137
|
mode: 'light'
|
|
@@ -140,13 +141,12 @@ var themeOverrideConfig = {
|
|
|
140
141
|
id: 'dark-new-input-border',
|
|
141
142
|
displayName: 'Dark Theme New Input Border',
|
|
142
143
|
palette: 'defaultPalette',
|
|
143
|
-
|
|
144
|
+
override: 'dark',
|
|
144
145
|
attributes: {
|
|
145
146
|
type: 'color',
|
|
146
147
|
mode: 'dark'
|
|
147
148
|
}
|
|
148
149
|
}
|
|
149
150
|
};
|
|
150
|
-
exports.themeOverrideConfig = themeOverrideConfig;
|
|
151
151
|
var _default = themeConfig;
|
|
152
152
|
exports.default = _default;
|
|
@@ -7,8 +7,9 @@ exports.default = void 0;
|
|
|
7
7
|
var color = {
|
|
8
8
|
color: {
|
|
9
9
|
blanket: {
|
|
10
|
+
// @ts-ignore temporary value (DarkNeutral-100 60% opacity)
|
|
10
11
|
'[default]': {
|
|
11
|
-
value: '
|
|
12
|
+
value: '#10121499'
|
|
12
13
|
},
|
|
13
14
|
// @ts-ignore temporary value (Blue600 8% opacity)
|
|
14
15
|
selected: {
|
|
@@ -41,13 +42,13 @@ var color = {
|
|
|
41
42
|
},
|
|
42
43
|
input: {
|
|
43
44
|
'[default]': {
|
|
44
|
-
value: '
|
|
45
|
+
value: 'DarkNeutral200'
|
|
45
46
|
},
|
|
46
47
|
hovered: {
|
|
47
|
-
value: '
|
|
48
|
+
value: 'DarkNeutral250'
|
|
48
49
|
},
|
|
49
50
|
pressed: {
|
|
50
|
-
value: '
|
|
51
|
+
value: 'DarkNeutral200'
|
|
51
52
|
}
|
|
52
53
|
},
|
|
53
54
|
neutral: {
|
|
@@ -14,7 +14,7 @@ var color = {
|
|
|
14
14
|
value: 'DarkNeutral700'
|
|
15
15
|
},
|
|
16
16
|
inverse: {
|
|
17
|
-
value: '
|
|
17
|
+
value: 'DarkNeutral100'
|
|
18
18
|
},
|
|
19
19
|
disabled: {
|
|
20
20
|
value: 'DarkNeutral400A'
|
|
@@ -33,7 +33,7 @@ var color = {
|
|
|
33
33
|
value: 'Yellow500'
|
|
34
34
|
},
|
|
35
35
|
inverse: {
|
|
36
|
-
value: '
|
|
36
|
+
value: 'DarkNeutral100'
|
|
37
37
|
}
|
|
38
38
|
},
|
|
39
39
|
success: {
|
|
@@ -8,7 +8,7 @@ var color = {
|
|
|
8
8
|
color: {
|
|
9
9
|
text: {
|
|
10
10
|
'[default]': {
|
|
11
|
-
value: '
|
|
11
|
+
value: 'DarkNeutral900'
|
|
12
12
|
},
|
|
13
13
|
subtle: {
|
|
14
14
|
value: 'DarkNeutral800'
|
|
@@ -17,7 +17,7 @@ var color = {
|
|
|
17
17
|
value: 'DarkNeutral700'
|
|
18
18
|
},
|
|
19
19
|
inverse: {
|
|
20
|
-
value: '
|
|
20
|
+
value: 'DarkNeutral100'
|
|
21
21
|
},
|
|
22
22
|
disabled: {
|
|
23
23
|
value: 'DarkNeutral400A'
|
|
@@ -36,7 +36,7 @@ var color = {
|
|
|
36
36
|
value: 'Yellow300'
|
|
37
37
|
},
|
|
38
38
|
inverse: {
|
|
39
|
-
value: '
|
|
39
|
+
value: 'DarkNeutral100'
|
|
40
40
|
}
|
|
41
41
|
},
|
|
42
42
|
success: {
|
|
@@ -9,24 +9,24 @@ var elevation = {
|
|
|
9
9
|
surface: {
|
|
10
10
|
'[default]': {
|
|
11
11
|
'[default]': {
|
|
12
|
-
value: '
|
|
12
|
+
value: 'DarkNeutral100'
|
|
13
13
|
},
|
|
14
14
|
hovered: {
|
|
15
|
-
value: '
|
|
15
|
+
value: 'DarkNeutral200'
|
|
16
16
|
},
|
|
17
17
|
pressed: {
|
|
18
|
-
value: '
|
|
18
|
+
value: 'DarkNeutral250'
|
|
19
19
|
}
|
|
20
20
|
},
|
|
21
21
|
sunken: {
|
|
22
|
-
value: '
|
|
22
|
+
value: 'DarkNeutral0'
|
|
23
23
|
},
|
|
24
24
|
raised: {
|
|
25
25
|
'[default]': {
|
|
26
|
-
value: '
|
|
26
|
+
value: 'DarkNeutral200'
|
|
27
27
|
},
|
|
28
28
|
hovered: {
|
|
29
|
-
value: '
|
|
29
|
+
value: 'DarkNeutral250'
|
|
30
30
|
},
|
|
31
31
|
pressed: {
|
|
32
32
|
value: 'DarkNeutral300'
|
|
@@ -34,13 +34,13 @@ var elevation = {
|
|
|
34
34
|
},
|
|
35
35
|
overlay: {
|
|
36
36
|
'[default]': {
|
|
37
|
-
value: '
|
|
37
|
+
value: 'DarkNeutral250'
|
|
38
38
|
},
|
|
39
39
|
hovered: {
|
|
40
40
|
value: 'DarkNeutral300'
|
|
41
41
|
},
|
|
42
42
|
pressed: {
|
|
43
|
-
value: '
|
|
43
|
+
value: 'DarkNeutral350'
|
|
44
44
|
}
|
|
45
45
|
}
|
|
46
46
|
}
|