welcome-ui 7.0.0 → 7.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +129 -0
- package/dist/Checkbox.js +1 -1
- package/dist/Checkbox.mjs +1 -1
- package/dist/{CustomInput-BCCxIle7.mjs → CustomInput-Cewo45Hd.mjs} +1 -1
- package/dist/{CustomInput-CDNZy-pz.js → CustomInput-DVH2rh9-.js} +1 -1
- package/dist/DatePicker.js +1 -1
- package/dist/DatePicker.mjs +1 -1
- package/dist/DateTimePicker.js +1 -1
- package/dist/DateTimePicker.mjs +1 -1
- package/dist/DateTimePickerCommon.js +1 -1
- package/dist/DateTimePickerCommon.mjs +1 -1
- package/dist/InputText.js +1 -1
- package/dist/InputText.mjs +1 -1
- package/dist/Radio.js +1 -1
- package/dist/Radio.mjs +1 -1
- package/dist/RadioTab.js +1 -1
- package/dist/RadioTab.mjs +1 -1
- package/dist/Search.js +1 -1
- package/dist/Search.mjs +1 -1
- package/dist/Select.js +1 -1
- package/dist/Select.mjs +1 -1
- package/dist/Tabs.js +9 -9
- package/dist/Tabs.mjs +83 -90
- package/dist/Textarea.js +1 -1
- package/dist/Textarea.mjs +1 -1
- package/dist/TimePicker.js +1 -1
- package/dist/TimePicker.mjs +1 -1
- package/dist/Toast.js +6 -6
- package/dist/Toast.mjs +18 -19
- package/dist/Toggle.js +1 -1
- package/dist/Toggle.mjs +1 -1
- package/dist/WuiProvider.js +12 -12
- package/dist/WuiProvider.mjs +21 -20
- package/dist/{field-styles-CeV7pnOp.mjs → field-styles-DLIhqG_8.mjs} +3 -3
- package/dist/{field-styles-D_gf6ypV.js → field-styles-DYEc1l_A.js} +1 -1
- package/dist/{index-CDjY0N2Z.mjs → index-BSdL4wPb.mjs} +1 -1
- package/dist/{index-CUtaVckz.js → index-Dn-QEAu6.js} +1 -1
- package/dist/theme.js +5 -5
- package/dist/theme.mjs +613 -532
- package/dist/types/components/Field/index.d.ts +2 -2
- package/dist/types/components/Field/styles.d.ts +3 -3
- package/dist/types/components/Select/styles.d.ts +3 -3
- package/dist/types/components/Toast/index.d.ts +5 -7
- package/dist/types/components/WuiProvider/index.d.ts +4 -0
- package/dist/types/theme/defaultFields.d.ts +3 -3
- package/dist/types/utils/field-styles.d.ts +4 -8
- package/dist/types/utils/index.d.ts +7 -3
- package/dist/use-fork-ref-Bjf1e56Z.js +1 -0
- package/dist/use-fork-ref-CUZErtAC.mjs +14 -0
- package/dist/utils.js +1 -1
- package/dist/utils.mjs +36 -26
- package/package.json +3 -1
package/dist/theme.mjs
CHANGED
|
@@ -1,82 +1,163 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { css as
|
|
3
|
-
import {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
const o = { ...e };
|
|
8
|
-
for (const n in r)
|
|
9
|
-
r.hasOwnProperty(n) && (o[n] = p(o[n], r[n]));
|
|
10
|
-
return o;
|
|
2
|
+
import { css as w, rpxTransformers as A, defaultTheme as E } from "@xstyled/styled-components";
|
|
3
|
+
import { g as _ } from "./_commonjsHelpers-CXJ7dpIk.mjs";
|
|
4
|
+
import { h as p } from "./hex-to-rgba-BIDK-3ab.mjs";
|
|
5
|
+
function R(o) {
|
|
6
|
+
return o != null && typeof o == "object" && o["@@functional/placeholder"] === !0;
|
|
11
7
|
}
|
|
12
|
-
|
|
13
|
-
|
|
8
|
+
var F = R, L = F;
|
|
9
|
+
function I(o) {
|
|
10
|
+
return function r(e) {
|
|
11
|
+
return arguments.length === 0 || L(e) ? r : o.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
}
|
|
14
|
+
var W = I, y = W, h = F;
|
|
15
|
+
function H(o) {
|
|
16
|
+
return function r(e, n) {
|
|
17
|
+
switch (arguments.length) {
|
|
18
|
+
case 0:
|
|
19
|
+
return r;
|
|
20
|
+
case 1:
|
|
21
|
+
return h(e) ? r : y(function(a) {
|
|
22
|
+
return o(e, a);
|
|
23
|
+
});
|
|
24
|
+
default:
|
|
25
|
+
return h(e) && h(n) ? r : h(e) ? y(function(a) {
|
|
26
|
+
return o(a, n);
|
|
27
|
+
}) : h(n) ? y(function(a) {
|
|
28
|
+
return o(e, a);
|
|
29
|
+
}) : o(e, n);
|
|
30
|
+
}
|
|
31
|
+
};
|
|
32
|
+
}
|
|
33
|
+
var S = H, f = W, m = S, c = F;
|
|
34
|
+
function U(o) {
|
|
35
|
+
return function r(e, n, a) {
|
|
36
|
+
switch (arguments.length) {
|
|
37
|
+
case 0:
|
|
38
|
+
return r;
|
|
39
|
+
case 1:
|
|
40
|
+
return c(e) ? r : m(function(l, d) {
|
|
41
|
+
return o(e, l, d);
|
|
42
|
+
});
|
|
43
|
+
case 2:
|
|
44
|
+
return c(e) && c(n) ? r : c(e) ? m(function(l, d) {
|
|
45
|
+
return o(l, n, d);
|
|
46
|
+
}) : c(n) ? m(function(l, d) {
|
|
47
|
+
return o(e, l, d);
|
|
48
|
+
}) : f(function(l) {
|
|
49
|
+
return o(e, n, l);
|
|
50
|
+
});
|
|
51
|
+
default:
|
|
52
|
+
return c(e) && c(n) && c(a) ? r : c(e) && c(n) ? m(function(l, d) {
|
|
53
|
+
return o(l, d, a);
|
|
54
|
+
}) : c(e) && c(a) ? m(function(l, d) {
|
|
55
|
+
return o(l, n, d);
|
|
56
|
+
}) : c(n) && c(a) ? m(function(l, d) {
|
|
57
|
+
return o(e, l, d);
|
|
58
|
+
}) : c(e) ? f(function(l) {
|
|
59
|
+
return o(l, n, a);
|
|
60
|
+
}) : c(n) ? f(function(l) {
|
|
61
|
+
return o(e, l, a);
|
|
62
|
+
}) : c(a) ? f(function(l) {
|
|
63
|
+
return o(e, n, l);
|
|
64
|
+
}) : o(e, n, a);
|
|
65
|
+
}
|
|
66
|
+
};
|
|
67
|
+
}
|
|
68
|
+
var T = U;
|
|
69
|
+
function O(o) {
|
|
70
|
+
return Object.prototype.toString.call(o) === "[object Object]";
|
|
71
|
+
}
|
|
72
|
+
var N = O;
|
|
73
|
+
function j(o, r) {
|
|
74
|
+
return Object.prototype.hasOwnProperty.call(r, o);
|
|
75
|
+
}
|
|
76
|
+
var P = j, G = T, x = P, M = /* @__PURE__ */ G(function(r, e, n) {
|
|
77
|
+
var a = {}, l;
|
|
78
|
+
e = e || {}, n = n || {};
|
|
79
|
+
for (l in e)
|
|
80
|
+
x(l, e) && (a[l] = x(l, n) ? r(l, e[l], n[l]) : e[l]);
|
|
81
|
+
for (l in n)
|
|
82
|
+
x(l, n) && !x(l, a) && (a[l] = n[l]);
|
|
83
|
+
return a;
|
|
84
|
+
}), K = M, Y = T, $ = N, J = K, X = /* @__PURE__ */ Y(function o(r, e, n) {
|
|
85
|
+
return J(function(a, l, d) {
|
|
86
|
+
return $(l) && $(d) ? o(r, l, d) : r(a, l, d);
|
|
87
|
+
}, e, n);
|
|
88
|
+
}), Z = X, q = S, Q = Z, V = /* @__PURE__ */ q(function(r, e) {
|
|
89
|
+
return Q(function(n, a, l) {
|
|
90
|
+
return l;
|
|
91
|
+
}, r, e);
|
|
92
|
+
}), rr = V;
|
|
93
|
+
const v = /* @__PURE__ */ _(rr), er = (o) => {
|
|
94
|
+
const { borderWidths: r, colors: e, fontSizes: n, radii: a, space: l, texts: d, transitions: i } = o;
|
|
14
95
|
return {
|
|
15
|
-
padding:
|
|
96
|
+
padding: l.lg,
|
|
16
97
|
wrapper: {
|
|
17
|
-
backgroundColor:
|
|
18
|
-
transition:
|
|
19
|
-
border: `${r.sm} solid ${
|
|
20
|
-
borderRadius:
|
|
98
|
+
backgroundColor: e["neutral-10"],
|
|
99
|
+
transition: i.medium,
|
|
100
|
+
border: `${r.sm} solid ${e["neutral-30"]}`,
|
|
101
|
+
borderRadius: a.md
|
|
21
102
|
},
|
|
22
103
|
icon: {
|
|
23
|
-
color:
|
|
104
|
+
color: e["neutral-90"]
|
|
24
105
|
},
|
|
25
106
|
content: {
|
|
26
107
|
fontSize: n.sm
|
|
27
108
|
},
|
|
28
|
-
title:
|
|
109
|
+
title: d.h5
|
|
29
110
|
};
|
|
30
|
-
},
|
|
31
|
-
const { borderWidths: r, colors:
|
|
32
|
-
backgroundColor:
|
|
33
|
-
borderColor:
|
|
34
|
-
color:
|
|
111
|
+
}, or = (o) => {
|
|
112
|
+
const { borderWidths: r, colors: e, fontSizes: n, fontWeights: a, radii: l, space: d } = o, i = (s) => ({
|
|
113
|
+
backgroundColor: e[`${s}-10`],
|
|
114
|
+
borderColor: e[`${s}-10`],
|
|
115
|
+
color: e[`${s}-90`]
|
|
35
116
|
});
|
|
36
117
|
return {
|
|
37
118
|
default: {
|
|
38
|
-
backgroundColor:
|
|
39
|
-
borderColor:
|
|
40
|
-
borderRadius:
|
|
119
|
+
backgroundColor: e["neutral-10"],
|
|
120
|
+
borderColor: e["neutral-30"],
|
|
121
|
+
borderRadius: l.lg,
|
|
41
122
|
borderStyle: "solid",
|
|
42
123
|
borderWidth: r.sm,
|
|
43
|
-
color:
|
|
124
|
+
color: e["neutral-80"],
|
|
44
125
|
fontSize: n.sm
|
|
45
126
|
},
|
|
46
127
|
title: {
|
|
47
128
|
default: {
|
|
48
|
-
color:
|
|
49
|
-
fontWeight:
|
|
129
|
+
color: e["neutral-90"],
|
|
130
|
+
fontWeight: a.medium
|
|
50
131
|
},
|
|
51
132
|
sizes: {
|
|
52
133
|
sm: {
|
|
53
|
-
marginBottom:
|
|
134
|
+
marginBottom: d.xs
|
|
54
135
|
},
|
|
55
136
|
md: {
|
|
56
|
-
marginBottom:
|
|
137
|
+
marginBottom: d.sm
|
|
57
138
|
}
|
|
58
139
|
}
|
|
59
140
|
},
|
|
60
|
-
danger:
|
|
61
|
-
warning:
|
|
62
|
-
info:
|
|
63
|
-
success:
|
|
141
|
+
danger: i("red"),
|
|
142
|
+
warning: i("orange"),
|
|
143
|
+
info: i("blue"),
|
|
144
|
+
success: i("green"),
|
|
64
145
|
beige: {
|
|
65
|
-
backgroundColor:
|
|
66
|
-
borderColor:
|
|
67
|
-
color:
|
|
146
|
+
backgroundColor: e["beige-20"],
|
|
147
|
+
borderColor: e["beige-20"],
|
|
148
|
+
color: e["beige-80"]
|
|
68
149
|
},
|
|
69
150
|
sizes: {
|
|
70
151
|
sm: {
|
|
71
|
-
padding:
|
|
152
|
+
padding: d.lg
|
|
72
153
|
},
|
|
73
154
|
md: {
|
|
74
|
-
padding:
|
|
155
|
+
padding: d.xl
|
|
75
156
|
}
|
|
76
157
|
}
|
|
77
158
|
};
|
|
78
|
-
},
|
|
79
|
-
const { colors: r, fontWeights:
|
|
159
|
+
}, tr = (o) => {
|
|
160
|
+
const { colors: r, fontWeights: e, toRem: n } = o;
|
|
80
161
|
return {
|
|
81
162
|
sizes: {
|
|
82
163
|
sm: n(20),
|
|
@@ -87,15 +168,15 @@ const w = (e) => {
|
|
|
87
168
|
},
|
|
88
169
|
text: {
|
|
89
170
|
color: r["neutral-90"],
|
|
90
|
-
fontWeight:
|
|
171
|
+
fontWeight: e.bold
|
|
91
172
|
}
|
|
92
173
|
};
|
|
93
|
-
},
|
|
94
|
-
const { colors: r, fontWeights:
|
|
174
|
+
}, nr = (o) => {
|
|
175
|
+
const { colors: r, fontWeights: e, space: n, texts: a, toRem: l } = o;
|
|
95
176
|
return {
|
|
96
177
|
default: {
|
|
97
|
-
...
|
|
98
|
-
fontWeight:
|
|
178
|
+
...a.xs,
|
|
179
|
+
fontWeight: e.medium
|
|
99
180
|
},
|
|
100
181
|
variants: {
|
|
101
182
|
default: {
|
|
@@ -120,22 +201,22 @@ const w = (e) => {
|
|
|
120
201
|
sizes: {
|
|
121
202
|
sm: {
|
|
122
203
|
padding: n.xxs,
|
|
123
|
-
height:
|
|
124
|
-
borderRadius:
|
|
204
|
+
height: l(16),
|
|
205
|
+
borderRadius: l(14)
|
|
125
206
|
},
|
|
126
207
|
md: {
|
|
127
208
|
padding: n.xs,
|
|
128
|
-
height:
|
|
129
|
-
borderRadius:
|
|
209
|
+
height: l(20),
|
|
210
|
+
borderRadius: l(14)
|
|
130
211
|
}
|
|
131
212
|
}
|
|
132
213
|
};
|
|
133
|
-
},
|
|
134
|
-
const { colors: r, space:
|
|
214
|
+
}, ar = (o) => {
|
|
215
|
+
const { colors: r, space: e, texts: n } = o;
|
|
135
216
|
return {
|
|
136
217
|
list: {
|
|
137
218
|
...n["subtitle-sm"],
|
|
138
|
-
padding: `${
|
|
219
|
+
padding: `${e.sm} 0`
|
|
139
220
|
},
|
|
140
221
|
item: {
|
|
141
222
|
default: {
|
|
@@ -150,38 +231,38 @@ const w = (e) => {
|
|
|
150
231
|
}
|
|
151
232
|
},
|
|
152
233
|
separator: {
|
|
153
|
-
padding: `0 ${
|
|
234
|
+
padding: `0 ${e.xs}`,
|
|
154
235
|
color: r["neutral-50"]
|
|
155
236
|
}
|
|
156
237
|
};
|
|
157
|
-
},
|
|
158
|
-
const { colors: r, focus:
|
|
159
|
-
...
|
|
238
|
+
}, lr = (o) => {
|
|
239
|
+
const { colors: r, focus: e, fontWeights: n, radii: a, space: l, texts: d, toRem: i } = o, s = {
|
|
240
|
+
...d.xs,
|
|
160
241
|
color: r["neutral-10"],
|
|
161
242
|
fontWeight: n.bold,
|
|
162
243
|
letterSpacing: 0,
|
|
163
|
-
borderRadius:
|
|
244
|
+
borderRadius: a.md
|
|
164
245
|
};
|
|
165
246
|
return {
|
|
166
247
|
primary: {
|
|
167
|
-
...
|
|
168
|
-
color:
|
|
248
|
+
...s,
|
|
249
|
+
color: o.colors["neutral-90"],
|
|
169
250
|
backgroundColor: r["primary-40"],
|
|
170
251
|
borderColor: r["primary-40"]
|
|
171
252
|
},
|
|
172
253
|
secondary: {
|
|
173
|
-
...
|
|
254
|
+
...s,
|
|
174
255
|
backgroundColor: r["neutral-90"],
|
|
175
256
|
borderColor: r["neutral-90"]
|
|
176
257
|
},
|
|
177
258
|
tertiary: {
|
|
178
|
-
...
|
|
259
|
+
...s,
|
|
179
260
|
color: r["neutral-90"],
|
|
180
261
|
backgroundColor: "transparent",
|
|
181
262
|
borderColor: r["neutral-90"]
|
|
182
263
|
},
|
|
183
264
|
ghost: {
|
|
184
|
-
...
|
|
265
|
+
...s,
|
|
185
266
|
color: r["neutral-90"],
|
|
186
267
|
backgroundColor: "transparent",
|
|
187
268
|
borderColor: "transparent"
|
|
@@ -213,10 +294,10 @@ const w = (e) => {
|
|
|
213
294
|
borderColor: "transparent"
|
|
214
295
|
},
|
|
215
296
|
tertiary: {
|
|
216
|
-
backgroundColor:
|
|
297
|
+
backgroundColor: p(r["neutral-90"], 0.1)
|
|
217
298
|
},
|
|
218
299
|
ghost: {
|
|
219
|
-
backgroundColor:
|
|
300
|
+
backgroundColor: p(r["neutral-90"], 0.1)
|
|
220
301
|
},
|
|
221
302
|
danger: {
|
|
222
303
|
primary: {
|
|
@@ -232,14 +313,14 @@ const w = (e) => {
|
|
|
232
313
|
}
|
|
233
314
|
},
|
|
234
315
|
focus: {
|
|
235
|
-
primary: { ...
|
|
236
|
-
secondary: { ...
|
|
237
|
-
tertiary: { ...
|
|
238
|
-
ghost: { ...
|
|
316
|
+
primary: { ...e(r["primary-20"]) },
|
|
317
|
+
secondary: { ...e(r["neutral-40"]) },
|
|
318
|
+
tertiary: { ...e(r["neutral-40"]) },
|
|
319
|
+
ghost: { ...e(r["neutral-40"]) },
|
|
239
320
|
danger: {
|
|
240
|
-
primary: { ...
|
|
241
|
-
tertiary: { ...
|
|
242
|
-
ghost: { ...
|
|
321
|
+
primary: { ...e(r["red-40"]) },
|
|
322
|
+
tertiary: { ...e(r["red-40"]) },
|
|
323
|
+
ghost: { ...e(r["red-40"]) }
|
|
243
324
|
}
|
|
244
325
|
},
|
|
245
326
|
active: {
|
|
@@ -252,10 +333,10 @@ const w = (e) => {
|
|
|
252
333
|
borderColor: r["neutral-50"]
|
|
253
334
|
},
|
|
254
335
|
tertiary: {
|
|
255
|
-
backgroundColor:
|
|
336
|
+
backgroundColor: p(r["neutral-90"], 0.4)
|
|
256
337
|
},
|
|
257
338
|
ghost: {
|
|
258
|
-
backgroundColor:
|
|
339
|
+
backgroundColor: p(r["neutral-90"], 0.4)
|
|
259
340
|
},
|
|
260
341
|
danger: {
|
|
261
342
|
primary: {
|
|
@@ -271,83 +352,83 @@ const w = (e) => {
|
|
|
271
352
|
}
|
|
272
353
|
},
|
|
273
354
|
disabled: {
|
|
274
|
-
...
|
|
355
|
+
...s,
|
|
275
356
|
color: r["beige-70"],
|
|
276
357
|
backgroundColor: r["beige-40"],
|
|
277
358
|
borderColor: r["beige-40"],
|
|
278
|
-
"&:focus": { ...
|
|
359
|
+
"&:focus": { ...e(r["beige-10"]) }
|
|
279
360
|
},
|
|
280
361
|
sizes: {
|
|
281
362
|
xs: {
|
|
282
|
-
height:
|
|
283
|
-
padding: `${
|
|
363
|
+
height: i(24),
|
|
364
|
+
padding: `${l.xs} ${l.sm}`
|
|
284
365
|
},
|
|
285
366
|
sm: {
|
|
286
|
-
height:
|
|
287
|
-
padding: `${
|
|
367
|
+
height: i(32),
|
|
368
|
+
padding: `${l.sm} ${l.md}`
|
|
288
369
|
},
|
|
289
370
|
md: {
|
|
290
|
-
...
|
|
371
|
+
...d.sm,
|
|
291
372
|
fontWeight: n.bold,
|
|
292
|
-
height:
|
|
293
|
-
padding: `${
|
|
373
|
+
height: i(40),
|
|
374
|
+
padding: `${l.sm} ${l.lg}`
|
|
294
375
|
},
|
|
295
376
|
lg: {
|
|
296
|
-
...
|
|
377
|
+
...d.sm,
|
|
297
378
|
fontWeight: n.bold,
|
|
298
|
-
height:
|
|
299
|
-
padding: `${
|
|
379
|
+
height: i(48),
|
|
380
|
+
padding: `${l.md} ${l.xl}`
|
|
300
381
|
}
|
|
301
382
|
},
|
|
302
383
|
icon: {
|
|
303
384
|
only: {
|
|
304
|
-
xs:
|
|
305
|
-
sm:
|
|
306
|
-
md:
|
|
307
|
-
lg:
|
|
385
|
+
xs: i(16),
|
|
386
|
+
sm: i(16),
|
|
387
|
+
md: i(16),
|
|
388
|
+
lg: i(24)
|
|
308
389
|
},
|
|
309
390
|
default: {
|
|
310
|
-
xs:
|
|
311
|
-
sm:
|
|
312
|
-
md:
|
|
313
|
-
lg:
|
|
391
|
+
xs: i(12),
|
|
392
|
+
sm: i(16),
|
|
393
|
+
md: i(16),
|
|
394
|
+
lg: i(16)
|
|
314
395
|
}
|
|
315
396
|
}
|
|
316
397
|
};
|
|
317
|
-
},
|
|
318
|
-
const { borderWidths: r, colors:
|
|
398
|
+
}, ir = (o) => {
|
|
399
|
+
const { borderWidths: r, colors: e } = o;
|
|
319
400
|
return {
|
|
320
401
|
default: {
|
|
321
|
-
backgroundColor:
|
|
402
|
+
backgroundColor: e["neutral-10"],
|
|
322
403
|
borderStyle: "solid",
|
|
323
404
|
borderWidth: r.sm,
|
|
324
|
-
borderColor:
|
|
405
|
+
borderColor: e["neutral-30"]
|
|
325
406
|
}
|
|
326
407
|
};
|
|
327
|
-
},
|
|
328
|
-
const { colors: r, fontWeights:
|
|
408
|
+
}, dr = (o) => {
|
|
409
|
+
const { colors: r, fontWeights: e } = o;
|
|
329
410
|
return {
|
|
330
411
|
item: {
|
|
331
412
|
selected: {
|
|
332
413
|
color: r["neutral-90"],
|
|
333
|
-
fontWeight:
|
|
414
|
+
fontWeight: e.bold,
|
|
334
415
|
backgroundColor: r["primary-40"],
|
|
335
416
|
outline: "none"
|
|
336
417
|
},
|
|
337
418
|
today: {
|
|
338
419
|
color: r["neutral-90"],
|
|
339
|
-
fontWeight:
|
|
420
|
+
fontWeight: e.bold
|
|
340
421
|
}
|
|
341
422
|
}
|
|
342
423
|
};
|
|
343
|
-
},
|
|
344
|
-
const { colors: r, radii:
|
|
424
|
+
}, sr = (o) => {
|
|
425
|
+
const { colors: r, radii: e, toRem: n } = o;
|
|
345
426
|
return {
|
|
346
427
|
default: {
|
|
347
428
|
width: n(16),
|
|
348
429
|
height: n(16),
|
|
349
430
|
flexShrink: 0,
|
|
350
|
-
borderRadius:
|
|
431
|
+
borderRadius: e.sm
|
|
351
432
|
},
|
|
352
433
|
disabled: {
|
|
353
434
|
borderColor: r["beige-60"]
|
|
@@ -358,8 +439,8 @@ const w = (e) => {
|
|
|
358
439
|
borderColor: r["primary-40"]
|
|
359
440
|
}
|
|
360
441
|
};
|
|
361
|
-
},
|
|
362
|
-
const { colors: r, space:
|
|
442
|
+
}, cr = (o) => {
|
|
443
|
+
const { colors: r, space: e, toRem: n } = o;
|
|
363
444
|
return {
|
|
364
445
|
backdrop: {
|
|
365
446
|
backgroundColor: r.overlay,
|
|
@@ -372,14 +453,14 @@ const w = (e) => {
|
|
|
372
453
|
title: {
|
|
373
454
|
margin: 0,
|
|
374
455
|
backgroundColor: r["neutral-10"],
|
|
375
|
-
padding: `${
|
|
456
|
+
padding: `${e.xl} ${e["5xl"]} ${e.xl} ${e.xl}`
|
|
376
457
|
},
|
|
377
458
|
content: {
|
|
378
|
-
padding: `${
|
|
459
|
+
padding: `${e.xl}`
|
|
379
460
|
},
|
|
380
461
|
footer: {
|
|
381
462
|
backgroundColor: r["neutral-10"],
|
|
382
|
-
padding: `${
|
|
463
|
+
padding: `${e.xl}`
|
|
383
464
|
},
|
|
384
465
|
sizes: {
|
|
385
466
|
horizontal: {
|
|
@@ -394,12 +475,12 @@ const w = (e) => {
|
|
|
394
475
|
}
|
|
395
476
|
}
|
|
396
477
|
};
|
|
397
|
-
},
|
|
398
|
-
const { colors: r, fontSizes:
|
|
478
|
+
}, gr = (o) => {
|
|
479
|
+
const { colors: r, fontSizes: e, radii: n, toRem: a } = o, l = r["beige-30"];
|
|
399
480
|
return {
|
|
400
481
|
inner: {
|
|
401
|
-
fontSize:
|
|
402
|
-
minWidth:
|
|
482
|
+
fontSize: e.sm,
|
|
483
|
+
minWidth: a(130),
|
|
403
484
|
borderRadius: n.md
|
|
404
485
|
},
|
|
405
486
|
item: {
|
|
@@ -420,14 +501,14 @@ const w = (e) => {
|
|
|
420
501
|
}
|
|
421
502
|
},
|
|
422
503
|
separator: {
|
|
423
|
-
backgroundColor:
|
|
504
|
+
backgroundColor: l
|
|
424
505
|
}
|
|
425
506
|
};
|
|
426
|
-
},
|
|
427
|
-
const { colors: r, toRem:
|
|
507
|
+
}, ur = (o) => {
|
|
508
|
+
const { colors: r, toRem: e } = o;
|
|
428
509
|
return {
|
|
429
510
|
default: {
|
|
430
|
-
minHeight:
|
|
511
|
+
minHeight: e(200),
|
|
431
512
|
borderStyle: "dashed"
|
|
432
513
|
},
|
|
433
514
|
dragAccept: {},
|
|
@@ -436,11 +517,11 @@ const w = (e) => {
|
|
|
436
517
|
backgroundColor: r["beige-30"]
|
|
437
518
|
}
|
|
438
519
|
};
|
|
439
|
-
},
|
|
440
|
-
const { colors: r, texts:
|
|
520
|
+
}, br = (o) => {
|
|
521
|
+
const { colors: r, texts: e } = o;
|
|
441
522
|
return {
|
|
442
523
|
default: {
|
|
443
|
-
...
|
|
524
|
+
...e.xs,
|
|
444
525
|
color: r["neutral-60"]
|
|
445
526
|
},
|
|
446
527
|
danger: {
|
|
@@ -453,23 +534,23 @@ const w = (e) => {
|
|
|
453
534
|
color: r["orange-70"]
|
|
454
535
|
}
|
|
455
536
|
};
|
|
456
|
-
},
|
|
457
|
-
const { colors: r, fontSizes:
|
|
537
|
+
}, mr = (o) => {
|
|
538
|
+
const { colors: r, fontSizes: e, fontWeights: n } = o;
|
|
458
539
|
return {
|
|
459
540
|
color: r["neutral-60"],
|
|
460
|
-
fontSize:
|
|
541
|
+
fontSize: e.sm,
|
|
461
542
|
fontWeight: n.medium
|
|
462
543
|
};
|
|
463
|
-
},
|
|
464
|
-
const { colors: r, fontWeights:
|
|
544
|
+
}, hr = (o) => {
|
|
545
|
+
const { colors: r, fontWeights: e, icons: n, space: a, transitions: l } = o;
|
|
465
546
|
return {
|
|
466
547
|
default: {
|
|
467
548
|
color: r["neutral-90"],
|
|
468
|
-
fontWeight:
|
|
469
|
-
transition:
|
|
549
|
+
fontWeight: e.medium,
|
|
550
|
+
transition: l.medium
|
|
470
551
|
},
|
|
471
552
|
withExternalLink: {
|
|
472
|
-
backgroundSize: `calc(100% - ${n.sm} - ${
|
|
553
|
+
backgroundSize: `calc(100% - ${n.sm} - ${a.sm}) 50%`
|
|
473
554
|
},
|
|
474
555
|
disabled: {
|
|
475
556
|
color: r["neutral-50"],
|
|
@@ -488,20 +569,20 @@ const w = (e) => {
|
|
|
488
569
|
}
|
|
489
570
|
}
|
|
490
571
|
};
|
|
491
|
-
},
|
|
492
|
-
xs:
|
|
493
|
-
sm:
|
|
494
|
-
md:
|
|
495
|
-
lg:
|
|
496
|
-
}),
|
|
497
|
-
xs:
|
|
498
|
-
sm:
|
|
499
|
-
md:
|
|
500
|
-
lg:
|
|
501
|
-
xl:
|
|
502
|
-
xxl:
|
|
503
|
-
}),
|
|
504
|
-
const { colors: r, radii:
|
|
572
|
+
}, pr = ({ toRem: o }) => ({
|
|
573
|
+
xs: o(8),
|
|
574
|
+
sm: o(10),
|
|
575
|
+
md: o(15),
|
|
576
|
+
lg: o(20)
|
|
577
|
+
}), fr = ({ toRem: o }) => ({
|
|
578
|
+
xs: o(12),
|
|
579
|
+
sm: o(16),
|
|
580
|
+
md: o(24),
|
|
581
|
+
lg: o(32),
|
|
582
|
+
xl: o(48),
|
|
583
|
+
xxl: o(64)
|
|
584
|
+
}), xr = (o) => {
|
|
585
|
+
const { colors: r, radii: e, space: n, toRem: a } = o;
|
|
505
586
|
return {
|
|
506
587
|
backdrop: {
|
|
507
588
|
backgroundColor: r.overlay,
|
|
@@ -509,12 +590,12 @@ const w = (e) => {
|
|
|
509
590
|
},
|
|
510
591
|
default: {
|
|
511
592
|
zIndex: 999,
|
|
512
|
-
borderRadius:
|
|
593
|
+
borderRadius: e.md
|
|
513
594
|
},
|
|
514
595
|
header: {
|
|
515
596
|
backgroundColor: r["neutral-10"],
|
|
516
|
-
borderTopLeftRadius:
|
|
517
|
-
borderTopRightRadius:
|
|
597
|
+
borderTopLeftRadius: e.md,
|
|
598
|
+
borderTopRightRadius: e.md,
|
|
518
599
|
paddingTop: n.xxl,
|
|
519
600
|
paddingRight: n["3xl"],
|
|
520
601
|
paddingBottom: n.xxl,
|
|
@@ -534,8 +615,8 @@ const w = (e) => {
|
|
|
534
615
|
footer: {
|
|
535
616
|
backgroundColor: r["neutral-10"],
|
|
536
617
|
borderTop: `solid ${r["neutral-30"]}`,
|
|
537
|
-
borderBottomLeftRadius:
|
|
538
|
-
borderBottomRightRadius:
|
|
618
|
+
borderBottomLeftRadius: e.md,
|
|
619
|
+
borderBottomRightRadius: e.md,
|
|
539
620
|
children: {
|
|
540
621
|
paddingRight: n.xxl,
|
|
541
622
|
paddingLeft: n.xxl,
|
|
@@ -550,39 +631,39 @@ const w = (e) => {
|
|
|
550
631
|
paddingBottom: n.xxl
|
|
551
632
|
}
|
|
552
633
|
},
|
|
553
|
-
gutter:
|
|
634
|
+
gutter: a(32),
|
|
554
635
|
sizes: {
|
|
555
636
|
xs: {
|
|
556
|
-
width:
|
|
637
|
+
width: a(320)
|
|
557
638
|
},
|
|
558
639
|
sm: {
|
|
559
|
-
width:
|
|
640
|
+
width: a(450)
|
|
560
641
|
},
|
|
561
642
|
md: {
|
|
562
|
-
width:
|
|
643
|
+
width: a(600)
|
|
563
644
|
},
|
|
564
645
|
lg: {
|
|
565
|
-
width:
|
|
646
|
+
width: a(730)
|
|
566
647
|
},
|
|
567
648
|
auto: {}
|
|
568
649
|
},
|
|
569
650
|
cover: {}
|
|
570
651
|
};
|
|
571
|
-
},
|
|
572
|
-
const { colors: r, focus:
|
|
652
|
+
}, Cr = (o) => {
|
|
653
|
+
const { colors: r, focus: e, fontSizes: n, fontWeights: a, toRem: l } = o;
|
|
573
654
|
return {
|
|
574
655
|
default: {
|
|
575
|
-
width:
|
|
576
|
-
height:
|
|
656
|
+
width: l(32),
|
|
657
|
+
height: l(32),
|
|
577
658
|
color: r["neutral-90"],
|
|
578
|
-
fontWeight:
|
|
659
|
+
fontWeight: a.bold,
|
|
579
660
|
fontSize: n.xs
|
|
580
661
|
},
|
|
581
662
|
item: {
|
|
582
663
|
"&:hover, &:focus": {
|
|
583
664
|
backgroundColor: r["neutral-30"]
|
|
584
665
|
},
|
|
585
|
-
"&:focus": { ...
|
|
666
|
+
"&:focus": { ...e(r["neutral-60"]) }
|
|
586
667
|
},
|
|
587
668
|
active: {
|
|
588
669
|
backgroundColor: r["neutral-90"],
|
|
@@ -596,14 +677,14 @@ const w = (e) => {
|
|
|
596
677
|
color: r["beige-70"]
|
|
597
678
|
}
|
|
598
679
|
};
|
|
599
|
-
},
|
|
600
|
-
const { borderWidths: r, colors:
|
|
680
|
+
}, kr = (o) => {
|
|
681
|
+
const { borderWidths: r, colors: e, space: n, texts: a, toRem: l } = o;
|
|
601
682
|
return {
|
|
602
683
|
default: {
|
|
603
|
-
...
|
|
604
|
-
backgroundColor:
|
|
605
|
-
color:
|
|
606
|
-
maxWidth:
|
|
684
|
+
...a.sm,
|
|
685
|
+
backgroundColor: e["neutral-90"],
|
|
686
|
+
color: e["neutral-10"],
|
|
687
|
+
maxWidth: l(700),
|
|
607
688
|
zIndex: 1
|
|
608
689
|
},
|
|
609
690
|
content: {
|
|
@@ -611,20 +692,20 @@ const w = (e) => {
|
|
|
611
692
|
padding: n.md
|
|
612
693
|
},
|
|
613
694
|
title: {
|
|
614
|
-
...
|
|
695
|
+
...a.h6,
|
|
615
696
|
padding: `${n.md} ${n.md} ${n.xs}`,
|
|
616
|
-
color:
|
|
617
|
-
borderBottomColor:
|
|
697
|
+
color: e["neutral-10"],
|
|
698
|
+
borderBottomColor: e["neutral-70"],
|
|
618
699
|
borderBottomWidth: r.sm,
|
|
619
700
|
borderBottomStyle: "solid"
|
|
620
701
|
}
|
|
621
702
|
};
|
|
622
|
-
},
|
|
623
|
-
const { colors: r, toRem:
|
|
703
|
+
}, yr = (o) => {
|
|
704
|
+
const { colors: r, toRem: e } = o;
|
|
624
705
|
return {
|
|
625
706
|
default: {
|
|
626
|
-
width:
|
|
627
|
-
height:
|
|
707
|
+
width: e(16),
|
|
708
|
+
height: e(16)
|
|
628
709
|
},
|
|
629
710
|
checked: {
|
|
630
711
|
color: r["neutral-90"],
|
|
@@ -635,8 +716,8 @@ const w = (e) => {
|
|
|
635
716
|
disabled: r["beige-60"]
|
|
636
717
|
}
|
|
637
718
|
};
|
|
638
|
-
},
|
|
639
|
-
const { colors: r } =
|
|
719
|
+
}, Fr = (o) => {
|
|
720
|
+
const { colors: r } = o;
|
|
640
721
|
return {
|
|
641
722
|
default: {
|
|
642
723
|
"&:hover": {
|
|
@@ -645,52 +726,52 @@ const w = (e) => {
|
|
|
645
726
|
},
|
|
646
727
|
checked: {
|
|
647
728
|
backgroundColor: r["primary-40"],
|
|
648
|
-
color:
|
|
729
|
+
color: o.colors["neutral-90"],
|
|
649
730
|
borderColor: r["primary-40"],
|
|
650
731
|
"&:hover": {
|
|
651
732
|
backgroundColor: r["primary-30"]
|
|
652
733
|
}
|
|
653
734
|
}
|
|
654
735
|
};
|
|
655
|
-
},
|
|
656
|
-
const { borderWidths: r, colors:
|
|
736
|
+
}, wr = (o) => {
|
|
737
|
+
const { borderWidths: r, colors: e } = o;
|
|
657
738
|
return {
|
|
658
739
|
default: {
|
|
659
|
-
backgroundColor:
|
|
660
|
-
backgroundImage: `linear-gradient(${
|
|
740
|
+
backgroundColor: e["beige-40"],
|
|
741
|
+
backgroundImage: `linear-gradient(${e["primary-40"]}, ${e["primary-40"]})`
|
|
661
742
|
},
|
|
662
743
|
selector: {
|
|
663
|
-
backgroundColor:
|
|
744
|
+
backgroundColor: e["neutral-90"],
|
|
664
745
|
borderRadius: "50%",
|
|
665
746
|
border: `${r.md} solid`,
|
|
666
747
|
disabled: {
|
|
667
|
-
backgroundColor:
|
|
748
|
+
backgroundColor: e["beige-60"]
|
|
668
749
|
}
|
|
669
750
|
},
|
|
670
751
|
output: {
|
|
671
752
|
tooltip: {
|
|
672
|
-
backgroundColor:
|
|
673
|
-
border: `${r.sm} solid ${
|
|
674
|
-
color:
|
|
753
|
+
backgroundColor: e["neutral-90"],
|
|
754
|
+
border: `${r.sm} solid ${e["neutral-70"]}}`,
|
|
755
|
+
color: e["neutral-10"]
|
|
675
756
|
}
|
|
676
757
|
},
|
|
677
758
|
focused: {
|
|
678
|
-
outline: `${r.md} solid ${
|
|
759
|
+
outline: `${r.md} solid ${e["primary-40"]}`,
|
|
679
760
|
disabled: {
|
|
680
761
|
outline: "none"
|
|
681
762
|
}
|
|
682
763
|
},
|
|
683
764
|
disabled: {
|
|
684
|
-
backgroundImage: `linear-gradient(${
|
|
765
|
+
backgroundImage: `linear-gradient(${e["beige-60"]}, ${e["beige-60"]})`
|
|
685
766
|
},
|
|
686
767
|
rangeInput: {
|
|
687
768
|
disabled: {
|
|
688
|
-
backgroundColor:
|
|
769
|
+
backgroundColor: e["beige-60"]
|
|
689
770
|
}
|
|
690
771
|
}
|
|
691
772
|
};
|
|
692
|
-
},
|
|
693
|
-
const { colors: r } =
|
|
773
|
+
}, $r = (o) => {
|
|
774
|
+
const { colors: r } = o;
|
|
694
775
|
return {
|
|
695
776
|
navigation: {
|
|
696
777
|
bullet: {
|
|
@@ -699,74 +780,74 @@ const w = (e) => {
|
|
|
699
780
|
}
|
|
700
781
|
}
|
|
701
782
|
};
|
|
702
|
-
},
|
|
703
|
-
const { borderWidths: r, colors:
|
|
783
|
+
}, vr = (o) => {
|
|
784
|
+
const { borderWidths: r, colors: e, fontWeights: n, space: a } = o;
|
|
704
785
|
return {
|
|
705
786
|
th: {
|
|
706
|
-
color:
|
|
787
|
+
color: e["neutral-60"],
|
|
707
788
|
fontWeight: n.medium,
|
|
708
789
|
textAlign: "left",
|
|
709
|
-
borderBottomColor:
|
|
790
|
+
borderBottomColor: e["neutral-90"],
|
|
710
791
|
borderBottomWidth: r.sm,
|
|
711
792
|
borderBottomStyle: "solid"
|
|
712
793
|
},
|
|
713
794
|
td: {
|
|
714
795
|
textAlign: "left",
|
|
715
|
-
padding:
|
|
796
|
+
padding: a.xl
|
|
716
797
|
},
|
|
717
798
|
tr: {
|
|
718
799
|
default: {
|
|
719
|
-
borderBottomColor:
|
|
800
|
+
borderBottomColor: e["neutral-30"],
|
|
720
801
|
borderBottomWidth: r.sm,
|
|
721
802
|
borderBottomStyle: "solid"
|
|
722
803
|
},
|
|
723
804
|
danger: {
|
|
724
|
-
backgroundColor:
|
|
725
|
-
color:
|
|
805
|
+
backgroundColor: e["red-10"],
|
|
806
|
+
color: e["red-70"]
|
|
726
807
|
},
|
|
727
808
|
warning: {
|
|
728
|
-
backgroundColor:
|
|
729
|
-
color:
|
|
809
|
+
backgroundColor: e["orange-10"],
|
|
810
|
+
color: e["orange-80"]
|
|
730
811
|
},
|
|
731
812
|
info: {
|
|
732
|
-
backgroundColor:
|
|
733
|
-
color:
|
|
813
|
+
backgroundColor: e["blue-10"],
|
|
814
|
+
color: e["blue-70"]
|
|
734
815
|
},
|
|
735
816
|
success: {
|
|
736
|
-
backgroundColor:
|
|
737
|
-
color:
|
|
817
|
+
backgroundColor: e["green-10"],
|
|
818
|
+
color: e["green-70"]
|
|
738
819
|
},
|
|
739
820
|
clickable: {
|
|
740
821
|
cursor: "pointer"
|
|
741
822
|
}
|
|
742
823
|
}
|
|
743
824
|
};
|
|
744
|
-
},
|
|
745
|
-
const { borderWidths: r, colors:
|
|
825
|
+
}, Wr = (o) => {
|
|
826
|
+
const { borderWidths: r, colors: e, fontSizes: n, fontWeights: a, lineHeights: l, space: d } = o;
|
|
746
827
|
return {
|
|
747
828
|
tabsBorder: {
|
|
748
829
|
horizontal: {
|
|
749
|
-
boxShadow: `inset 0 -${r.sm} 0 ${
|
|
830
|
+
boxShadow: `inset 0 -${r.sm} 0 ${e["neutral-30"]}`
|
|
750
831
|
},
|
|
751
832
|
vertical: {
|
|
752
|
-
boxShadow: `inset -${r.sm} 0 0 ${
|
|
833
|
+
boxShadow: `inset -${r.sm} 0 0 ${e["neutral-30"]}`
|
|
753
834
|
}
|
|
754
835
|
},
|
|
755
836
|
item: {
|
|
756
837
|
default: {
|
|
757
|
-
color:
|
|
758
|
-
fontWeight:
|
|
838
|
+
color: e["neutral-70"],
|
|
839
|
+
fontWeight: a.medium,
|
|
759
840
|
textDecoration: "none",
|
|
760
|
-
lineHeight:
|
|
841
|
+
lineHeight: l.md
|
|
761
842
|
},
|
|
762
843
|
active: {
|
|
763
|
-
color:
|
|
844
|
+
color: e["neutral-90"]
|
|
764
845
|
},
|
|
765
846
|
focus: {
|
|
766
|
-
color:
|
|
847
|
+
color: e["neutral-90"]
|
|
767
848
|
},
|
|
768
849
|
disabled: {
|
|
769
|
-
color:
|
|
850
|
+
color: e["neutral-50"]
|
|
770
851
|
},
|
|
771
852
|
size: {
|
|
772
853
|
sm: {
|
|
@@ -784,7 +865,7 @@ const w = (e) => {
|
|
|
784
865
|
}
|
|
785
866
|
},
|
|
786
867
|
horizontal: {
|
|
787
|
-
marginTop:
|
|
868
|
+
marginTop: d.xl,
|
|
788
869
|
"&:focus": {
|
|
789
870
|
outline: "none"
|
|
790
871
|
}
|
|
@@ -792,42 +873,42 @@ const w = (e) => {
|
|
|
792
873
|
},
|
|
793
874
|
activeBar: {
|
|
794
875
|
horizontal: {
|
|
795
|
-
background:
|
|
876
|
+
background: e["primary-40"],
|
|
796
877
|
height: r.md
|
|
797
878
|
},
|
|
798
879
|
vertical: {
|
|
799
|
-
background:
|
|
880
|
+
background: e["primary-40"],
|
|
800
881
|
width: r.md
|
|
801
882
|
}
|
|
802
883
|
},
|
|
803
884
|
icon: {
|
|
804
|
-
maxWidth:
|
|
805
|
-
maxHeight:
|
|
885
|
+
maxWidth: d.lg,
|
|
886
|
+
maxHeight: d.lg
|
|
806
887
|
},
|
|
807
888
|
badge: {
|
|
808
|
-
maxHeight:
|
|
889
|
+
maxHeight: d.lg
|
|
809
890
|
}
|
|
810
891
|
};
|
|
811
|
-
},
|
|
812
|
-
const { colors: r, fontSizes:
|
|
813
|
-
xs:
|
|
814
|
-
sm:
|
|
815
|
-
md:
|
|
816
|
-
},
|
|
817
|
-
backgroundColor: r[`${
|
|
818
|
-
color: r[`${
|
|
819
|
-
}), t = (
|
|
820
|
-
backgroundColor: r[`${
|
|
821
|
-
}), g = (
|
|
822
|
-
backgroundColor: r[`${
|
|
892
|
+
}, Sr = (o) => {
|
|
893
|
+
const { colors: r, fontSizes: e, fontWeights: n, radii: a, space: l, toRem: d } = o, i = {
|
|
894
|
+
xs: d(20),
|
|
895
|
+
sm: d(24),
|
|
896
|
+
md: d(32)
|
|
897
|
+
}, s = (u) => ({
|
|
898
|
+
backgroundColor: r[`${u}-10`],
|
|
899
|
+
color: r[`${u}-90`]
|
|
900
|
+
}), t = (u) => ({
|
|
901
|
+
backgroundColor: r[`${u}-20`]
|
|
902
|
+
}), g = (u) => ({
|
|
903
|
+
backgroundColor: r[`${u}-${u === "green" ? "30" : "40"}`],
|
|
823
904
|
color: r["neutral-90"]
|
|
824
|
-
}),
|
|
825
|
-
backgroundColor: r[`${
|
|
905
|
+
}), b = (u) => ({
|
|
906
|
+
backgroundColor: r[`${u}-${u === "green" ? "40" : "50"}`]
|
|
826
907
|
});
|
|
827
908
|
return {
|
|
828
909
|
default: {
|
|
829
910
|
fontWeight: n.medium,
|
|
830
|
-
borderRadius:
|
|
911
|
+
borderRadius: a.md
|
|
831
912
|
},
|
|
832
913
|
variants: {
|
|
833
914
|
default: {
|
|
@@ -835,13 +916,13 @@ const w = (e) => {
|
|
|
835
916
|
color: r["beige-90"]
|
|
836
917
|
},
|
|
837
918
|
primary: {
|
|
838
|
-
color:
|
|
919
|
+
color: o.colors["neutral-90"],
|
|
839
920
|
backgroundColor: r["primary-40"]
|
|
840
921
|
},
|
|
841
|
-
success:
|
|
842
|
-
danger:
|
|
843
|
-
warning:
|
|
844
|
-
info:
|
|
922
|
+
success: s("green"),
|
|
923
|
+
danger: s("red"),
|
|
924
|
+
warning: s("orange"),
|
|
925
|
+
info: s("blue"),
|
|
845
926
|
teal: g("teal"),
|
|
846
927
|
blue: g("blue"),
|
|
847
928
|
orange: g("orange"),
|
|
@@ -860,82 +941,82 @@ const w = (e) => {
|
|
|
860
941
|
danger: t("red"),
|
|
861
942
|
warning: t("orange"),
|
|
862
943
|
info: t("blue"),
|
|
863
|
-
teal:
|
|
864
|
-
blue:
|
|
865
|
-
orange:
|
|
866
|
-
pink:
|
|
867
|
-
green:
|
|
868
|
-
violet:
|
|
944
|
+
teal: b("teal"),
|
|
945
|
+
blue: b("blue"),
|
|
946
|
+
orange: b("orange"),
|
|
947
|
+
pink: b("pink"),
|
|
948
|
+
green: b("green"),
|
|
949
|
+
violet: b("violet")
|
|
869
950
|
},
|
|
870
951
|
sizes: {
|
|
871
952
|
xs: {
|
|
872
|
-
padding: `${
|
|
873
|
-
height:
|
|
874
|
-
fontSize:
|
|
875
|
-
gap:
|
|
876
|
-
borderRadius:
|
|
953
|
+
padding: `${l.xxs} ${l.xs}`,
|
|
954
|
+
height: i.xs,
|
|
955
|
+
fontSize: e.xs,
|
|
956
|
+
gap: l.xs,
|
|
957
|
+
borderRadius: a.sm
|
|
877
958
|
},
|
|
878
959
|
sm: {
|
|
879
|
-
padding: `${
|
|
880
|
-
height:
|
|
881
|
-
fontSize:
|
|
882
|
-
gap:
|
|
960
|
+
padding: `${l.xs} ${l.sm}`,
|
|
961
|
+
height: i.sm,
|
|
962
|
+
fontSize: e.xs,
|
|
963
|
+
gap: l.xs
|
|
883
964
|
},
|
|
884
965
|
md: {
|
|
885
|
-
padding: `${
|
|
886
|
-
height:
|
|
887
|
-
fontSize:
|
|
888
|
-
gap:
|
|
966
|
+
padding: `${l.xs} ${l.sm}`,
|
|
967
|
+
height: i.md,
|
|
968
|
+
fontSize: e.sm,
|
|
969
|
+
gap: l.sm
|
|
889
970
|
}
|
|
890
971
|
},
|
|
891
972
|
icon: {
|
|
892
|
-
xs:
|
|
893
|
-
sm:
|
|
894
|
-
md:
|
|
973
|
+
xs: d(12),
|
|
974
|
+
sm: d(12),
|
|
975
|
+
md: d(16)
|
|
895
976
|
},
|
|
896
977
|
shape: {
|
|
897
978
|
xs: {
|
|
898
|
-
width:
|
|
899
|
-
height:
|
|
979
|
+
width: i.xs,
|
|
980
|
+
height: i.xs
|
|
900
981
|
},
|
|
901
982
|
sm: {
|
|
902
|
-
width:
|
|
903
|
-
height:
|
|
983
|
+
width: i.sm,
|
|
984
|
+
height: i.sm
|
|
904
985
|
},
|
|
905
986
|
md: {
|
|
906
|
-
width:
|
|
907
|
-
height:
|
|
987
|
+
width: i.md,
|
|
988
|
+
height: i.md
|
|
908
989
|
}
|
|
909
990
|
}
|
|
910
991
|
};
|
|
911
|
-
},
|
|
912
|
-
const { space: r, toRem:
|
|
992
|
+
}, Tr = (o) => {
|
|
993
|
+
const { space: r, toRem: e } = o;
|
|
913
994
|
return {
|
|
914
|
-
minHeight:
|
|
995
|
+
minHeight: e(130),
|
|
915
996
|
padding: r.md
|
|
916
997
|
};
|
|
917
|
-
},
|
|
918
|
-
const { toEm:
|
|
998
|
+
}, Dr = (o, r) => {
|
|
999
|
+
const { toEm: e, toRem: n } = r, a = n;
|
|
919
1000
|
return {
|
|
920
|
-
h0:
|
|
921
|
-
h1:
|
|
922
|
-
h2:
|
|
923
|
-
h3:
|
|
924
|
-
h4:
|
|
925
|
-
h5:
|
|
926
|
-
h6:
|
|
927
|
-
lg:
|
|
928
|
-
md:
|
|
929
|
-
sm:
|
|
930
|
-
"subtitle-md":
|
|
931
|
-
"subtitle-sm":
|
|
932
|
-
xs:
|
|
1001
|
+
h0: a(65),
|
|
1002
|
+
h1: a(45),
|
|
1003
|
+
h2: a(36),
|
|
1004
|
+
h3: a(26),
|
|
1005
|
+
h4: a(20),
|
|
1006
|
+
h5: a(16),
|
|
1007
|
+
h6: a(14),
|
|
1008
|
+
lg: a(18),
|
|
1009
|
+
md: a(16),
|
|
1010
|
+
sm: a(14),
|
|
1011
|
+
"subtitle-md": a(13),
|
|
1012
|
+
"subtitle-sm": a(11),
|
|
1013
|
+
xs: a(12)
|
|
933
1014
|
};
|
|
934
|
-
},
|
|
935
|
-
defaultLineHeight:
|
|
1015
|
+
}, zr = ({
|
|
1016
|
+
defaultLineHeight: o,
|
|
936
1017
|
toRem: r
|
|
937
1018
|
}) => ({
|
|
938
|
-
html:
|
|
1019
|
+
html: o,
|
|
939
1020
|
h0: r(72),
|
|
940
1021
|
h1: r(48),
|
|
941
1022
|
h2: r(40),
|
|
@@ -947,17 +1028,17 @@ const w = (e) => {
|
|
|
947
1028
|
md: r(18),
|
|
948
1029
|
sm: r(18),
|
|
949
1030
|
xs: r(14),
|
|
950
|
-
"subtitle-md":
|
|
951
|
-
"subtitle-sm":
|
|
952
|
-
}),
|
|
1031
|
+
"subtitle-md": o,
|
|
1032
|
+
"subtitle-sm": o
|
|
1033
|
+
}), Br = {
|
|
953
1034
|
regular: 400,
|
|
954
1035
|
medium: 500,
|
|
955
1036
|
bold: 600
|
|
956
|
-
},
|
|
957
|
-
defaultLetterSpacing:
|
|
1037
|
+
}, Ar = ({
|
|
1038
|
+
defaultLetterSpacing: o,
|
|
958
1039
|
toRem: r
|
|
959
1040
|
}) => ({
|
|
960
|
-
html:
|
|
1041
|
+
html: o,
|
|
961
1042
|
h0: r(-1.7),
|
|
962
1043
|
h1: r(-1.2),
|
|
963
1044
|
h2: r(-1),
|
|
@@ -965,14 +1046,14 @@ const w = (e) => {
|
|
|
965
1046
|
h4: r(-0.6),
|
|
966
1047
|
h5: r(-0.5),
|
|
967
1048
|
h6: r(-0.5),
|
|
968
|
-
lg:
|
|
969
|
-
md:
|
|
970
|
-
sm:
|
|
1049
|
+
lg: o,
|
|
1050
|
+
md: o,
|
|
1051
|
+
sm: o,
|
|
971
1052
|
xs: r(-0.2),
|
|
972
1053
|
"subtitle-md": r(-0.2),
|
|
973
1054
|
"subtitle-sm": r(-0.2)
|
|
974
|
-
}),
|
|
975
|
-
const { fontWeights: r } =
|
|
1055
|
+
}), Er = (o) => {
|
|
1056
|
+
const { fontWeights: r } = o;
|
|
976
1057
|
return {
|
|
977
1058
|
h0: r.bold,
|
|
978
1059
|
h1: r.bold,
|
|
@@ -988,8 +1069,8 @@ const w = (e) => {
|
|
|
988
1069
|
"subtitle-sm": r.medium,
|
|
989
1070
|
xs: r.regular
|
|
990
1071
|
};
|
|
991
|
-
},
|
|
992
|
-
const { fonts: r } =
|
|
1072
|
+
}, _r = (o) => {
|
|
1073
|
+
const { fonts: r } = o;
|
|
993
1074
|
return {
|
|
994
1075
|
h0: r.headings,
|
|
995
1076
|
h1: r.headings,
|
|
@@ -1001,11 +1082,11 @@ const w = (e) => {
|
|
|
1001
1082
|
"subtitle-md": r.headings,
|
|
1002
1083
|
"subtitle-sm": r.headings
|
|
1003
1084
|
};
|
|
1004
|
-
},
|
|
1085
|
+
}, Rr = () => ({
|
|
1005
1086
|
"subtitle-md": "uppercase",
|
|
1006
1087
|
"subtitle-sm": "uppercase"
|
|
1007
|
-
}),
|
|
1008
|
-
const { colors: r } =
|
|
1088
|
+
}), Lr = (o) => {
|
|
1089
|
+
const { colors: r } = o;
|
|
1009
1090
|
return {
|
|
1010
1091
|
h0: r["neutral-90"],
|
|
1011
1092
|
h1: r["neutral-90"],
|
|
@@ -1015,151 +1096,151 @@ const w = (e) => {
|
|
|
1015
1096
|
h5: r["neutral-90"],
|
|
1016
1097
|
h6: r["neutral-90"]
|
|
1017
1098
|
};
|
|
1018
|
-
},
|
|
1099
|
+
}, D = (o) => {
|
|
1019
1100
|
const {
|
|
1020
1101
|
fontSizes: r,
|
|
1021
|
-
letterSpacings:
|
|
1102
|
+
letterSpacings: e,
|
|
1022
1103
|
lineHeights: n,
|
|
1023
|
-
textsFontColors:
|
|
1024
|
-
textsFontFamily:
|
|
1025
|
-
textsFontWeights:
|
|
1026
|
-
textsTextTransform:
|
|
1027
|
-
} =
|
|
1028
|
-
return Object.keys(r).reduce((
|
|
1029
|
-
...
|
|
1104
|
+
textsFontColors: a,
|
|
1105
|
+
textsFontFamily: l,
|
|
1106
|
+
textsFontWeights: d,
|
|
1107
|
+
textsTextTransform: i
|
|
1108
|
+
} = o;
|
|
1109
|
+
return Object.keys(r).reduce((s, t) => ({
|
|
1110
|
+
...s,
|
|
1030
1111
|
[t]: {
|
|
1031
|
-
color:
|
|
1032
|
-
fontFamily:
|
|
1033
|
-
fontWeight:
|
|
1112
|
+
color: a[t],
|
|
1113
|
+
fontFamily: l[t] || void 0,
|
|
1114
|
+
fontWeight: d[t],
|
|
1034
1115
|
fontSize: r[t],
|
|
1035
1116
|
lineHeight: n[t] || n.lg,
|
|
1036
|
-
letterSpacing:
|
|
1037
|
-
textTransform:
|
|
1117
|
+
letterSpacing: e[t] || void 0,
|
|
1118
|
+
textTransform: i[t] || void 0
|
|
1038
1119
|
}
|
|
1039
1120
|
}), {});
|
|
1040
|
-
},
|
|
1041
|
-
texts: [
|
|
1121
|
+
}, Ir = (o, r, e) => ({
|
|
1122
|
+
texts: [o, "sans-serif"].join(", "),
|
|
1042
1123
|
headings: [r, "sans-serif"].join(", "),
|
|
1043
|
-
icons:
|
|
1044
|
-
}),
|
|
1045
|
-
const { borderWidths: r, colors:
|
|
1124
|
+
icons: e
|
|
1125
|
+
}), Hr = (o) => {
|
|
1126
|
+
const { borderWidths: r, colors: e, fontWeights: n, radii: a, space: l } = o;
|
|
1046
1127
|
return {
|
|
1047
1128
|
default: {
|
|
1048
|
-
paddingLeft:
|
|
1049
|
-
paddingRight:
|
|
1129
|
+
paddingLeft: l.sm,
|
|
1130
|
+
paddingRight: l.sm
|
|
1050
1131
|
},
|
|
1051
1132
|
top: {
|
|
1052
|
-
paddingTop:
|
|
1133
|
+
paddingTop: l.lg
|
|
1053
1134
|
},
|
|
1054
1135
|
bottom: {
|
|
1055
|
-
paddingBottom:
|
|
1136
|
+
paddingBottom: l.lg
|
|
1056
1137
|
},
|
|
1057
1138
|
growls: {
|
|
1058
1139
|
default: {
|
|
1059
|
-
...
|
|
1140
|
+
...D(o).sm,
|
|
1060
1141
|
borderWidth: r.sm,
|
|
1061
1142
|
borderStyle: "solid",
|
|
1062
|
-
borderRadius:
|
|
1143
|
+
borderRadius: a.lg,
|
|
1063
1144
|
maxWidth: 340
|
|
1064
1145
|
},
|
|
1065
1146
|
title: {
|
|
1066
1147
|
fontWeight: n.bold,
|
|
1067
|
-
color:
|
|
1148
|
+
color: e["neutral-90"]
|
|
1068
1149
|
}
|
|
1069
1150
|
},
|
|
1070
1151
|
snackbar: {
|
|
1071
1152
|
default: {
|
|
1072
|
-
borderRadius:
|
|
1153
|
+
borderRadius: a.lg
|
|
1073
1154
|
},
|
|
1074
1155
|
separator: {
|
|
1075
1156
|
default: {
|
|
1076
1157
|
borderLeft: "1px solid",
|
|
1077
|
-
borderLeftColor:
|
|
1158
|
+
borderLeftColor: e["neutral-30"]
|
|
1078
1159
|
},
|
|
1079
1160
|
danger: {
|
|
1080
|
-
borderLeftColor:
|
|
1161
|
+
borderLeftColor: e["red-20"]
|
|
1081
1162
|
},
|
|
1082
1163
|
warning: {
|
|
1083
|
-
borderLeftColor:
|
|
1164
|
+
borderLeftColor: e["orange-20"]
|
|
1084
1165
|
},
|
|
1085
1166
|
info: {
|
|
1086
|
-
borderLeftColor:
|
|
1167
|
+
borderLeftColor: e["blue-30"]
|
|
1087
1168
|
},
|
|
1088
1169
|
success: {
|
|
1089
|
-
borderLeftColor:
|
|
1170
|
+
borderLeftColor: e["green-30"]
|
|
1090
1171
|
}
|
|
1091
1172
|
}
|
|
1092
1173
|
}
|
|
1093
1174
|
};
|
|
1094
|
-
},
|
|
1095
|
-
const { borderWidths: r, colors:
|
|
1175
|
+
}, Ur = "0.32rem !important", Or = "0.12rem ! important", Nr = (o) => {
|
|
1176
|
+
const { borderWidths: r, colors: e, focus: n, toRem: a } = o;
|
|
1096
1177
|
return {
|
|
1097
1178
|
item: {
|
|
1098
1179
|
default: {
|
|
1099
|
-
backgroundColor:
|
|
1100
|
-
borderColor:
|
|
1180
|
+
backgroundColor: e["neutral-10"],
|
|
1181
|
+
borderColor: e["neutral-30"],
|
|
1101
1182
|
borderWidth: r.sm,
|
|
1102
1183
|
borderStyle: "solid",
|
|
1103
|
-
borderRadius:
|
|
1184
|
+
borderRadius: a(16),
|
|
1104
1185
|
"&:focus": {
|
|
1105
|
-
borderColor:
|
|
1106
|
-
...n(
|
|
1186
|
+
borderColor: e["primary-30"],
|
|
1187
|
+
...n(e["primary-30"])
|
|
1107
1188
|
}
|
|
1108
1189
|
},
|
|
1109
1190
|
sizes: {
|
|
1110
1191
|
xs: {
|
|
1111
|
-
width:
|
|
1112
|
-
height:
|
|
1113
|
-
marginTop:
|
|
1192
|
+
width: a(28),
|
|
1193
|
+
height: a(16),
|
|
1194
|
+
marginTop: Ur
|
|
1114
1195
|
},
|
|
1115
1196
|
sm: {
|
|
1116
|
-
width:
|
|
1117
|
-
height:
|
|
1118
|
-
marginTop:
|
|
1197
|
+
width: a(36),
|
|
1198
|
+
height: a(20),
|
|
1199
|
+
marginTop: Or
|
|
1119
1200
|
},
|
|
1120
1201
|
md: {
|
|
1121
|
-
width:
|
|
1122
|
-
height:
|
|
1202
|
+
width: a(44),
|
|
1203
|
+
height: a(24),
|
|
1123
1204
|
marginTop: "0 !important"
|
|
1124
1205
|
}
|
|
1125
1206
|
},
|
|
1126
1207
|
checked: {
|
|
1127
|
-
backgroundColor:
|
|
1128
|
-
borderColor:
|
|
1208
|
+
backgroundColor: e["primary-40"],
|
|
1209
|
+
borderColor: e["primary-40"]
|
|
1129
1210
|
},
|
|
1130
1211
|
disabled: {
|
|
1131
|
-
borderColor:
|
|
1132
|
-
backgroundColor:
|
|
1212
|
+
borderColor: e["beige-60"],
|
|
1213
|
+
backgroundColor: e["beige-40"]
|
|
1133
1214
|
}
|
|
1134
1215
|
},
|
|
1135
1216
|
after: {
|
|
1136
1217
|
default: {
|
|
1137
|
-
backgroundColor:
|
|
1138
|
-
borderColor:
|
|
1218
|
+
backgroundColor: e["neutral-10"],
|
|
1219
|
+
borderColor: e["neutral-50"],
|
|
1139
1220
|
borderWidth: r.sm,
|
|
1140
1221
|
borderStyle: "solid",
|
|
1141
1222
|
borderRadius: "50%"
|
|
1142
1223
|
},
|
|
1143
1224
|
checked: {
|
|
1144
|
-
backgroundColor:
|
|
1145
|
-
borderColor:
|
|
1225
|
+
backgroundColor: e["neutral-10"],
|
|
1226
|
+
borderColor: e["neutral-10"]
|
|
1146
1227
|
},
|
|
1147
1228
|
disabled: {
|
|
1148
1229
|
borderColor: "transparent",
|
|
1149
|
-
backgroundColor:
|
|
1230
|
+
backgroundColor: e["beige-60"]
|
|
1150
1231
|
},
|
|
1151
1232
|
sizes: {
|
|
1152
1233
|
xs: {
|
|
1153
|
-
width:
|
|
1154
|
-
height:
|
|
1234
|
+
width: a(12),
|
|
1235
|
+
height: a(12)
|
|
1155
1236
|
},
|
|
1156
1237
|
sm: {
|
|
1157
|
-
width:
|
|
1158
|
-
height:
|
|
1238
|
+
width: a(16),
|
|
1239
|
+
height: a(16)
|
|
1159
1240
|
},
|
|
1160
1241
|
md: {
|
|
1161
|
-
width:
|
|
1162
|
-
height:
|
|
1242
|
+
width: a(20),
|
|
1243
|
+
height: a(20)
|
|
1163
1244
|
}
|
|
1164
1245
|
}
|
|
1165
1246
|
},
|
|
@@ -1180,38 +1261,38 @@ const w = (e) => {
|
|
|
1180
1261
|
},
|
|
1181
1262
|
sizes: {
|
|
1182
1263
|
xs: {
|
|
1183
|
-
width:
|
|
1184
|
-
height:
|
|
1185
|
-
fontSize:
|
|
1264
|
+
width: a(10),
|
|
1265
|
+
height: a(10),
|
|
1266
|
+
fontSize: a(10)
|
|
1186
1267
|
},
|
|
1187
1268
|
sm: {
|
|
1188
|
-
width:
|
|
1189
|
-
height:
|
|
1190
|
-
fontSize:
|
|
1269
|
+
width: a(12),
|
|
1270
|
+
height: a(12),
|
|
1271
|
+
fontSize: a(12)
|
|
1191
1272
|
},
|
|
1192
1273
|
md: {
|
|
1193
|
-
width:
|
|
1194
|
-
height:
|
|
1195
|
-
fontSize:
|
|
1274
|
+
width: a(16),
|
|
1275
|
+
height: a(16),
|
|
1276
|
+
fontSize: a(16)
|
|
1196
1277
|
}
|
|
1197
1278
|
}
|
|
1198
1279
|
}
|
|
1199
1280
|
};
|
|
1200
|
-
},
|
|
1201
|
-
const { borderWidths: r, colors:
|
|
1281
|
+
}, jr = (o) => {
|
|
1282
|
+
const { borderWidths: r, colors: e, fontSizes: n, fontWeights: a, radii: l, space: d, toRem: i } = o;
|
|
1202
1283
|
return {
|
|
1203
|
-
maxWidth:
|
|
1204
|
-
backgroundColor:
|
|
1205
|
-
color:
|
|
1206
|
-
padding: `${
|
|
1284
|
+
maxWidth: i(200),
|
|
1285
|
+
backgroundColor: e["neutral-90"],
|
|
1286
|
+
color: e["neutral-10"],
|
|
1287
|
+
padding: `${d.xs} ${d.sm}`,
|
|
1207
1288
|
fontSize: n.sm,
|
|
1208
|
-
fontWeight:
|
|
1209
|
-
border: `${r.sm} solid ${
|
|
1210
|
-
borderRadius:
|
|
1289
|
+
fontWeight: a.medium,
|
|
1290
|
+
border: `${r.sm} solid ${e["neutral-60"]}`,
|
|
1291
|
+
borderRadius: l.md,
|
|
1211
1292
|
boxSizing: "border-box"
|
|
1212
1293
|
};
|
|
1213
|
-
},
|
|
1214
|
-
const { colors: r } =
|
|
1294
|
+
}, Pr = (o) => {
|
|
1295
|
+
const { colors: r } = o;
|
|
1215
1296
|
return {
|
|
1216
1297
|
default: {
|
|
1217
1298
|
color: r["neutral-90"]
|
|
@@ -1229,7 +1310,7 @@ const w = (e) => {
|
|
|
1229
1310
|
color: r["blue-60"]
|
|
1230
1311
|
}
|
|
1231
1312
|
};
|
|
1232
|
-
},
|
|
1313
|
+
}, Gr = {
|
|
1233
1314
|
"beige-10": "#FBF9F7",
|
|
1234
1315
|
"beige-20": "#F6F3EF",
|
|
1235
1316
|
"beige-30": "#EAE4DE",
|
|
@@ -1335,94 +1416,94 @@ const w = (e) => {
|
|
|
1335
1416
|
"yellow-70": "#846A01",
|
|
1336
1417
|
"yellow-80": "#604D00",
|
|
1337
1418
|
"yellow-90": "#423500"
|
|
1338
|
-
},
|
|
1339
|
-
...
|
|
1340
|
-
"primary-10":
|
|
1341
|
-
"primary-20":
|
|
1342
|
-
"primary-30":
|
|
1343
|
-
"primary-40":
|
|
1344
|
-
"primary-50":
|
|
1345
|
-
"primary-60":
|
|
1346
|
-
"primary-70":
|
|
1347
|
-
"primary-80":
|
|
1348
|
-
"primary-90":
|
|
1349
|
-
"secondary-blue":
|
|
1350
|
-
"secondary-green":
|
|
1351
|
-
"secondary-orange":
|
|
1352
|
-
"secondary-pink":
|
|
1353
|
-
"secondary-teal":
|
|
1354
|
-
"secondary-violet":
|
|
1419
|
+
}, z = (o) => ({
|
|
1420
|
+
...o,
|
|
1421
|
+
"primary-10": o["yellow-10"],
|
|
1422
|
+
"primary-20": o["yellow-20"],
|
|
1423
|
+
"primary-30": o["yellow-30"],
|
|
1424
|
+
"primary-40": o["yellow-40"],
|
|
1425
|
+
"primary-50": o["yellow-50"],
|
|
1426
|
+
"primary-60": o["yellow-60"],
|
|
1427
|
+
"primary-70": o["yellow-70"],
|
|
1428
|
+
"primary-80": o["yellow-80"],
|
|
1429
|
+
"primary-90": o["yellow-90"],
|
|
1430
|
+
"secondary-blue": o["blue-40"],
|
|
1431
|
+
"secondary-green": o["green-30"],
|
|
1432
|
+
"secondary-orange": o["red-orange-40"],
|
|
1433
|
+
"secondary-pink": o["pink-40"],
|
|
1434
|
+
"secondary-teal": o["teal-40"],
|
|
1435
|
+
"secondary-violet": o["violet-40"],
|
|
1355
1436
|
overlay: "rgba(0, 0, 0, 0.55)"
|
|
1356
|
-
}),
|
|
1357
|
-
if (r.startsWith("secondary-") || r === "overlay") return
|
|
1358
|
-
const
|
|
1437
|
+
}), k = z(Gr), Mr = Object.keys(k).reduce((o, r) => {
|
|
1438
|
+
if (r.startsWith("secondary-") || r === "overlay") return o;
|
|
1439
|
+
const e = 100 - Number(r.slice(-2)), n = r.slice(0, r.length - 2);
|
|
1359
1440
|
return {
|
|
1360
|
-
...
|
|
1361
|
-
[r]:
|
|
1441
|
+
...o,
|
|
1442
|
+
[r]: k[`${n}${e}`]
|
|
1362
1443
|
};
|
|
1363
|
-
}, {}),
|
|
1364
|
-
...
|
|
1365
|
-
...
|
|
1366
|
-
},
|
|
1367
|
-
colors:
|
|
1368
|
-
},
|
|
1444
|
+
}, {}), Kr = {
|
|
1445
|
+
...k,
|
|
1446
|
+
...z(Mr)
|
|
1447
|
+
}, he = {
|
|
1448
|
+
colors: Kr
|
|
1449
|
+
}, Yr = "f19d0de47a5f6f7446d37111f075c0901835bf12", Jr = (o) => ({
|
|
1369
1450
|
"welcome-font": [
|
|
1370
1451
|
{
|
|
1371
|
-
url: `${
|
|
1452
|
+
url: `${o.fontsUrl}/welcome-font-regular`,
|
|
1372
1453
|
weight: "400"
|
|
1373
1454
|
},
|
|
1374
1455
|
{
|
|
1375
|
-
url: `${
|
|
1456
|
+
url: `${o.fontsUrl}/welcome-font-medium`,
|
|
1376
1457
|
weight: "500"
|
|
1377
1458
|
},
|
|
1378
1459
|
{
|
|
1379
|
-
url: `${
|
|
1460
|
+
url: `${o.fontsUrl}/welcome-font-bold`,
|
|
1380
1461
|
weight: "600"
|
|
1381
1462
|
},
|
|
1382
1463
|
{
|
|
1383
|
-
url: `${
|
|
1464
|
+
url: `${o.fontsUrl}/welcome-font-regular-italic`,
|
|
1384
1465
|
style: "italic",
|
|
1385
1466
|
weight: "400"
|
|
1386
1467
|
},
|
|
1387
1468
|
{
|
|
1388
|
-
url: `${
|
|
1469
|
+
url: `${o.fontsUrl}/welcome-font-medium-italic`,
|
|
1389
1470
|
style: "italic",
|
|
1390
1471
|
weight: "500"
|
|
1391
1472
|
},
|
|
1392
1473
|
{
|
|
1393
|
-
url: `${
|
|
1474
|
+
url: `${o.fontsUrl}/welcome-font-bold-italic`,
|
|
1394
1475
|
style: "italic",
|
|
1395
1476
|
weight: "600"
|
|
1396
1477
|
}
|
|
1397
1478
|
],
|
|
1398
1479
|
"welcome-icon-font": [
|
|
1399
1480
|
{
|
|
1400
|
-
url: `${
|
|
1481
|
+
url: `${o.fontsUrl}/icon-font/${Yr}/welcome-icon-font`,
|
|
1401
1482
|
display: "block"
|
|
1402
1483
|
}
|
|
1403
1484
|
],
|
|
1404
1485
|
"work-sans": [
|
|
1405
1486
|
{
|
|
1406
|
-
url: `${
|
|
1487
|
+
url: `${o.fontsUrl}/work-sans-variable`,
|
|
1407
1488
|
isVariable: !0,
|
|
1408
1489
|
stretch: "75% 125%",
|
|
1409
1490
|
weight: "100 1000"
|
|
1410
1491
|
}
|
|
1411
1492
|
]
|
|
1412
|
-
}),
|
|
1493
|
+
}), C = {
|
|
1413
1494
|
primary: "ease",
|
|
1414
1495
|
secondary: "linear",
|
|
1415
1496
|
tertiary: "cubic-bezier(0.41, 0.094, 0.54, 0.07)"
|
|
1416
|
-
},
|
|
1417
|
-
slow: `500ms ${
|
|
1418
|
-
medium: `300ms ${
|
|
1419
|
-
fast: `100ms ${
|
|
1420
|
-
},
|
|
1421
|
-
default:
|
|
1497
|
+
}, Xr = {
|
|
1498
|
+
slow: `500ms ${C.tertiary}`,
|
|
1499
|
+
medium: `300ms ${C.primary}`,
|
|
1500
|
+
fast: `100ms ${C.secondary}`
|
|
1501
|
+
}, Zr = ({ colors: o }) => ({
|
|
1502
|
+
default: w`
|
|
1422
1503
|
background-image: linear-gradient(
|
|
1423
1504
|
0deg,
|
|
1424
|
-
${
|
|
1425
|
-
${
|
|
1505
|
+
${o["primary-40"]},
|
|
1506
|
+
${o["primary-40"]} 100%
|
|
1426
1507
|
);
|
|
1427
1508
|
background-repeat: no-repeat;
|
|
1428
1509
|
background-size: 100% 50%;
|
|
@@ -1432,24 +1513,24 @@ const w = (e) => {
|
|
|
1432
1513
|
background-size 250ms,
|
|
1433
1514
|
color 250ms;
|
|
1434
1515
|
`,
|
|
1435
|
-
hover:
|
|
1516
|
+
hover: w`
|
|
1436
1517
|
opacity: 1;
|
|
1437
1518
|
background-position-y: 100%;
|
|
1438
1519
|
background-size: 100% 100%;
|
|
1439
1520
|
`
|
|
1440
|
-
}),
|
|
1521
|
+
}), qr = (o) => ({
|
|
1441
1522
|
none: "0",
|
|
1442
|
-
sm:
|
|
1443
|
-
md:
|
|
1444
|
-
lg:
|
|
1445
|
-
xl:
|
|
1446
|
-
xxl:
|
|
1523
|
+
sm: o.toRem(2),
|
|
1524
|
+
md: o.toRem(4),
|
|
1525
|
+
lg: o.toRem(8),
|
|
1526
|
+
xl: o.toRem(16),
|
|
1527
|
+
xxl: o.toRem(24),
|
|
1447
1528
|
full: "100%"
|
|
1448
|
-
}),
|
|
1529
|
+
}), Qr = {
|
|
1449
1530
|
sm: "1px",
|
|
1450
1531
|
md: "2px",
|
|
1451
1532
|
lg: "3px"
|
|
1452
|
-
},
|
|
1533
|
+
}, Vr = {
|
|
1453
1534
|
xs: 0,
|
|
1454
1535
|
sm: 480,
|
|
1455
1536
|
md: 736,
|
|
@@ -1458,122 +1539,122 @@ const w = (e) => {
|
|
|
1458
1539
|
xxl: 1440,
|
|
1459
1540
|
"3xl": 1620,
|
|
1460
1541
|
"4xl": 1920
|
|
1461
|
-
},
|
|
1542
|
+
}, re = {
|
|
1462
1543
|
sm: "1px 2px 4px 0 rgba(0,0,0,0.05)",
|
|
1463
1544
|
md: "3px 4px 10px 0 rgba(0,0,0,0.07)"
|
|
1464
|
-
},
|
|
1465
|
-
xxs:
|
|
1466
|
-
xs:
|
|
1467
|
-
sm:
|
|
1468
|
-
md:
|
|
1469
|
-
lg:
|
|
1470
|
-
xl:
|
|
1471
|
-
xxl:
|
|
1472
|
-
"3xl":
|
|
1473
|
-
"4xl":
|
|
1474
|
-
"5xl":
|
|
1475
|
-
"6xl":
|
|
1476
|
-
"7xl":
|
|
1477
|
-
}),
|
|
1478
|
-
backgroundColor:
|
|
1479
|
-
color:
|
|
1480
|
-
}),
|
|
1481
|
-
function r(
|
|
1545
|
+
}, ee = (o) => ({
|
|
1546
|
+
xxs: o.toRem(2),
|
|
1547
|
+
xs: o.toRem(4),
|
|
1548
|
+
sm: o.toRem(8),
|
|
1549
|
+
md: o.toRem(12),
|
|
1550
|
+
lg: o.toRem(16),
|
|
1551
|
+
xl: o.toRem(24),
|
|
1552
|
+
xxl: o.toRem(32),
|
|
1553
|
+
"3xl": o.toRem(48),
|
|
1554
|
+
"4xl": o.toRem(64),
|
|
1555
|
+
"5xl": o.toRem(96),
|
|
1556
|
+
"6xl": o.toRem(128),
|
|
1557
|
+
"7xl": o.toRem(192)
|
|
1558
|
+
}), oe = (o) => ({
|
|
1559
|
+
backgroundColor: o.colors["primary-40"],
|
|
1560
|
+
color: o.colors["neutral-90"]
|
|
1561
|
+
}), te = ({ colors: o }) => {
|
|
1562
|
+
function r(e = o["primary-40"]) {
|
|
1482
1563
|
return {
|
|
1483
|
-
boxShadow: `0 0 0 2px ${
|
|
1564
|
+
boxShadow: `0 0 0 2px ${e}`
|
|
1484
1565
|
};
|
|
1485
1566
|
}
|
|
1486
1567
|
return r;
|
|
1487
|
-
},
|
|
1488
|
-
const { borderWidths: r, colors:
|
|
1568
|
+
}, ne = (o) => {
|
|
1569
|
+
const { borderWidths: r, colors: e, focus: n, fontSizes: a, fontWeights: l, radii: d, space: i, toRem: s } = o;
|
|
1489
1570
|
return {
|
|
1490
1571
|
default: {
|
|
1491
|
-
color:
|
|
1492
|
-
fontSize:
|
|
1572
|
+
color: e["neutral-90"],
|
|
1573
|
+
fontSize: a.sm,
|
|
1493
1574
|
/* Can't use 16 because that's a valid line-height value (16em) */
|
|
1494
1575
|
lineHeight: "1rem",
|
|
1495
|
-
fontWeight:
|
|
1496
|
-
backgroundColor:
|
|
1497
|
-
borderColor:
|
|
1576
|
+
fontWeight: l.regular,
|
|
1577
|
+
backgroundColor: e["neutral-10"],
|
|
1578
|
+
borderColor: e["neutral-30"],
|
|
1498
1579
|
borderWidth: r.sm,
|
|
1499
1580
|
borderStyle: "solid",
|
|
1500
1581
|
outline: "none",
|
|
1501
|
-
borderRadius:
|
|
1582
|
+
borderRadius: d.md
|
|
1502
1583
|
},
|
|
1503
1584
|
hover: {
|
|
1504
1585
|
default: {
|
|
1505
|
-
borderColor:
|
|
1586
|
+
borderColor: e["neutral-40"]
|
|
1506
1587
|
},
|
|
1507
1588
|
transparency: {
|
|
1508
|
-
borderColor:
|
|
1589
|
+
borderColor: e["neutral-20"]
|
|
1509
1590
|
}
|
|
1510
1591
|
},
|
|
1511
1592
|
variants: {
|
|
1512
1593
|
danger: {
|
|
1513
|
-
borderColor:
|
|
1594
|
+
borderColor: e["red-70"]
|
|
1514
1595
|
},
|
|
1515
1596
|
success: {
|
|
1516
|
-
borderColor:
|
|
1597
|
+
borderColor: e["green-60"]
|
|
1517
1598
|
},
|
|
1518
1599
|
warning: {
|
|
1519
|
-
borderColor:
|
|
1600
|
+
borderColor: e["orange-60"]
|
|
1520
1601
|
}
|
|
1521
1602
|
},
|
|
1522
1603
|
focused: {
|
|
1523
1604
|
default: {
|
|
1524
|
-
...n(
|
|
1525
|
-
borderColor:
|
|
1605
|
+
...n(e["primary-20"]),
|
|
1606
|
+
borderColor: e["primary-40"]
|
|
1526
1607
|
},
|
|
1527
|
-
danger: { ...n(
|
|
1528
|
-
warning: { ...n(
|
|
1529
|
-
success: { ...n(
|
|
1608
|
+
danger: { ...n(e["red-30"]) },
|
|
1609
|
+
warning: { ...n(e["orange-20"]) },
|
|
1610
|
+
success: { ...n(e["green-30"]) }
|
|
1530
1611
|
},
|
|
1531
1612
|
sizes: {
|
|
1532
1613
|
xs: {
|
|
1533
|
-
height:
|
|
1534
|
-
paddingTop:
|
|
1535
|
-
paddingRight:
|
|
1536
|
-
paddingBottom:
|
|
1537
|
-
paddingLeft:
|
|
1614
|
+
height: s(24),
|
|
1615
|
+
paddingTop: i.xs,
|
|
1616
|
+
paddingRight: i.sm,
|
|
1617
|
+
paddingBottom: i.xs,
|
|
1618
|
+
paddingLeft: i.sm
|
|
1538
1619
|
},
|
|
1539
1620
|
sm: {
|
|
1540
|
-
height:
|
|
1541
|
-
paddingTop:
|
|
1542
|
-
paddingRight:
|
|
1543
|
-
paddingBottom:
|
|
1544
|
-
paddingLeft:
|
|
1621
|
+
height: s(32),
|
|
1622
|
+
paddingTop: i.sm,
|
|
1623
|
+
paddingRight: i.md,
|
|
1624
|
+
paddingBottom: i.sm,
|
|
1625
|
+
paddingLeft: i.md
|
|
1545
1626
|
},
|
|
1546
1627
|
md: {
|
|
1547
|
-
height:
|
|
1548
|
-
paddingTop:
|
|
1549
|
-
paddingRight:
|
|
1550
|
-
paddingBottom:
|
|
1551
|
-
paddingLeft:
|
|
1628
|
+
height: s(40),
|
|
1629
|
+
paddingTop: i.md,
|
|
1630
|
+
paddingRight: i.md,
|
|
1631
|
+
paddingBottom: i.md,
|
|
1632
|
+
paddingLeft: i.md
|
|
1552
1633
|
},
|
|
1553
1634
|
lg: {
|
|
1554
|
-
height:
|
|
1555
|
-
paddingTop:
|
|
1556
|
-
paddingRight:
|
|
1557
|
-
paddingBottom:
|
|
1558
|
-
paddingLeft:
|
|
1635
|
+
height: s(48),
|
|
1636
|
+
paddingTop: i.lg,
|
|
1637
|
+
paddingRight: i.md,
|
|
1638
|
+
paddingBottom: i.lg,
|
|
1639
|
+
paddingLeft: i.md
|
|
1559
1640
|
}
|
|
1560
1641
|
},
|
|
1561
1642
|
iconPlacement: {
|
|
1562
1643
|
xs: {
|
|
1563
|
-
left:
|
|
1564
|
-
right:
|
|
1644
|
+
left: s(8),
|
|
1645
|
+
right: s(8)
|
|
1565
1646
|
},
|
|
1566
1647
|
sm: {
|
|
1567
|
-
left:
|
|
1568
|
-
right:
|
|
1648
|
+
left: s(12),
|
|
1649
|
+
right: s(12)
|
|
1569
1650
|
},
|
|
1570
1651
|
md: {
|
|
1571
|
-
left:
|
|
1572
|
-
right:
|
|
1652
|
+
left: s(12),
|
|
1653
|
+
right: s(12)
|
|
1573
1654
|
},
|
|
1574
1655
|
lg: {
|
|
1575
|
-
left:
|
|
1576
|
-
right:
|
|
1656
|
+
left: s(12),
|
|
1657
|
+
right: s(12)
|
|
1577
1658
|
}
|
|
1578
1659
|
},
|
|
1579
1660
|
checkableField: {
|
|
@@ -1586,42 +1667,42 @@ const w = (e) => {
|
|
|
1586
1667
|
}
|
|
1587
1668
|
},
|
|
1588
1669
|
disabled: {
|
|
1589
|
-
backgroundColor:
|
|
1590
|
-
color:
|
|
1670
|
+
backgroundColor: e["beige-40"],
|
|
1671
|
+
color: e["beige-70"],
|
|
1591
1672
|
cursor: "not-allowed"
|
|
1592
1673
|
},
|
|
1593
1674
|
placeholder: {
|
|
1594
|
-
color:
|
|
1675
|
+
color: e["neutral-50"]
|
|
1595
1676
|
},
|
|
1596
1677
|
checkablelabel: {
|
|
1597
1678
|
default: {},
|
|
1598
1679
|
checked: {
|
|
1599
|
-
color:
|
|
1680
|
+
color: e["neutral-90"],
|
|
1600
1681
|
"-webkit-text-stroke": "0.04em"
|
|
1601
1682
|
}
|
|
1602
1683
|
},
|
|
1603
1684
|
select: {
|
|
1604
1685
|
default: {
|
|
1605
|
-
maxHeight:
|
|
1606
|
-
borderRadius:
|
|
1686
|
+
maxHeight: s(155),
|
|
1687
|
+
borderRadius: d.md
|
|
1607
1688
|
},
|
|
1608
1689
|
existing: {
|
|
1609
|
-
color:
|
|
1690
|
+
color: e["beige-40"],
|
|
1610
1691
|
cursor: "not-allowed"
|
|
1611
1692
|
},
|
|
1612
1693
|
highlighted: {
|
|
1613
|
-
backgroundColor:
|
|
1694
|
+
backgroundColor: e["beige-20"],
|
|
1614
1695
|
cursor: "default"
|
|
1615
1696
|
},
|
|
1616
1697
|
selectedAndHighlighted: {
|
|
1617
1698
|
backgroundImage: "linear-gradient(0deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.08) 100%)"
|
|
1618
1699
|
},
|
|
1619
1700
|
selected: {
|
|
1620
|
-
color:
|
|
1621
|
-
fontWeight:
|
|
1701
|
+
color: e["neutral-90"],
|
|
1702
|
+
fontWeight: l.bold
|
|
1622
1703
|
},
|
|
1623
1704
|
disabled: {
|
|
1624
|
-
color:
|
|
1705
|
+
color: e["beige-60"],
|
|
1625
1706
|
cursor: "not-allowed"
|
|
1626
1707
|
}
|
|
1627
1708
|
},
|
|
@@ -1629,21 +1710,21 @@ const w = (e) => {
|
|
|
1629
1710
|
"border-width": "0"
|
|
1630
1711
|
}
|
|
1631
1712
|
};
|
|
1632
|
-
},
|
|
1713
|
+
}, ae = "work-sans", le = 16, ie = "-0.019rem", de = 1.15, se = "https://cdn.welcome-ui.com/fonts", ce = "welcome-font", ge = "welcome-icon-font", pe = (o = {}) => {
|
|
1633
1714
|
const {
|
|
1634
|
-
defaultFontFamily: r =
|
|
1635
|
-
defaultFontSize:
|
|
1636
|
-
defaultLetterSpacing: n =
|
|
1637
|
-
defaultLineHeight:
|
|
1638
|
-
fontsUrl:
|
|
1639
|
-
headingFontFamily:
|
|
1640
|
-
iconFontFamily:
|
|
1641
|
-
...
|
|
1642
|
-
} =
|
|
1715
|
+
defaultFontFamily: r = ae,
|
|
1716
|
+
defaultFontSize: e = le,
|
|
1717
|
+
defaultLetterSpacing: n = ie,
|
|
1718
|
+
defaultLineHeight: a = de,
|
|
1719
|
+
fontsUrl: l = se,
|
|
1720
|
+
headingFontFamily: d = ce,
|
|
1721
|
+
iconFontFamily: i = ge,
|
|
1722
|
+
...s
|
|
1723
|
+
} = o;
|
|
1643
1724
|
let t = {};
|
|
1644
|
-
return t.transformers = { ...
|
|
1725
|
+
return t.transformers = { ...A }, t.toEm = (g) => `${g / e}em`, t.toRem = (g) => `${g / e}rem`, t.toPx = (g) => `${g * e}px`, t.colors = k, t.fontsUrl = l, t.fontFaces = Jr(t), t.fontSizes = Dr("rem", t), t.defaultLineHeight = a, t.defaultLetterSpacing = n, t.lineHeights = zr(t), t.fontWeights = Br, t.letterSpacings = Ar(t), t.fonts = Ir(r, d, i), t.borderWidths = Qr, t.screens = Vr, t.space = ee(t), t.inset = t.space, t.radii = qr(t), t.transitions = Xr, t.timingFunction = C, t.shadows = re, t = v(t, s), t.selection = oe(t), t.underline = Zr(t), t.focus = te(t), t.textsFontWeights = Er(t), t.textsFontFamily = _r(t), t.textsFontColors = Lr(t), t.textsTextTransform = Rr(), t.texts = D(t), t.defaultFields = ne(t), t.icons = fr(t), t.accordions = er(t), t.alerts = or(t), t.avatars = tr(t), t.badges = nr(t), t.breadcrumbs = ar(t), t.buttons = lr(t), t.cards = ir(t), t.checkboxes = sr(t), t.dateTimePickerCommon = dr(t), t.drawers = cr(t), t.dropdownMenu = gr(t), t.fileDrops = ur(t), t.hints = br(t), t.labels = mr(t), t.links = hr(t), t.loaders = pr(t), t.modals = xr(t), t.paginations = Cr(t), t.popovers = kr(t), t.radios = yr(t), t.radiosTab = Fr(t), t.sliders = wr(t), t.swipers = $r(t), t.tables = vr(t), t.tabs = Wr(t), t.tags = Sr(t), t.textareas = Tr(t), t.toasts = Hr(t), t.toggles = Nr(t), t.tooltips = jr(t), t.variantIcon = Pr(t), t.states = E.states, t = v(t, s), t;
|
|
1645
1726
|
};
|
|
1646
1727
|
export {
|
|
1647
|
-
|
|
1648
|
-
|
|
1728
|
+
pe as createTheme,
|
|
1729
|
+
he as darkTheme
|
|
1649
1730
|
};
|