polaris_tokens 2.16.0 → 2.21.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +7 -7
- data/dist-modern/palette/base.dark.android.xml +1 -1
- data/dist-modern/palette/base.dark.figma.json +1 -1
- data/dist-modern/palette/base.dark.ios.json +1 -1
- data/dist-modern/palette/base.dark.json +1 -1
- data/dist-modern/palette/base.dark.polaris.custom-properties.css +129 -0
- data/dist-modern/palette/base.light.polaris.custom-properties.css +129 -0
- data/dist-modern/palette/mfp-ui.dark.android.xml +130 -0
- data/dist-modern/palette/mfp-ui.dark.figma.json +1 -0
- data/dist-modern/palette/mfp-ui.dark.ios.json +1 -0
- data/dist-modern/palette/mfp-ui.dark.json +129 -0
- data/dist-modern/palette/mfp-ui.dark.polaris.custom-properties.css +129 -0
- data/dist-modern/palette/mfp-ui.light.android.xml +130 -0
- data/dist-modern/palette/mfp-ui.light.figma.json +1 -0
- data/dist-modern/palette/mfp-ui.light.ios.json +1 -0
- data/dist-modern/palette/mfp-ui.light.json +129 -0
- data/dist-modern/palette/mfp-ui.light.polaris.custom-properties.css +129 -0
- data/dist-modern/theme/mfp-ui.json +12 -0
- data/dist/color-filters.color-map.scss +0 -8
- data/dist/color-filters.map.scss +8 -0
- data/dist/index.common.js +168 -75
- data/dist/index.custom-properties.css +2 -2
- data/dist/index.d.ts +149 -77
- data/dist/index.esm.js +166 -0
- data/dist/index.json +1 -1
- data/dist/index.map.scss +1 -1
- data/dist/index.raw.json +2 -2
- data/dist/index.scss +2 -2
- data/dist/typography.common.js +1 -1
- data/dist/typography.custom-properties.css +2 -2
- data/dist/typography.json +1 -1
- data/dist/typography.map.scss +1 -1
- data/dist/typography.raw.json +2 -2
- data/dist/typography.scss +2 -2
- data/index.js +4 -0
- data/lib/polaris_tokens/rails/engine.rb +1 -0
- data/package.json +28 -48
- metadata +16 -2
@@ -0,0 +1,129 @@
|
|
1
|
+
:root {
|
2
|
+
--p-background: rgb(246, 246, 247);
|
3
|
+
--p-background-hovered: rgb(241, 242, 243);
|
4
|
+
--p-background-pressed: rgb(237, 238, 239);
|
5
|
+
--p-background-selected: rgb(237, 238, 239);
|
6
|
+
--p-surface: rgb(255, 255, 255);
|
7
|
+
--p-surface-neutral: rgb(228, 229, 231);
|
8
|
+
--p-surface-neutral-hovered: rgb(219, 221, 223);
|
9
|
+
--p-surface-neutral-pressed: rgb(201, 204, 208);
|
10
|
+
--p-surface-neutral-disabled: rgb(241, 242, 243);
|
11
|
+
--p-surface-neutral-subdued: rgb(246, 246, 247);
|
12
|
+
--p-surface-subdued: rgb(250, 251, 251);
|
13
|
+
--p-surface-disabled: rgb(250, 251, 251);
|
14
|
+
--p-surface-hovered: rgb(246, 246, 247);
|
15
|
+
--p-surface-pressed: rgb(241, 242, 243);
|
16
|
+
--p-surface-depressed: rgb(237, 238, 239);
|
17
|
+
--p-backdrop: rgba(0, 0, 0, 0.5);
|
18
|
+
--p-overlay: rgba(255, 255, 255, 0.5);
|
19
|
+
--p-shadow-from-dim-light: rgba(0, 0, 0, 0.2);
|
20
|
+
--p-shadow-from-ambient-light: rgba(23, 24, 24, 0.05);
|
21
|
+
--p-shadow-from-direct-light: rgba(0, 0, 0, 0.15);
|
22
|
+
--p-hint-from-direct-light: rgba(0, 0, 0, 0.15);
|
23
|
+
--p-on-surface-background: rgb(241, 242, 243);
|
24
|
+
--p-border: rgb(140, 145, 150);
|
25
|
+
--p-border-neutral-subdued: rgb(186, 191, 195);
|
26
|
+
--p-border-hovered: rgb(153, 158, 164);
|
27
|
+
--p-border-disabled: rgb(210, 213, 216);
|
28
|
+
--p-border-subdued: rgb(201, 204, 207);
|
29
|
+
--p-border-depressed: rgb(87, 89, 89);
|
30
|
+
--p-border-shadow: rgb(174, 180, 185);
|
31
|
+
--p-border-shadow-subdued: rgb(186, 191, 196);
|
32
|
+
--p-divider: rgb(225, 227, 229);
|
33
|
+
--p-icon: rgb(92, 95, 98);
|
34
|
+
--p-icon-hovered: rgb(26, 28, 29);
|
35
|
+
--p-icon-pressed: rgb(68, 71, 74);
|
36
|
+
--p-icon-disabled: rgb(186, 190, 195);
|
37
|
+
--p-icon-subdued: rgb(140, 145, 150);
|
38
|
+
--p-text: rgb(32, 34, 35);
|
39
|
+
--p-text-disabled: rgb(140, 145, 150);
|
40
|
+
--p-text-subdued: rgb(109, 113, 117);
|
41
|
+
--p-interactive: rgb(44, 110, 203);
|
42
|
+
--p-interactive-disabled: rgb(189, 193, 204);
|
43
|
+
--p-interactive-hovered: rgb(31, 81, 153);
|
44
|
+
--p-interactive-pressed: rgb(16, 50, 98);
|
45
|
+
--p-focused: rgb(69, 143, 255);
|
46
|
+
--p-surface-selected: rgb(242, 247, 254);
|
47
|
+
--p-surface-selected-hovered: rgb(237, 244, 254);
|
48
|
+
--p-surface-selected-pressed: rgb(229, 239, 253);
|
49
|
+
--p-icon-on-interactive: rgb(255, 255, 255);
|
50
|
+
--p-text-on-interactive: rgb(255, 255, 255);
|
51
|
+
--p-action-secondary: rgb(255, 255, 255);
|
52
|
+
--p-action-secondary-disabled: rgb(255, 255, 255);
|
53
|
+
--p-action-secondary-hovered: rgb(246, 246, 247);
|
54
|
+
--p-action-secondary-pressed: rgb(241, 242, 243);
|
55
|
+
--p-action-secondary-depressed: rgb(109, 113, 117);
|
56
|
+
--p-action-primary: rgb(46, 113, 191);
|
57
|
+
--p-action-primary-disabled: rgb(241, 241, 241);
|
58
|
+
--p-action-primary-hovered: rgb(39, 98, 166);
|
59
|
+
--p-action-primary-pressed: rgb(32, 83, 143);
|
60
|
+
--p-action-primary-depressed: rgb(18, 53, 95);
|
61
|
+
--p-icon-on-primary: rgb(255, 255, 255);
|
62
|
+
--p-text-on-primary: rgb(255, 255, 255);
|
63
|
+
--p-text-primary: rgb(44, 109, 185);
|
64
|
+
--p-text-primary-hovered: rgb(38, 95, 162);
|
65
|
+
--p-text-primary-pressed: rgb(31, 81, 139);
|
66
|
+
--p-surface-primary-selected: rgb(246, 246, 248);
|
67
|
+
--p-surface-primary-selected-hovered: rgb(196, 201, 214);
|
68
|
+
--p-surface-primary-selected-pressed: rgb(175, 182, 199);
|
69
|
+
--p-border-critical: rgb(253, 87, 73);
|
70
|
+
--p-border-critical-subdued: rgb(224, 179, 178);
|
71
|
+
--p-border-critical-disabled: rgb(255, 167, 163);
|
72
|
+
--p-icon-critical: rgb(215, 44, 13);
|
73
|
+
--p-surface-critical: rgb(254, 211, 209);
|
74
|
+
--p-surface-critical-subdued: rgb(255, 244, 244);
|
75
|
+
--p-surface-critical-subdued-hovered: rgb(255, 240, 240);
|
76
|
+
--p-surface-critical-subdued-pressed: rgb(255, 233, 232);
|
77
|
+
--p-surface-critical-subdued-depressed: rgb(254, 188, 185);
|
78
|
+
--p-text-critical: rgb(215, 44, 13);
|
79
|
+
--p-action-critical: rgb(216, 44, 13);
|
80
|
+
--p-action-critical-disabled: rgb(241, 241, 241);
|
81
|
+
--p-action-critical-hovered: rgb(188, 34, 0);
|
82
|
+
--p-action-critical-pressed: rgb(162, 27, 0);
|
83
|
+
--p-action-critical-depressed: rgb(108, 15, 0);
|
84
|
+
--p-icon-on-critical: rgb(255, 255, 255);
|
85
|
+
--p-text-on-critical: rgb(255, 255, 255);
|
86
|
+
--p-interactive-critical: rgb(216, 44, 13);
|
87
|
+
--p-interactive-critical-disabled: rgb(253, 147, 141);
|
88
|
+
--p-interactive-critical-hovered: rgb(205, 41, 12);
|
89
|
+
--p-interactive-critical-pressed: rgb(103, 15, 3);
|
90
|
+
--p-border-warning: rgb(185, 137, 0);
|
91
|
+
--p-border-warning-subdued: rgb(225, 184, 120);
|
92
|
+
--p-icon-warning: rgb(185, 137, 0);
|
93
|
+
--p-surface-warning: rgb(255, 215, 157);
|
94
|
+
--p-surface-warning-subdued: rgb(255, 245, 234);
|
95
|
+
--p-surface-warning-subdued-hovered: rgb(255, 242, 226);
|
96
|
+
--p-surface-warning-subdued-pressed: rgb(255, 235, 211);
|
97
|
+
--p-text-warning: rgb(145, 106, 0);
|
98
|
+
--p-border-highlight: rgb(68, 157, 167);
|
99
|
+
--p-border-highlight-subdued: rgb(152, 198, 205);
|
100
|
+
--p-icon-highlight: rgb(0, 160, 172);
|
101
|
+
--p-surface-highlight: rgb(164, 232, 242);
|
102
|
+
--p-surface-highlight-subdued: rgb(235, 249, 252);
|
103
|
+
--p-surface-highlight-subdued-hovered: rgb(228, 247, 250);
|
104
|
+
--p-surface-highlight-subdued-pressed: rgb(213, 243, 248);
|
105
|
+
--p-text-highlight: rgb(52, 124, 132);
|
106
|
+
--p-border-success: rgb(0, 164, 124);
|
107
|
+
--p-border-success-subdued: rgb(149, 201, 180);
|
108
|
+
--p-icon-success: rgb(0, 127, 95);
|
109
|
+
--p-surface-success: rgb(174, 233, 209);
|
110
|
+
--p-surface-success-subdued: rgb(241, 248, 245);
|
111
|
+
--p-surface-success-subdued-hovered: rgb(236, 246, 241);
|
112
|
+
--p-surface-success-subdued-pressed: rgb(226, 241, 234);
|
113
|
+
--p-text-success: rgb(0, 128, 96);
|
114
|
+
--p-decorative-one-icon: rgb(126, 87, 0);
|
115
|
+
--p-decorative-one-surface: rgb(255, 201, 107);
|
116
|
+
--p-decorative-one-text: rgb(61, 40, 0);
|
117
|
+
--p-decorative-two-icon: rgb(175, 41, 78);
|
118
|
+
--p-decorative-two-surface: rgb(255, 196, 176);
|
119
|
+
--p-decorative-two-text: rgb(73, 11, 28);
|
120
|
+
--p-decorative-three-icon: rgb(0, 109, 65);
|
121
|
+
--p-decorative-three-surface: rgb(146, 230, 181);
|
122
|
+
--p-decorative-three-text: rgb(0, 47, 25);
|
123
|
+
--p-decorative-four-icon: rgb(0, 106, 104);
|
124
|
+
--p-decorative-four-surface: rgb(145, 224, 214);
|
125
|
+
--p-decorative-four-text: rgb(0, 45, 45);
|
126
|
+
--p-decorative-five-icon: rgb(174, 43, 76);
|
127
|
+
--p-decorative-five-surface: rgb(253, 201, 208);
|
128
|
+
--p-decorative-five-text: rgb(79, 14, 31);
|
129
|
+
}
|
@@ -0,0 +1,12 @@
|
|
1
|
+
{
|
2
|
+
"surface": "#111213",
|
3
|
+
"onSurface": "#111213",
|
4
|
+
"interactive": "#2e72d2",
|
5
|
+
"secondary": "#111213",
|
6
|
+
"primary": "#2864aa",
|
7
|
+
"critical": "#d82c0d",
|
8
|
+
"warning": "#ffc453",
|
9
|
+
"highlight": "#5bcdda",
|
10
|
+
"success": "#008060",
|
11
|
+
"decorative": "#ffc96b"
|
12
|
+
}
|
@@ -137,12 +137,4 @@ $polaris-color-filters: (
|
|
137
137
|
'white': (
|
138
138
|
'base': brightness(0) saturate(100%) invert(100%),
|
139
139
|
),
|
140
|
-
'icon': (
|
141
|
-
'base': brightness(0) saturate(100%) invert(36%) sepia(13%) saturate(137%)
|
142
|
-
hue-rotate(169deg) brightness(95%) contrast(87%),
|
143
|
-
),
|
144
|
-
'action': (
|
145
|
-
'base': brightness(0) saturate(100%) invert(20%) sepia(59%) saturate(5557%)
|
146
|
-
hue-rotate(162deg) brightness(95%) contrast(101%),
|
147
|
-
),
|
148
140
|
);
|
data/dist/color-filters.map.scss
CHANGED
@@ -229,4 +229,12 @@ $polaris-color-filters-map: (
|
|
229
229
|
'color-white': (
|
230
230
|
brightness(0) saturate(100%) invert(100%),
|
231
231
|
),
|
232
|
+
'icon': (
|
233
|
+
'base': brightness(0) saturate(100%) invert(36%) sepia(13%) saturate(137%)
|
234
|
+
hue-rotate(169deg) brightness(95%) contrast(87%),
|
235
|
+
),
|
236
|
+
'action': (
|
237
|
+
'base': brightness(0) saturate(100%) invert(20%) sepia(59%) saturate(5557%)
|
238
|
+
hue-rotate(162deg) brightness(95%) contrast(101%),
|
239
|
+
),
|
232
240
|
);
|
data/dist/index.common.js
CHANGED
@@ -1,76 +1,169 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
exports.colorInkLight = exports.colorInk = exports.colorRedLighter = exports.colorRedLight = exports.colorRed = exports.colorRedDark = exports.colorRedDarker = exports.colorRedText = exports.colorOrangeLighter = exports.colorOrangeLight = exports.colorOrange = exports.colorOrangeDark = exports.colorOrangeDarker = exports.colorOrangeText = exports.colorYellowLighter = exports.colorYellowLight = exports.colorYellow = exports.colorYellowDark = exports.colorYellowDarker = exports.colorYellowText = exports.colorGreenLighter = exports.colorGreenLight = exports.colorGreen = exports.colorGreenDark = exports.colorGreenDarker = exports.colorGreenText = exports.colorTealLighter = exports.colorTealLight = exports.colorTeal = exports.colorTealDark = exports.colorTealDarker = exports.colorTealText = exports.colorBlueLighter = exports.colorBlueLight = exports.colorBlue = exports.colorBlueDark = exports.colorBlueDarker = exports.colorBlueText = exports.colorIndigoLighter = exports.colorIndigoLight = exports.colorIndigo = exports.colorIndigoDark = exports.colorIndigoDarker = exports.colorIndigoText = exports.colorPurpleLighter = exports.colorPurpleLight = exports.colorPurple = exports.colorPurpleDark = exports.colorPurpleDarker = exports.colorPurpleText = void 0;
|
4
|
+
exports.fontStackMonospace = exports.fontStackBase = exports.spacingExtraLoose = exports.spacingLoose = exports.spacingBase = exports.spacingBaseTight = exports.spacingTight = exports.spacingExtraTight = exports.spacingNone = exports.durationSlowest = exports.durationSlower = exports.durationSlow = exports.durationBase = exports.durationFast = exports.durationNone = exports.colorWhite = exports.colorBlack = exports.colorSkyLighter = exports.colorSkyLight = exports.colorSky = exports.colorSkyDark = exports.colorInkLightest = exports.colorInkLighter = void 0;
|
5
|
+
exports.colorPurpleText = 'rgb(80, 73, 90)';
|
6
|
+
exports.colorPurpleDarker = 'rgb(35, 0, 81)';
|
7
|
+
exports.colorPurpleDark = 'rgb(80, 36, 143)';
|
8
|
+
exports.colorPurple = 'rgb(156, 106, 222)';
|
9
|
+
exports.colorPurpleLight = 'rgb(227, 208, 255)';
|
10
|
+
exports.colorPurpleLighter = 'rgb(246, 240, 253)';
|
11
|
+
exports.colorIndigoText = 'rgb(62, 65, 85)';
|
12
|
+
exports.colorIndigoDarker = 'rgb(0, 6, 57)';
|
13
|
+
exports.colorIndigoDark = 'rgb(32, 46, 120)';
|
14
|
+
exports.colorIndigo = 'rgb(92, 106, 196)';
|
15
|
+
exports.colorIndigoLight = 'rgb(179, 188, 245)';
|
16
|
+
exports.colorIndigoLighter = 'rgb(244, 245, 250)';
|
17
|
+
exports.colorBlueText = 'rgb(62, 78, 87)';
|
18
|
+
exports.colorBlueDarker = 'rgb(0, 20, 41)';
|
19
|
+
exports.colorBlueDark = 'rgb(8, 78, 138)';
|
20
|
+
exports.colorBlue = 'rgb(0, 111, 187)';
|
21
|
+
exports.colorBlueLight = 'rgb(180, 225, 250)';
|
22
|
+
exports.colorBlueLighter = 'rgb(235, 245, 250)';
|
23
|
+
exports.colorTealText = 'rgb(64, 83, 82)';
|
24
|
+
exports.colorTealDarker = 'rgb(0, 49, 53)';
|
25
|
+
exports.colorTealDark = 'rgb(0, 132, 142)';
|
26
|
+
exports.colorTeal = 'rgb(71, 193, 191)';
|
27
|
+
exports.colorTealLight = 'rgb(183, 236, 236)';
|
28
|
+
exports.colorTealLighter = 'rgb(224, 245, 245)';
|
29
|
+
exports.colorGreenText = 'rgb(65, 79, 62)';
|
30
|
+
exports.colorGreenDarker = 'rgb(23, 54, 48)';
|
31
|
+
exports.colorGreenDark = 'rgb(16, 128, 67)';
|
32
|
+
exports.colorGreen = 'rgb(80, 184, 60)';
|
33
|
+
exports.colorGreenLight = 'rgb(187, 229, 179)';
|
34
|
+
exports.colorGreenLighter = 'rgb(227, 241, 223)';
|
35
|
+
exports.colorYellowText = 'rgb(89, 81, 48)';
|
36
|
+
exports.colorYellowDarker = 'rgb(87, 59, 0)';
|
37
|
+
exports.colorYellowDark = 'rgb(138, 97, 22)';
|
38
|
+
exports.colorYellow = 'rgb(238, 194, 0)';
|
39
|
+
exports.colorYellowLight = 'rgb(255, 234, 138)';
|
40
|
+
exports.colorYellowLighter = 'rgb(252, 241, 205)';
|
41
|
+
exports.colorOrangeText = 'rgb(89, 68, 48)';
|
42
|
+
exports.colorOrangeDarker = 'rgb(74, 21, 4)';
|
43
|
+
exports.colorOrangeDark = 'rgb(192, 87, 23)';
|
44
|
+
exports.colorOrange = 'rgb(244, 147, 66)';
|
45
|
+
exports.colorOrangeLight = 'rgb(255, 197, 139)';
|
46
|
+
exports.colorOrangeLighter = 'rgb(252, 235, 219)';
|
47
|
+
exports.colorRedText = 'rgb(88, 60, 53)';
|
48
|
+
exports.colorRedDarker = 'rgb(51, 1, 1)';
|
49
|
+
exports.colorRedDark = 'rgb(191, 7, 17)';
|
50
|
+
exports.colorRed = 'rgb(222, 54, 24)';
|
51
|
+
exports.colorRedLight = 'rgb(254, 173, 154)';
|
52
|
+
exports.colorRedLighter = 'rgb(251, 234, 229)';
|
53
|
+
exports.colorInk = 'rgb(33, 43, 54)';
|
54
|
+
exports.colorInkLight = 'rgb(69, 79, 91)';
|
55
|
+
exports.colorInkLighter = 'rgb(99, 115, 129)';
|
56
|
+
exports.colorInkLightest = 'rgb(145, 158, 171)';
|
57
|
+
exports.colorSkyDark = 'rgb(196, 205, 213)';
|
58
|
+
exports.colorSky = 'rgb(223, 227, 232)';
|
59
|
+
exports.colorSkyLight = 'rgb(244, 246, 248)';
|
60
|
+
exports.colorSkyLighter = 'rgb(249, 250, 251)';
|
61
|
+
exports.colorBlack = 'rgb(0, 0, 0)';
|
62
|
+
exports.colorWhite = 'rgb(255, 255, 255)';
|
63
|
+
exports.durationNone = 0;
|
64
|
+
exports.durationFast = 100;
|
65
|
+
exports.durationBase = 200;
|
66
|
+
exports.durationSlow = 300;
|
67
|
+
exports.durationSlower = 400;
|
68
|
+
exports.durationSlowest = 500;
|
69
|
+
exports.spacingNone = 0;
|
70
|
+
exports.spacingExtraTight = '4px';
|
71
|
+
exports.spacingTight = '8px';
|
72
|
+
exports.spacingBaseTight = '12px';
|
73
|
+
exports.spacingBase = '16px';
|
74
|
+
exports.spacingLoose = '20px';
|
75
|
+
exports.spacingExtraLoose = '32px';
|
76
|
+
exports.fontStackBase = "-apple-system, BlinkMacSystemFont, 'San Francisco', 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif";
|
77
|
+
exports.fontStackMonospace = "Monaco, Consolas, 'Lucida Console', monospace";
|
78
|
+
// When this package shipped only CJS, bundlers applied some cjs-to-esm interop
|
79
|
+
// dark magic that meant you could access content from index.common.js from an
|
80
|
+
// esm file in many ways.
|
81
|
+
// The following were all valid ways to access tokens:
|
82
|
+
//
|
83
|
+
// import {colorInk as namedImport} from '@shopify/polaris-tokens'
|
84
|
+
// import * as namespaceImport from '@shopify/polaris-tokens'
|
85
|
+
// import defaultImport from '@shopify/polaris-tokens'
|
86
|
+
// console.log(colorInk, namespaceImport.colorInk, defaultImport.colorInk)
|
87
|
+
//
|
88
|
+
// In order to avoid adding this esm file being a breaking change, we must
|
89
|
+
// provide a default export to maintain compatibility.
|
90
|
+
// This is a deprecated way of accessing tokens. Consumers should use either
|
91
|
+
// named imports (`import {colorInk}`) or a namespace import
|
92
|
+
// (`import * as tokens`).
|
93
|
+
// This default export should be removed in polaris-tokens v3 if we don't
|
94
|
+
// remove this file entirely.
|
95
|
+
exports.default = {
|
96
|
+
colorPurpleText: exports.colorPurpleText,
|
97
|
+
colorPurpleDarker: exports.colorPurpleDarker,
|
98
|
+
colorPurpleDark: exports.colorPurpleDark,
|
99
|
+
colorPurple: exports.colorPurple,
|
100
|
+
colorPurpleLight: exports.colorPurpleLight,
|
101
|
+
colorPurpleLighter: exports.colorPurpleLighter,
|
102
|
+
colorIndigoText: exports.colorIndigoText,
|
103
|
+
colorIndigoDarker: exports.colorIndigoDarker,
|
104
|
+
colorIndigoDark: exports.colorIndigoDark,
|
105
|
+
colorIndigo: exports.colorIndigo,
|
106
|
+
colorIndigoLight: exports.colorIndigoLight,
|
107
|
+
colorIndigoLighter: exports.colorIndigoLighter,
|
108
|
+
colorBlueText: exports.colorBlueText,
|
109
|
+
colorBlueDarker: exports.colorBlueDarker,
|
110
|
+
colorBlueDark: exports.colorBlueDark,
|
111
|
+
colorBlue: exports.colorBlue,
|
112
|
+
colorBlueLight: exports.colorBlueLight,
|
113
|
+
colorBlueLighter: exports.colorBlueLighter,
|
114
|
+
colorTealText: exports.colorTealText,
|
115
|
+
colorTealDarker: exports.colorTealDarker,
|
116
|
+
colorTealDark: exports.colorTealDark,
|
117
|
+
colorTeal: exports.colorTeal,
|
118
|
+
colorTealLight: exports.colorTealLight,
|
119
|
+
colorTealLighter: exports.colorTealLighter,
|
120
|
+
colorGreenText: exports.colorGreenText,
|
121
|
+
colorGreenDarker: exports.colorGreenDarker,
|
122
|
+
colorGreenDark: exports.colorGreenDark,
|
123
|
+
colorGreen: exports.colorGreen,
|
124
|
+
colorGreenLight: exports.colorGreenLight,
|
125
|
+
colorGreenLighter: exports.colorGreenLighter,
|
126
|
+
colorYellowText: exports.colorYellowText,
|
127
|
+
colorYellowDarker: exports.colorYellowDarker,
|
128
|
+
colorYellowDark: exports.colorYellowDark,
|
129
|
+
colorYellow: exports.colorYellow,
|
130
|
+
colorYellowLight: exports.colorYellowLight,
|
131
|
+
colorYellowLighter: exports.colorYellowLighter,
|
132
|
+
colorOrangeText: exports.colorOrangeText,
|
133
|
+
colorOrangeDarker: exports.colorOrangeDarker,
|
134
|
+
colorOrangeDark: exports.colorOrangeDark,
|
135
|
+
colorOrange: exports.colorOrange,
|
136
|
+
colorOrangeLight: exports.colorOrangeLight,
|
137
|
+
colorOrangeLighter: exports.colorOrangeLighter,
|
138
|
+
colorRedText: exports.colorRedText,
|
139
|
+
colorRedDarker: exports.colorRedDarker,
|
140
|
+
colorRedDark: exports.colorRedDark,
|
141
|
+
colorRed: exports.colorRed,
|
142
|
+
colorRedLight: exports.colorRedLight,
|
143
|
+
colorRedLighter: exports.colorRedLighter,
|
144
|
+
colorInk: exports.colorInk,
|
145
|
+
colorInkLight: exports.colorInkLight,
|
146
|
+
colorInkLighter: exports.colorInkLighter,
|
147
|
+
colorInkLightest: exports.colorInkLightest,
|
148
|
+
colorSkyDark: exports.colorSkyDark,
|
149
|
+
colorSky: exports.colorSky,
|
150
|
+
colorSkyLight: exports.colorSkyLight,
|
151
|
+
colorSkyLighter: exports.colorSkyLighter,
|
152
|
+
colorBlack: exports.colorBlack,
|
153
|
+
colorWhite: exports.colorWhite,
|
154
|
+
durationNone: exports.durationNone,
|
155
|
+
durationFast: exports.durationFast,
|
156
|
+
durationBase: exports.durationBase,
|
157
|
+
durationSlow: exports.durationSlow,
|
158
|
+
durationSlower: exports.durationSlower,
|
159
|
+
durationSlowest: exports.durationSlowest,
|
160
|
+
spacingNone: exports.spacingNone,
|
161
|
+
spacingExtraTight: exports.spacingExtraTight,
|
162
|
+
spacingTight: exports.spacingTight,
|
163
|
+
spacingBaseTight: exports.spacingBaseTight,
|
164
|
+
spacingBase: exports.spacingBase,
|
165
|
+
spacingLoose: exports.spacingLoose,
|
166
|
+
spacingExtraLoose: exports.spacingExtraLoose,
|
167
|
+
fontStackBase: exports.fontStackBase,
|
168
|
+
fontStackMonospace: exports.fontStackMonospace,
|
76
169
|
};
|
@@ -70,7 +70,7 @@
|
|
70
70
|
--spacing-base: 16px;
|
71
71
|
--spacing-loose: 20px;
|
72
72
|
--spacing-extra-loose: 32px;
|
73
|
-
--font-stack-base: -apple-system, BlinkMacSystemFont, 'San Francisco',
|
74
|
-
'Segoe UI', 'Helvetica Neue', sans-serif;
|
73
|
+
--font-stack-base: -apple-system, BlinkMacSystemFont, 'San Francisco',
|
74
|
+
'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
|
75
75
|
--font-stack-monospace: Monaco, Consolas, 'Lucida Console', monospace;
|
76
76
|
}
|
data/dist/index.d.ts
CHANGED
@@ -1,77 +1,149 @@
|
|
1
|
-
declare
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
1
|
+
export declare const colorPurpleText = "rgb(80, 73, 90)";
|
2
|
+
export declare const colorPurpleDarker = "rgb(35, 0, 81)";
|
3
|
+
export declare const colorPurpleDark = "rgb(80, 36, 143)";
|
4
|
+
export declare const colorPurple = "rgb(156, 106, 222)";
|
5
|
+
export declare const colorPurpleLight = "rgb(227, 208, 255)";
|
6
|
+
export declare const colorPurpleLighter = "rgb(246, 240, 253)";
|
7
|
+
export declare const colorIndigoText = "rgb(62, 65, 85)";
|
8
|
+
export declare const colorIndigoDarker = "rgb(0, 6, 57)";
|
9
|
+
export declare const colorIndigoDark = "rgb(32, 46, 120)";
|
10
|
+
export declare const colorIndigo = "rgb(92, 106, 196)";
|
11
|
+
export declare const colorIndigoLight = "rgb(179, 188, 245)";
|
12
|
+
export declare const colorIndigoLighter = "rgb(244, 245, 250)";
|
13
|
+
export declare const colorBlueText = "rgb(62, 78, 87)";
|
14
|
+
export declare const colorBlueDarker = "rgb(0, 20, 41)";
|
15
|
+
export declare const colorBlueDark = "rgb(8, 78, 138)";
|
16
|
+
export declare const colorBlue = "rgb(0, 111, 187)";
|
17
|
+
export declare const colorBlueLight = "rgb(180, 225, 250)";
|
18
|
+
export declare const colorBlueLighter = "rgb(235, 245, 250)";
|
19
|
+
export declare const colorTealText = "rgb(64, 83, 82)";
|
20
|
+
export declare const colorTealDarker = "rgb(0, 49, 53)";
|
21
|
+
export declare const colorTealDark = "rgb(0, 132, 142)";
|
22
|
+
export declare const colorTeal = "rgb(71, 193, 191)";
|
23
|
+
export declare const colorTealLight = "rgb(183, 236, 236)";
|
24
|
+
export declare const colorTealLighter = "rgb(224, 245, 245)";
|
25
|
+
export declare const colorGreenText = "rgb(65, 79, 62)";
|
26
|
+
export declare const colorGreenDarker = "rgb(23, 54, 48)";
|
27
|
+
export declare const colorGreenDark = "rgb(16, 128, 67)";
|
28
|
+
export declare const colorGreen = "rgb(80, 184, 60)";
|
29
|
+
export declare const colorGreenLight = "rgb(187, 229, 179)";
|
30
|
+
export declare const colorGreenLighter = "rgb(227, 241, 223)";
|
31
|
+
export declare const colorYellowText = "rgb(89, 81, 48)";
|
32
|
+
export declare const colorYellowDarker = "rgb(87, 59, 0)";
|
33
|
+
export declare const colorYellowDark = "rgb(138, 97, 22)";
|
34
|
+
export declare const colorYellow = "rgb(238, 194, 0)";
|
35
|
+
export declare const colorYellowLight = "rgb(255, 234, 138)";
|
36
|
+
export declare const colorYellowLighter = "rgb(252, 241, 205)";
|
37
|
+
export declare const colorOrangeText = "rgb(89, 68, 48)";
|
38
|
+
export declare const colorOrangeDarker = "rgb(74, 21, 4)";
|
39
|
+
export declare const colorOrangeDark = "rgb(192, 87, 23)";
|
40
|
+
export declare const colorOrange = "rgb(244, 147, 66)";
|
41
|
+
export declare const colorOrangeLight = "rgb(255, 197, 139)";
|
42
|
+
export declare const colorOrangeLighter = "rgb(252, 235, 219)";
|
43
|
+
export declare const colorRedText = "rgb(88, 60, 53)";
|
44
|
+
export declare const colorRedDarker = "rgb(51, 1, 1)";
|
45
|
+
export declare const colorRedDark = "rgb(191, 7, 17)";
|
46
|
+
export declare const colorRed = "rgb(222, 54, 24)";
|
47
|
+
export declare const colorRedLight = "rgb(254, 173, 154)";
|
48
|
+
export declare const colorRedLighter = "rgb(251, 234, 229)";
|
49
|
+
export declare const colorInk = "rgb(33, 43, 54)";
|
50
|
+
export declare const colorInkLight = "rgb(69, 79, 91)";
|
51
|
+
export declare const colorInkLighter = "rgb(99, 115, 129)";
|
52
|
+
export declare const colorInkLightest = "rgb(145, 158, 171)";
|
53
|
+
export declare const colorSkyDark = "rgb(196, 205, 213)";
|
54
|
+
export declare const colorSky = "rgb(223, 227, 232)";
|
55
|
+
export declare const colorSkyLight = "rgb(244, 246, 248)";
|
56
|
+
export declare const colorSkyLighter = "rgb(249, 250, 251)";
|
57
|
+
export declare const colorBlack = "rgb(0, 0, 0)";
|
58
|
+
export declare const colorWhite = "rgb(255, 255, 255)";
|
59
|
+
export declare const durationNone = 0;
|
60
|
+
export declare const durationFast = 100;
|
61
|
+
export declare const durationBase = 200;
|
62
|
+
export declare const durationSlow = 300;
|
63
|
+
export declare const durationSlower = 400;
|
64
|
+
export declare const durationSlowest = 500;
|
65
|
+
export declare const spacingNone = 0;
|
66
|
+
export declare const spacingExtraTight = "4px";
|
67
|
+
export declare const spacingTight = "8px";
|
68
|
+
export declare const spacingBaseTight = "12px";
|
69
|
+
export declare const spacingBase = "16px";
|
70
|
+
export declare const spacingLoose = "20px";
|
71
|
+
export declare const spacingExtraLoose = "32px";
|
72
|
+
export declare const fontStackBase = "-apple-system, BlinkMacSystemFont, 'San Francisco', 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif";
|
73
|
+
export declare const fontStackMonospace = "Monaco, Consolas, 'Lucida Console', monospace";
|
74
|
+
declare const _default: {
|
75
|
+
colorPurpleText: string;
|
76
|
+
colorPurpleDarker: string;
|
77
|
+
colorPurpleDark: string;
|
78
|
+
colorPurple: string;
|
79
|
+
colorPurpleLight: string;
|
80
|
+
colorPurpleLighter: string;
|
81
|
+
colorIndigoText: string;
|
82
|
+
colorIndigoDarker: string;
|
83
|
+
colorIndigoDark: string;
|
84
|
+
colorIndigo: string;
|
85
|
+
colorIndigoLight: string;
|
86
|
+
colorIndigoLighter: string;
|
87
|
+
colorBlueText: string;
|
88
|
+
colorBlueDarker: string;
|
89
|
+
colorBlueDark: string;
|
90
|
+
colorBlue: string;
|
91
|
+
colorBlueLight: string;
|
92
|
+
colorBlueLighter: string;
|
93
|
+
colorTealText: string;
|
94
|
+
colorTealDarker: string;
|
95
|
+
colorTealDark: string;
|
96
|
+
colorTeal: string;
|
97
|
+
colorTealLight: string;
|
98
|
+
colorTealLighter: string;
|
99
|
+
colorGreenText: string;
|
100
|
+
colorGreenDarker: string;
|
101
|
+
colorGreenDark: string;
|
102
|
+
colorGreen: string;
|
103
|
+
colorGreenLight: string;
|
104
|
+
colorGreenLighter: string;
|
105
|
+
colorYellowText: string;
|
106
|
+
colorYellowDarker: string;
|
107
|
+
colorYellowDark: string;
|
108
|
+
colorYellow: string;
|
109
|
+
colorYellowLight: string;
|
110
|
+
colorYellowLighter: string;
|
111
|
+
colorOrangeText: string;
|
112
|
+
colorOrangeDarker: string;
|
113
|
+
colorOrangeDark: string;
|
114
|
+
colorOrange: string;
|
115
|
+
colorOrangeLight: string;
|
116
|
+
colorOrangeLighter: string;
|
117
|
+
colorRedText: string;
|
118
|
+
colorRedDarker: string;
|
119
|
+
colorRedDark: string;
|
120
|
+
colorRed: string;
|
121
|
+
colorRedLight: string;
|
122
|
+
colorRedLighter: string;
|
123
|
+
colorInk: string;
|
124
|
+
colorInkLight: string;
|
125
|
+
colorInkLighter: string;
|
126
|
+
colorInkLightest: string;
|
127
|
+
colorSkyDark: string;
|
128
|
+
colorSky: string;
|
129
|
+
colorSkyLight: string;
|
130
|
+
colorSkyLighter: string;
|
131
|
+
colorBlack: string;
|
132
|
+
colorWhite: string;
|
133
|
+
durationNone: number;
|
134
|
+
durationFast: number;
|
135
|
+
durationBase: number;
|
136
|
+
durationSlow: number;
|
137
|
+
durationSlower: number;
|
138
|
+
durationSlowest: number;
|
139
|
+
spacingNone: number;
|
140
|
+
spacingExtraTight: string;
|
141
|
+
spacingTight: string;
|
142
|
+
spacingBaseTight: string;
|
143
|
+
spacingBase: string;
|
144
|
+
spacingLoose: string;
|
145
|
+
spacingExtraLoose: string;
|
146
|
+
fontStackBase: string;
|
147
|
+
fontStackMonospace: string;
|
148
|
+
};
|
149
|
+
export default _default;
|