@atlaskit/tokens 0.1.1 → 0.4.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 +39 -0
- package/README.md +28 -0
- package/babel-plugin/package.json +7 -0
- package/css/atlassian-dark.css +89 -88
- package/css/atlassian-light.css +89 -88
- package/dist/cjs/artifacts/rename-mapping.js +23 -0
- package/dist/cjs/artifacts/token-default-values.js +105 -0
- package/dist/cjs/artifacts/token-names.js +101 -0
- package/dist/cjs/artifacts/tokens-raw/atlassian-dark.js +1786 -0
- package/dist/cjs/artifacts/tokens-raw/atlassian-light.js +1766 -0
- package/dist/cjs/artifacts/types.js +5 -0
- package/dist/cjs/babel-plugin/index.js +15 -0
- package/dist/cjs/babel-plugin/plugin.js +176 -0
- package/dist/cjs/entry-points/rename-mapping.js +1 -1
- package/dist/cjs/entry-points/token-names.js +1 -1
- package/dist/cjs/figma/synchronize-figma-tokens.js +43 -41
- package/dist/cjs/get-token.js +1 -1
- package/dist/cjs/tokens/atlassian-dark/utility/utility.js +3 -0
- package/dist/cjs/tokens/atlassian-light/utility/utility.js +3 -0
- package/dist/cjs/tokens/default/color/accent.js +26 -13
- package/dist/cjs/tokens/default/color/background.js +98 -49
- package/dist/cjs/tokens/default/color/border.js +4 -2
- package/dist/cjs/tokens/default/color/icon-border.js +10 -5
- package/dist/cjs/tokens/default/color/overlay.js +4 -2
- package/dist/cjs/tokens/default/color/text.js +28 -14
- package/dist/cjs/tokens/default/shadow/shadow.js +4 -2
- package/dist/cjs/tokens/default/utility/utility.js +10 -2
- package/dist/cjs/tokens/palette.js +145 -260
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/artifacts/rename-mapping.js +16 -0
- package/dist/es2019/artifacts/token-default-values.js +98 -0
- package/dist/es2019/artifacts/token-names.js +94 -0
- package/dist/es2019/artifacts/tokens-raw/atlassian-dark.js +1779 -0
- package/dist/es2019/artifacts/tokens-raw/atlassian-light.js +1759 -0
- package/dist/es2019/artifacts/types.js +1 -0
- package/dist/es2019/babel-plugin/index.js +1 -0
- package/dist/es2019/babel-plugin/plugin.js +151 -0
- package/dist/es2019/entry-points/rename-mapping.js +1 -1
- package/dist/es2019/entry-points/token-names.js +1 -1
- package/dist/es2019/figma/synchronize-figma-tokens.js +43 -41
- package/dist/es2019/get-token.js +1 -1
- package/dist/es2019/tokens/atlassian-dark/utility/utility.js +3 -0
- package/dist/es2019/tokens/atlassian-light/utility/utility.js +3 -0
- package/dist/es2019/tokens/default/color/accent.js +26 -13
- package/dist/es2019/tokens/default/color/background.js +103 -49
- package/dist/es2019/tokens/default/color/border.js +4 -2
- package/dist/es2019/tokens/default/color/icon-border.js +28 -5
- package/dist/es2019/tokens/default/color/overlay.js +4 -2
- package/dist/es2019/tokens/default/color/text.js +35 -14
- package/dist/es2019/tokens/default/shadow/shadow.js +12 -2
- package/dist/es2019/tokens/default/utility/utility.js +10 -2
- package/dist/es2019/tokens/palette.js +145 -260
- package/dist/es2019/version.json +1 -1
- package/dist/esm/artifacts/rename-mapping.js +16 -0
- package/dist/esm/artifacts/token-default-values.js +98 -0
- package/dist/esm/artifacts/token-names.js +94 -0
- package/dist/esm/artifacts/tokens-raw/atlassian-dark.js +1779 -0
- package/dist/esm/artifacts/tokens-raw/atlassian-light.js +1759 -0
- package/dist/esm/artifacts/types.js +1 -0
- package/dist/esm/babel-plugin/index.js +1 -0
- package/dist/esm/babel-plugin/plugin.js +158 -0
- package/dist/esm/entry-points/rename-mapping.js +1 -1
- package/dist/esm/entry-points/token-names.js +1 -1
- package/dist/esm/figma/synchronize-figma-tokens.js +43 -41
- package/dist/esm/get-token.js +1 -1
- package/dist/esm/tokens/atlassian-dark/utility/utility.js +3 -0
- package/dist/esm/tokens/atlassian-light/utility/utility.js +3 -0
- package/dist/esm/tokens/default/color/accent.js +26 -13
- package/dist/esm/tokens/default/color/background.js +98 -49
- package/dist/esm/tokens/default/color/border.js +4 -2
- package/dist/esm/tokens/default/color/icon-border.js +10 -5
- package/dist/esm/tokens/default/color/overlay.js +4 -2
- package/dist/esm/tokens/default/color/text.js +28 -14
- package/dist/esm/tokens/default/shadow/shadow.js +4 -2
- package/dist/esm/tokens/default/utility/utility.js +10 -2
- package/dist/esm/tokens/palette.js +145 -260
- package/dist/esm/version.json +1 -1
- package/dist/types/artifacts/rename-mapping.d.ts +17 -0
- package/dist/types/artifacts/token-default-values.d.ts +95 -0
- package/dist/types/artifacts/token-names.d.ts +184 -0
- package/dist/types/artifacts/tokens-raw/atlassian-dark.d.ts +80 -0
- package/dist/types/artifacts/tokens-raw/atlassian-light.d.ts +56 -0
- package/dist/types/artifacts/types.d.ts +4 -0
- package/dist/types/babel-plugin/index.d.ts +1 -0
- package/dist/types/babel-plugin/plugin.d.ts +14 -0
- package/dist/types/entry-points/babel-plugin.d.ts +1 -0
- package/dist/types/entry-points/rename-mapping.d.ts +1 -1
- package/dist/types/entry-points/token-names.d.ts +2 -2
- package/dist/types/get-token.d.ts +1 -1
- package/dist/types/index.d.ts +1 -1
- package/dist/types/tokens/atlassian-dark/utility/utility.d.ts +10 -2
- package/dist/types/tokens/atlassian-light/utility/utility.d.ts +10 -2
- package/dist/types/tokens/default/utility/utility.d.ts +138 -2
- package/dist/types/types.d.ts +49 -14
- package/package.json +17 -5
- package/tokens-browser-extension/README.md +28 -0
- package/tokens-browser-extension/atlassian-theme.css +375 -0
- package/tokens-browser-extension/background.js +75 -0
- package/tokens-browser-extension/content-script.js +75 -0
- package/tokens-browser-extension/devtools.html +1 -0
- package/tokens-browser-extension/devtools.js +14 -0
- package/tokens-browser-extension/manifest.json +36 -0
- package/tokens-browser-extension/messageback-script.js +10 -0
- package/tokens-browser-extension/messaging.js +36 -0
- package/tokens-browser-extension/panel.html +25 -0
- package/tokens-browser-extension/panel.js +46 -0
- package/tokens-browser-extension/toast.png +0 -0
- package/dist/cjs/tokens/rename-mapping.js +0 -29
- package/dist/cjs/tokens/token-names.js +0 -100
- package/dist/es2019/tokens/rename-mapping.js +0 -21
- package/dist/es2019/tokens/token-names.js +0 -93
- package/dist/esm/tokens/rename-mapping.js +0 -21
- package/dist/esm/tokens/token-names.js +0 -93
- package/dist/types/tokens/rename-mapping.d.ts +0 -24
- package/dist/types/tokens/token-names.d.ts +0 -182
package/dist/esm/version.json
CHANGED
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* This file is intended to help automate renaming of tokens.
|
|
3
|
+
*
|
|
4
|
+
* 1. Mark the old token's 'state' as deprecated
|
|
5
|
+
* 2. Add a 'rename' attribute to the token with the value 'my.new.token'
|
|
6
|
+
* 3. Create a new token matching the token above: 'my.new.token'
|
|
7
|
+
* 4. Run 'bolt build tokens' to have you changes reflected in this map
|
|
8
|
+
* 5. eslint and other tools will now use this to automate replacing tokens
|
|
9
|
+
*
|
|
10
|
+
* These changes will then be picked up by our tooling, which will attempt to
|
|
11
|
+
* migrate as many of these renames as possible
|
|
12
|
+
*/
|
|
13
|
+
import tokens from './token-names';
|
|
14
|
+
declare type Token = keyof typeof tokens | string;
|
|
15
|
+
declare type RenameMapper = Partial<Record<Token, Token>>;
|
|
16
|
+
declare const renameMapper: RenameMapper;
|
|
17
|
+
export default renameMapper;
|
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A map of token names to their value in the default Atlassian theme ('light')
|
|
3
|
+
*/
|
|
4
|
+
declare const defaultTokenValues: {
|
|
5
|
+
readonly 'color.accent.boldBlue': "#579DFF";
|
|
6
|
+
readonly 'color.accent.boldGreen': "#4BCE97";
|
|
7
|
+
readonly 'color.accent.boldOrange': "#FAA53D";
|
|
8
|
+
readonly 'color.accent.boldPurple': "#9F8FEF";
|
|
9
|
+
readonly 'color.accent.boldRed': "#F87462";
|
|
10
|
+
readonly 'color.accent.boldTeal': "#60C6D2";
|
|
11
|
+
readonly 'color.accent.subtleBlue': "#CCE0FF";
|
|
12
|
+
readonly 'color.accent.subtleGreen': "#BAF3DB";
|
|
13
|
+
readonly 'color.accent.subtleMagenta': "#FDD0EC";
|
|
14
|
+
readonly 'color.accent.subtleOrange': "#FFE2BD";
|
|
15
|
+
readonly 'color.accent.subtlePurple': "#DFD8FD";
|
|
16
|
+
readonly 'color.accent.subtleRed': "#FFD2CC";
|
|
17
|
+
readonly 'color.accent.subtleTeal': "#C1F0F5";
|
|
18
|
+
readonly 'color.background.sunken': "#091E4208";
|
|
19
|
+
readonly 'color.background.default': "#FFFFFF";
|
|
20
|
+
readonly 'color.background.card': "#FFFFFF";
|
|
21
|
+
readonly 'color.background.overlay': "#FFFFFF";
|
|
22
|
+
readonly 'color.background.selected.resting': "#E9F2FF";
|
|
23
|
+
readonly 'color.background.selected.hover': "#CCE0FF";
|
|
24
|
+
readonly 'color.background.selected.pressed': "#85B8FF";
|
|
25
|
+
readonly 'color.background.blanket': "#091E427A";
|
|
26
|
+
readonly 'color.background.disabled': "#091E420F";
|
|
27
|
+
readonly 'color.background.boldBrand.resting': "#0C66E4";
|
|
28
|
+
readonly 'color.background.boldBrand.hover': "#0055CC";
|
|
29
|
+
readonly 'color.background.boldBrand.pressed': "#09326C";
|
|
30
|
+
readonly 'color.background.subtleBrand.resting': "#E9F2FF";
|
|
31
|
+
readonly 'color.background.subtleBrand.hover': "#CCE0FF";
|
|
32
|
+
readonly 'color.background.subtleBrand.pressed': "#85B8FF";
|
|
33
|
+
readonly 'color.background.boldDanger.resting': "#CA3521";
|
|
34
|
+
readonly 'color.background.boldDanger.hover': "#AE2A19";
|
|
35
|
+
readonly 'color.background.boldDanger.pressed': "#601E16";
|
|
36
|
+
readonly 'color.background.subtleDanger.resting': "#FFEDEB";
|
|
37
|
+
readonly 'color.background.subtleDanger.hover': "#FFD2CC";
|
|
38
|
+
readonly 'color.background.subtleDanger.pressed': "#FF9C8F";
|
|
39
|
+
readonly 'color.background.boldWarning.resting': "#E2B203";
|
|
40
|
+
readonly 'color.background.boldWarning.hover': "#CF9F02";
|
|
41
|
+
readonly 'color.background.boldWarning.pressed': "#B38600";
|
|
42
|
+
readonly 'color.background.subtleWarning.resting': "#FFF7D6";
|
|
43
|
+
readonly 'color.background.subtleWarning.hover': "#F8E6A0";
|
|
44
|
+
readonly 'color.background.subtleWarning.pressed': "#F5CD47";
|
|
45
|
+
readonly 'color.background.boldSuccess.resting': "#1F845A";
|
|
46
|
+
readonly 'color.background.boldSuccess.hover': "#216E4E";
|
|
47
|
+
readonly 'color.background.boldSuccess.pressed': "#164B35";
|
|
48
|
+
readonly 'color.background.subtleSuccess.resting': "#DFFCF0";
|
|
49
|
+
readonly 'color.background.subtleSuccess.hover': "#BAF3DB";
|
|
50
|
+
readonly 'color.background.subtleSuccess.pressed': "#7EE2B8";
|
|
51
|
+
readonly 'color.background.boldDiscovery.resting': "#6E5DC6";
|
|
52
|
+
readonly 'color.background.boldDiscovery.hover': "#5E4DB2";
|
|
53
|
+
readonly 'color.background.boldDiscovery.pressed': "#352C63";
|
|
54
|
+
readonly 'color.background.subtleDiscovery.resting': "#F3F0FF";
|
|
55
|
+
readonly 'color.background.subtleDiscovery.hover': "#DFD8FD";
|
|
56
|
+
readonly 'color.background.subtleDiscovery.pressed': "#B8ACF6";
|
|
57
|
+
readonly 'color.background.boldNeutral.resting': "#44546F";
|
|
58
|
+
readonly 'color.background.boldNeutral.hover': "#2C3E5D";
|
|
59
|
+
readonly 'color.background.boldNeutral.pressed': "#172B4D";
|
|
60
|
+
readonly 'color.background.transparentNeutral.hover': "#091E420F";
|
|
61
|
+
readonly 'color.background.transparentNeutral.pressed': "#091E4224";
|
|
62
|
+
readonly 'color.background.subtleNeutral.resting': "#091E420F";
|
|
63
|
+
readonly 'color.background.subtleNeutral.hover': "#091E4224";
|
|
64
|
+
readonly 'color.background.subtleNeutral.pressed': "#091E424F";
|
|
65
|
+
readonly 'color.background.subtleBorderedNeutral.resting': "#091E4208";
|
|
66
|
+
readonly 'color.background.subtleBorderedNeutral.pressed': "#091E420F";
|
|
67
|
+
readonly 'color.border.focus': "#388BFF";
|
|
68
|
+
readonly 'color.border.neutral': "#091E4224";
|
|
69
|
+
readonly 'color.iconBorder.brand': "#1D7AFC";
|
|
70
|
+
readonly 'color.iconBorder.danger': "#E34935";
|
|
71
|
+
readonly 'color.iconBorder.warning': "#D97008";
|
|
72
|
+
readonly 'color.iconBorder.success': "#22A06B";
|
|
73
|
+
readonly 'color.iconBorder.discovery': "#8270DB";
|
|
74
|
+
readonly 'color.overlay.hover': "#091E424F";
|
|
75
|
+
readonly 'color.overlay.pressed': "#091E427A";
|
|
76
|
+
readonly 'color.text.selected': "#0C66E4";
|
|
77
|
+
readonly 'color.text.highEmphasis': "#172B4D";
|
|
78
|
+
readonly 'color.text.mediumEmphasis': "#44546F";
|
|
79
|
+
readonly 'color.text.lowEmphasis': "#626F86";
|
|
80
|
+
readonly 'color.text.onBold': "#FFFFFF";
|
|
81
|
+
readonly 'color.text.onBoldWarning': "#172B4D";
|
|
82
|
+
readonly 'color.text.link.resting': "#0C66E4";
|
|
83
|
+
readonly 'color.text.link.pressed': "#0055CC";
|
|
84
|
+
readonly 'color.text.brand': "#0055CC";
|
|
85
|
+
readonly 'color.text.warning': "#974F0C";
|
|
86
|
+
readonly 'color.text.danger': "#AE2A19";
|
|
87
|
+
readonly 'color.text.success': "#216E4E";
|
|
88
|
+
readonly 'color.text.discovery': "#5E4DB2";
|
|
89
|
+
readonly 'color.text.disabled': "#8993A5";
|
|
90
|
+
readonly 'shadow.card': "0px 1px 1px #091E4240, 0px 0px 1px #091E424F";
|
|
91
|
+
readonly 'shadow.overlay': "0px 8px 12px #091E4226, 0px 0px 1px #091E424F";
|
|
92
|
+
readonly 'utility.UNSAFE_util.transparent': "transparent";
|
|
93
|
+
readonly 'utility.UNSAFE_util.MISSING_TOKEN': "#FA11F2";
|
|
94
|
+
};
|
|
95
|
+
export default defaultTokenValues;
|
|
@@ -0,0 +1,184 @@
|
|
|
1
|
+
declare const tokens: {
|
|
2
|
+
readonly 'color.accent.boldBlue': "--ds-accent-boldBlue";
|
|
3
|
+
readonly 'color.accent.boldGreen': "--ds-accent-boldGreen";
|
|
4
|
+
readonly 'color.accent.boldOrange': "--ds-accent-boldOrange";
|
|
5
|
+
readonly 'color.accent.boldPurple': "--ds-accent-boldPurple";
|
|
6
|
+
readonly 'color.accent.boldRed': "--ds-accent-boldRed";
|
|
7
|
+
readonly 'color.accent.boldTeal': "--ds-accent-boldTeal";
|
|
8
|
+
readonly 'color.accent.subtleBlue': "--ds-accent-subtleBlue";
|
|
9
|
+
readonly 'color.accent.subtleGreen': "--ds-accent-subtleGreen";
|
|
10
|
+
readonly 'color.accent.subtleMagenta': "--ds-accent-subtleMagenta";
|
|
11
|
+
readonly 'color.accent.subtleOrange': "--ds-accent-subtleOrange";
|
|
12
|
+
readonly 'color.accent.subtlePurple': "--ds-accent-subtlePurple";
|
|
13
|
+
readonly 'color.accent.subtleRed': "--ds-accent-subtleRed";
|
|
14
|
+
readonly 'color.accent.subtleTeal': "--ds-accent-subtleTeal";
|
|
15
|
+
readonly 'color.background.sunken': "--ds-background-sunken";
|
|
16
|
+
readonly 'color.background.default': "--ds-background-default";
|
|
17
|
+
readonly 'color.background.card': "--ds-background-card";
|
|
18
|
+
readonly 'color.background.overlay': "--ds-background-overlay";
|
|
19
|
+
readonly 'color.background.selected.resting': "--ds-background-selected-resting";
|
|
20
|
+
readonly 'color.background.selected.hover': "--ds-background-selected-hover";
|
|
21
|
+
readonly 'color.background.selected.pressed': "--ds-background-selected-pressed";
|
|
22
|
+
readonly 'color.background.blanket': "--ds-background-blanket";
|
|
23
|
+
readonly 'color.background.disabled': "--ds-background-disabled";
|
|
24
|
+
readonly 'color.background.boldBrand.resting': "--ds-background-boldBrand-resting";
|
|
25
|
+
readonly 'color.background.boldBrand.hover': "--ds-background-boldBrand-hover";
|
|
26
|
+
readonly 'color.background.boldBrand.pressed': "--ds-background-boldBrand-pressed";
|
|
27
|
+
readonly 'color.background.subtleBrand.resting': "--ds-background-subtleBrand-resting";
|
|
28
|
+
readonly 'color.background.subtleBrand.hover': "--ds-background-subtleBrand-hover";
|
|
29
|
+
readonly 'color.background.subtleBrand.pressed': "--ds-background-subtleBrand-pressed";
|
|
30
|
+
readonly 'color.background.boldDanger.resting': "--ds-background-boldDanger-resting";
|
|
31
|
+
readonly 'color.background.boldDanger.hover': "--ds-background-boldDanger-hover";
|
|
32
|
+
readonly 'color.background.boldDanger.pressed': "--ds-background-boldDanger-pressed";
|
|
33
|
+
readonly 'color.background.subtleDanger.resting': "--ds-background-subtleDanger-resting";
|
|
34
|
+
readonly 'color.background.subtleDanger.hover': "--ds-background-subtleDanger-hover";
|
|
35
|
+
readonly 'color.background.subtleDanger.pressed': "--ds-background-subtleDanger-pressed";
|
|
36
|
+
readonly 'color.background.boldWarning.resting': "--ds-background-boldWarning-resting";
|
|
37
|
+
readonly 'color.background.boldWarning.hover': "--ds-background-boldWarning-hover";
|
|
38
|
+
readonly 'color.background.boldWarning.pressed': "--ds-background-boldWarning-pressed";
|
|
39
|
+
readonly 'color.background.subtleWarning.resting': "--ds-background-subtleWarning-resting";
|
|
40
|
+
readonly 'color.background.subtleWarning.hover': "--ds-background-subtleWarning-hover";
|
|
41
|
+
readonly 'color.background.subtleWarning.pressed': "--ds-background-subtleWarning-pressed";
|
|
42
|
+
readonly 'color.background.boldSuccess.resting': "--ds-background-boldSuccess-resting";
|
|
43
|
+
readonly 'color.background.boldSuccess.hover': "--ds-background-boldSuccess-hover";
|
|
44
|
+
readonly 'color.background.boldSuccess.pressed': "--ds-background-boldSuccess-pressed";
|
|
45
|
+
readonly 'color.background.subtleSuccess.resting': "--ds-background-subtleSuccess-resting";
|
|
46
|
+
readonly 'color.background.subtleSuccess.hover': "--ds-background-subtleSuccess-hover";
|
|
47
|
+
readonly 'color.background.subtleSuccess.pressed': "--ds-background-subtleSuccess-pressed";
|
|
48
|
+
readonly 'color.background.boldDiscovery.resting': "--ds-background-boldDiscovery-resting";
|
|
49
|
+
readonly 'color.background.boldDiscovery.hover': "--ds-background-boldDiscovery-hover";
|
|
50
|
+
readonly 'color.background.boldDiscovery.pressed': "--ds-background-boldDiscovery-pressed";
|
|
51
|
+
readonly 'color.background.subtleDiscovery.resting': "--ds-background-subtleDiscovery-resting";
|
|
52
|
+
readonly 'color.background.subtleDiscovery.hover': "--ds-background-subtleDiscovery-hover";
|
|
53
|
+
readonly 'color.background.subtleDiscovery.pressed': "--ds-background-subtleDiscovery-pressed";
|
|
54
|
+
readonly 'color.background.boldNeutral.resting': "--ds-background-boldNeutral-resting";
|
|
55
|
+
readonly 'color.background.boldNeutral.hover': "--ds-background-boldNeutral-hover";
|
|
56
|
+
readonly 'color.background.boldNeutral.pressed': "--ds-background-boldNeutral-pressed";
|
|
57
|
+
readonly 'color.background.transparentNeutral.hover': "--ds-background-transparentNeutral-hover";
|
|
58
|
+
readonly 'color.background.transparentNeutral.pressed': "--ds-background-transparentNeutral-pressed";
|
|
59
|
+
readonly 'color.background.subtleNeutral.resting': "--ds-background-subtleNeutral-resting";
|
|
60
|
+
readonly 'color.background.subtleNeutral.hover': "--ds-background-subtleNeutral-hover";
|
|
61
|
+
readonly 'color.background.subtleNeutral.pressed': "--ds-background-subtleNeutral-pressed";
|
|
62
|
+
readonly 'color.background.subtleBorderedNeutral.resting': "--ds-background-subtleBorderedNeutral-resting";
|
|
63
|
+
readonly 'color.background.subtleBorderedNeutral.pressed': "--ds-background-subtleBorderedNeutral-pressed";
|
|
64
|
+
readonly 'color.border.focus': "--ds-border-focus";
|
|
65
|
+
readonly 'color.border.neutral': "--ds-border-neutral";
|
|
66
|
+
readonly 'color.iconBorder.brand': "--ds-iconBorder-brand";
|
|
67
|
+
readonly 'color.iconBorder.danger': "--ds-iconBorder-danger";
|
|
68
|
+
readonly 'color.iconBorder.warning': "--ds-iconBorder-warning";
|
|
69
|
+
readonly 'color.iconBorder.success': "--ds-iconBorder-success";
|
|
70
|
+
readonly 'color.iconBorder.discovery': "--ds-iconBorder-discovery";
|
|
71
|
+
readonly 'color.overlay.hover': "--ds-overlay-hover";
|
|
72
|
+
readonly 'color.overlay.pressed': "--ds-overlay-pressed";
|
|
73
|
+
readonly 'color.text.selected': "--ds-text-selected";
|
|
74
|
+
readonly 'color.text.highEmphasis': "--ds-text-highEmphasis";
|
|
75
|
+
readonly 'color.text.mediumEmphasis': "--ds-text-mediumEmphasis";
|
|
76
|
+
readonly 'color.text.lowEmphasis': "--ds-text-lowEmphasis";
|
|
77
|
+
readonly 'color.text.onBold': "--ds-text-onBold";
|
|
78
|
+
readonly 'color.text.onBoldWarning': "--ds-text-onBoldWarning";
|
|
79
|
+
readonly 'color.text.link.resting': "--ds-text-link-resting";
|
|
80
|
+
readonly 'color.text.link.pressed': "--ds-text-link-pressed";
|
|
81
|
+
readonly 'color.text.brand': "--ds-text-brand";
|
|
82
|
+
readonly 'color.text.warning': "--ds-text-warning";
|
|
83
|
+
readonly 'color.text.danger': "--ds-text-danger";
|
|
84
|
+
readonly 'color.text.success': "--ds-text-success";
|
|
85
|
+
readonly 'color.text.discovery': "--ds-text-discovery";
|
|
86
|
+
readonly 'color.text.disabled': "--ds-text-disabled";
|
|
87
|
+
readonly 'shadow.card': "--ds-card";
|
|
88
|
+
readonly 'shadow.overlay': "--ds-overlay";
|
|
89
|
+
readonly 'utility.UNSAFE_util.transparent': "--ds-UNSAFE_util-transparent";
|
|
90
|
+
readonly 'utility.UNSAFE_util.MISSING_TOKEN': "--ds-UNSAFE_util-MISSING_TOKEN";
|
|
91
|
+
};
|
|
92
|
+
export declare type CSSTokenMap = {
|
|
93
|
+
'color.accent.boldBlue': 'var(--ds-accent-boldBlue)';
|
|
94
|
+
'color.accent.boldGreen': 'var(--ds-accent-boldGreen)';
|
|
95
|
+
'color.accent.boldOrange': 'var(--ds-accent-boldOrange)';
|
|
96
|
+
'color.accent.boldPurple': 'var(--ds-accent-boldPurple)';
|
|
97
|
+
'color.accent.boldRed': 'var(--ds-accent-boldRed)';
|
|
98
|
+
'color.accent.boldTeal': 'var(--ds-accent-boldTeal)';
|
|
99
|
+
'color.accent.subtleBlue': 'var(--ds-accent-subtleBlue)';
|
|
100
|
+
'color.accent.subtleGreen': 'var(--ds-accent-subtleGreen)';
|
|
101
|
+
'color.accent.subtleMagenta': 'var(--ds-accent-subtleMagenta)';
|
|
102
|
+
'color.accent.subtleOrange': 'var(--ds-accent-subtleOrange)';
|
|
103
|
+
'color.accent.subtlePurple': 'var(--ds-accent-subtlePurple)';
|
|
104
|
+
'color.accent.subtleRed': 'var(--ds-accent-subtleRed)';
|
|
105
|
+
'color.accent.subtleTeal': 'var(--ds-accent-subtleTeal)';
|
|
106
|
+
'color.background.sunken': 'var(--ds-background-sunken)';
|
|
107
|
+
'color.background.default': 'var(--ds-background-default)';
|
|
108
|
+
'color.background.card': 'var(--ds-background-card)';
|
|
109
|
+
'color.background.overlay': 'var(--ds-background-overlay)';
|
|
110
|
+
'color.background.selected.resting': 'var(--ds-background-selected-resting)';
|
|
111
|
+
'color.background.selected.hover': 'var(--ds-background-selected-hover)';
|
|
112
|
+
'color.background.selected.pressed': 'var(--ds-background-selected-pressed)';
|
|
113
|
+
'color.background.blanket': 'var(--ds-background-blanket)';
|
|
114
|
+
'color.background.disabled': 'var(--ds-background-disabled)';
|
|
115
|
+
'color.background.boldBrand.resting': 'var(--ds-background-boldBrand-resting)';
|
|
116
|
+
'color.background.boldBrand.hover': 'var(--ds-background-boldBrand-hover)';
|
|
117
|
+
'color.background.boldBrand.pressed': 'var(--ds-background-boldBrand-pressed)';
|
|
118
|
+
'color.background.subtleBrand.resting': 'var(--ds-background-subtleBrand-resting)';
|
|
119
|
+
'color.background.subtleBrand.hover': 'var(--ds-background-subtleBrand-hover)';
|
|
120
|
+
'color.background.subtleBrand.pressed': 'var(--ds-background-subtleBrand-pressed)';
|
|
121
|
+
'color.background.boldDanger.resting': 'var(--ds-background-boldDanger-resting)';
|
|
122
|
+
'color.background.boldDanger.hover': 'var(--ds-background-boldDanger-hover)';
|
|
123
|
+
'color.background.boldDanger.pressed': 'var(--ds-background-boldDanger-pressed)';
|
|
124
|
+
'color.background.subtleDanger.resting': 'var(--ds-background-subtleDanger-resting)';
|
|
125
|
+
'color.background.subtleDanger.hover': 'var(--ds-background-subtleDanger-hover)';
|
|
126
|
+
'color.background.subtleDanger.pressed': 'var(--ds-background-subtleDanger-pressed)';
|
|
127
|
+
'color.background.boldWarning.resting': 'var(--ds-background-boldWarning-resting)';
|
|
128
|
+
'color.background.boldWarning.hover': 'var(--ds-background-boldWarning-hover)';
|
|
129
|
+
'color.background.boldWarning.pressed': 'var(--ds-background-boldWarning-pressed)';
|
|
130
|
+
'color.background.subtleWarning.resting': 'var(--ds-background-subtleWarning-resting)';
|
|
131
|
+
'color.background.subtleWarning.hover': 'var(--ds-background-subtleWarning-hover)';
|
|
132
|
+
'color.background.subtleWarning.pressed': 'var(--ds-background-subtleWarning-pressed)';
|
|
133
|
+
'color.background.boldSuccess.resting': 'var(--ds-background-boldSuccess-resting)';
|
|
134
|
+
'color.background.boldSuccess.hover': 'var(--ds-background-boldSuccess-hover)';
|
|
135
|
+
'color.background.boldSuccess.pressed': 'var(--ds-background-boldSuccess-pressed)';
|
|
136
|
+
'color.background.subtleSuccess.resting': 'var(--ds-background-subtleSuccess-resting)';
|
|
137
|
+
'color.background.subtleSuccess.hover': 'var(--ds-background-subtleSuccess-hover)';
|
|
138
|
+
'color.background.subtleSuccess.pressed': 'var(--ds-background-subtleSuccess-pressed)';
|
|
139
|
+
'color.background.boldDiscovery.resting': 'var(--ds-background-boldDiscovery-resting)';
|
|
140
|
+
'color.background.boldDiscovery.hover': 'var(--ds-background-boldDiscovery-hover)';
|
|
141
|
+
'color.background.boldDiscovery.pressed': 'var(--ds-background-boldDiscovery-pressed)';
|
|
142
|
+
'color.background.subtleDiscovery.resting': 'var(--ds-background-subtleDiscovery-resting)';
|
|
143
|
+
'color.background.subtleDiscovery.hover': 'var(--ds-background-subtleDiscovery-hover)';
|
|
144
|
+
'color.background.subtleDiscovery.pressed': 'var(--ds-background-subtleDiscovery-pressed)';
|
|
145
|
+
'color.background.boldNeutral.resting': 'var(--ds-background-boldNeutral-resting)';
|
|
146
|
+
'color.background.boldNeutral.hover': 'var(--ds-background-boldNeutral-hover)';
|
|
147
|
+
'color.background.boldNeutral.pressed': 'var(--ds-background-boldNeutral-pressed)';
|
|
148
|
+
'color.background.transparentNeutral.hover': 'var(--ds-background-transparentNeutral-hover)';
|
|
149
|
+
'color.background.transparentNeutral.pressed': 'var(--ds-background-transparentNeutral-pressed)';
|
|
150
|
+
'color.background.subtleNeutral.resting': 'var(--ds-background-subtleNeutral-resting)';
|
|
151
|
+
'color.background.subtleNeutral.hover': 'var(--ds-background-subtleNeutral-hover)';
|
|
152
|
+
'color.background.subtleNeutral.pressed': 'var(--ds-background-subtleNeutral-pressed)';
|
|
153
|
+
'color.background.subtleBorderedNeutral.resting': 'var(--ds-background-subtleBorderedNeutral-resting)';
|
|
154
|
+
'color.background.subtleBorderedNeutral.pressed': 'var(--ds-background-subtleBorderedNeutral-pressed)';
|
|
155
|
+
'color.border.focus': 'var(--ds-border-focus)';
|
|
156
|
+
'color.border.neutral': 'var(--ds-border-neutral)';
|
|
157
|
+
'color.iconBorder.brand': 'var(--ds-iconBorder-brand)';
|
|
158
|
+
'color.iconBorder.danger': 'var(--ds-iconBorder-danger)';
|
|
159
|
+
'color.iconBorder.warning': 'var(--ds-iconBorder-warning)';
|
|
160
|
+
'color.iconBorder.success': 'var(--ds-iconBorder-success)';
|
|
161
|
+
'color.iconBorder.discovery': 'var(--ds-iconBorder-discovery)';
|
|
162
|
+
'color.overlay.hover': 'var(--ds-overlay-hover)';
|
|
163
|
+
'color.overlay.pressed': 'var(--ds-overlay-pressed)';
|
|
164
|
+
'color.text.selected': 'var(--ds-text-selected)';
|
|
165
|
+
'color.text.highEmphasis': 'var(--ds-text-highEmphasis)';
|
|
166
|
+
'color.text.mediumEmphasis': 'var(--ds-text-mediumEmphasis)';
|
|
167
|
+
'color.text.lowEmphasis': 'var(--ds-text-lowEmphasis)';
|
|
168
|
+
'color.text.onBold': 'var(--ds-text-onBold)';
|
|
169
|
+
'color.text.onBoldWarning': 'var(--ds-text-onBoldWarning)';
|
|
170
|
+
'color.text.link.resting': 'var(--ds-text-link-resting)';
|
|
171
|
+
'color.text.link.pressed': 'var(--ds-text-link-pressed)';
|
|
172
|
+
'color.text.brand': 'var(--ds-text-brand)';
|
|
173
|
+
'color.text.warning': 'var(--ds-text-warning)';
|
|
174
|
+
'color.text.danger': 'var(--ds-text-danger)';
|
|
175
|
+
'color.text.success': 'var(--ds-text-success)';
|
|
176
|
+
'color.text.discovery': 'var(--ds-text-discovery)';
|
|
177
|
+
'color.text.disabled': 'var(--ds-text-disabled)';
|
|
178
|
+
'shadow.card': 'var(--ds-card)';
|
|
179
|
+
'shadow.overlay': 'var(--ds-overlay)';
|
|
180
|
+
'utility.UNSAFE_util.transparent': 'var(--ds-UNSAFE_util-transparent)';
|
|
181
|
+
'utility.UNSAFE_util.MISSING_TOKEN': 'var(--ds-UNSAFE_util-MISSING_TOKEN)';
|
|
182
|
+
};
|
|
183
|
+
export declare type CSSToken = CSSTokenMap[keyof CSSTokenMap];
|
|
184
|
+
export default tokens;
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
declare const tokens: ({
|
|
2
|
+
attributes: {
|
|
3
|
+
group: string;
|
|
4
|
+
state: string;
|
|
5
|
+
description: string;
|
|
6
|
+
};
|
|
7
|
+
value: string;
|
|
8
|
+
filePath: string;
|
|
9
|
+
isSource: boolean;
|
|
10
|
+
original: {
|
|
11
|
+
attributes: {
|
|
12
|
+
group: string;
|
|
13
|
+
state: string;
|
|
14
|
+
description: string;
|
|
15
|
+
};
|
|
16
|
+
value: string;
|
|
17
|
+
};
|
|
18
|
+
name: string;
|
|
19
|
+
path: string[];
|
|
20
|
+
} | {
|
|
21
|
+
attributes: {
|
|
22
|
+
group: string;
|
|
23
|
+
state: string;
|
|
24
|
+
description: string;
|
|
25
|
+
};
|
|
26
|
+
value: ({
|
|
27
|
+
radius: number;
|
|
28
|
+
spread: number;
|
|
29
|
+
color: string;
|
|
30
|
+
offset: {
|
|
31
|
+
x: number;
|
|
32
|
+
y: number;
|
|
33
|
+
};
|
|
34
|
+
opacity: number;
|
|
35
|
+
inset: boolean;
|
|
36
|
+
} | {
|
|
37
|
+
radius: number;
|
|
38
|
+
offset: {
|
|
39
|
+
x: number;
|
|
40
|
+
y: number;
|
|
41
|
+
};
|
|
42
|
+
color: string;
|
|
43
|
+
opacity: number;
|
|
44
|
+
spread?: undefined;
|
|
45
|
+
inset?: undefined;
|
|
46
|
+
})[];
|
|
47
|
+
filePath: string;
|
|
48
|
+
isSource: boolean;
|
|
49
|
+
original: {
|
|
50
|
+
attributes: {
|
|
51
|
+
group: string;
|
|
52
|
+
state: string;
|
|
53
|
+
description: string;
|
|
54
|
+
};
|
|
55
|
+
value: ({
|
|
56
|
+
radius: number;
|
|
57
|
+
spread: number;
|
|
58
|
+
color: string;
|
|
59
|
+
offset: {
|
|
60
|
+
x: number;
|
|
61
|
+
y: number;
|
|
62
|
+
};
|
|
63
|
+
opacity: number;
|
|
64
|
+
inset: boolean;
|
|
65
|
+
} | {
|
|
66
|
+
radius: number;
|
|
67
|
+
offset: {
|
|
68
|
+
x: number;
|
|
69
|
+
y: number;
|
|
70
|
+
};
|
|
71
|
+
color: string;
|
|
72
|
+
opacity: number;
|
|
73
|
+
spread?: undefined;
|
|
74
|
+
inset?: undefined;
|
|
75
|
+
})[];
|
|
76
|
+
};
|
|
77
|
+
name: string;
|
|
78
|
+
path: string[];
|
|
79
|
+
})[];
|
|
80
|
+
export default tokens;
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
declare const tokens: ({
|
|
2
|
+
attributes: {
|
|
3
|
+
group: string;
|
|
4
|
+
state: string;
|
|
5
|
+
description: string;
|
|
6
|
+
};
|
|
7
|
+
value: string;
|
|
8
|
+
filePath: string;
|
|
9
|
+
isSource: boolean;
|
|
10
|
+
original: {
|
|
11
|
+
attributes: {
|
|
12
|
+
group: string;
|
|
13
|
+
state: string;
|
|
14
|
+
description: string;
|
|
15
|
+
};
|
|
16
|
+
value: string;
|
|
17
|
+
};
|
|
18
|
+
name: string;
|
|
19
|
+
path: string[];
|
|
20
|
+
} | {
|
|
21
|
+
attributes: {
|
|
22
|
+
group: string;
|
|
23
|
+
state: string;
|
|
24
|
+
description: string;
|
|
25
|
+
};
|
|
26
|
+
value: {
|
|
27
|
+
radius: number;
|
|
28
|
+
offset: {
|
|
29
|
+
x: number;
|
|
30
|
+
y: number;
|
|
31
|
+
};
|
|
32
|
+
color: string;
|
|
33
|
+
opacity: number;
|
|
34
|
+
}[];
|
|
35
|
+
filePath: string;
|
|
36
|
+
isSource: boolean;
|
|
37
|
+
original: {
|
|
38
|
+
attributes: {
|
|
39
|
+
group: string;
|
|
40
|
+
state: string;
|
|
41
|
+
description: string;
|
|
42
|
+
};
|
|
43
|
+
value: {
|
|
44
|
+
radius: number;
|
|
45
|
+
offset: {
|
|
46
|
+
x: number;
|
|
47
|
+
y: number;
|
|
48
|
+
};
|
|
49
|
+
color: string;
|
|
50
|
+
opacity: number;
|
|
51
|
+
}[];
|
|
52
|
+
};
|
|
53
|
+
name: string;
|
|
54
|
+
path: string[];
|
|
55
|
+
})[];
|
|
56
|
+
export default tokens;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Type representing the currently active tokens
|
|
3
|
+
*/
|
|
4
|
+
export declare type ActiveTokens = 'color.accent.boldBlue' | 'color.accent.boldGreen' | 'color.accent.boldOrange' | 'color.accent.boldPurple' | 'color.accent.boldRed' | 'color.accent.boldTeal' | 'color.accent.subtleBlue' | 'color.accent.subtleGreen' | 'color.accent.subtleMagenta' | 'color.accent.subtleOrange' | 'color.accent.subtlePurple' | 'color.accent.subtleRed' | 'color.accent.subtleTeal' | 'color.background.sunken' | 'color.background.default' | 'color.background.card' | 'color.background.overlay' | 'color.background.selected.resting' | 'color.background.selected.hover' | 'color.background.selected.pressed' | 'color.background.blanket' | 'color.background.disabled' | 'color.background.boldBrand.resting' | 'color.background.boldBrand.hover' | 'color.background.boldBrand.pressed' | 'color.background.subtleBrand.resting' | 'color.background.subtleBrand.hover' | 'color.background.subtleBrand.pressed' | 'color.background.boldDanger.resting' | 'color.background.boldDanger.hover' | 'color.background.boldDanger.pressed' | 'color.background.subtleDanger.resting' | 'color.background.subtleDanger.hover' | 'color.background.subtleDanger.pressed' | 'color.background.boldWarning.resting' | 'color.background.boldWarning.hover' | 'color.background.boldWarning.pressed' | 'color.background.subtleWarning.resting' | 'color.background.subtleWarning.hover' | 'color.background.subtleWarning.pressed' | 'color.background.boldSuccess.resting' | 'color.background.boldSuccess.hover' | 'color.background.boldSuccess.pressed' | 'color.background.subtleSuccess.resting' | 'color.background.subtleSuccess.hover' | 'color.background.subtleSuccess.pressed' | 'color.background.boldDiscovery.resting' | 'color.background.boldDiscovery.hover' | 'color.background.boldDiscovery.pressed' | 'color.background.subtleDiscovery.resting' | 'color.background.subtleDiscovery.hover' | 'color.background.subtleDiscovery.pressed' | 'color.background.boldNeutral.resting' | 'color.background.boldNeutral.hover' | 'color.background.boldNeutral.pressed' | 'color.background.transparentNeutral.hover' | 'color.background.transparentNeutral.pressed' | 'color.background.subtleNeutral.resting' | 'color.background.subtleNeutral.hover' | 'color.background.subtleNeutral.pressed' | 'color.background.subtleBorderedNeutral.resting' | 'color.background.subtleBorderedNeutral.pressed' | 'color.border.focus' | 'color.border.neutral' | 'color.iconBorder.brand' | 'color.iconBorder.danger' | 'color.iconBorder.warning' | 'color.iconBorder.success' | 'color.iconBorder.discovery' | 'color.overlay.hover' | 'color.overlay.pressed' | 'color.text.selected' | 'color.text.highEmphasis' | 'color.text.mediumEmphasis' | 'color.text.lowEmphasis' | 'color.text.onBold' | 'color.text.onBoldWarning' | 'color.text.link.resting' | 'color.text.link.pressed' | 'color.text.brand' | 'color.text.warning' | 'color.text.danger' | 'color.text.success' | 'color.text.discovery' | 'color.text.disabled' | 'shadow.card' | 'shadow.overlay' | 'utility.UNSAFE_util.transparent' | 'utility.UNSAFE_util.MISSING_TOKEN';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './plugin';
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { NodePath } from '@babel/traverse';
|
|
2
|
+
import * as t from '@babel/types';
|
|
3
|
+
export default function plugin(): {
|
|
4
|
+
visitor: {
|
|
5
|
+
CallExpression(path: NodePath<t.CallExpression>, state: {
|
|
6
|
+
opts: {
|
|
7
|
+
shouldUseAutoFallback?: boolean;
|
|
8
|
+
};
|
|
9
|
+
}): void;
|
|
10
|
+
Program: {
|
|
11
|
+
exit(path: NodePath<t.Program>): void;
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from '../babel-plugin/plugin';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { default } from '../
|
|
1
|
+
export { default } from '../artifacts/rename-mapping';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { default } from '../
|
|
2
|
-
export type { CSSToken } from '../
|
|
1
|
+
export { default } from '../artifacts/token-names';
|
|
2
|
+
export type { CSSToken } from '../artifacts/token-names';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import tokens, { CSSTokenMap } from './
|
|
1
|
+
import tokens, { CSSTokenMap } from './artifacts/token-names';
|
|
2
2
|
declare type tokenSchema = typeof tokens;
|
|
3
3
|
declare function token<T extends keyof tokenSchema>(path: T, fallback?: string): CSSTokenMap[T];
|
|
4
4
|
export default token;
|
package/dist/types/index.d.ts
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
|
-
import type { UtilTokenSchema, ValueSchema } from '../../../types';
|
|
2
1
|
declare const _default: {
|
|
3
|
-
utility:
|
|
2
|
+
utility: Pick<{
|
|
3
|
+
UNSAFE_util: {
|
|
4
|
+
transparent: {
|
|
5
|
+
value: string;
|
|
6
|
+
};
|
|
7
|
+
MISSING_TOKEN: {
|
|
8
|
+
value: string;
|
|
9
|
+
};
|
|
10
|
+
};
|
|
11
|
+
}, "UNSAFE_util">;
|
|
4
12
|
};
|
|
5
13
|
export default _default;
|
|
@@ -1,5 +1,13 @@
|
|
|
1
|
-
import type { UtilTokenSchema, ValueSchema } from '../../../types';
|
|
2
1
|
declare const _default: {
|
|
3
|
-
utility:
|
|
2
|
+
utility: Pick<{
|
|
3
|
+
UNSAFE_util: {
|
|
4
|
+
transparent: {
|
|
5
|
+
value: string;
|
|
6
|
+
};
|
|
7
|
+
MISSING_TOKEN: {
|
|
8
|
+
value: string;
|
|
9
|
+
};
|
|
10
|
+
};
|
|
11
|
+
}, "UNSAFE_util">;
|
|
4
12
|
};
|
|
5
13
|
export default _default;
|