@gouvfr-lasuite/ui-kit 0.16.2 → 0.17.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.
@@ -1,99 +1,298 @@
1
- const config = {
1
+
2
+
3
+ const designTokens = {
2
4
  themes: {
3
5
  default: {
4
- theme: {
6
+ globals: {
5
7
  colors: {
6
- "primary-text": "#000091",
7
- "primary-050": "#F5F5FE",
8
- "primary-100": "#ECECFE",
9
- "primary-150": "#F4F4FD",
10
- "primary-200": "#E3E3FD",
11
- "primary-300": "#CACAFB",
12
- "primary-400": "#8585F6",
13
- "primary-500": "#6A6AF4",
14
- "primary-600": "#313178",
15
- "primary-700": "#272747",
16
- "primary-800": "#000091",
17
- "primary-900": "#21213F",
18
- "secondary-text": "#fff",
19
- "secondary-100": "#fee9ea",
20
- "secondary-200": "#fedfdf",
21
- "secondary-300": "#fdbfbf",
22
- "secondary-400": "#e1020f",
23
- "secondary-500": "#c91a1f",
24
- "secondary-600": "#5e2b2b",
25
- "secondary-700": "#3b2424",
26
- "secondary-800": "#341f1f",
27
- "secondary-900": "#2b1919",
28
- "greyscale-text": "#303C4B",
29
- "greyscale-000": "#fff",
30
- "greyscale-050": "#F6F6F6",
31
- "greyscale-100": "#eee",
32
- "greyscale-200": "#E5E5E5",
33
- "greyscale-250": "#ddd",
34
- "greyscale-300": "#CECECE",
35
- "greyscale-350": "#ddd",
36
- "greyscale-400": "#929292",
37
- "greyscale-500": "#7C7C7C",
38
- "greyscale-600": "#666666",
39
- "greyscale-700": "#3A3A3A",
40
- "greyscale-750": "#353535",
41
- "greyscale-800": "#2A2A2A",
42
- "greyscale-900": "#242424",
43
- "greyscale-950": "#1E1E1E",
44
- "greyscale-1000": "#161616",
45
- "success-text": "#1f8d49",
46
- "success-100": "#dffee6",
47
- "success-200": "#b8fec9",
48
- "success-300": "#88fdaa",
49
- "success-400": "#3bea7e",
50
- "success-500": "#1f8d49",
51
- "success-600": "#18753c",
52
- "success-700": "#204129",
53
- "success-800": "#1e2e22",
54
- "success-900": "#19281d",
55
- "info-text": "#0078f3",
56
- "info-100": "#E8EDFF",
57
- "info-200": "#DDE5FF",
58
- "info-300": "#BCCDFF",
59
- "info-400": "#518FFF",
60
- "info-500": "#0078F3",
61
- "info-600": "#0063CB",
62
- "info-700": "#273961",
63
- "info-800": "#222A3F",
64
- "info-900": "#1D2437",
65
- "warning-text": "#d64d00",
66
- "warning-100": "#fff4f3",
67
- "warning-200": "#ffe9e6",
68
- "warning-300": "#ffded9",
69
- "warning-400": "#ffbeb4",
70
- "warning-500": "#d64d00",
71
- "warning-600": "#b34000",
72
- "warning-700": "#5e2c21",
73
- "warning-800": "#3e241e",
74
- "warning-900": "#361e19",
75
- "danger-text": "#FFF",
76
- "danger-050": "#FFF4F4",
77
- "danger-100": "#FFE9E9",
78
- "danger-200": "#FFDDDD",
79
- "danger-300": "#FFBDBD",
80
- "danger-400": "#FF5655",
81
- "danger-500": "#F60700",
82
- "danger-600": "#CE0500",
83
- "danger-700": "#642626",
84
- "danger-800": "#412121",
85
- "danger-900": "#391C1C",
86
- "blue-500": "#417DC4",
87
- "brown-500": "#BD987A",
88
- "cyan-500": "#009099",
89
- "gold-500": "#C3992A",
90
- "green-500": "#00A95F",
91
- "olive-500": "#68A532",
92
- "orange-500": "#E4794A",
93
- "purple-500": "#A558A0",
94
- "red-500": "#E1000F",
95
- "yellow-500": "#B7A73F",
96
- "rose-500": "#E18B76",
8
+ "brand-050": "#EDF0FF",
9
+ "brand-100": "#DAE2FF",
10
+ "brand-150": "#C8D3FF",
11
+ "brand-200": "#B5C4FF",
12
+ "brand-250": "#A2B6FF",
13
+ "brand-300": "#90A7FF",
14
+ "brand-350": "#7E98FF",
15
+ "brand-400": "#6C89FE",
16
+ "brand-450": "#5C7AF7",
17
+ "brand-500": "#4C6CEF",
18
+ "brand-550": "#3E5DE7",
19
+ "brand-600": "#304DDF",
20
+ "brand-650": "#2845C1",
21
+ "brand-700": "#223E9E",
22
+ "brand-750": "#1F367D",
23
+ "brand-800": "#1B2E5F",
24
+ "brand-850": "#172446",
25
+ "brand-900": "#121B30",
26
+ "brand-950": "#0C111A",
27
+ "gray-000": "#FFFFFF",
28
+ "gray-025": "#F6F8F9",
29
+ "gray-050": "#EEF1F4",
30
+ "gray-100": "#DFE2EA",
31
+ "gray-150": "#CFD5DE",
32
+ "gray-200": "#C1C7D3",
33
+ "gray-250": "#B2B9C7",
34
+ "gray-300": "#A4ABBC",
35
+ "gray-350": "#969EB0",
36
+ "gray-400": "#8891A4",
37
+ "gray-450": "#7B8498",
38
+ "gray-500": "#6D778C",
39
+ "gray-550": "#626A80",
40
+ "gray-600": "#555E74",
41
+ "gray-650": "#4A5267",
42
+ "gray-700": "#3F4759",
43
+ "gray-750": "#363B4C",
44
+ "gray-800": "#2B303D",
45
+ "gray-850": "#222631",
46
+ "gray-900": "#181B24",
47
+ "gray-950": "#0F1117",
48
+ "gray-1000": "#000000",
49
+ "info-050": "#E7F2FF",
50
+ "info-100": "#CFE5FF",
51
+ "info-150": "#B7D7FF",
52
+ "info-200": "#A0CAFE",
53
+ "info-250": "#8CBCF9",
54
+ "info-300": "#77AEF4",
55
+ "info-350": "#63A0EE",
56
+ "info-400": "#5092E7",
57
+ "info-450": "#4185DC",
58
+ "info-500": "#3677CC",
59
+ "info-550": "#2F6ABB",
60
+ "info-600": "#265EAA",
61
+ "info-650": "#28528F",
62
+ "info-700": "#274775",
63
+ "info-750": "#243C5E",
64
+ "info-800": "#20314A",
65
+ "info-850": "#1B2637",
66
+ "info-900": "#141C27",
67
+ "info-950": "#0D1118",
68
+ "success-050": "#DEF7E6",
69
+ "success-100": "#BAEECF",
70
+ "success-150": "#A5E2C0",
71
+ "success-200": "#95D4B3",
72
+ "success-250": "#85C6A7",
73
+ "success-300": "#74B99B",
74
+ "success-350": "#65AB8F",
75
+ "success-400": "#579E84",
76
+ "success-450": "#4B9079",
77
+ "success-500": "#40836F",
78
+ "success-550": "#367664",
79
+ "success-600": "#2B695A",
80
+ "success-650": "#2C5A50",
81
+ "success-700": "#2A4D45",
82
+ "success-750": "#26403C",
83
+ "success-800": "#213430",
84
+ "success-850": "#1B2826",
85
+ "success-900": "#151D1C",
86
+ "success-950": "#0D1212",
87
+ "warning-050": "#FFEEDF",
88
+ "warning-100": "#FFDCBE",
89
+ "warning-150": "#FFCA9C",
90
+ "warning-200": "#FFB778",
91
+ "warning-250": "#FDA54F",
92
+ "warning-300": "#F59425",
93
+ "warning-350": "#E78613",
94
+ "warning-400": "#D7790C",
95
+ "warning-450": "#C86C08",
96
+ "warning-500": "#B85F03",
97
+ "warning-550": "#A75400",
98
+ "warning-600": "#984800",
99
+ "warning-650": "#814112",
100
+ "warning-700": "#6C3A19",
101
+ "warning-750": "#58321C",
102
+ "warning-800": "#452A1A",
103
+ "warning-850": "#352117",
104
+ "warning-900": "#261813",
105
+ "warning-950": "#170F0C",
106
+ "error-050": "#FFEDEB",
107
+ "error-100": "#FFDAD7",
108
+ "error-150": "#FFC7C2",
109
+ "error-200": "#FFB3AD",
110
+ "error-250": "#FF9F99",
111
+ "error-300": "#FF8984",
112
+ "error-350": "#FF706E",
113
+ "error-400": "#FB5759",
114
+ "error-450": "#F63A45",
115
+ "error-500": "#E32C39",
116
+ "error-550": "#CF202D",
117
+ "error-600": "#BD0F23",
118
+ "error-650": "#9D2227",
119
+ "error-700": "#812727",
120
+ "error-750": "#672624",
121
+ "error-800": "#512220",
122
+ "error-850": "#3D1C1B",
123
+ "error-900": "#2A1614",
124
+ "error-950": "#190E0D",
125
+ "red-050": "#FFEDEB",
126
+ "red-100": "#FFDAD7",
127
+ "red-150": "#FFC7C2",
128
+ "red-200": "#FFB3AD",
129
+ "red-250": "#FF9F99",
130
+ "red-300": "#FF8984",
131
+ "red-350": "#FF706E",
132
+ "red-400": "#FB5759",
133
+ "red-450": "#F63A45",
134
+ "red-500": "#E32C39",
135
+ "red-550": "#CF202D",
136
+ "red-600": "#BD0F23",
137
+ "red-650": "#9D2227",
138
+ "red-700": "#812727",
139
+ "red-750": "#672624",
140
+ "red-800": "#512220",
141
+ "red-850": "#3D1C1B",
142
+ "red-900": "#2A1614",
143
+ "red-950": "#190E0D",
144
+ "orange-050": "#FCEDEB",
145
+ "orange-100": "#F8DCD7",
146
+ "orange-150": "#F1CCC5",
147
+ "orange-200": "#EABCB4",
148
+ "orange-250": "#E2ACA2",
149
+ "orange-300": "#DA9C92",
150
+ "orange-350": "#D28C81",
151
+ "orange-400": "#CA7C70",
152
+ "orange-450": "#BE6E62",
153
+ "orange-500": "#AE6257",
154
+ "orange-550": "#9E564D",
155
+ "orange-600": "#8F4B42",
156
+ "orange-650": "#79443D",
157
+ "orange-700": "#643C37",
158
+ "orange-750": "#513430",
159
+ "orange-800": "#412B28",
160
+ "orange-850": "#312220",
161
+ "orange-900": "#231918",
162
+ "orange-950": "#150F0F",
163
+ "brown-050": "#F9EFEA",
164
+ "brown-100": "#F3DFD3",
165
+ "brown-150": "#EACFC1",
166
+ "brown-200": "#E2BFAE",
167
+ "brown-250": "#D8B19C",
168
+ "brown-300": "#D0A189",
169
+ "brown-350": "#C3937B",
170
+ "brown-400": "#B5866D",
171
+ "brown-450": "#A77A62",
172
+ "brown-500": "#996D57",
173
+ "brown-550": "#8B614D",
174
+ "brown-600": "#7C5542",
175
+ "brown-650": "#6A4C3C",
176
+ "brown-700": "#594236",
177
+ "brown-750": "#49382F",
178
+ "brown-800": "#3B2E28",
179
+ "brown-850": "#2D2420",
180
+ "brown-900": "#201A18",
181
+ "brown-950": "#13100F",
182
+ "yellow-050": "#FDF1C5",
183
+ "yellow-100": "#FBE18E",
184
+ "yellow-150": "#F4D261",
185
+ "yellow-200": "#EAC244",
186
+ "yellow-250": "#DFB41B",
187
+ "yellow-300": "#D1A516",
188
+ "yellow-350": "#C49711",
189
+ "yellow-400": "#B78A0C",
190
+ "yellow-450": "#A87D07",
191
+ "yellow-500": "#9B6F02",
192
+ "yellow-550": "#8D6300",
193
+ "yellow-600": "#7F5600",
194
+ "yellow-650": "#6E4C11",
195
+ "yellow-700": "#5D4219",
196
+ "yellow-750": "#4D371B",
197
+ "yellow-800": "#3D2E1A",
198
+ "yellow-850": "#2F2417",
199
+ "yellow-900": "#221A12",
200
+ "yellow-950": "#14100C",
201
+ "green-050": "#E7F9B3",
202
+ "green-100": "#D5EC98",
203
+ "green-150": "#C5DE86",
204
+ "green-200": "#B5D174",
205
+ "green-250": "#A5C464",
206
+ "green-300": "#95B755",
207
+ "green-350": "#85AA45",
208
+ "green-400": "#769D39",
209
+ "green-450": "#688F30",
210
+ "green-500": "#5A8228",
211
+ "green-550": "#4D7621",
212
+ "green-600": "#416919",
213
+ "green-650": "#3A5B20",
214
+ "green-700": "#324E22",
215
+ "green-750": "#2C4122",
216
+ "green-800": "#24351D",
217
+ "green-850": "#1D2919",
218
+ "green-900": "#161E13",
219
+ "green-950": "#0E120C",
220
+ "blue1-050": "#E7F2FF",
221
+ "blue1-100": "#CFE5FF",
222
+ "blue1-150": "#B7D7FF",
223
+ "blue1-200": "#A0CAFE",
224
+ "blue1-250": "#8CBCF9",
225
+ "blue1-300": "#77AEF4",
226
+ "blue1-350": "#63A0EE",
227
+ "blue1-400": "#5092E7",
228
+ "blue1-450": "#4185DC",
229
+ "blue1-500": "#3677CC",
230
+ "blue1-550": "#2F6ABB",
231
+ "blue1-600": "#265EAA",
232
+ "blue1-650": "#28528F",
233
+ "blue1-700": "#274775",
234
+ "blue1-750": "#243C5E",
235
+ "blue1-800": "#20314A",
236
+ "blue1-850": "#1B2637",
237
+ "blue1-900": "#141C27",
238
+ "blue1-950": "#0D1118",
239
+ "blue2-050": "#E2F4FD",
240
+ "blue2-100": "#C4E8F8",
241
+ "blue2-150": "#AADCF2",
242
+ "blue2-200": "#93CFEB",
243
+ "blue2-250": "#7CC2E2",
244
+ "blue2-300": "#6CB4D6",
245
+ "blue2-350": "#5CA7C9",
246
+ "blue2-400": "#5099BC",
247
+ "blue2-450": "#458BAE",
248
+ "blue2-500": "#3A7EA0",
249
+ "blue2-550": "#327191",
250
+ "blue2-600": "#286483",
251
+ "blue2-650": "#2B5770",
252
+ "blue2-700": "#294A5E",
253
+ "blue2-750": "#263E4D",
254
+ "blue2-800": "#22323D",
255
+ "blue2-850": "#1C272E",
256
+ "blue2-900": "#151D21",
257
+ "blue2-950": "#0E1114",
258
+ "purple-050": "#F5EEFF",
259
+ "purple-100": "#ECDCFF",
260
+ "purple-150": "#E2CBFF",
261
+ "purple-200": "#D9B9FF",
262
+ "purple-250": "#D0A7FF",
263
+ "purple-300": "#C894FE",
264
+ "purple-350": "#BE83FA",
265
+ "purple-400": "#B570F5",
266
+ "purple-450": "#AB5EF0",
267
+ "purple-500": "#A04BE8",
268
+ "purple-550": "#933CDB",
269
+ "purple-600": "#8530C8",
270
+ "purple-650": "#7033A5",
271
+ "purple-700": "#5D3185",
272
+ "purple-750": "#4C2C6A",
273
+ "purple-800": "#3C2652",
274
+ "purple-850": "#2D203C",
275
+ "purple-900": "#21182A",
276
+ "purple-950": "#130F19",
277
+ "pink-050": "#FFEBF6",
278
+ "pink-100": "#FFD8ED",
279
+ "pink-150": "#FCC4E3",
280
+ "pink-200": "#F7B2D9",
281
+ "pink-250": "#F29FCE",
282
+ "pink-300": "#ED8CC3",
283
+ "pink-350": "#E779B8",
284
+ "pink-400": "#E264AD",
285
+ "pink-450": "#D2579E",
286
+ "pink-500": "#C24B8E",
287
+ "pink-550": "#B0417F",
288
+ "pink-600": "#9F3670",
289
+ "pink-650": "#873560",
290
+ "pink-700": "#6F3250",
291
+ "pink-750": "#5A2C43",
292
+ "pink-800": "#472635",
293
+ "pink-850": "#351F29",
294
+ "pink-900": "#26171D",
295
+ "pink-950": "#170F12"
97
296
  },
98
297
  font: {
99
298
  sizes: {
@@ -156,192 +355,68 @@ const config = {
156
355
  tablet: "1024px",
157
356
  },
158
357
  },
358
+
159
359
  components: {
160
360
  modal: {
161
361
  "width-small": "342px",
162
362
  },
163
363
  tooltip: {
164
364
  padding: "4px 8px",
165
- "background-color": "ref(theme.colors.greyscale-1000)",
365
+ "background-color": "ref(globals.colors.greyscale-1000)",
166
366
  },
167
367
  button: {
168
368
  "medium-height": "40px",
169
369
  "medium-text-height": "40px",
170
370
  "border-radius": "4px",
171
- "small-height": "26px",
172
- primary: {
173
- "background--color": "ref(theme.colors.primary-text)",
174
- "background--color-hover": "#1212ff",
175
- "background--color-active": "#2323ff",
176
- "background--color-disabled":
177
- "ref(theme.colors.greyscale-100)",
178
- color: "#fff",
179
- "color-hover": "#fff",
180
- "color-active": "#fff",
181
- "color-focus-visible": "#fff",
182
- disabled: "ref(theme.colors.greyscale-500)",
183
- },
184
- "primary-text": {
185
- "background--color": "ref(theme.colors.primary-text)",
186
- "background--color-hover": "ref(theme.colors.greyscale-100)",
187
- "background--color-active": "ref(theme.colors.primary-100)",
188
- "background--color-focus-visible": "#fff",
189
- "background--color-disabled":
190
- "ref(theme.colors.greyscale-000)",
191
- color: "ref(theme.colors.primary-800)",
192
- "color-hover": "ref(theme.colors.primary-800)",
193
- disabled: "ref(theme.colors.greyscale-400)",
194
- },
195
- secondary: {
196
- "background--color-hover": "#F6F6F6",
197
- "background--color-active": "#EDEDED",
198
- "background--color-focus-visible":
199
- "ref(theme.colors.greyscale-000)",
200
- "background--disabled": "ref(theme.colors.greyscale-000)",
201
- color: "ref(theme.colors.primary-800)",
202
- "border--color": "ref(theme.colors.greyscale-300)",
203
- "border--color-hover": "ref(theme.colors.greyscale-300)",
204
- "border--color-disabled": "ref(theme.colors.greyscale-300)",
205
- disabled: "ref(theme.colors.greyscale-400)",
206
- },
207
- tertiary: {
208
- "background--color": "ref(theme.colors.primary-100)",
209
- "background--color-focus-visible":
210
- "ref(theme.colors.primary-100)",
211
- "background--color-hover": "ref(theme.colors.primary-300)",
212
- "background--color-active": "ref(theme.colors.primary-300)",
213
- "background--disabled": "ref(theme.colors.primary-050)",
214
- color: "ref(theme.colors.primary-800)",
215
- disabled: "ref(theme.colors.primary-300)",
216
- },
217
- "tertiary-text": {
218
- "background--color-hover": "ref(theme.colors.greyscale-100)",
219
- "color-hover": "ref(theme.colors.primary-text)",
220
- color: "ref(theme.colors.primary-600)",
221
- disabled: "ref(theme.colors.primary-300)",
222
- },
223
- danger: {
224
- "color-hover": "white",
225
- "background--color": "ref(theme.colors.danger-600)",
226
- "background--color-hover": "#FF2725",
227
- "background--color-focus-visible":
228
- "ref(theme.colors.danger-600)",
229
- "background--color-disabled":
230
- "ref(theme.colors.greyscale-100)",
231
- "color-disabled": "ref(theme.colors.greyscale-400)",
232
- },
371
+ "border-radius--active": "4px",
372
+ "border-radius--focus": "4px",
233
373
  },
234
374
  datagrid: {
235
- "header--color": "ref(theme.colors.greyscale-600)",
375
+ "header--color": "ref(contextuals.content.semantic.neutral.primary)",
236
376
  "header--size": "12px",
237
377
  "header--weight": "500",
238
- "body--background-color-hover": "ref(theme.colors.greyscale-100)",
378
+ "body--background-color-hover": "ref(contextuals.background.semantic.neutral.tertiary)",
239
379
  },
240
380
  "forms-checkbox": {
241
- "border-radius": "4px",
242
- "border-color": "ref(theme.colors.primary-800)",
243
- "background-color--hover": "ref(theme.colors.greyscale-100)",
244
- "border--color-disabled": "ref(theme.colors.greyscale-200)",
245
- "border--color": "ref(theme.colors.primary-800)",
246
- "background--disabled": "ref(theme.colors.greyscale-200)",
247
- "background--enable": "ref(theme.colors.primary-800)",
248
- "check--disabled": "ref(theme.colors.greyscale-300)",
249
- "check--enable": "ref(theme.colors.greyscale-000)",
250
- color: "ref(theme.colors.primary-text)",
251
- "label--color": "ref(theme.colors.greyscale-1000)",
252
- "label--size": "ref(theme.font.sizes.sm)",
253
- "label--weight": "500",
254
- "text--color": "ref(theme.colors.greyscale-600)",
255
- "text--size": "ref(theme.font.sizes.s)",
256
- "text--weight": "400",
257
- "text--color-disabled": "ref(theme.colors.greyscale-300)",
258
- },
259
- "forms-labelledbox": {
260
- "label-color--small": "ref(theme.colors.greyscale-950)",
261
- "label-color--small--disabled": "ref(theme.colors.greyscale-300)",
262
- "label-color--big": "ref(theme.colors.greyscale-950)",
263
- "label-color--big--disabled": "ref(theme.colors.greyscale-300)",
264
- },
265
- "forms-radio": {
266
- "border-color": "ref(theme.colors.primary-800)",
267
- "background-color": "ref(theme.colors.greyscale-000)",
268
- "accent-color": "ref(theme.colors.primary-800)",
269
- "accent-color-disabled": "ref(theme.colors.greyscale-300)",
270
- },
271
- "forms-switch": {
272
- "border--color-disabled": "ref(theme.colors.greyscale-300)",
273
- "border--color": "ref(theme.colors.primary-800)",
274
- "handle-background-color": "white",
275
- "handle-background-color--disabled":
276
- "ref(theme.colors.greyscale-000)",
277
- "rail-background-color--disabled":
278
- "ref(theme.colors.greyscale-000)",
279
- "accent-color": "ref(theme.colors.primary-800)",
280
- },
281
- "forms-textarea": {
282
- "label-color--focus": "ref(theme.colors.greyscale-1000)",
283
- "border-radius": "4px",
284
- "border-color": "ref(theme.colors.greyscale-400)",
285
- "box-shadow--color--hover": "ref(theme.colors.greyscale-400)",
286
- "box-shadow--color--focus": "ref(theme.colors.primary-800)",
287
- "value-color": "ref(theme.colors.greyscale-950)",
288
- "value-color--disabled": "ref(theme.colors.greyscale-300)",
289
- "font-size": "14px",
290
- },
291
- "forms-input": {
292
- "label-color--focus": "ref(theme.colors.greyscale-1000)",
293
- "border-radius": "4px",
294
- "border-color": "ref(theme.colors.greyscale-400)",
295
- "box-shadow--color--hover": "ref(theme.colors.greyscale-400)",
296
- "box-shadow--color--focus": "ref(theme.colors.primary-800)",
297
- "value-color": "ref(theme.colors.greyscale-950)",
298
- "value-color--disabled": "ref(theme.colors.greyscale-300)",
299
- "font-size": "14px",
300
- },
301
- "forms-select": {
302
- "label-color--focus": "ref(theme.colors.greyscale-1000)",
303
- "item-font-size": "14px",
304
- "border-radius": "4px",
305
- "border-radius-hover": "4px",
306
- "border-color": "ref(theme.colors.greyscale-400)",
307
- "box-shadow--color--hover": "ref(theme.colors.greyscale-400)",
308
- "box-shadow--color--focus": "ref(theme.colors.primary-800)",
309
- "value-color": "ref(theme.colors.greyscale-950)",
310
- "font-size": "14px",
381
+ "font-size": "ref(globals.font.sizes.sm)",
311
382
  },
312
383
  "badge": {
313
- "font-size": "ref(theme.font.sizes.xs)",
314
- "border-radius": "4px",
315
- "padding-inline": "ref(theme.spacings.xs)",
316
- "padding-block": "ref(theme.spacings.2xs)",
384
+ "font-size": "ref(globals.font.sizes.xs)",
385
+ "border-radius": "12px",
386
+ "padding-inline": "ref(globals.spacings.xs)",
387
+ "padding-block": "ref(globals.spacings.2xs)",
317
388
  "accent": {
318
- "background-color": "ref(theme.colors.primary-100)",
319
- "color": "ref(theme.colors.primary-600)",
389
+ "background-color": "ref(contextuals.background.semantic.brand.secondary)",
390
+ "color": "ref(contextuals.content.semantic.brand.secondary)",
320
391
  },
321
392
  "neutral": {
322
- "background-color": "ref(theme.colors.greyscale-100)",
323
- "color": "ref(theme.colors.greyscale-600)",
393
+ "background-color": "ref(contextuals.background.semantic.neutral.secondary)",
394
+ "color": "ref(contextuals.content.semantic.neutral.secondary)",
324
395
  },
325
396
  "danger": {
326
- "background-color": "ref(theme.colors.danger-100)",
327
- "color": "ref(theme.colors.danger-600)",
397
+ "background-color": "ref(contextuals.background.semantic.error.secondary)",
398
+ "color": "ref(contextuals.content.semantic.error.secondary)",
328
399
  },
329
400
  "success": {
330
- "background-color": "ref(theme.colors.success-100)",
331
- "color": "ref(theme.colors.success-600)",
401
+ "background-color": "ref(contextuals.background.semantic.success.secondary)",
402
+ "color": "ref(contextuals.content.semantic.success.secondary)",
332
403
  },
333
404
  "warning": {
334
- "background-color": "ref(theme.colors.warning-100)",
335
- "color": "ref(theme.colors.warning-600)",
405
+ "background-color": "ref(contextuals.background.semantic.warning.secondary)",
406
+ "color": "ref(contextuals.content.semantic.warning.secondary)",
336
407
  },
337
408
  "info": {
338
- "background-color": "ref(theme.colors.info-100)",
339
- "color": "ref(theme.colors.info-600)",
409
+ "background-color": "ref(contextuals.background.semantic.info.secondary)",
410
+ "color": "ref(contextuals.content.semantic.info.secondary)",
340
411
  },
341
412
  },
342
413
  },
343
414
  },
344
- },
415
+ }
345
416
  };
346
417
 
418
+ const config = { ...designTokens };
419
+
347
420
  export default config;
421
+
422
+