@drivy/cobalt 0.46.0 → 0.46.2

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.
Files changed (23) hide show
  1. package/cjs/tokens/palette.js +73 -29
  2. package/cjs/tokens/palette.js.map +1 -1
  3. package/cjs/tokens/theme.js +119 -111
  4. package/cjs/tokens/theme.js.map +1 -1
  5. package/components/Calendar/CalendarView/CalendarViewMonth.js +2 -2
  6. package/components/Calendar/CalendarView/CalendarViewMonth.js.map +1 -1
  7. package/package.json +1 -1
  8. package/styles/components/Calendar/CalendarView/index.scss +7 -16
  9. package/styles/components/ContainedIcon/index.scss +2 -0
  10. package/styles/components/Icon/iconColors.scss +42 -30
  11. package/styles/components/Layout/Surfaces/index.scss +36 -20
  12. package/styles/core/_colors-map.scss +49 -41
  13. package/styles/core/breakpoints.scss +20 -0
  14. package/styles/core/default-theme.scss +69 -61
  15. package/styles/core/palette.scss +70 -26
  16. package/styles/core/theme.scss +175 -159
  17. package/tokens/palette.js +73 -29
  18. package/tokens/palette.js.map +1 -1
  19. package/tokens/theme.js +119 -111
  20. package/tokens/theme.js.map +1 -1
  21. package/types/src/components/Icon/index.d.ts +1 -1
  22. package/types/src/tokens/index.d.ts +95 -43
  23. package/utilities.css +249 -169
package/tokens/palette.js CHANGED
@@ -1,11 +1,17 @@
1
- const white = "#FFF";
1
+ const white = "#FFFFFF";
2
2
  const purple = {
3
- "100": "#F6E5F5",
4
- "300": "#CA6BC3",
5
- "400": "#C04FB8",
3
+ "100": "#F8F2F8",
4
+ "200": "#F0E1EE",
5
+ "300": "#DB97D5",
6
+ "400": "#C758BD",
6
7
  "500": "#B01AA7",
7
- "700": "#8D1586",
8
- "900": "#5F1159"
8
+ "600": "#A6199D",
9
+ "700": "#901588",
10
+ "800": "#75116F",
11
+ "900": "#530C4F",
12
+ "1000": "#3E093B",
13
+ "1100": "#280626",
14
+ "1200": "#160315"
9
15
  };
10
16
  const purpleDeep = {
11
17
  "100": "#F2A6EE",
@@ -13,7 +19,8 @@ const purpleDeep = {
13
19
  "400": "#C31DBA",
14
20
  "500": "#9B1794",
15
21
  "700": "#73116E",
16
- "900": "#4B0B48"
22
+ "900": "#4B0B48",
23
+ "1000": "#3E093C"
17
24
  };
18
25
  const purpleLight = {
19
26
  "100": "#FFDCFD"
@@ -24,6 +31,7 @@ const navy = {
24
31
  "120": "#CAC7D2",
25
32
  "200": "#BBB8C7",
26
33
  "300": "#7B728E",
34
+ "400": "#554B70",
27
35
  "500": "#362E53",
28
36
  "700": "#261A48",
29
37
  "900": "#0F0429"
@@ -31,30 +39,42 @@ const navy = {
31
39
  const yellow = {
32
40
  "100": "#FFEED1",
33
41
  "300": "#FFDDA3",
42
+ "400": "#FFD387",
34
43
  "500": "#FFC766",
35
44
  "700": "#C59548",
36
45
  "900": "#75592D",
37
46
  "1000": "#3B2E17"
38
47
  };
39
48
  const green = {
40
- "100": "#CDEBCB",
41
- "120": "#BFE5BD",
42
- "150": "#B1E0AE",
49
+ "100": "#F4F9F3",
50
+ "200": "#E5F2E4",
51
+ "300": "#C8E5C6",
52
+ "400": "#93D790",
43
53
  "500": "#5CBF54",
44
54
  "700": "#479D3E",
45
55
  "900": "#2F6D1C",
46
- "1000": "#1B500A"
56
+ "1000": "#1B500A",
57
+ "1100": "#143B05",
58
+ "1200": "#102E03"
47
59
  };
48
60
  const red = {
49
61
  "100": "#FDEDED",
50
- "120": "#FBDADA",
51
- "150": "#F9C8C8",
52
- "200": "#E38C8C",
53
- "400": "#ED4545",
62
+ "120": "#F7E9E9",
63
+ "150": "#EED0D0",
64
+ "200": "#E5B5B5",
65
+ "300": "#DB9494",
66
+ "400": "#D16969",
54
67
  "500": "#C71414",
55
- "700": "#AF1212",
56
- "800": "#764747",
57
- "900": "#3F2424"
68
+ "600": "#B61212",
69
+ "700": "#A21010",
70
+ "800": "#8D0E0E",
71
+ "900": "#730C0C",
72
+ "1000": "#510808",
73
+ "1200": "#4A0707",
74
+ "1300": "#420707",
75
+ "1400": "#390606",
76
+ "1500": "#2F0505",
77
+ "1600": "#210303"
58
78
  };
59
79
  const orange = {
60
80
  "100": "#F1D5B1",
@@ -66,18 +86,38 @@ const black = {
66
86
  "50": "#544F53",
67
87
  "75": "#443F44",
68
88
  "100": "#363036",
89
+ "200": "#2E292E",
69
90
  "300": "#282127",
91
+ "400": "#251D24",
70
92
  "500": "#191218",
71
- "1000": "#000"
93
+ "600": "#0F0A0E",
94
+ "700": "#090609",
95
+ "800": "#030203",
96
+ "1000": "#000000"
72
97
  };
73
98
  const grey = {
74
99
  "50": "#F8F9FA",
75
100
  "100": "#E3E2E3",
101
+ "200": "#C3C1C3",
76
102
  "300": "#A9A6A9",
77
- "500": "#918D91"
103
+ "400": "#9D9A9D",
104
+ "500": "#918D91",
105
+ "600": "#7D787D",
106
+ "700": "#6A676A"
78
107
  };
79
108
  const blue = {
80
- "500": "#79A3F3"
109
+ "100": "#F5F8FF",
110
+ "200": "#E5EDFF",
111
+ "300": "#B7D3FF",
112
+ "400": "#74B0FF",
113
+ "500": "#1F81F3",
114
+ "600": "#185BD1",
115
+ "700": "#1B3B8B",
116
+ "800": "#19255C",
117
+ "900": "#151C38",
118
+ "1000": "#101423",
119
+ "1100": "#0D1016",
120
+ "1200": "#0A0B0F"
81
121
  };
82
122
  const turquoise = {
83
123
  "50": "#ECF9FB",
@@ -93,14 +133,18 @@ const turquoise = {
93
133
  "1200": "#11505E"
94
134
  };
95
135
  const season = {
96
- "100": "#BDFFAC",
97
- "200": "#94EA84",
98
- "300": "#73C865",
99
- "400": "#54A949",
100
- "700": "#0B7011",
101
- "800": "#005100",
102
- "900": "#030",
103
- "1000": "#001900"
136
+ "100": "#A9D4A8",
137
+ "200": "#9FD09E",
138
+ "300": "#7CC27B",
139
+ "400": "#56B654",
140
+ "500": "#24AA1F",
141
+ "600": "#229F1C",
142
+ "700": "#1F931A",
143
+ "800": "#1D8618",
144
+ "900": "#1A7816",
145
+ "1000": "#166612",
146
+ "1100": "#11510F",
147
+ "1200": "#0A3109"
104
148
  };
105
149
  const newPurple = {
106
150
  "200": "#E46FEE",
package/tokens/palette.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"palette.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"palette.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/tokens/theme.js CHANGED
@@ -1,40 +1,41 @@
1
1
  const background = {
2
2
  primary: "white/black.500",
3
- secondary: "white/black.300",
4
- accent: "purple.500/purpleDeep.500",
5
- accentAlt: "purple.100/purpleDeep.900",
3
+ secondary: "white/black.400",
4
+ accent: "purple.500/purple.400",
5
+ accentAlt: "purple.200/purple.900",
6
6
  info: "yellow.100/yellow.1000",
7
7
  error: "red.500/red.500",
8
- errorAlt: "red.100/red.900",
8
+ errorAlt: "red.100/red.1500",
9
9
  success: "green.700/green.700",
10
- successAlt: "green.100/green.1000",
10
+ successAlt: "green.100/green.1200",
11
11
  connect: "newPurple.500/newPurple.200",
12
12
  connectAlt: "turquoise.50/turquoise.900",
13
- keyExchange: "newViolet.500/newViolet.200",
14
- picked: "green.700/green.500",
15
- rideshare: "black.1000/black.1000",
16
13
  driver: "yellow.500/yellow.500",
17
14
  owner: "navy.700/navy.700",
18
- disabled: "navy.100/black.100",
15
+ disabled: "navy.50/black.500",
19
16
  neutral: "navy.100/black.50",
20
17
  neutralAlt: "navy.50/black.100",
21
- seasonLow: "season.100/season.700",
22
- seasonMedium: "season.200/season.800",
23
- seasonHigh: "season.300/season.900",
24
- seasonVeryhigh: "season.400/season.1000",
25
- rental: "turquoise.100/turquoise.1200",
26
- blocker: "navy.100/black.75",
18
+ seasonLow: "season.100/season.300",
19
+ seasonMedium: "season.300/season.600",
20
+ seasonHigh: "season.700/season.900",
21
+ seasonVeryHigh: "season.1100/season.1200",
22
+ rental: "blue.500/blue.700",
23
+ rentalAlt: "blue.300/blue.500",
24
+ blocker: "grey.100/black.200",
25
+ rideshare: "black.1000/black.1000",
26
+ keyExchange: "newViolet.500/newViolet.200",
27
+ picked: "green.700/green.500",
27
28
  base: "navy.900/navy.50",
28
29
  secondaryInteractive: {
29
- DEFAULT: "white/black.300",
30
+ DEFAULT: "white/black.400",
30
31
  hover: "navy.50/black.300"
31
32
  },
32
33
  accentInteractive: {
33
- DEFAULT: "purple.500/purpleDeep.500",
34
+ DEFAULT: "purple.500/purple.400",
34
35
  hover: "purple.700/purpleDeep.400"
35
36
  },
36
37
  accentAltInteractive: {
37
- DEFAULT: "purple.100/purpleDeep.900",
38
+ DEFAULT: "purple.200/purple.900",
38
39
  hover: "purpleLight.100/purpleDeep.900"
39
40
  },
40
41
  connectInteractive: {
@@ -48,128 +49,135 @@ const background = {
48
49
  };
49
50
  const text = {
50
51
  base: "navy.700/grey.100",
51
- subdued: "navy.300/grey.300",
52
- accent: "purple.500/purpleDeep.400",
53
- accentAlt: "purple.500/grey.100",
54
- info: "yellow.900/yellow.300",
55
- infoAlt: "yellow.700/yellow.700",
52
+ subdued: "navy.400/grey.300",
53
+ accent: "purple.500/purple.300",
54
+ accentAlt: "purple.700/purple.200",
55
+ info: "yellow.900/yellow.400",
56
56
  error: "red.500/red.400",
57
- errorAlt: "red.500/red.500",
58
- success: "green.700/green.700",
59
- successAlt: "green.1000/green.100",
60
- warning: "orange.500/orange.300",
57
+ errorAlt: "red.500/red.200",
58
+ success: "green.700/green.400",
59
+ successAlt: "green.1000/green.400",
61
60
  connect: "newPurple.500/newPurple.200",
62
61
  connectAlt: "turquoise.900/white",
63
- keyExchange: "newViolet.500/newViolet.200",
64
- picked: "green.700/green.500",
65
- rideshare: "black.1000/white",
66
62
  driver: "navy.700/navy.700",
67
63
  owner: "white/grey.100",
68
- disabled: "navy.200/black.50",
69
- inversed: "white/white",
70
- onAccent: "white/grey.100",
64
+ warning: "orange.500/orange.300",
65
+ infoAlt: "yellow.700/yellow.700",
66
+ disabled: "navy.120/black.50",
67
+ onAccent: "white/black.1000",
71
68
  onRideshare: "white/white",
72
69
  onError: "white/white",
73
70
  onSuccess: "white/white",
74
- onConnect: "white/navy.900",
75
- onKeyExchange: "white/navy.900",
76
- onPicked: "white/navy.900",
71
+ onConnect: "white/black.1000",
72
+ onKeyExchange: "white/black.1000",
73
+ onPicked: "white/black.1000",
74
+ keyExchange: "newViolet.500/newViolet.200",
75
+ picked: "green.700/green.500",
76
+ rideshare: "black.1000/white",
77
77
  onBase: "white/navy.900",
78
+ onSeasonLow: "black.800/black.800",
79
+ onSeasonMedium: "black.800/white",
80
+ onSeasonHigh: "white/white",
81
+ onSeasonVeryHigh: "white/white",
82
+ onRental: "white/white",
83
+ onRentalAlt: "black.300/black.1000",
84
+ inversed: "white/white",
78
85
  baseInteractive: {
79
86
  DEFAULT: "navy.700/grey.100",
80
87
  hover: "navy.900/grey.300"
81
88
  },
82
89
  subduedInteractive: {
83
- DEFAULT: "navy.300/grey.300",
90
+ DEFAULT: "navy.400/grey.300",
84
91
  hover: "navy.500/grey.300"
85
92
  },
86
93
  accentInteractive: {
87
- DEFAULT: "purple.500/purpleDeep.400",
94
+ DEFAULT: "purple.500/purple.300",
88
95
  hover: "purple.700/purpleDeep.400"
89
96
  },
90
97
  accentAltInteractive: {
91
- DEFAULT: "purple.500/grey.100",
98
+ DEFAULT: "purple.700/purple.200",
92
99
  hover: "purple.700/grey.100"
93
100
  }
94
101
  };
95
102
  const icon = {
96
- base: "navy.500/grey.100",
97
- subdued: "navy.300/grey.300",
98
- accent: "purple.500/purpleDeep.400",
99
- accentAlt: "purple.500/grey.100",
100
- info: "yellow.900/yellow.300",
101
- infoAlt: "yellow.500/yellow.700",
103
+ base: "navy.700/grey.100",
104
+ subdued: "navy.400/grey.300",
105
+ accent: "purple.500/purple.300",
106
+ accentAlt: "purple.700/purple.200",
107
+ info: "yellow.900/yellow.400",
102
108
  error: "red.500/red.400",
103
109
  errorAlt: "red.500/red.200",
104
- success: "green.700/green.700",
105
- successAlt: "green.1000/green.100",
106
- warning: "orange.500/orange.300",
110
+ success: "green.700/green.400",
111
+ successAlt: "green.1000/green.400",
107
112
  connect: "newPurple.500/newPurple.200",
108
113
  connectAlt: "turquoise.900/turquoise.50",
109
- keyExchange: "newViolet.500/newViolet.200",
110
- picked: "green.700/green.500",
111
- rideshare: "black.1000/white",
112
114
  driver: "navy.700/navy.700",
113
- owner: "white/white",
114
- disabled: "navy.200/black.50",
115
- disabledAlt: "navy.300/grey.500",
116
- inversed: "white/white",
117
- onAccent: "white/white",
115
+ owner: "white/grey.100",
116
+ warning: "orange.500/orange.300",
117
+ infoAlt: "yellow.500/yellow.700",
118
+ disabled: "navy.200/black.75",
119
+ onAccent: "white/black.1000",
118
120
  onRideshare: "white/white",
119
121
  onError: "white/white",
120
122
  onSuccess: "white/white",
121
- onConnect: "white/navy.900",
122
- onKeyExchange: "white/navy.900",
123
- onPicked: "white/navy.900",
123
+ onConnect: "white/black.1000",
124
+ onKeyExchange: "white/black.1000",
125
+ onPicked: "white/black.1000",
126
+ keyExchange: "newViolet.500/newViolet.200",
127
+ picked: "green.700/green.500",
128
+ rideshare: "black.1000/white",
124
129
  onBase: "white/navy.900",
130
+ disabledAlt: "navy.120/black.50",
131
+ onRental: "white/white",
132
+ inversed: "white/white",
125
133
  baseInteractive: {
126
- DEFAULT: "navy.500/grey.100",
134
+ DEFAULT: "navy.700/grey.100",
127
135
  hover: "navy.700/grey.100"
128
136
  },
129
137
  subduedInteractive: {
130
- DEFAULT: "navy.300/grey.300",
138
+ DEFAULT: "navy.400/grey.300",
131
139
  hover: "navy.500/grey.300"
132
140
  },
133
141
  accentInteractive: {
134
- DEFAULT: "purple.500/purpleDeep.400",
142
+ DEFAULT: "purple.500/purple.300",
135
143
  hover: "purple.700/purpleDeep.400"
136
144
  },
137
145
  accentAltInteractive: {
138
- DEFAULT: "purple.500/grey.100",
146
+ DEFAULT: "purple.700/purple.200",
139
147
  hover: "purple.700/grey.100"
140
148
  }
141
149
  };
142
150
  const stroke = {
143
- base: "navy.100/black.50",
151
+ base: "navy.100/black.100",
144
152
  subdued: "navy.50/black.100",
145
- strong: "navy.300/navy.200",
146
- accent: "purple.500/purpleDeep.500",
147
- accentAlt: "purple.300/purpleDeep.400",
148
- error: "red.500/red.200",
149
- errorAlt: "red.500/red.200",
153
+ accent: "purple.500/purple.400",
154
+ accentAlt: "purple.600/purple.400",
150
155
  success: "green.500/green.700",
151
156
  successAlt: "green.500/green.700",
152
- connect: "newPurple.500/newPurple.200",
153
- keyExchange: "newViolet.500/newViolet.200",
154
- picked: "green.700/green.500",
155
- rideshare: "black.1000/white",
156
- rental: "turquoise.500/turquoise.500",
157
- blocker: "navy.300/grey.300",
157
+ error: "red.500/red.200",
158
+ errorAlt: "red.500/red.200",
159
+ strong: "grey.300/grey.700",
158
160
  onAccent: "white/grey.100",
161
+ rental: "blue.700/blue.500",
162
+ blocker: "grey.200/black.50",
159
163
  onError: "white/white",
160
164
  onSuccess: "white/white",
161
- onConnect: "white/black.1000",
162
- onPicked: "white/black.1000",
163
- onKeyExchange: "white/black.1000",
165
+ connect: "newPurple.500/newPurple.200",
166
+ keyExchange: "newViolet.500/newViolet.200",
167
+ picked: "green.700/green.500",
168
+ onConnect: "white/black.75",
169
+ onKeyExchange: "white/black.75",
170
+ onPicked: "white/black.75",
164
171
  onRideshare: "white/black.1000",
165
- onBase: "white/black.1000",
172
+ rideshare: "black.1000/white",
173
+ onBase: "white/black.600",
166
174
  baseInteractive: {
167
- DEFAULT: "navy.100/black.50",
175
+ DEFAULT: "navy.100/black.100",
168
176
  hover: "navy.300/purpleDeep.400",
169
177
  press: "navy.500/purpleDeep.400"
170
178
  },
171
179
  accentInteractive: {
172
- DEFAULT: "purple.500/purpleDeep.500",
180
+ DEFAULT: "purple.500/purple.400",
173
181
  hover: "purple.700/purpleDeep.400",
174
182
  press: "purple.900/purpleDeep.400"
175
183
  },
@@ -181,8 +189,8 @@ const stroke = {
181
189
  };
182
190
  const buttonIcon = {
183
191
  selected: "purple.500/grey.100",
184
- primary: "white/grey.100",
185
- secondary: "purple.500/purpleDeep.400",
192
+ primary: "white/black.1000",
193
+ secondary: "purple.500/purple.300",
186
194
  tertiary: "purple.500/white",
187
195
  destructive: "red.500/red.200",
188
196
  success: "white/green.100",
@@ -190,12 +198,12 @@ const buttonIcon = {
190
198
  disabled: "navy.300/grey.300",
191
199
  accentAlt: "purple.500/grey.100",
192
200
  primaryInteractive: {
193
- DEFAULT: "white/grey.100",
201
+ DEFAULT: "white/black.1000",
194
202
  hover: "white/white",
195
203
  press: "white/white"
196
204
  },
197
205
  secondaryInteractive: {
198
- DEFAULT: "purple.500/purpleDeep.400",
206
+ DEFAULT: "purple.500/purple.300",
199
207
  hover: "purple.700/purpleDeep.700",
200
208
  press: "purple.900/purpleDeep.900"
201
209
  },
@@ -217,8 +225,8 @@ const buttonIcon = {
217
225
  };
218
226
  const buttonLabel = {
219
227
  selected: "purple.500/grey.100",
220
- primary: "white/grey.100",
221
- secondary: "purple.500/purpleDeep.400",
228
+ primary: "white/black.1000",
229
+ secondary: "purple.500/purple.300",
222
230
  tertiary: "purple.500/white",
223
231
  disabled: "navy.300/grey.300",
224
232
  accentAlt: "purple.500/grey.100",
@@ -226,12 +234,12 @@ const buttonLabel = {
226
234
  success: "white/green.100",
227
235
  successAlt: "green.900/green.100",
228
236
  primaryInteractive: {
229
- DEFAULT: "white/grey.100",
237
+ DEFAULT: "white/black.1000",
230
238
  hover: "white/white",
231
239
  press: "white/white"
232
240
  },
233
241
  secondaryInteractive: {
234
- DEFAULT: "purple.500/purpleDeep.400",
242
+ DEFAULT: "purple.500/purple.300",
235
243
  hover: "purple.700/purpleDeep.700",
236
244
  press: "purple.900/purpleDeep.900"
237
245
  },
@@ -251,10 +259,25 @@ const buttonLabel = {
251
259
  press: "green.900/green.100"
252
260
  }
253
261
  };
262
+ const fill = {
263
+ base: "navy.500/navy.50",
264
+ accent: "purple.500/purpleDeep.400",
265
+ secondary: "yellow.500/yellow.400",
266
+ subdued: "navy.100/black.50",
267
+ neutral: "navy.50/black.100",
268
+ negative: "red.150/red.800",
269
+ accentAlt: "purple.100/purpleDeep.900",
270
+ disabled: "navy.300/grey.300",
271
+ error: "red.500/red.500",
272
+ success: "green.500/green.700",
273
+ rental: "blue.300/blue.700",
274
+ blocker: "grey.100/black.200",
275
+ primary: "white/black.1000"
276
+ };
254
277
  const buttonBackground = {
255
278
  selected: "purple.100/purpleDeep.900",
256
- primary: "purple.500/purpleDeep.500",
257
- secondary: "white/black.500",
279
+ primary: "purple.500/purple.400",
280
+ secondary: "white/black.100",
258
281
  tertiary: "white/white",
259
282
  accentAlt: "purple.100/purpleDeep.900",
260
283
  destructive: "red.100/red.900",
@@ -262,12 +285,12 @@ const buttonBackground = {
262
285
  successAlt: "green.100/green.1000",
263
286
  disabled: "navy.100/black.50",
264
287
  primaryInteractive: {
265
- DEFAULT: "purple.500/purpleDeep.500",
288
+ DEFAULT: "purple.500/purple.400",
266
289
  hover: "purple.700/purpleDeep.700",
267
290
  press: "purple.900/purpleDeep.900"
268
291
  },
269
292
  secondaryInteractive: {
270
- DEFAULT: "white/black.500",
293
+ DEFAULT: "white/black.100",
271
294
  hover: "white/black.500",
272
295
  press: "white/black.500"
273
296
  },
@@ -283,25 +306,10 @@ const buttonBackground = {
283
306
  },
284
307
  successAltInteractive: {
285
308
  DEFAULT: "green.100/green.1000",
286
- hover: "green.120/green.900",
287
- press: "green.150/green.1000"
309
+ hover: "green.300/green.900",
310
+ press: "green.400/green.1000"
288
311
  }
289
312
  };
290
- const fill = {
291
- base: "navy.500/grey.50",
292
- subdued: "navy.100/black.50",
293
- secondary: "yellow.500/yellow.500",
294
- accent: "purple.500/purpleDeep.400",
295
- accentAlt: "purple.100/purpleDeep.900",
296
- error: "red.500/red.500",
297
- success: "green.500/green.700",
298
- neutral: "navy.50/black.100",
299
- negative: "red.150/red.800",
300
- disabled: "navy.300/grey.300",
301
- rental: "turquoise.100/turquoise.1200",
302
- blocker: "navy.120/black.75",
303
- primary: "white/black.1000"
304
- };
305
313
  const illustrations = {
306
314
  primary: "navy.500/white",
307
315
  secondary: "white/white",
@@ -315,8 +323,8 @@ var _theme = {
315
323
  stroke: stroke,
316
324
  buttonIcon: buttonIcon,
317
325
  buttonLabel: buttonLabel,
318
- buttonBackground: buttonBackground,
319
326
  fill: fill,
327
+ buttonBackground: buttonBackground,
320
328
  illustrations: illustrations
321
329
  };
322
330
 
package/tokens/theme.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"theme.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"theme.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/types/src/components/Icon/index.d.ts CHANGED
@@ -5,7 +5,7 @@ interface IconsMap {
5
5
  }
6
6
  export declare const BUNDLED_ICONS: IconsMap;
7
7
  export type IconSources = keyof typeof iconTokens.icons;
8
- export declare const iconColors: ("amber" | "blue" | "coral" | "graphite" | "graphiteLight" | "green" | "greenDark" | "greenLight" | "grey" | "greyDark" | "greyLight" | "greyLighter" | "indigo" | "indigoDark" | "purple" | "purpleLight" | "red" | "turquoise" | "white" | "base" | "subdued" | "accent" | "accentAlt" | "info" | "infoAlt" | "error" | "errorAlt" | "success" | "successAlt" | "warning" | "connect" | "connectAlt" | "keyExchange" | "picked" | "rideshare" | "driver" | "owner" | "disabled" | "disabledAlt" | "inversed" | "onAccent" | "onRideshare" | "onError" | "onSuccess" | "onConnect" | "onKeyExchange" | "onPicked" | "onBase" | "baseInteractive" | "subduedInteractive" | "accentInteractive" | "accentAltInteractive")[];
8
+ export declare const iconColors: ("amber" | "blue" | "coral" | "graphite" | "graphiteLight" | "green" | "greenDark" | "greenLight" | "grey" | "greyDark" | "greyLight" | "greyLighter" | "indigo" | "indigoDark" | "purple" | "purpleLight" | "red" | "turquoise" | "white" | "base" | "subdued" | "accent" | "accentAlt" | "info" | "error" | "errorAlt" | "success" | "successAlt" | "connect" | "connectAlt" | "driver" | "owner" | "warning" | "infoAlt" | "disabled" | "onAccent" | "onRideshare" | "onError" | "onSuccess" | "onConnect" | "onKeyExchange" | "onPicked" | "keyExchange" | "picked" | "rideshare" | "onBase" | "disabledAlt" | "onRental" | "inversed" | "baseInteractive" | "subduedInteractive" | "accentInteractive" | "accentAltInteractive")[];
9
9
  export type IconColorsType = (typeof iconColors)[number];
10
10
  export interface IconProps {
11
11
  source: IconSources;