@okam/directus-next 1.2.11 → 1.2.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +26 -0
- package/ErrorIcon-DM65zoku.mjs +14 -0
- package/ErrorIcon-Vnk7YKtL.js +14 -0
- package/draft/route.d.ts +21 -16
- package/index.js +113 -88
- package/index.mjs +96 -88
- package/package.json +5 -5
- package/server.js +2552 -4
- package/server.mjs +2557 -9
package/server.js
CHANGED
|
@@ -2,12 +2,2560 @@
|
|
|
2
2
|
"use strict";
|
|
3
3
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
4
4
|
const router = require("./router-DTZYUtal.js");
|
|
5
|
-
require("
|
|
6
|
-
const
|
|
7
|
-
const
|
|
5
|
+
const jsxRuntime = require("react/jsx-runtime");
|
|
6
|
+
const React = require("react");
|
|
7
|
+
const tailwindVariants = require("tailwind-variants");
|
|
8
8
|
const radashi = require("radashi");
|
|
9
|
+
require("@react-aria/accordion");
|
|
10
|
+
const coreLib = require("@okam/core-lib");
|
|
11
|
+
const reactAria = require("react-aria");
|
|
12
|
+
require("react-use");
|
|
13
|
+
require("@react-spring/web");
|
|
14
|
+
const reactStately = require("react-stately");
|
|
15
|
+
require("react-div-100vh");
|
|
16
|
+
require("@react-aria/focus");
|
|
17
|
+
require("swiper/react");
|
|
18
|
+
require("swiper/modules");
|
|
19
|
+
require("sanitize-html");
|
|
20
|
+
require("@react-aria/i18n");
|
|
21
|
+
const reactHookForm = require("react-hook-form");
|
|
22
|
+
const logger$1 = require("@okam/logger");
|
|
23
|
+
const utils = require("@react-aria/utils");
|
|
24
|
+
require("next/headers");
|
|
25
|
+
const directusQuery = require("@okam/directus-query");
|
|
26
|
+
const makeTheme = (theme) => theme;
|
|
27
|
+
function createCtxNullable() {
|
|
28
|
+
const ctx = React.createContext(void 0);
|
|
29
|
+
function useCtx() {
|
|
30
|
+
const c = React.useContext(ctx);
|
|
31
|
+
if (c === void 0) {
|
|
32
|
+
return null;
|
|
33
|
+
}
|
|
34
|
+
return c;
|
|
35
|
+
}
|
|
36
|
+
return [useCtx, ctx.Provider];
|
|
37
|
+
}
|
|
38
|
+
const defaultTheme = {
|
|
39
|
+
typography: () => ""
|
|
40
|
+
};
|
|
41
|
+
const [useTheme, ThemeProvider] = createCtxNullable();
|
|
42
|
+
function ThemeContextProvider({ children, brandTheme = defaultTheme }) {
|
|
43
|
+
const value = React.useMemo(() => ({ brandTheme }), [brandTheme]);
|
|
44
|
+
return /* @__PURE__ */ jsxRuntime.jsx(ThemeProvider, { value, children });
|
|
45
|
+
}
|
|
46
|
+
const createThemeProvider = (brandTheme) => {
|
|
47
|
+
const ThemeProviderContext = ({ children }) => /* @__PURE__ */ jsxRuntime.jsx(ThemeContextProvider, { brandTheme, children });
|
|
48
|
+
return ThemeProviderContext;
|
|
49
|
+
};
|
|
50
|
+
const accordionContainer = tailwindVariants.tv({
|
|
51
|
+
base: "[border-radius: 32px] p-1.5 focus:outline-none text-color-1-500",
|
|
52
|
+
defaultVariants: {
|
|
53
|
+
textAlign: "left",
|
|
54
|
+
isOpen: false
|
|
55
|
+
},
|
|
56
|
+
variants: {
|
|
57
|
+
textAlign: {
|
|
58
|
+
center: "text-center",
|
|
59
|
+
left: "text-left"
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
});
|
|
63
|
+
const accordionButton = tailwindVariants.tv({
|
|
64
|
+
base: "grid overflow-hidden w-full items-center border-b-2 border-color-1-500 focus-ring-black",
|
|
65
|
+
variants: {
|
|
66
|
+
titleBold: {
|
|
67
|
+
true: "font-bold"
|
|
68
|
+
},
|
|
69
|
+
textAlign: {
|
|
70
|
+
center: "grid-cols-[3rem_1fr_3rem] pl-0 sm:pl-0",
|
|
71
|
+
left: "grid-cols-[1fr_3rem]"
|
|
72
|
+
},
|
|
73
|
+
bgColor: {
|
|
74
|
+
gray: "bg-gray-300",
|
|
75
|
+
white: "bg-white"
|
|
76
|
+
}
|
|
77
|
+
},
|
|
78
|
+
defaultVariants: {
|
|
79
|
+
titleBold: false,
|
|
80
|
+
textAlign: "left",
|
|
81
|
+
bgColor: "white"
|
|
82
|
+
}
|
|
83
|
+
});
|
|
84
|
+
const accordionTitle = tailwindVariants.tv({
|
|
85
|
+
base: "",
|
|
86
|
+
defaultVariants: {
|
|
87
|
+
textAlign: "left"
|
|
88
|
+
},
|
|
89
|
+
variants: {
|
|
90
|
+
textAlign: {
|
|
91
|
+
center: "justify-self-center col-start-2",
|
|
92
|
+
left: "justify-self-start"
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
});
|
|
96
|
+
const accordionIcon = tailwindVariants.tv({
|
|
97
|
+
base: "text-color-1-500 min-h-12 rotate-90 min-w-12 rounded-full flex items-center justify-center transition duration-500 transform ml-auto aspect-square",
|
|
98
|
+
variants: {
|
|
99
|
+
isOpen: {
|
|
100
|
+
true: "-rotate-90",
|
|
101
|
+
false: ""
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
});
|
|
105
|
+
const accordionRegion = tailwindVariants.tv({
|
|
106
|
+
base: `
|
|
107
|
+
font-body
|
|
108
|
+
text-inherit
|
|
109
|
+
h-auto
|
|
110
|
+
grid
|
|
111
|
+
`,
|
|
112
|
+
defaultVariants: {
|
|
113
|
+
textAlign: "left"
|
|
114
|
+
},
|
|
115
|
+
variants: {
|
|
116
|
+
textAlign: {
|
|
117
|
+
center: "grid-cols-[3rem_1fr_3rem] px-6 text-center",
|
|
118
|
+
left: "grid-cols-[1fr_3rem] text-left"
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
});
|
|
122
|
+
const accordionContent = tailwindVariants.tv({
|
|
123
|
+
base: "overflow-hidden flex flex-col gap-2 items-start",
|
|
124
|
+
defaultVariants: {
|
|
125
|
+
textAlign: "left"
|
|
126
|
+
},
|
|
127
|
+
variants: {
|
|
128
|
+
textAlign: {
|
|
129
|
+
center: "col-start-2",
|
|
130
|
+
left: ""
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
});
|
|
134
|
+
const accordionTheme = {
|
|
135
|
+
container: (props) => accordionContainer(props),
|
|
136
|
+
button: (props) => accordionButton(props),
|
|
137
|
+
title: (props) => accordionTitle(props),
|
|
138
|
+
icon: (props) => accordionIcon(props),
|
|
139
|
+
region: (props) => accordionRegion(props),
|
|
140
|
+
content: (props) => accordionContent(props)
|
|
141
|
+
};
|
|
142
|
+
const button = tailwindVariants.tv({
|
|
143
|
+
base: `
|
|
144
|
+
flex
|
|
145
|
+
items-center
|
|
146
|
+
justify-center
|
|
147
|
+
gap-4
|
|
148
|
+
transition
|
|
149
|
+
duration-300
|
|
150
|
+
ease-in-out
|
|
151
|
+
disabled:pointer-events-none
|
|
152
|
+
disabled:opacity-30
|
|
153
|
+
focus-ring-black
|
|
154
|
+
h-fit
|
|
155
|
+
`,
|
|
156
|
+
defaultVariants: {
|
|
157
|
+
buttonStyle: "default",
|
|
158
|
+
type: "button",
|
|
159
|
+
size: "default",
|
|
160
|
+
shape: "rounded"
|
|
161
|
+
},
|
|
162
|
+
variants: {
|
|
163
|
+
type: {
|
|
164
|
+
button: "",
|
|
165
|
+
menu: "text-2xl"
|
|
166
|
+
},
|
|
167
|
+
buttonStyle: {
|
|
168
|
+
default: `
|
|
169
|
+
px-4
|
|
170
|
+
py-2
|
|
171
|
+
text-white
|
|
172
|
+
bg-color-1-500
|
|
173
|
+
hover:bg-color-1-400
|
|
174
|
+
active:bg-color-1-400
|
|
175
|
+
`,
|
|
176
|
+
outline: `
|
|
177
|
+
px-4
|
|
178
|
+
py-2
|
|
179
|
+
bg-transparent
|
|
180
|
+
border-color-1-500
|
|
181
|
+
text-color-1-500
|
|
182
|
+
hover:bg-color-1-500
|
|
183
|
+
hover:text-white
|
|
184
|
+
active:bg-color-1-500
|
|
185
|
+
active:text-white
|
|
186
|
+
`,
|
|
187
|
+
hollow: `
|
|
188
|
+
px-2
|
|
189
|
+
bg-transparent
|
|
190
|
+
text-color-1-500
|
|
191
|
+
hover:border-b-color-1-500
|
|
192
|
+
active:border-b-color-1-500
|
|
193
|
+
focus:border-b-color-1-500
|
|
194
|
+
|
|
195
|
+
`
|
|
196
|
+
},
|
|
197
|
+
intent: {
|
|
198
|
+
danger: ``,
|
|
199
|
+
error: `
|
|
200
|
+
bg-error
|
|
201
|
+
text-white
|
|
202
|
+
pointer-events-none
|
|
203
|
+
border-error
|
|
204
|
+
`
|
|
205
|
+
},
|
|
206
|
+
size: {
|
|
207
|
+
default: `min-w-12 min-h-6`,
|
|
208
|
+
large: `min-w-36 min-h-18`
|
|
209
|
+
},
|
|
210
|
+
shape: {
|
|
211
|
+
rounded: `rounded-md`,
|
|
212
|
+
circular: `rounded-full`
|
|
213
|
+
}
|
|
214
|
+
},
|
|
215
|
+
compoundVariants: [
|
|
216
|
+
{
|
|
217
|
+
intent: "danger",
|
|
218
|
+
buttonStyle: "default",
|
|
219
|
+
className: `
|
|
220
|
+
bg-danger-500
|
|
221
|
+
text-white
|
|
222
|
+
border-danger-500
|
|
223
|
+
hover:bg-danger-400
|
|
224
|
+
hover:border-danger-400
|
|
225
|
+
focus:bg-danger-400
|
|
226
|
+
focus:border-danger-400
|
|
227
|
+
`
|
|
228
|
+
}
|
|
229
|
+
]
|
|
230
|
+
});
|
|
231
|
+
const typography = tailwindVariants.tv({
|
|
232
|
+
variants: {
|
|
233
|
+
size: {
|
|
234
|
+
h1: `text-5xl`,
|
|
235
|
+
h2: `text-4xl`,
|
|
236
|
+
h3: `text-3xl`,
|
|
237
|
+
h4: `text-2xl`,
|
|
238
|
+
h5: `text-xl`,
|
|
239
|
+
h6: `text-lg`,
|
|
240
|
+
leading: `text-md font-bold leading-normal`,
|
|
241
|
+
paragraph: `text-md inline`,
|
|
242
|
+
footnotes: `text-sm`,
|
|
243
|
+
xs: `text-xs`
|
|
244
|
+
},
|
|
245
|
+
font: {
|
|
246
|
+
body: `font-body`
|
|
247
|
+
},
|
|
248
|
+
weight: {
|
|
249
|
+
normal: `font-normal`,
|
|
250
|
+
light: `font-light`,
|
|
251
|
+
bold: "font-bold"
|
|
252
|
+
},
|
|
253
|
+
color: {
|
|
254
|
+
gray: `text-gray-500`,
|
|
255
|
+
white: `text-white`
|
|
256
|
+
},
|
|
257
|
+
isError: {
|
|
258
|
+
true: "text-sm text-error"
|
|
259
|
+
},
|
|
260
|
+
align: {
|
|
261
|
+
center: "text-center",
|
|
262
|
+
left: "text-left",
|
|
263
|
+
right: "text-right"
|
|
264
|
+
}
|
|
265
|
+
},
|
|
266
|
+
defaultVariants: {
|
|
267
|
+
size: "paragraph",
|
|
268
|
+
font: "body"
|
|
269
|
+
}
|
|
270
|
+
});
|
|
271
|
+
const alertsWrapper = tailwindVariants.tv({
|
|
272
|
+
base: "bg-color-1-200 p-4 flex flex-col gap-4"
|
|
273
|
+
});
|
|
274
|
+
const alertsCarouselWrapper = tailwindVariants.tv({
|
|
275
|
+
base: "flex flex-wrap justify-between items-center gap-4 relative"
|
|
276
|
+
});
|
|
277
|
+
const alertsCloseBtn = tailwindVariants.tv({
|
|
278
|
+
extend: button,
|
|
279
|
+
base: "self-end"
|
|
280
|
+
});
|
|
281
|
+
const alertsSwiperSwiper = tailwindVariants.tv({
|
|
282
|
+
base: "bg-color-1-300 m-2 rounded-lg order-2 basis-9/12"
|
|
283
|
+
});
|
|
284
|
+
const alertsSwiperWrapper = tailwindVariants.tv({
|
|
285
|
+
base: "m-4"
|
|
286
|
+
});
|
|
287
|
+
const alertsItemWrapper = tailwindVariants.tv({
|
|
288
|
+
base: ""
|
|
289
|
+
});
|
|
290
|
+
const alertsItemContainer = tailwindVariants.tv({
|
|
291
|
+
base: ""
|
|
292
|
+
});
|
|
293
|
+
const alertsItemTitle = tailwindVariants.tv({
|
|
294
|
+
extend: typography,
|
|
295
|
+
defaultVariants: {
|
|
296
|
+
size: "h1"
|
|
297
|
+
}
|
|
298
|
+
});
|
|
299
|
+
const alertsItemContent = tailwindVariants.tv({
|
|
300
|
+
extend: typography
|
|
301
|
+
});
|
|
302
|
+
const alertsItemIcon = tailwindVariants.tv({
|
|
303
|
+
base: "block w-min bg-color-1-400 p-2 rounded-lg"
|
|
304
|
+
});
|
|
305
|
+
const alertsNavigationButton = tailwindVariants.tv({
|
|
306
|
+
extend: button,
|
|
307
|
+
base: "basis-1/12",
|
|
308
|
+
variants: {
|
|
309
|
+
order: {
|
|
310
|
+
prev: "order-1",
|
|
311
|
+
next: "order-3"
|
|
312
|
+
}
|
|
313
|
+
}
|
|
314
|
+
});
|
|
315
|
+
const alertsPaginationWrapper = tailwindVariants.tv({
|
|
316
|
+
base: "flex gap-4 justify-center bg-color-1-200 z-10 bottom-4 left-0 right-0 order-4 basis-full"
|
|
317
|
+
});
|
|
318
|
+
const alertsPaginationBullet = tailwindVariants.tv({
|
|
319
|
+
base: "w-4 h-4 rounded-full block bg-color-1-600 focus-ring-black",
|
|
320
|
+
variants: {
|
|
321
|
+
active: {
|
|
322
|
+
true: "bg-color-1-100",
|
|
323
|
+
false: ""
|
|
324
|
+
}
|
|
325
|
+
}
|
|
326
|
+
});
|
|
327
|
+
const alertsTheme = {
|
|
328
|
+
wrapper: alertsWrapper,
|
|
329
|
+
carouselWrapper: alertsCarouselWrapper,
|
|
330
|
+
closeBtn: alertsCloseBtn,
|
|
331
|
+
swiper: {
|
|
332
|
+
swiper: alertsSwiperSwiper,
|
|
333
|
+
wrapper: alertsSwiperWrapper
|
|
334
|
+
},
|
|
335
|
+
item: {
|
|
336
|
+
wrapper: alertsItemWrapper,
|
|
337
|
+
container: alertsItemContainer,
|
|
338
|
+
title: alertsItemTitle,
|
|
339
|
+
content: alertsItemContent,
|
|
340
|
+
icon: alertsItemIcon
|
|
341
|
+
},
|
|
342
|
+
navigation: {
|
|
343
|
+
button: alertsNavigationButton
|
|
344
|
+
},
|
|
345
|
+
pagination: {
|
|
346
|
+
wrapper: alertsPaginationWrapper,
|
|
347
|
+
bullet: alertsPaginationBullet
|
|
348
|
+
}
|
|
349
|
+
};
|
|
350
|
+
const main = tailwindVariants.tv({
|
|
351
|
+
base: "w-full bg-slate-100"
|
|
352
|
+
});
|
|
353
|
+
const container = tailwindVariants.tv({
|
|
354
|
+
base: "max-w-screen-lg mx-auto w-full",
|
|
355
|
+
variants: {
|
|
356
|
+
fullWidth: {
|
|
357
|
+
true: "max-w-full col-span-full p-0"
|
|
358
|
+
},
|
|
359
|
+
spacing: {
|
|
360
|
+
small: "mb-3",
|
|
361
|
+
medium: "mb-6",
|
|
362
|
+
large: "mb-8",
|
|
363
|
+
none: "mb-0"
|
|
364
|
+
}
|
|
365
|
+
}
|
|
366
|
+
});
|
|
367
|
+
const grid = tailwindVariants.tv({
|
|
368
|
+
extend: container,
|
|
369
|
+
base: "grid grid-cols-12 gap-6 px-4 col-span-full",
|
|
370
|
+
variants: {
|
|
371
|
+
fullWidth: {
|
|
372
|
+
true: "max-w-full col-span-full p-0"
|
|
373
|
+
}
|
|
374
|
+
}
|
|
375
|
+
});
|
|
376
|
+
const gridItem = tailwindVariants.tv({
|
|
377
|
+
base: "bg-slate-300 h-64 p-4 flex justify-start items-end",
|
|
378
|
+
defaultVariants: {
|
|
379
|
+
size: "small"
|
|
380
|
+
},
|
|
381
|
+
variants: {
|
|
382
|
+
size: {
|
|
383
|
+
small: "col-span-12 sm:col-span-6 md:col-span-4 lg:col-span-4",
|
|
384
|
+
medium: "col-span-12 sm:col-span-12 md:col-span-8 lg:col-span-8",
|
|
385
|
+
large: "lg:col-start-3 sm:col-start-1 sm:col-end-13 lg:col-end-11 md:col-start-3 md:col-end-11 col-start-1 col-end-13"
|
|
386
|
+
}
|
|
387
|
+
}
|
|
388
|
+
});
|
|
389
|
+
const calendarContainer = tailwindVariants.tv({
|
|
390
|
+
base: "text-gray-800 flex flex-col gap-4"
|
|
391
|
+
});
|
|
392
|
+
const calendarHeader = tailwindVariants.tv({
|
|
393
|
+
base: "flex items-center justify-between"
|
|
394
|
+
});
|
|
395
|
+
const calendarTitle = tailwindVariants.tv({
|
|
396
|
+
base: "text-2xl text-color-1-500 font-bold"
|
|
397
|
+
});
|
|
398
|
+
const calendarHeaderContainer = tailwindVariants.tv({
|
|
399
|
+
base: ""
|
|
400
|
+
});
|
|
401
|
+
tailwindVariants.tv({
|
|
402
|
+
base: ""
|
|
403
|
+
});
|
|
404
|
+
tailwindVariants.tv({
|
|
405
|
+
base: ""
|
|
406
|
+
});
|
|
407
|
+
tailwindVariants.tv({
|
|
408
|
+
base: ""
|
|
409
|
+
});
|
|
410
|
+
const calendarNavigationButtonsContainer = tailwindVariants.tv({
|
|
411
|
+
base: "flex items-center gap-1"
|
|
412
|
+
});
|
|
413
|
+
const calendarNavigationButtons = tailwindVariants.tv({
|
|
414
|
+
base: `
|
|
415
|
+
active:bg-color-1-500
|
|
416
|
+
p-2
|
|
417
|
+
rounded-full
|
|
418
|
+
active:text-color-1-100
|
|
419
|
+
hover:bg-color-1-200
|
|
420
|
+
focus-ring-black
|
|
421
|
+
transition-all
|
|
422
|
+
duration-300
|
|
423
|
+
ease-in-out
|
|
424
|
+
`
|
|
425
|
+
});
|
|
426
|
+
const calendarTable = tailwindVariants.tv({
|
|
427
|
+
base: `
|
|
428
|
+
border-spacing-2
|
|
429
|
+
border-separate
|
|
430
|
+
`
|
|
431
|
+
});
|
|
432
|
+
const calendarDayLabel = tailwindVariants.tv({
|
|
433
|
+
base: `
|
|
434
|
+
text-center
|
|
435
|
+
capitalize
|
|
436
|
+
rounded-lg
|
|
437
|
+
p-2
|
|
438
|
+
mx-2
|
|
439
|
+
bg-color-1-300
|
|
440
|
+
`
|
|
441
|
+
});
|
|
442
|
+
const calendarCellContainer = tailwindVariants.tv({
|
|
443
|
+
base: "text-center",
|
|
444
|
+
variants: {
|
|
445
|
+
isFocusVisible: {
|
|
446
|
+
true: "z-10",
|
|
447
|
+
false: ""
|
|
448
|
+
}
|
|
449
|
+
}
|
|
450
|
+
});
|
|
451
|
+
const calendarCell = tailwindVariants.tv({
|
|
452
|
+
base: "w-10 h-10",
|
|
453
|
+
variants: {
|
|
454
|
+
isSelected: {
|
|
455
|
+
true: "",
|
|
456
|
+
false: ""
|
|
457
|
+
},
|
|
458
|
+
isInvalid: {
|
|
459
|
+
true: "",
|
|
460
|
+
false: ""
|
|
461
|
+
},
|
|
462
|
+
isDisabled: {
|
|
463
|
+
true: "disabled pointer-events-none",
|
|
464
|
+
false: ""
|
|
465
|
+
},
|
|
466
|
+
isUnavailable: {
|
|
467
|
+
true: "pointer-events-none",
|
|
468
|
+
false: ""
|
|
469
|
+
},
|
|
470
|
+
isOutsideRange: {
|
|
471
|
+
true: "pointer-events-none",
|
|
472
|
+
false: ""
|
|
473
|
+
},
|
|
474
|
+
isOutsideVisibleRange: {
|
|
475
|
+
true: "pointer-events-none",
|
|
476
|
+
false: ""
|
|
477
|
+
},
|
|
478
|
+
isRoundedLeft: {
|
|
479
|
+
true: "rounded-l-full",
|
|
480
|
+
false: ""
|
|
481
|
+
},
|
|
482
|
+
isRoundedRight: {
|
|
483
|
+
true: "rounded-r-full",
|
|
484
|
+
false: ""
|
|
485
|
+
}
|
|
486
|
+
},
|
|
487
|
+
compoundVariants: [
|
|
488
|
+
{
|
|
489
|
+
isSelected: [true, false],
|
|
490
|
+
isInvalid: true,
|
|
491
|
+
class: "bg-error-400 hover:bg-error-500"
|
|
492
|
+
},
|
|
493
|
+
{
|
|
494
|
+
isSelected: true
|
|
495
|
+
}
|
|
496
|
+
]
|
|
497
|
+
});
|
|
498
|
+
const calendarCellDate = tailwindVariants.tv({
|
|
499
|
+
base: `
|
|
500
|
+
w-full
|
|
501
|
+
h-full
|
|
502
|
+
flex
|
|
503
|
+
items-center
|
|
504
|
+
justify-center
|
|
505
|
+
cursor-pointer
|
|
506
|
+
transition-all
|
|
507
|
+
duration-100
|
|
508
|
+
ease-in-out
|
|
509
|
+
relative
|
|
510
|
+
`,
|
|
511
|
+
variants: {
|
|
512
|
+
isSelected: {
|
|
513
|
+
true: `
|
|
514
|
+
bg-color-1-400
|
|
515
|
+
text-white
|
|
516
|
+
hover:bg-color-1-500
|
|
517
|
+
`,
|
|
518
|
+
false: `
|
|
519
|
+
rounded-full
|
|
520
|
+
hover:text-white
|
|
521
|
+
hover:bg-color-1-400
|
|
522
|
+
`
|
|
523
|
+
},
|
|
524
|
+
isInvalid: {
|
|
525
|
+
true: "",
|
|
526
|
+
fasle: ""
|
|
527
|
+
},
|
|
528
|
+
isDisabled: {
|
|
529
|
+
true: "opacity-50",
|
|
530
|
+
false: ""
|
|
531
|
+
},
|
|
532
|
+
isUnavailable: {
|
|
533
|
+
true: "text-gray-200",
|
|
534
|
+
false: ""
|
|
535
|
+
},
|
|
536
|
+
isOutsideRange: {
|
|
537
|
+
true: `
|
|
538
|
+
text-black
|
|
539
|
+
before:content-['/']
|
|
540
|
+
before:text-gray-400
|
|
541
|
+
before:[font-weight:100]
|
|
542
|
+
before:text-4xl
|
|
543
|
+
before:absolute
|
|
544
|
+
before:inset-0
|
|
545
|
+
before:flex
|
|
546
|
+
before:items-center
|
|
547
|
+
before:justify-center
|
|
548
|
+
`,
|
|
549
|
+
false: ""
|
|
550
|
+
},
|
|
551
|
+
isOutsideVisibleRange: {
|
|
552
|
+
true: `text-gray-400`,
|
|
553
|
+
false: ""
|
|
554
|
+
},
|
|
555
|
+
isFocusVisible: {
|
|
556
|
+
true: "",
|
|
557
|
+
false: ""
|
|
558
|
+
},
|
|
559
|
+
isSelectionStart: {
|
|
560
|
+
true: "",
|
|
561
|
+
false: ""
|
|
562
|
+
},
|
|
563
|
+
isSelectionEnd: {
|
|
564
|
+
true: "",
|
|
565
|
+
false: ""
|
|
566
|
+
}
|
|
567
|
+
},
|
|
568
|
+
compoundVariants: [
|
|
569
|
+
{
|
|
570
|
+
isSelectionStart: [true, false],
|
|
571
|
+
isSelectionEnd: [true, false],
|
|
572
|
+
isDisabled: false,
|
|
573
|
+
isOutsideRange: false,
|
|
574
|
+
isUnavailable: false,
|
|
575
|
+
isInvalid: true,
|
|
576
|
+
class: `
|
|
577
|
+
bg-error-400
|
|
578
|
+
hover:bg-error-500
|
|
579
|
+
`
|
|
580
|
+
},
|
|
581
|
+
{
|
|
582
|
+
isSelectionStart: true,
|
|
583
|
+
class: `
|
|
584
|
+
rounded-l-full
|
|
585
|
+
bg-color-1-400
|
|
586
|
+
text-white
|
|
587
|
+
hover:bg-color-1-500
|
|
588
|
+
`
|
|
589
|
+
},
|
|
590
|
+
{
|
|
591
|
+
isSelectionEnd: true,
|
|
592
|
+
class: `
|
|
593
|
+
rounded-r-full
|
|
594
|
+
bg-color-1-400
|
|
595
|
+
text-white
|
|
596
|
+
hover:bg-color-1-500
|
|
597
|
+
`
|
|
598
|
+
}
|
|
599
|
+
]
|
|
600
|
+
});
|
|
601
|
+
const calendarTheme = {
|
|
602
|
+
container: calendarContainer,
|
|
603
|
+
header: calendarHeader,
|
|
604
|
+
calendarHeaderContainer,
|
|
605
|
+
title: calendarTitle,
|
|
606
|
+
navigationButtonsContainer: calendarNavigationButtonsContainer,
|
|
607
|
+
navigationButtons: calendarNavigationButtons,
|
|
608
|
+
calendarTable,
|
|
609
|
+
calendarDayLabel,
|
|
610
|
+
cellContainer: calendarCellContainer,
|
|
611
|
+
cell: calendarCell,
|
|
612
|
+
cellDate: calendarCellDate
|
|
613
|
+
};
|
|
614
|
+
const carouselWrapper = tailwindVariants.tv({
|
|
615
|
+
base: "flex flex-wrap justify-between items-center gap-4 relative"
|
|
616
|
+
});
|
|
617
|
+
const carouselSwiperSwiper = tailwindVariants.tv({
|
|
618
|
+
base: `
|
|
619
|
+
basis-9/12
|
|
620
|
+
bg-color-1-300
|
|
621
|
+
m-2
|
|
622
|
+
rounded-lg
|
|
623
|
+
order-2
|
|
624
|
+
focus-visible:outline-2
|
|
625
|
+
focus-visible:outline-black
|
|
626
|
+
focus-visible:outline-offset-2
|
|
627
|
+
`
|
|
628
|
+
});
|
|
629
|
+
const carouselSwiperWrapper = tailwindVariants.tv({
|
|
630
|
+
base: ""
|
|
631
|
+
});
|
|
632
|
+
const carouselNavigationButton = tailwindVariants.tv({
|
|
633
|
+
extend: button,
|
|
634
|
+
base: "basis-1/12",
|
|
635
|
+
variants: {
|
|
636
|
+
order: {
|
|
637
|
+
prev: "order-1",
|
|
638
|
+
next: "order-3"
|
|
639
|
+
}
|
|
640
|
+
}
|
|
641
|
+
});
|
|
642
|
+
const carouselPaginationWrapper = tailwindVariants.tv({
|
|
643
|
+
base: "flex gap-4 justify-center z-10 bottom-4 left-0 right-0 order-4 basis-full"
|
|
644
|
+
});
|
|
645
|
+
const carouselPaginationBullet = tailwindVariants.tv({
|
|
646
|
+
base: "w-4 h-4 rounded-full block bg-color-1-600 focus-ring-black",
|
|
647
|
+
variants: {
|
|
648
|
+
active: {
|
|
649
|
+
true: "bg-color-1-100",
|
|
650
|
+
false: ""
|
|
651
|
+
}
|
|
652
|
+
}
|
|
653
|
+
});
|
|
654
|
+
const carouselPaginationFractionWrapper = tailwindVariants.tv({
|
|
655
|
+
base: "bg-color-1-300 rounded-lg p-2"
|
|
656
|
+
});
|
|
657
|
+
const carouselSlideWrapper = tailwindVariants.tv({
|
|
658
|
+
base: "px-4 flex flex-col justify-center h-full"
|
|
659
|
+
});
|
|
660
|
+
const carouselSlideContainer = tailwindVariants.tv({
|
|
661
|
+
base: "flex flex-col gap-2 bg-color-1-400 my-4 rounded-lg p-4"
|
|
662
|
+
});
|
|
663
|
+
const carouselSlideTitle = tailwindVariants.tv({
|
|
664
|
+
extend: typography,
|
|
665
|
+
defaultVariants: {
|
|
666
|
+
size: "h3"
|
|
667
|
+
}
|
|
668
|
+
});
|
|
669
|
+
const carouselTheme = {
|
|
670
|
+
carouselWrapper,
|
|
671
|
+
swiper: {
|
|
672
|
+
swiper: carouselSwiperSwiper,
|
|
673
|
+
wrapper: carouselSwiperWrapper
|
|
674
|
+
},
|
|
675
|
+
navigation: {
|
|
676
|
+
button: carouselNavigationButton
|
|
677
|
+
},
|
|
678
|
+
pagination: {
|
|
679
|
+
wrapper: carouselPaginationWrapper,
|
|
680
|
+
bullet: carouselPaginationBullet,
|
|
681
|
+
fraction: {
|
|
682
|
+
wrapper: carouselPaginationFractionWrapper
|
|
683
|
+
}
|
|
684
|
+
},
|
|
685
|
+
slide: {
|
|
686
|
+
wrapper: carouselSlideWrapper,
|
|
687
|
+
container: carouselSlideContainer,
|
|
688
|
+
title: carouselSlideTitle
|
|
689
|
+
}
|
|
690
|
+
};
|
|
691
|
+
const checkboxContainer = tailwindVariants.tv({
|
|
692
|
+
base: "flex focus-ring-black"
|
|
693
|
+
});
|
|
694
|
+
const checkboxLabel = tailwindVariants.tv({
|
|
695
|
+
base: `hover:cursor-pointer`,
|
|
696
|
+
variants: {
|
|
697
|
+
color: {
|
|
698
|
+
gray: "text-gray-300",
|
|
699
|
+
black: "text-black"
|
|
700
|
+
},
|
|
701
|
+
isDisabled: {
|
|
702
|
+
true: "text-gray-6"
|
|
703
|
+
}
|
|
704
|
+
},
|
|
705
|
+
defaultVariants: {
|
|
706
|
+
color: "black"
|
|
707
|
+
}
|
|
708
|
+
});
|
|
709
|
+
const checkBox = tailwindVariants.tv({
|
|
710
|
+
base: `w-6 h-6 mt-0.5 mr-2.5 rounded-full border-2 border-gray-2 shrink-0 hover:cursor-pointer flex items-center justify-center`,
|
|
711
|
+
variants: {
|
|
712
|
+
isDisabled: {
|
|
713
|
+
true: "border-gray-6"
|
|
714
|
+
},
|
|
715
|
+
isFocused: {
|
|
716
|
+
true: `outline-black [outline-offset: 2px]`
|
|
717
|
+
},
|
|
718
|
+
isError: {
|
|
719
|
+
true: "border-red-500"
|
|
720
|
+
}
|
|
721
|
+
}
|
|
722
|
+
});
|
|
723
|
+
const checkMark = tailwindVariants.tv({
|
|
724
|
+
base: `hidden w-4 h-4 bg-gray-300 rounded-full`,
|
|
725
|
+
variants: {
|
|
726
|
+
selected: {
|
|
727
|
+
true: "block text-white"
|
|
728
|
+
}
|
|
729
|
+
}
|
|
730
|
+
});
|
|
731
|
+
const checkMarkIcon = tailwindVariants.tv({
|
|
732
|
+
base: "text-white w-4 h-4 [&_svg]:w-4 [&_svg]:h-4"
|
|
733
|
+
});
|
|
734
|
+
const checkboxGroup = tailwindVariants.tv({
|
|
735
|
+
base: `block`,
|
|
736
|
+
variants: {
|
|
737
|
+
isDisabled: {
|
|
738
|
+
true: "opacity-60 pointer-events-none"
|
|
739
|
+
}
|
|
740
|
+
}
|
|
741
|
+
});
|
|
742
|
+
const checkboxGroupItemsGroup = tailwindVariants.tv({
|
|
743
|
+
base: `flex flex-col gap-4 py-8`
|
|
744
|
+
});
|
|
745
|
+
const listBoxWrapper = tailwindVariants.tv({
|
|
746
|
+
base: "flex flex-col gap-2"
|
|
747
|
+
});
|
|
748
|
+
const listBoxLabel = tailwindVariants.tv({
|
|
749
|
+
extend: typography,
|
|
750
|
+
defaultVariants: {
|
|
751
|
+
size: "h3"
|
|
752
|
+
}
|
|
753
|
+
});
|
|
754
|
+
const listBoxList = tailwindVariants.tv({
|
|
755
|
+
base: "flex flex-col gap-2"
|
|
756
|
+
});
|
|
757
|
+
const listBoxSectionWrapper = tailwindVariants.tv({
|
|
758
|
+
base: "flex flex-col gap-2 pt-2 mb-2 border-t border-border first:border-t-0 first:pt-0 last:mb-0"
|
|
759
|
+
});
|
|
760
|
+
const listBoxSectionHeading = tailwindVariants.tv({
|
|
761
|
+
extend: typography,
|
|
762
|
+
defaultVariants: {
|
|
763
|
+
size: "h4"
|
|
764
|
+
}
|
|
765
|
+
});
|
|
766
|
+
const listBoxSectionGroup = tailwindVariants.tv({
|
|
767
|
+
base: "flex flex-col gap-2"
|
|
768
|
+
});
|
|
769
|
+
const listBoxOptionOption = tailwindVariants.tv({
|
|
770
|
+
extend: typography,
|
|
771
|
+
base: "p-1 rounded-md",
|
|
772
|
+
variants: {
|
|
773
|
+
isSelectable: {
|
|
774
|
+
true: "cursor-pointer"
|
|
775
|
+
},
|
|
776
|
+
isLink: {
|
|
777
|
+
true: "cursor-pointer underline underline-offset-4 decoration-color-1-400 text-color-1-400 hover:text-color-1-500 active:text-color-1-600",
|
|
778
|
+
false: ""
|
|
779
|
+
},
|
|
780
|
+
isFocused: {
|
|
781
|
+
true: "outline outline-2 outline-offset-1 outline-gray-400"
|
|
782
|
+
},
|
|
783
|
+
isFocusVisible: {
|
|
784
|
+
true: "outline outline-4 outline-offset-2 outline-black"
|
|
785
|
+
},
|
|
786
|
+
isSelected: {
|
|
787
|
+
true: "bg-color-1-400 text-white hover:bg-color-1-500 active:bg-color-1-600"
|
|
788
|
+
},
|
|
789
|
+
isDisabled: {
|
|
790
|
+
true: "opacity-50 pointer-events-none"
|
|
791
|
+
},
|
|
792
|
+
allowsSelection: {
|
|
793
|
+
true: ""
|
|
794
|
+
}
|
|
795
|
+
},
|
|
796
|
+
defaultVariants: {
|
|
797
|
+
size: "paragraph"
|
|
798
|
+
},
|
|
799
|
+
compoundVariants: [
|
|
800
|
+
{
|
|
801
|
+
isFocused: true,
|
|
802
|
+
isFocusVisible: true,
|
|
803
|
+
className: "outline outline-4 outline-offset-2 outline-black"
|
|
804
|
+
},
|
|
805
|
+
{
|
|
806
|
+
isSelectable: true,
|
|
807
|
+
isLink: false,
|
|
808
|
+
className: "hover:bg-color-1-100 active:bg-color-1-200"
|
|
809
|
+
}
|
|
810
|
+
]
|
|
811
|
+
});
|
|
812
|
+
const listBoxOptionLabel = tailwindVariants.tv({
|
|
813
|
+
extend: typography,
|
|
814
|
+
defaultVariants: {
|
|
815
|
+
size: "h5"
|
|
816
|
+
}
|
|
817
|
+
});
|
|
818
|
+
const listBoxOptionDescription = tailwindVariants.tv({
|
|
819
|
+
extend: typography,
|
|
820
|
+
defaultVariants: {
|
|
821
|
+
size: "footnotes"
|
|
822
|
+
}
|
|
823
|
+
});
|
|
824
|
+
const listBoxErrorMessage = tailwindVariants.tv({
|
|
825
|
+
extend: typography,
|
|
826
|
+
defaultVariants: {
|
|
827
|
+
size: "footnotes",
|
|
828
|
+
isError: true
|
|
829
|
+
}
|
|
830
|
+
});
|
|
831
|
+
const itemTheme = {
|
|
832
|
+
option: listBoxOptionOption,
|
|
833
|
+
label: listBoxOptionLabel,
|
|
834
|
+
description: listBoxOptionDescription
|
|
835
|
+
};
|
|
836
|
+
const listBoxTheme = {
|
|
837
|
+
wrapper: listBoxWrapper,
|
|
838
|
+
label: listBoxLabel,
|
|
839
|
+
list: listBoxList,
|
|
840
|
+
section: {
|
|
841
|
+
wrapper: listBoxSectionWrapper,
|
|
842
|
+
heading: listBoxSectionHeading,
|
|
843
|
+
group: listBoxSectionGroup,
|
|
844
|
+
item: itemTheme
|
|
845
|
+
},
|
|
846
|
+
item: itemTheme,
|
|
847
|
+
errorMessage: listBoxErrorMessage
|
|
848
|
+
};
|
|
849
|
+
const comboBoxButton = tailwindVariants.tv({
|
|
850
|
+
base: [
|
|
851
|
+
button.base,
|
|
852
|
+
`
|
|
853
|
+
px-4
|
|
854
|
+
py-2
|
|
855
|
+
text-white
|
|
856
|
+
bg-color-1-500
|
|
857
|
+
`
|
|
858
|
+
],
|
|
859
|
+
variants: {
|
|
860
|
+
isOpen: {
|
|
861
|
+
true: "pointer-events-none",
|
|
862
|
+
false: "hover:bg-color-1-400 active:bg-color-1-400"
|
|
863
|
+
}
|
|
864
|
+
}
|
|
865
|
+
});
|
|
866
|
+
const comboBoxTheme = {
|
|
867
|
+
wrapper: () => "flex flex-col gap-4 relative",
|
|
868
|
+
label: (props) => typography({ ...props, className: "text-gray-3" }),
|
|
869
|
+
container: () => "flex flex-col gap-4",
|
|
870
|
+
inputWrapper: () => "relative flex items-center outline outline-2 outline-gray-300 focus-within:outline focus-within:outline-black focus-within:outline-2 [&>input]:flex-1 [&>input]:min-w-0 [&>input]:pr-10 [&>input]:border-0 [&>input]:outline-0 [&>input]:bg-transparent [&>input]:text-ellipsis [&>input]:whitespace-nowrap [&>input]:overflow-hidden",
|
|
871
|
+
button: comboBoxButton,
|
|
872
|
+
popover: {
|
|
873
|
+
popover: () => "w-[var(--comboBox-popover-container-width)] max-h-[300px] overflow-y-auto overflow-x-hidden text-white !bg-color-1-500 rounded-md p-2"
|
|
874
|
+
},
|
|
875
|
+
listContainer: (props) => typography({
|
|
876
|
+
...props,
|
|
877
|
+
className: "outline outline-2 outline-white outline-offset-2 p-2 my-4 rounded-md w-full flex flex-col gap-6 max-h-[300px] overflow-y-auto overflow-x-hidden"
|
|
878
|
+
}),
|
|
879
|
+
ul: (props) => typography({
|
|
880
|
+
...props,
|
|
881
|
+
className: "w-full flex flex-col gap-6"
|
|
882
|
+
}),
|
|
883
|
+
li: () => "transition w-full hover:text-gray-300 focus-ring-white",
|
|
884
|
+
group: () => "flex flex-col gap-4",
|
|
885
|
+
section: () => "flex flex-col gap-4",
|
|
886
|
+
list: {
|
|
887
|
+
...listBoxTheme
|
|
888
|
+
},
|
|
889
|
+
headerText: () => "text-gray-300",
|
|
890
|
+
noResults: () => "p-4 text-center",
|
|
891
|
+
noResultsText: (props) => typography({ ...props, className: "text-gray-400" }),
|
|
892
|
+
errorMessage: (props) => typography({ ...props, size: "footnotes", isError: true })
|
|
893
|
+
};
|
|
894
|
+
const focusable = tailwindVariants.tv({
|
|
895
|
+
base: `
|
|
896
|
+
focus-ring-black
|
|
897
|
+
transition-all
|
|
898
|
+
duration-200
|
|
899
|
+
`
|
|
900
|
+
});
|
|
901
|
+
const datePickerContainer = tailwindVariants.tv({
|
|
902
|
+
base: "relative inline-flex flex-col text-left"
|
|
903
|
+
});
|
|
904
|
+
const datePickerButton = tailwindVariants.tv({
|
|
905
|
+
extend: focusable,
|
|
906
|
+
base: "flex gap-4 justify-between items-center border-2 border-color-1-500 rounded-md bg-gray-100 p-4",
|
|
907
|
+
variants: {
|
|
908
|
+
dateFieldShown: {
|
|
909
|
+
true: "w-full",
|
|
910
|
+
false: "w-fit"
|
|
911
|
+
},
|
|
912
|
+
isInvalid: {
|
|
913
|
+
true: "bg-red-100 border-red-500",
|
|
914
|
+
false: "bg-gray-100 border-color-1-500"
|
|
915
|
+
}
|
|
916
|
+
},
|
|
917
|
+
defaultVariants: {
|
|
918
|
+
dateFieldShown: true
|
|
919
|
+
}
|
|
920
|
+
});
|
|
921
|
+
const datePickerIcon = tailwindVariants.tv({
|
|
922
|
+
base: "text-white bg-color-1-500 rounded-md h-full p-2"
|
|
923
|
+
});
|
|
924
|
+
const datePickerLabel = tailwindVariants.tv({
|
|
925
|
+
base: "text-color-1-500 font-bold pb-2 text-2xl"
|
|
926
|
+
});
|
|
927
|
+
const datePickerWrapper = tailwindVariants.tv({
|
|
928
|
+
base: "w-fit flex flex-col gap-4"
|
|
929
|
+
});
|
|
930
|
+
const datePickerCalendarPopoverUnderlay = tailwindVariants.tv({
|
|
931
|
+
base: "fixed inset-0"
|
|
932
|
+
});
|
|
933
|
+
const datePickerCalendarPopoverContainer = tailwindVariants.tv({
|
|
934
|
+
base: "absolute top-full bg-white border border-gray-300 rounded-md shadow-lg mt-2 p-8 z-10"
|
|
935
|
+
});
|
|
936
|
+
const datePickerDialog = tailwindVariants.tv({
|
|
937
|
+
base: "flex flex-col gap-4"
|
|
938
|
+
});
|
|
939
|
+
const datePickerDateFieldContainer = tailwindVariants.tv({
|
|
940
|
+
base: "flex gap-2 items-center justify-between",
|
|
941
|
+
defaultVariants: {
|
|
942
|
+
dateFieldShown: true
|
|
943
|
+
},
|
|
944
|
+
variants: {
|
|
945
|
+
dateFieldShown: {
|
|
946
|
+
true: "",
|
|
947
|
+
false: "hidden"
|
|
948
|
+
}
|
|
949
|
+
}
|
|
950
|
+
});
|
|
951
|
+
const datePickerDateField = tailwindVariants.tv({
|
|
952
|
+
base: "flex bg-gray-300 p-2 rounded-md"
|
|
953
|
+
});
|
|
954
|
+
const datePickerDateSegment = tailwindVariants.tv({
|
|
955
|
+
extend: focusable,
|
|
956
|
+
base: `rounded-sm p-1 focus:bg-color-1-400 focus:text-white`
|
|
957
|
+
});
|
|
958
|
+
const datePickerInvalidIndicator = tailwindVariants.tv({
|
|
959
|
+
base: "rounded-lg p-2 border-2 border-red-500",
|
|
960
|
+
variants: {
|
|
961
|
+
position: {
|
|
962
|
+
inner: "text-red-500 bg-white",
|
|
963
|
+
outer: "text-black bg-red-100"
|
|
964
|
+
}
|
|
965
|
+
}
|
|
966
|
+
});
|
|
967
|
+
const datePickerTheme = {
|
|
968
|
+
container: datePickerContainer,
|
|
969
|
+
wrapper: datePickerWrapper,
|
|
970
|
+
button: datePickerButton,
|
|
971
|
+
icon: datePickerIcon,
|
|
972
|
+
dateField: datePickerDateField,
|
|
973
|
+
dateSegment: datePickerDateSegment,
|
|
974
|
+
label: datePickerLabel,
|
|
975
|
+
calendarPopover: datePickerCalendarPopoverContainer,
|
|
976
|
+
calendarUnderlay: datePickerCalendarPopoverUnderlay,
|
|
977
|
+
dialog: datePickerDialog,
|
|
978
|
+
dateFieldContainer: datePickerDateFieldContainer,
|
|
979
|
+
invalidIndicator: datePickerInvalidIndicator
|
|
980
|
+
};
|
|
981
|
+
const imgStyles = tailwindVariants.tv({
|
|
982
|
+
base: "object-contain"
|
|
983
|
+
});
|
|
984
|
+
const imgTheme = (props) => imgStyles(props);
|
|
985
|
+
const lightBoxWrapper = tailwindVariants.tv({
|
|
986
|
+
base: "focus-ring-black"
|
|
987
|
+
});
|
|
988
|
+
const lightBoxContainer = tailwindVariants.tv({
|
|
989
|
+
base: `rounded-3xl overflow-hidden`
|
|
990
|
+
});
|
|
991
|
+
const lightBoxCloseBtn = tailwindVariants.tv({
|
|
992
|
+
base: `
|
|
993
|
+
absolute
|
|
994
|
+
xl:top-10
|
|
995
|
+
xl:right-20
|
|
996
|
+
lg:top-8
|
|
997
|
+
lg:right-8
|
|
998
|
+
z-[10000]
|
|
999
|
+
top-4
|
|
1000
|
+
right-4
|
|
1001
|
+
size-10
|
|
1002
|
+
focus-ring-black
|
|
1003
|
+
`
|
|
1004
|
+
});
|
|
1005
|
+
const lightBoxLabel = tailwindVariants.tv({
|
|
1006
|
+
extend: typography,
|
|
1007
|
+
base: "sr-only"
|
|
1008
|
+
});
|
|
1009
|
+
const lightBoxModalUnderlay = tailwindVariants.tv({
|
|
1010
|
+
base: "w-screen h-screen bg-black/50 absolute top-0 left-0 flex justify-center items-center"
|
|
1011
|
+
});
|
|
1012
|
+
const lightBoxModalOverlay = tailwindVariants.tv({
|
|
1013
|
+
base: ""
|
|
1014
|
+
});
|
|
1015
|
+
const lightBoxModalDialog = tailwindVariants.tv({
|
|
1016
|
+
base: "flex flex-col gap-4 items-center"
|
|
1017
|
+
});
|
|
1018
|
+
const lightboxTheme = {
|
|
1019
|
+
wrapper: lightBoxWrapper,
|
|
1020
|
+
container: lightBoxContainer,
|
|
1021
|
+
label: lightBoxLabel,
|
|
1022
|
+
closeBtn: lightBoxCloseBtn,
|
|
1023
|
+
modal: {
|
|
1024
|
+
underlay: lightBoxModalUnderlay,
|
|
1025
|
+
overlay: lightBoxModalOverlay,
|
|
1026
|
+
dialog: lightBoxModalDialog
|
|
1027
|
+
}
|
|
1028
|
+
};
|
|
1029
|
+
const popoverPopover = tailwindVariants.tv({
|
|
1030
|
+
base: "border-2 text-black p-4 bg-gray-300"
|
|
1031
|
+
});
|
|
1032
|
+
const popoverUnderlay = tailwindVariants.tv({});
|
|
1033
|
+
const popoverArrow = tailwindVariants.tv({});
|
|
1034
|
+
const popoverButton = tailwindVariants.tv({
|
|
1035
|
+
extend: button
|
|
1036
|
+
});
|
|
1037
|
+
const popoverTheme = {
|
|
1038
|
+
popover: popoverPopover,
|
|
1039
|
+
underlay: popoverUnderlay,
|
|
1040
|
+
arrow: popoverArrow,
|
|
1041
|
+
button: popoverButton
|
|
1042
|
+
};
|
|
1043
|
+
const printButton = tailwindVariants.tv({
|
|
1044
|
+
base: "relative z-20 !bg-color-1-500 hover:!bg-color-1-400 w-16 h-16 flex justify-center items-center active:!bg-color-1-400 rounded-full text-white focus-ring-black"
|
|
1045
|
+
});
|
|
1046
|
+
const printButtonIcon = tailwindVariants.tv({
|
|
1047
|
+
base: "text-white"
|
|
1048
|
+
});
|
|
1049
|
+
const radioLabel = tailwindVariants.tv({
|
|
1050
|
+
base: `text-black flex flex-row items-center hover:cursor-pointer focus-ring-black`,
|
|
1051
|
+
variants: {
|
|
1052
|
+
isDisabled: {
|
|
1053
|
+
true: "text-gray-6"
|
|
1054
|
+
}
|
|
1055
|
+
}
|
|
1056
|
+
});
|
|
1057
|
+
const radio = tailwindVariants.tv({
|
|
1058
|
+
base: `w-6 h-6 mt-0.5 mr-2.5 rounded-full border-2 border-gray-2 shrink-0 hover:cursor-pointer flex items-center justify-center`,
|
|
1059
|
+
variants: {
|
|
1060
|
+
isDisabled: {
|
|
1061
|
+
true: "border-gray-6"
|
|
1062
|
+
},
|
|
1063
|
+
isFocused: {
|
|
1064
|
+
true: `outline-black [outline-offset: 2px]`
|
|
1065
|
+
}
|
|
1066
|
+
}
|
|
1067
|
+
});
|
|
1068
|
+
const selectedMark = tailwindVariants.tv({
|
|
1069
|
+
base: `hidden w-4 h-4 bg-gray-300 rounded-full`,
|
|
1070
|
+
variants: {
|
|
1071
|
+
selected: {
|
|
1072
|
+
true: "block text-white"
|
|
1073
|
+
}
|
|
1074
|
+
}
|
|
1075
|
+
});
|
|
1076
|
+
const radioGroup = tailwindVariants.tv({
|
|
1077
|
+
base: `block`,
|
|
1078
|
+
variants: {
|
|
1079
|
+
isDisabled: {
|
|
1080
|
+
true: "opacity-60 pointer-events-none"
|
|
1081
|
+
}
|
|
1082
|
+
}
|
|
1083
|
+
});
|
|
1084
|
+
const radioGroupItemsGroup = tailwindVariants.tv({
|
|
1085
|
+
base: `flex flex-col gap-4 py-8`
|
|
1086
|
+
});
|
|
1087
|
+
const searchInput = tailwindVariants.tv({
|
|
1088
|
+
base: "p-4 w-full outline-0 search-cancel:appearance-none",
|
|
1089
|
+
variants: {
|
|
1090
|
+
isDisabled: {
|
|
1091
|
+
true: "opacity-60 pointer-events-none"
|
|
1092
|
+
}
|
|
1093
|
+
}
|
|
1094
|
+
});
|
|
1095
|
+
const searchIcon = tailwindVariants.tv({
|
|
1096
|
+
base: `
|
|
1097
|
+
box-border
|
|
1098
|
+
absolute
|
|
1099
|
+
right-4
|
|
1100
|
+
focus-ring-black
|
|
1101
|
+
outline-0
|
|
1102
|
+
`
|
|
1103
|
+
});
|
|
1104
|
+
const shareButtonContainer = tailwindVariants.tv({
|
|
1105
|
+
base: "flex print:hidden relative",
|
|
1106
|
+
defaultVariants: {
|
|
1107
|
+
listDirection: "row"
|
|
1108
|
+
},
|
|
1109
|
+
variants: {
|
|
1110
|
+
listDirection: {
|
|
1111
|
+
row: "flex-row",
|
|
1112
|
+
column: "flex-col"
|
|
1113
|
+
}
|
|
1114
|
+
}
|
|
1115
|
+
});
|
|
1116
|
+
const shareButton = tailwindVariants.tv({
|
|
1117
|
+
base: "relative z-20 !bg-color-1-500 hover:!bg-color-1-400 w-16 h-16 flex justify-center items-center active:!bg-color-1-400 rounded-full text-white focus-ring-black",
|
|
1118
|
+
variants: {
|
|
1119
|
+
isOpen: {
|
|
1120
|
+
true: "",
|
|
1121
|
+
false: ""
|
|
1122
|
+
}
|
|
1123
|
+
}
|
|
1124
|
+
});
|
|
1125
|
+
const shareButtonLinksList = tailwindVariants.tv({
|
|
1126
|
+
base: "!bg-color-1-200 absolute opacity-0 invisible flex transition duration-300 items-center p-0 bg-primary-1 z-0 rounded-b-full rounded-t-full",
|
|
1127
|
+
defaultVariants: {
|
|
1128
|
+
listDirection: "row"
|
|
1129
|
+
},
|
|
1130
|
+
variants: {
|
|
1131
|
+
listDirection: {
|
|
1132
|
+
row: "flex-row pl-14 h-16 left-0",
|
|
1133
|
+
column: "flex-col [width:calc(100% + .5rem)] pt-14 w-16 top-0"
|
|
1134
|
+
},
|
|
1135
|
+
isOpen: {
|
|
1136
|
+
true: "opacity-100 visible",
|
|
1137
|
+
false: ""
|
|
1138
|
+
}
|
|
1139
|
+
}
|
|
1140
|
+
});
|
|
1141
|
+
const shareButtonLink = tailwindVariants.tv({
|
|
1142
|
+
base: `
|
|
1143
|
+
flex
|
|
1144
|
+
items-center
|
|
1145
|
+
justify-center
|
|
1146
|
+
cursor-pointer
|
|
1147
|
+
bg-color-1-200
|
|
1148
|
+
hover:bg-color-1-300
|
|
1149
|
+
w-full
|
|
1150
|
+
text-color-1-500
|
|
1151
|
+
rounded-none
|
|
1152
|
+
p-2
|
|
1153
|
+
focus-ring-black
|
|
1154
|
+
z-10
|
|
1155
|
+
has-focus-ring:z-20
|
|
1156
|
+
`,
|
|
1157
|
+
defaultVariants: {
|
|
1158
|
+
listDirection: "row"
|
|
1159
|
+
},
|
|
1160
|
+
variants: {
|
|
1161
|
+
listDirection: {
|
|
1162
|
+
row: "last:rounded-r-full h-full",
|
|
1163
|
+
column: "last:rounded-b-full"
|
|
1164
|
+
}
|
|
1165
|
+
}
|
|
1166
|
+
});
|
|
1167
|
+
const shareButtonIcon = tailwindVariants.tv({
|
|
1168
|
+
base: "text-white"
|
|
1169
|
+
});
|
|
1170
|
+
const shareButtonLinkIcons = tailwindVariants.tv({
|
|
1171
|
+
base: ""
|
|
1172
|
+
});
|
|
1173
|
+
const sidePanelWrapper = tailwindVariants.tv({
|
|
1174
|
+
base: "m-auto fixed right-0 top-0 bottom-0 w-full max-w-[512px] [&>div]:h-full"
|
|
1175
|
+
});
|
|
1176
|
+
const sidePanelContainer = tailwindVariants.tv({ base: "h-full w-full flex justify-end" });
|
|
1177
|
+
const sidePanelInnerContainer = tailwindVariants.tv({ base: "bg-gray-300 h-full w-full overflow-y-auto" });
|
|
1178
|
+
const skipToMain = tailwindVariants.tv({
|
|
1179
|
+
extend: button,
|
|
1180
|
+
base: `
|
|
1181
|
+
left-1/2
|
|
1182
|
+
absolute
|
|
1183
|
+
-translate-x-1/2
|
|
1184
|
+
-translate-y-[300px]
|
|
1185
|
+
transition-transform
|
|
1186
|
+
focus:-translate-x-1/2
|
|
1187
|
+
focus:translate-y-[75px]
|
|
1188
|
+
`
|
|
1189
|
+
});
|
|
1190
|
+
const tabListWrapper = tailwindVariants.tv({
|
|
1191
|
+
base: `
|
|
1192
|
+
flex
|
|
1193
|
+
flex-col
|
|
1194
|
+
gap-4
|
|
1195
|
+
`
|
|
1196
|
+
});
|
|
1197
|
+
const tabListContainer = tailwindVariants.tv({
|
|
1198
|
+
base: `
|
|
1199
|
+
flex
|
|
1200
|
+
gap-4
|
|
1201
|
+
`,
|
|
1202
|
+
variants: {
|
|
1203
|
+
orientation: {
|
|
1204
|
+
horizontal: "flex-col",
|
|
1205
|
+
vertical: "flex-row"
|
|
1206
|
+
}
|
|
1207
|
+
}
|
|
1208
|
+
});
|
|
1209
|
+
const tabListList = tailwindVariants.tv({
|
|
1210
|
+
base: `
|
|
1211
|
+
flex
|
|
1212
|
+
flex-wrap
|
|
1213
|
+
gap-4
|
|
1214
|
+
`,
|
|
1215
|
+
variants: {
|
|
1216
|
+
orientation: {
|
|
1217
|
+
horizontal: "flex-row items-center",
|
|
1218
|
+
vertical: "flex-col items-end"
|
|
1219
|
+
}
|
|
1220
|
+
},
|
|
1221
|
+
defaultVariants: {
|
|
1222
|
+
orientation: "horizontal"
|
|
1223
|
+
}
|
|
1224
|
+
});
|
|
1225
|
+
const tabListLabel = tailwindVariants.tv({
|
|
1226
|
+
extend: typography,
|
|
1227
|
+
defaultVariants: {
|
|
1228
|
+
size: "h3"
|
|
1229
|
+
}
|
|
1230
|
+
});
|
|
1231
|
+
const tabListTabPanelTransition = tailwindVariants.tv({
|
|
1232
|
+
base: `
|
|
1233
|
+
focus-ring-black
|
|
1234
|
+
transition-all
|
|
1235
|
+
duration-200
|
|
1236
|
+
`
|
|
1237
|
+
});
|
|
1238
|
+
const tabListTabPanelContainer = tailwindVariants.tv({
|
|
1239
|
+
base: `
|
|
1240
|
+
mt-4
|
|
1241
|
+
p-4
|
|
1242
|
+
bg-color-1-100
|
|
1243
|
+
rounded-md
|
|
1244
|
+
focus-ring-black
|
|
1245
|
+
transition-all
|
|
1246
|
+
duration-200
|
|
1247
|
+
`
|
|
1248
|
+
});
|
|
1249
|
+
const tabListTab = tailwindVariants.tv({
|
|
1250
|
+
extend: typography,
|
|
1251
|
+
base: `
|
|
1252
|
+
focus-ring-black
|
|
1253
|
+
transition-all
|
|
1254
|
+
duration-200
|
|
1255
|
+
px-4
|
|
1256
|
+
py-2
|
|
1257
|
+
`,
|
|
1258
|
+
variants: {
|
|
1259
|
+
orientation: {
|
|
1260
|
+
horizontal: "border-b border-b-4",
|
|
1261
|
+
vertical: "border-r border-r-4"
|
|
1262
|
+
},
|
|
1263
|
+
isSelected: {
|
|
1264
|
+
true: `
|
|
1265
|
+
border-color-1-500
|
|
1266
|
+
hover:border-color-1-900
|
|
1267
|
+
active:border-color-1-900
|
|
1268
|
+
`,
|
|
1269
|
+
false: `
|
|
1270
|
+
border-color-1-200
|
|
1271
|
+
hover:border-color-1-400
|
|
1272
|
+
active:border-color-1-400
|
|
1273
|
+
`
|
|
1274
|
+
},
|
|
1275
|
+
isDisabled: {
|
|
1276
|
+
true: `
|
|
1277
|
+
opacity-30
|
|
1278
|
+
pointer-events-none
|
|
1279
|
+
`
|
|
1280
|
+
},
|
|
1281
|
+
isFocusVisible: {
|
|
1282
|
+
true: `has-focus-ring`
|
|
1283
|
+
}
|
|
1284
|
+
},
|
|
1285
|
+
defaultVariants: {
|
|
1286
|
+
size: "h6"
|
|
1287
|
+
}
|
|
1288
|
+
});
|
|
1289
|
+
const tabListTheme = {
|
|
1290
|
+
wrapper: tabListWrapper,
|
|
1291
|
+
container: tabListContainer,
|
|
1292
|
+
list: tabListList,
|
|
1293
|
+
label: tabListLabel,
|
|
1294
|
+
panel: {
|
|
1295
|
+
transition: tabListTabPanelTransition,
|
|
1296
|
+
container: tabListTabPanelContainer
|
|
1297
|
+
},
|
|
1298
|
+
tab: tabListTab
|
|
1299
|
+
};
|
|
1300
|
+
const tagGroupWrapper = tailwindVariants.tv({
|
|
1301
|
+
base: `
|
|
1302
|
+
flex
|
|
1303
|
+
flex-col
|
|
1304
|
+
gap-4
|
|
1305
|
+
`
|
|
1306
|
+
});
|
|
1307
|
+
const tagGroupTags = tailwindVariants.tv({
|
|
1308
|
+
base: `
|
|
1309
|
+
w-full
|
|
1310
|
+
flex
|
|
1311
|
+
flex-wrap
|
|
1312
|
+
gap-2
|
|
1313
|
+
`
|
|
1314
|
+
});
|
|
1315
|
+
const tagGroupLabel = tailwindVariants.tv({
|
|
1316
|
+
extend: typography,
|
|
1317
|
+
defaultVariants: {
|
|
1318
|
+
size: "h4"
|
|
1319
|
+
}
|
|
1320
|
+
});
|
|
1321
|
+
const tagGroupDescription = tailwindVariants.tv({
|
|
1322
|
+
extend: typography,
|
|
1323
|
+
defaultVariants: {
|
|
1324
|
+
size: "paragraph"
|
|
1325
|
+
}
|
|
1326
|
+
});
|
|
1327
|
+
const tagGroupErrorMessage = tailwindVariants.tv({
|
|
1328
|
+
extend: typography,
|
|
1329
|
+
defaultVariants: {
|
|
1330
|
+
size: "paragraph",
|
|
1331
|
+
isError: true
|
|
1332
|
+
}
|
|
1333
|
+
});
|
|
1334
|
+
const tagGroupTagWrapper = tailwindVariants.tv({
|
|
1335
|
+
base: `
|
|
1336
|
+
focus-visible:outline
|
|
1337
|
+
focus-visible:outline-offset-2
|
|
1338
|
+
focus-visible:outline-2
|
|
1339
|
+
focus-visible:outline-black
|
|
1340
|
+
cursor-pointer
|
|
1341
|
+
transition-all
|
|
1342
|
+
duration-200
|
|
1343
|
+
`,
|
|
1344
|
+
variants: {
|
|
1345
|
+
isSelected: {
|
|
1346
|
+
true: `bg-color-1-800 text-white`
|
|
1347
|
+
},
|
|
1348
|
+
isDisabled: {
|
|
1349
|
+
true: `opacity-50 pointer-events-none`
|
|
1350
|
+
},
|
|
1351
|
+
isLink: {
|
|
1352
|
+
true: `
|
|
1353
|
+
border-b
|
|
1354
|
+
border-color-1-300
|
|
1355
|
+
px-2
|
|
1356
|
+
py-0.5
|
|
1357
|
+
mx-2
|
|
1358
|
+
text-color-1-500
|
|
1359
|
+
hover:text-color-1-700
|
|
1360
|
+
hover:border-color-1-700
|
|
1361
|
+
active:text-color-1-900
|
|
1362
|
+
active:border-color-1-900
|
|
1363
|
+
`,
|
|
1364
|
+
false: `
|
|
1365
|
+
p-2
|
|
1366
|
+
bg-color-1-200
|
|
1367
|
+
rounded-full
|
|
1368
|
+
hover:bg-color-1-300
|
|
1369
|
+
active:bg-color-1-400
|
|
1370
|
+
active:text-white
|
|
1371
|
+
`
|
|
1372
|
+
}
|
|
1373
|
+
},
|
|
1374
|
+
defaultVariants: {
|
|
1375
|
+
isLink: false
|
|
1376
|
+
}
|
|
1377
|
+
});
|
|
1378
|
+
const tagGroupTagContainer = tailwindVariants.tv({
|
|
1379
|
+
base: `
|
|
1380
|
+
flex
|
|
1381
|
+
items-center
|
|
1382
|
+
gap-2
|
|
1383
|
+
`
|
|
1384
|
+
});
|
|
1385
|
+
const tagGroupTagRemoveButton = tailwindVariants.tv({
|
|
1386
|
+
base: `
|
|
1387
|
+
aspect-square
|
|
1388
|
+
rounded-full
|
|
1389
|
+
bg-black/30
|
|
1390
|
+
p-1
|
|
1391
|
+
h-auto
|
|
1392
|
+
w-8
|
|
1393
|
+
`
|
|
1394
|
+
});
|
|
1395
|
+
const tagGroupTheme = {
|
|
1396
|
+
wrapper: tagGroupWrapper,
|
|
1397
|
+
tags: tagGroupTags,
|
|
1398
|
+
label: tagGroupLabel,
|
|
1399
|
+
description: tagGroupDescription,
|
|
1400
|
+
errorMessage: tagGroupErrorMessage,
|
|
1401
|
+
tag: {
|
|
1402
|
+
wrapper: tagGroupTagWrapper,
|
|
1403
|
+
container: tagGroupTagContainer,
|
|
1404
|
+
removeButton: tagGroupTagRemoveButton
|
|
1405
|
+
}
|
|
1406
|
+
};
|
|
1407
|
+
const textArea = tailwindVariants.tv({
|
|
1408
|
+
base: `
|
|
1409
|
+
w-full
|
|
1410
|
+
min-h-32
|
|
1411
|
+
rounded-2xl
|
|
1412
|
+
px-6
|
|
1413
|
+
h-12
|
|
1414
|
+
border-2
|
|
1415
|
+
border-solid
|
|
1416
|
+
transition
|
|
1417
|
+
duration-300
|
|
1418
|
+
ease-in-out
|
|
1419
|
+
text-gray-2
|
|
1420
|
+
placeholder:text-gray-2
|
|
1421
|
+
focus-ring-black
|
|
1422
|
+
|
|
1423
|
+
`,
|
|
1424
|
+
variants: {
|
|
1425
|
+
isError: {
|
|
1426
|
+
true: "border-red-500"
|
|
1427
|
+
}
|
|
1428
|
+
}
|
|
1429
|
+
});
|
|
1430
|
+
const textInputWrapper = tailwindVariants.tv({
|
|
1431
|
+
base: `
|
|
1432
|
+
relative
|
|
1433
|
+
group
|
|
1434
|
+
flex
|
|
1435
|
+
items-center
|
|
1436
|
+
gap-4
|
|
1437
|
+
rounded-md
|
|
1438
|
+
px-4
|
|
1439
|
+
py-1
|
|
1440
|
+
mb-3
|
|
1441
|
+
m-0.5
|
|
1442
|
+
border-2
|
|
1443
|
+
aria-disabled:pointer-events-none
|
|
1444
|
+
aria-disabled:opacity-30
|
|
1445
|
+
focus-ring-black
|
|
1446
|
+
`,
|
|
1447
|
+
variants: {
|
|
1448
|
+
isError: {
|
|
1449
|
+
true: `border-error`
|
|
1450
|
+
}
|
|
1451
|
+
}
|
|
1452
|
+
});
|
|
1453
|
+
const textInputInputWrapper = tailwindVariants.tv({
|
|
1454
|
+
base: `flex flex-col order-2`
|
|
1455
|
+
});
|
|
1456
|
+
const textInputContainer = tailwindVariants.tv({
|
|
1457
|
+
base: `flex items-center gap-2`
|
|
1458
|
+
});
|
|
1459
|
+
const textInputLabel = tailwindVariants.tv({
|
|
1460
|
+
base: `
|
|
1461
|
+
group-has-[:required]:after:content-["_*"]
|
|
1462
|
+
group-has-[:required]:after:text-red-500
|
|
1463
|
+
text-xs
|
|
1464
|
+
`
|
|
1465
|
+
});
|
|
1466
|
+
const textInputInput = tailwindVariants.tv({
|
|
1467
|
+
base: ``
|
|
1468
|
+
});
|
|
1469
|
+
const textInputErrorMessage = tailwindVariants.tv({
|
|
1470
|
+
extend: typography,
|
|
1471
|
+
base: `ml-0`,
|
|
1472
|
+
variants: {
|
|
1473
|
+
isError: {
|
|
1474
|
+
false: `hidden`
|
|
1475
|
+
}
|
|
1476
|
+
},
|
|
1477
|
+
defaultVariants: {
|
|
1478
|
+
isError: false,
|
|
1479
|
+
size: "footnotes"
|
|
1480
|
+
}
|
|
1481
|
+
});
|
|
1482
|
+
const textInputIcon = tailwindVariants.tv({
|
|
1483
|
+
base: [typography(), `order-1`],
|
|
1484
|
+
variants: {
|
|
1485
|
+
isDisabled: {
|
|
1486
|
+
true: `text-gray-300`
|
|
1487
|
+
},
|
|
1488
|
+
isError: {
|
|
1489
|
+
true: `hidden`
|
|
1490
|
+
}
|
|
1491
|
+
}
|
|
1492
|
+
});
|
|
1493
|
+
const textInputErrorIcon = tailwindVariants.tv({
|
|
1494
|
+
base: [typography({ isError: true }), `order-3`],
|
|
1495
|
+
variants: {
|
|
1496
|
+
isError: {
|
|
1497
|
+
false: `hidden`
|
|
1498
|
+
}
|
|
1499
|
+
}
|
|
1500
|
+
});
|
|
1501
|
+
const textInputTheme = {
|
|
1502
|
+
wrapper: textInputWrapper,
|
|
1503
|
+
container: textInputContainer,
|
|
1504
|
+
inputWrapper: textInputInputWrapper,
|
|
1505
|
+
label: textInputLabel,
|
|
1506
|
+
input: textInputInput,
|
|
1507
|
+
errorMessage: textInputErrorMessage,
|
|
1508
|
+
icon: textInputIcon,
|
|
1509
|
+
errorIcon: textInputErrorIcon
|
|
1510
|
+
};
|
|
1511
|
+
const BaseTheme = makeTheme({
|
|
1512
|
+
main: (props) => main(props),
|
|
1513
|
+
gridItem: (props) => gridItem(props),
|
|
1514
|
+
grid: (props) => grid(props),
|
|
1515
|
+
container: (props) => container(props),
|
|
1516
|
+
accordion: accordionTheme,
|
|
1517
|
+
carousel: carouselTheme,
|
|
1518
|
+
calendar: calendarTheme,
|
|
1519
|
+
datePicker: datePickerTheme,
|
|
1520
|
+
popover: popoverTheme,
|
|
1521
|
+
typography: (props) => typography(props),
|
|
1522
|
+
button: (props) => button(props),
|
|
1523
|
+
link: button,
|
|
1524
|
+
sidePanel: {
|
|
1525
|
+
wrapper: (props) => sidePanelWrapper(props),
|
|
1526
|
+
container: (props) => sidePanelContainer(props),
|
|
1527
|
+
innerContainer: (props) => sidePanelInnerContainer(props)
|
|
1528
|
+
},
|
|
1529
|
+
comboBox: comboBoxTheme,
|
|
1530
|
+
lightBox: lightboxTheme,
|
|
1531
|
+
printButton: {
|
|
1532
|
+
icon: (props) => printButtonIcon(props),
|
|
1533
|
+
button: (props) => printButton(props)
|
|
1534
|
+
},
|
|
1535
|
+
shareButton: {
|
|
1536
|
+
icon: (props) => shareButtonIcon(props),
|
|
1537
|
+
button: (props) => shareButton(props),
|
|
1538
|
+
container: (props) => shareButtonContainer(props),
|
|
1539
|
+
linksList: (props) => shareButtonLinksList(props),
|
|
1540
|
+
link: (props) => shareButtonLink(props),
|
|
1541
|
+
linkIcons: (props) => shareButtonLinkIcons(props)
|
|
1542
|
+
},
|
|
1543
|
+
skipToMain: (props) => skipToMain(props),
|
|
1544
|
+
checkbox: {
|
|
1545
|
+
container: (props) => checkboxContainer(props),
|
|
1546
|
+
label: (props) => checkboxLabel(props),
|
|
1547
|
+
checkBox: (props) => checkBox(props),
|
|
1548
|
+
checkMark: (props) => checkMark(props),
|
|
1549
|
+
checkMarkIcon: (props) => checkMarkIcon(props),
|
|
1550
|
+
errorMessage: (props) => typography(props)
|
|
1551
|
+
},
|
|
1552
|
+
radio: {
|
|
1553
|
+
label: (props) => radioLabel(props),
|
|
1554
|
+
radio: (props) => radio(props),
|
|
1555
|
+
selectedMark: (props) => selectedMark(props),
|
|
1556
|
+
errorMessage: (props) => typography(props)
|
|
1557
|
+
},
|
|
1558
|
+
radioGroup: {
|
|
1559
|
+
radioGroup: (props) => radioGroup(props),
|
|
1560
|
+
radioGroupItemsGroup: (props) => radioGroupItemsGroup(props),
|
|
1561
|
+
errorMessage: (props) => typography(props)
|
|
1562
|
+
},
|
|
1563
|
+
checkboxGroup: {
|
|
1564
|
+
checkboxGroup: (props) => checkboxGroup(props),
|
|
1565
|
+
checkboxGroupItemsGroup: (props) => checkboxGroupItemsGroup(props),
|
|
1566
|
+
errormessage: (props) => typography(props)
|
|
1567
|
+
},
|
|
1568
|
+
select: {
|
|
1569
|
+
button: (props) => button(props),
|
|
1570
|
+
ul: (props) => typography({
|
|
1571
|
+
...props,
|
|
1572
|
+
className: "outline outline-2 outline-white outline-offset-2 p-2 my-4 rounded-md w-full flex flex-col gap-6"
|
|
1573
|
+
}),
|
|
1574
|
+
popover: (props) => button({ ...props, className: "w-[var(--select-container-width)]" }),
|
|
1575
|
+
errorMessage: (props) => typography({ ...props, size: "footnotes", isError: true }),
|
|
1576
|
+
wrapper: () => "flex flex-col gap-4 relative",
|
|
1577
|
+
container: () => "flex flex-col gap-4",
|
|
1578
|
+
list: () => "flex flex-col gap-4",
|
|
1579
|
+
li: () => "transition w-full hover:text-gray-300 focus-ring-white",
|
|
1580
|
+
headerText: () => "text-gray-300",
|
|
1581
|
+
section: () => "flex flex-col gap-4"
|
|
1582
|
+
},
|
|
1583
|
+
textarea: {
|
|
1584
|
+
wrapper: () => "flex flex-col",
|
|
1585
|
+
container: () => "flex items-center gap-4",
|
|
1586
|
+
label: () => "text-gray-3 px-6",
|
|
1587
|
+
input: (props) => textArea(props),
|
|
1588
|
+
errorMessage: (props) => typography({ ...props, size: "footnotes", isError: true })
|
|
1589
|
+
},
|
|
1590
|
+
textInput: textInputTheme,
|
|
1591
|
+
search: {
|
|
1592
|
+
wrapper: () => "min-w-fit sm:w-80 flex flex-col gap-2",
|
|
1593
|
+
container: () => "relative flex items-center outline outline-2 outline-gray-300 focus-within:outline focus-within:outline-black focus-within:outline-2",
|
|
1594
|
+
label: () => "text-gray-3",
|
|
1595
|
+
input: (props) => searchInput(props),
|
|
1596
|
+
icon: (props) => searchIcon(props),
|
|
1597
|
+
errorMessage: (props) => typography({ ...props, size: "footnotes", isError: true })
|
|
1598
|
+
},
|
|
1599
|
+
menu: {
|
|
1600
|
+
sidePanel: {
|
|
1601
|
+
wrapper: () => ``,
|
|
1602
|
+
container: () => "",
|
|
1603
|
+
innerContainer: () => ""
|
|
1604
|
+
},
|
|
1605
|
+
wrapper: () => ""
|
|
1606
|
+
},
|
|
1607
|
+
menuItem: {
|
|
1608
|
+
wrapper: () => ``,
|
|
1609
|
+
container: () => ``,
|
|
1610
|
+
innerContent: () => ``,
|
|
1611
|
+
button: () => ``,
|
|
1612
|
+
anchor: () => ``
|
|
1613
|
+
},
|
|
1614
|
+
img: imgTheme,
|
|
1615
|
+
alerts: alertsTheme,
|
|
1616
|
+
tagGroup: tagGroupTheme,
|
|
1617
|
+
tabList: tabListTheme,
|
|
1618
|
+
listBox: listBoxTheme
|
|
1619
|
+
});
|
|
1620
|
+
React.memo(createThemeProvider(BaseTheme));
|
|
1621
|
+
const useThemeContext = (func, props = {}, customTheme = null) => {
|
|
1622
|
+
const theme = useTheme();
|
|
1623
|
+
if (theme != null && func != null) {
|
|
1624
|
+
const { brandTheme } = theme;
|
|
1625
|
+
const themeFunc = radashi.get(brandTheme, func);
|
|
1626
|
+
if (typeof themeFunc === "function") {
|
|
1627
|
+
const returnValue = themeFunc == null ? void 0 : themeFunc(props);
|
|
1628
|
+
if (typeof returnValue === "string") {
|
|
1629
|
+
return returnValue;
|
|
1630
|
+
}
|
|
1631
|
+
}
|
|
1632
|
+
}
|
|
1633
|
+
if (!customTheme) {
|
|
1634
|
+
return void 0;
|
|
1635
|
+
}
|
|
1636
|
+
return customTheme;
|
|
1637
|
+
};
|
|
1638
|
+
const Typography = ({
|
|
1639
|
+
as: Component = "span",
|
|
1640
|
+
themeName = "typography",
|
|
1641
|
+
tokens,
|
|
1642
|
+
customTheme,
|
|
1643
|
+
children,
|
|
1644
|
+
...rest
|
|
1645
|
+
}) => {
|
|
1646
|
+
const theme = useThemeContext(themeName, tokens, customTheme);
|
|
1647
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Component, { ...rest, className: theme, children });
|
|
1648
|
+
};
|
|
1649
|
+
React.forwardRef((props, ref) => {
|
|
1650
|
+
const { as: Component = "span", tokens, themeName = "typography", customTheme, children, ...rest } = props;
|
|
1651
|
+
const theme = useThemeContext(themeName, tokens, customTheme);
|
|
1652
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Component, { ...rest, ref, className: theme, children });
|
|
1653
|
+
});
|
|
1654
|
+
const [useAccordionCtx, AccordionProvider] = coreLib.createCtxNullable();
|
|
1655
|
+
const Box = ({
|
|
1656
|
+
as: Component = "div",
|
|
1657
|
+
themeName = "box",
|
|
1658
|
+
tokens,
|
|
1659
|
+
customTheme,
|
|
1660
|
+
children,
|
|
1661
|
+
className,
|
|
1662
|
+
...rest
|
|
1663
|
+
}) => {
|
|
1664
|
+
const theme = useThemeContext(themeName, tokens, customTheme);
|
|
1665
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Component, { ...rest, className: theme, children });
|
|
1666
|
+
};
|
|
1667
|
+
const BoxWithForwardRef = React.forwardRef((props, ref) => {
|
|
1668
|
+
const { as: Component = "div", tokens, themeName = "box", customTheme, children, ...rest } = props;
|
|
1669
|
+
const theme = useThemeContext(themeName, tokens, customTheme);
|
|
1670
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Component, { ...rest, ref, className: theme, children });
|
|
1671
|
+
});
|
|
1672
|
+
const Anchor = React.forwardRef((props, forwardRef) => {
|
|
1673
|
+
var _a;
|
|
1674
|
+
const {
|
|
1675
|
+
as: Component = "a",
|
|
1676
|
+
handlePress,
|
|
1677
|
+
children,
|
|
1678
|
+
as,
|
|
1679
|
+
customTheme,
|
|
1680
|
+
tokens,
|
|
1681
|
+
themeName = "button",
|
|
1682
|
+
nextLinkProps: { onClick, ...nextLinkProps } = {},
|
|
1683
|
+
...rest
|
|
1684
|
+
} = props;
|
|
1685
|
+
const { onPress, onFocusChange, excludeFromTabOrder, preventFocusOnPress, ...anchorProps } = rest;
|
|
1686
|
+
const ref = forwardRef;
|
|
1687
|
+
const { linkProps } = reactAria.useLink(
|
|
1688
|
+
{
|
|
1689
|
+
...props,
|
|
1690
|
+
...nextLinkProps,
|
|
1691
|
+
onClick: ({ currentTarget, ...e }) => {
|
|
1692
|
+
onClick == null ? void 0 : onClick({
|
|
1693
|
+
...e,
|
|
1694
|
+
// @ts-expect-error Mismatch between react-aria and next/link. Happens since react-aria >3.36
|
|
1695
|
+
currentTarget
|
|
1696
|
+
});
|
|
1697
|
+
},
|
|
1698
|
+
href: props.href ?? ((_a = nextLinkProps == null ? void 0 : nextLinkProps.href) == null ? void 0 : _a.toString()),
|
|
1699
|
+
elementType: as == null ? void 0 : as.toString(),
|
|
1700
|
+
onPress: handlePress
|
|
1701
|
+
},
|
|
1702
|
+
forwardRef ?? ref
|
|
1703
|
+
);
|
|
1704
|
+
const theme = useThemeContext(themeName, tokens, customTheme);
|
|
1705
|
+
return /* @__PURE__ */ jsxRuntime.jsx(reactAria.FocusRing, { focusRingClass: "has-focus-ring", children: /* @__PURE__ */ jsxRuntime.jsx(Component, { ref, ...linkProps, ...nextLinkProps, ...anchorProps, className: theme, children }) });
|
|
1706
|
+
});
|
|
1707
|
+
const Button = React.forwardRef((props, forwardRef) => {
|
|
1708
|
+
const {
|
|
1709
|
+
as: Component = "button",
|
|
1710
|
+
handlePress,
|
|
1711
|
+
children,
|
|
1712
|
+
as,
|
|
1713
|
+
customTheme,
|
|
1714
|
+
tokens,
|
|
1715
|
+
themeName = "button",
|
|
1716
|
+
isDisabled = false,
|
|
1717
|
+
...rest
|
|
1718
|
+
} = props;
|
|
1719
|
+
const ref = forwardRef;
|
|
1720
|
+
const { buttonProps } = reactAria.useButton(
|
|
1721
|
+
{ ...props, isDisabled, elementType: as, onPress: handlePress },
|
|
1722
|
+
forwardRef ?? ref
|
|
1723
|
+
);
|
|
1724
|
+
const theme = useThemeContext(themeName, tokens, customTheme);
|
|
1725
|
+
const { onPress, onFocusChange, excludeFromTabOrder, preventFocusOnPress, ...allProps } = rest;
|
|
1726
|
+
return /* @__PURE__ */ jsxRuntime.jsx(reactAria.FocusRing, { within: true, focusRingClass: "has-focus-ring", children: /* @__PURE__ */ jsxRuntime.jsx(Component, { ref, ...buttonProps, ...allProps, className: theme, children }) });
|
|
1727
|
+
});
|
|
1728
|
+
const ButtonWithForwardRef = React.forwardRef(
|
|
1729
|
+
(props, ref) => {
|
|
1730
|
+
const { as } = props;
|
|
1731
|
+
if (as === "a") return /* @__PURE__ */ jsxRuntime.jsx(Anchor, { ref, ...props });
|
|
1732
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Button, { ref, ...props });
|
|
1733
|
+
}
|
|
1734
|
+
);
|
|
1735
|
+
const ButtonComponent = (props) => {
|
|
1736
|
+
const { as } = props;
|
|
1737
|
+
const ref = React.useRef(null);
|
|
1738
|
+
if (as === "a") return /* @__PURE__ */ jsxRuntime.jsx(Anchor, { ref, ...props });
|
|
1739
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Button, { ref, ...props });
|
|
1740
|
+
};
|
|
1741
|
+
ButtonComponent.displayName = "Button";
|
|
1742
|
+
const __variableDynamicImportRuntimeHelper = (glob, path, segs) => {
|
|
1743
|
+
const v = glob[path];
|
|
1744
|
+
if (v) {
|
|
1745
|
+
return typeof v === "function" ? v() : Promise.resolve(v);
|
|
1746
|
+
}
|
|
1747
|
+
return new Promise((_, reject) => {
|
|
1748
|
+
(typeof queueMicrotask === "function" ? queueMicrotask : setTimeout)(
|
|
1749
|
+
reject.bind(
|
|
1750
|
+
null,
|
|
1751
|
+
new Error(
|
|
1752
|
+
"Unknown variable dynamic import: " + path + (path.split("/").length !== segs ? ". Note that variables only represent file names one level deep." : "")
|
|
1753
|
+
)
|
|
1754
|
+
)
|
|
1755
|
+
);
|
|
1756
|
+
});
|
|
1757
|
+
};
|
|
1758
|
+
const SvgComponent$q = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: 48, width: 48, fill: "currentColor", ...props });
|
|
1759
|
+
const Fallback = React.memo(SvgComponent$q);
|
|
1760
|
+
const IconFallback = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
1761
|
+
__proto__: null,
|
|
1762
|
+
default: Fallback
|
|
1763
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
1764
|
+
const Icon = (props) => {
|
|
1765
|
+
const { icon, ...rest } = props;
|
|
1766
|
+
const ImportedIcon = React.useMemo(() => React.lazy(() => __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "../icons/ArrowDown.tsx": () => Promise.resolve().then(() => ArrowDown$1), "../icons/ArrowLeft.tsx": () => Promise.resolve().then(() => ArrowLeft$1), "../icons/ArrowRight.tsx": () => Promise.resolve().then(() => ArrowRight$1), "../icons/Check.tsx": () => Promise.resolve().then(() => Check$1), "../icons/ChevronLeft.tsx": () => Promise.resolve().then(() => ChevronLeft$1), "../icons/ChevronRight.tsx": () => Promise.resolve().then(() => ChevronRight$1), "../icons/CloseBtn.tsx": () => Promise.resolve().then(() => CloseBtn$1), "../icons/ErrorIcon.tsx": () => Promise.resolve().then(() => require("./ErrorIcon-Vnk7YKtL.js")), "../icons/Facebook.tsx": () => Promise.resolve().then(() => Facebook$1), "../icons/FacebookColored.tsx": () => Promise.resolve().then(() => FacebookColored$1), "../icons/FacebookRounded.tsx": () => Promise.resolve().then(() => FacebookRounded$1), "../icons/Globe.tsx": () => Promise.resolve().then(() => Globe$1), "../icons/IconFallback.tsx": () => Promise.resolve().then(() => IconFallback), "../icons/Instagram.tsx": () => Promise.resolve().then(() => Instagram$1), "../icons/InstagramColored.tsx": () => Promise.resolve().then(() => InstagramColored$1), "../icons/Link.tsx": () => Promise.resolve().then(() => Link$1), "../icons/LinkedIn.tsx": () => Promise.resolve().then(() => LinkedIn$1), "../icons/Mail.tsx": () => Promise.resolve().then(() => Mail$1), "../icons/Plus.tsx": () => Promise.resolve().then(() => Plus$1), "../icons/Print.tsx": () => Promise.resolve().then(() => Print$1), "../icons/Search.tsx": () => Promise.resolve().then(() => Search$1), "../icons/Share.tsx": () => Promise.resolve().then(() => Share$1), "../icons/Twitter.tsx": () => Promise.resolve().then(() => Twitter$1), "../icons/TwitterColored.tsx": () => Promise.resolve().then(() => TwitterColored$1), "../icons/Upload.tsx": () => Promise.resolve().then(() => Upload$1), "../icons/X.tsx": () => Promise.resolve().then(() => X$1), "../icons/YouTube.tsx": () => Promise.resolve().then(() => YouTube$1), "../icons/YouTubeColored.tsx": () => Promise.resolve().then(() => YouTubeColored$1) }), `../icons/${icon || "ArrowRight"}.tsx`, 3)), [icon]);
|
|
1767
|
+
return /* @__PURE__ */ jsxRuntime.jsx(React.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(Fallback, { className: "overflow-visible pointer-events-none" }), children: /* @__PURE__ */ jsxRuntime.jsx(ImportedIcon, { ...rest, className: "overflow-visible pointer-events-none", ...props }) });
|
|
1768
|
+
};
|
|
1769
|
+
const IconDispatcher = (props) => {
|
|
1770
|
+
const { icon, as: Component = "span", tokens, customTheme, themeName = "icon", children, ...rest } = props;
|
|
1771
|
+
const theme = useThemeContext(themeName, tokens, customTheme);
|
|
1772
|
+
if (typeof icon !== "string") {
|
|
1773
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(Component, { ...rest, className: theme, children: [
|
|
1774
|
+
children,
|
|
1775
|
+
icon
|
|
1776
|
+
] });
|
|
1777
|
+
}
|
|
1778
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(Component, { className: theme, children: [
|
|
1779
|
+
children,
|
|
1780
|
+
/* @__PURE__ */ jsxRuntime.jsx(Icon, { icon, ...rest })
|
|
1781
|
+
] });
|
|
1782
|
+
};
|
|
1783
|
+
const [useSidePanel, SidePanelProvider] = coreLib.createCtx();
|
|
1784
|
+
const [useCarousel, CarouselProvider] = coreLib.createCtxNullable();
|
|
1785
|
+
const LegacyCarouselNavigationButton = React.forwardRef(
|
|
1786
|
+
(props, ref) => {
|
|
1787
|
+
const { themeName, tokens, customTheme, children, onSubmit, ...rest } = props;
|
|
1788
|
+
const { isDisabled } = rest;
|
|
1789
|
+
const { pressProps } = reactAria.usePress({
|
|
1790
|
+
onPress: () => onSubmit == null ? void 0 : onSubmit()
|
|
1791
|
+
});
|
|
1792
|
+
return /* @__PURE__ */ jsxRuntime.jsx(reactAria.FocusRing, { within: true, focusRingClass: "has-focus-ring", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1793
|
+
ButtonWithForwardRef,
|
|
1794
|
+
{
|
|
1795
|
+
themeName,
|
|
1796
|
+
tokens,
|
|
1797
|
+
ref,
|
|
1798
|
+
...pressProps,
|
|
1799
|
+
...rest,
|
|
1800
|
+
...{ "aria-disabled": isDisabled },
|
|
1801
|
+
children
|
|
1802
|
+
}
|
|
1803
|
+
) });
|
|
1804
|
+
}
|
|
1805
|
+
);
|
|
1806
|
+
const LegacyCarouselNextNavigationButton = React.forwardRef(
|
|
1807
|
+
(props, ref) => {
|
|
1808
|
+
const { children, ...rest } = props;
|
|
1809
|
+
const { controller } = useCarousel();
|
|
1810
|
+
const { params, activeIndex = 1, slides } = controller ?? {};
|
|
1811
|
+
const { slidesPerView = 1, loop } = params ?? {};
|
|
1812
|
+
const slidesGroupIndex = Math.round(
|
|
1813
|
+
typeof slidesPerView === "number" ? (activeIndex + 1) / slidesPerView : activeIndex
|
|
1814
|
+
);
|
|
1815
|
+
const slidesGroupLength = Math.round(
|
|
1816
|
+
slides && typeof slidesPerView === "number" ? slides.length / slidesPerView : (slides == null ? void 0 : slides.length) ?? 1
|
|
1817
|
+
);
|
|
1818
|
+
const allowNavigateNext = slidesGroupIndex < slidesGroupLength;
|
|
1819
|
+
const disabled = !loop && !allowNavigateNext;
|
|
1820
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1821
|
+
LegacyCarouselNavigationButton,
|
|
1822
|
+
{
|
|
1823
|
+
onSubmit: () => controller == null ? void 0 : controller.slideNext(),
|
|
1824
|
+
...rest,
|
|
1825
|
+
ref,
|
|
1826
|
+
isDisabled: disabled,
|
|
1827
|
+
children: children || /* @__PURE__ */ jsxRuntime.jsx(IconDispatcher, { icon: "ArrowRight" })
|
|
1828
|
+
}
|
|
1829
|
+
);
|
|
1830
|
+
}
|
|
1831
|
+
);
|
|
1832
|
+
const LegacyCarouselPrevNavigationButton = React.forwardRef(
|
|
1833
|
+
(props, ref) => {
|
|
1834
|
+
const { children, ...rest } = props;
|
|
1835
|
+
const { controller } = useCarousel();
|
|
1836
|
+
const { params, activeIndex = 1 } = controller ?? {};
|
|
1837
|
+
const { loop } = params ?? {};
|
|
1838
|
+
const allowNavigatePrev = activeIndex !== 0;
|
|
1839
|
+
const disabled = !loop && !allowNavigatePrev;
|
|
1840
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1841
|
+
LegacyCarouselNavigationButton,
|
|
1842
|
+
{
|
|
1843
|
+
onSubmit: () => controller == null ? void 0 : controller.slidePrev(),
|
|
1844
|
+
...rest,
|
|
1845
|
+
ref,
|
|
1846
|
+
isDisabled: disabled,
|
|
1847
|
+
children: children || /* @__PURE__ */ jsxRuntime.jsx(IconDispatcher, { icon: "ArrowLeft" })
|
|
1848
|
+
}
|
|
1849
|
+
);
|
|
1850
|
+
}
|
|
1851
|
+
);
|
|
1852
|
+
LegacyCarouselNavigationButton.displayName = "LegacyCarouselNavigationButton";
|
|
1853
|
+
LegacyCarouselNextNavigationButton.displayName = "LegacyCarouselNextNavigationButton";
|
|
1854
|
+
LegacyCarouselPrevNavigationButton.displayName = "LegacyCarouselPrevNavigationButton";
|
|
1855
|
+
const logger = logger$1.createLogger("[StackUI]");
|
|
1856
|
+
const { log } = logger;
|
|
1857
|
+
const [useTranslation, TranslationProvider] = coreLib.createCtx();
|
|
1858
|
+
const [useUserQueryValHook, SearchProvider] = coreLib.createCtx();
|
|
1859
|
+
const SvgComponent$p = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: 24, height: 24, fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M18 6 6 18M6 6l12 12" }) });
|
|
1860
|
+
const CloseBtn = React.memo(SvgComponent$p, radashi.isEqual);
|
|
1861
|
+
const CloseBtn$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
1862
|
+
__proto__: null,
|
|
1863
|
+
default: CloseBtn
|
|
1864
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
1865
|
+
const SvgComponent$o = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: 20, height: 20, xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 20 20", ...props, children: [
|
|
1866
|
+
/* @__PURE__ */ jsxRuntime.jsxs("g", { stroke: "currentColor", clipPath: "url(#a)", children: [
|
|
1867
|
+
/* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "8.2727", cy: "8.2727", r: "7.2727" }),
|
|
1868
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M13.4551 13.4531L19.5005 19.4986" })
|
|
1869
|
+
] }),
|
|
1870
|
+
/* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsx("clipPath", { children: /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "currentColor", d: "M0 0h14v14H0z" }) }) })
|
|
1871
|
+
] });
|
|
1872
|
+
const Search = React.memo(SvgComponent$o, radashi.isEqual);
|
|
1873
|
+
const Search$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
1874
|
+
__proto__: null,
|
|
1875
|
+
default: Search
|
|
1876
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
1877
|
+
React.createContext(null);
|
|
1878
|
+
const Wrapper = React.forwardRef((props, ref) => {
|
|
1879
|
+
const {
|
|
1880
|
+
themeName = "datePicker",
|
|
1881
|
+
tokens,
|
|
1882
|
+
groupProps,
|
|
1883
|
+
buttonProps,
|
|
1884
|
+
buttonLabel,
|
|
1885
|
+
buttonContent,
|
|
1886
|
+
icon,
|
|
1887
|
+
children
|
|
1888
|
+
} = props;
|
|
1889
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(BoxWithForwardRef, { themeName: `${themeName}.wrapper`, tokens, ...groupProps, ref, children: [
|
|
1890
|
+
buttonLabel && /* @__PURE__ */ jsxRuntime.jsx(Typography, { themeName: `${themeName}.buttonLabel`, tokens, children: buttonLabel }),
|
|
1891
|
+
/* @__PURE__ */ jsxRuntime.jsx(Box, { themeName: `${themeName}.dateFieldContainer`, tokens, children }),
|
|
1892
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
1893
|
+
ButtonComponent,
|
|
1894
|
+
{
|
|
1895
|
+
themeName: `${themeName}.button`,
|
|
1896
|
+
tokens,
|
|
1897
|
+
type: "button",
|
|
1898
|
+
...buttonProps,
|
|
1899
|
+
handlePress: buttonProps.onPress,
|
|
1900
|
+
children: [
|
|
1901
|
+
buttonContent && /* @__PURE__ */ jsxRuntime.jsx(Typography, { themeName: `${themeName}.buttonContent`, tokens, children: buttonContent }),
|
|
1902
|
+
/* @__PURE__ */ jsxRuntime.jsx(IconDispatcher, { themeName: `${themeName}.icon`, tokens, icon: icon ?? "ArrowDown" })
|
|
1903
|
+
]
|
|
1904
|
+
}
|
|
1905
|
+
)
|
|
1906
|
+
] });
|
|
1907
|
+
});
|
|
1908
|
+
Wrapper.displayName = "Wrapper";
|
|
1909
|
+
React.createContext(null);
|
|
1910
|
+
const [useMenu, MenuProvider] = coreLib.createCtxNullable();
|
|
1911
|
+
const AlertsCloseButton = React.forwardRef((props, ref) => {
|
|
1912
|
+
const { themeName = "alerts.closeBtn", ...rest } = props;
|
|
1913
|
+
return /* @__PURE__ */ jsxRuntime.jsx(ButtonWithForwardRef, { ref, themeName, ...rest, children: /* @__PURE__ */ jsxRuntime.jsx(IconDispatcher, { icon: /* @__PURE__ */ jsxRuntime.jsx(CloseBtn, {}) }) });
|
|
1914
|
+
});
|
|
1915
|
+
AlertsCloseButton.displayName = "AlertsCloseButton";
|
|
1916
|
+
function mergeDefaultComponentProps(firstArg, ...args) {
|
|
1917
|
+
const allArgs = [firstArg, ...args];
|
|
1918
|
+
const mergedTokens = allArgs.reduce(
|
|
1919
|
+
(acc, curr) => curr && "tokens" in curr ? Object.assign(acc, curr == null ? void 0 : curr.tokens) : acc,
|
|
1920
|
+
{}
|
|
1921
|
+
);
|
|
1922
|
+
const mergedCustomThemes = allArgs.map((arg) => arg && "customTheme" in arg ? arg == null ? void 0 : arg.customTheme : void 0).filter((theme) => !radashi.isEmpty(theme)).join(" ");
|
|
1923
|
+
const mergedArgs = reactAria.mergeProps(...allArgs.filter((arg) => arg !== null));
|
|
1924
|
+
return { ...mergedArgs, tokens: mergedTokens, customTheme: mergedCustomThemes };
|
|
1925
|
+
}
|
|
1926
|
+
const Option = ({
|
|
1927
|
+
item,
|
|
1928
|
+
state,
|
|
1929
|
+
...props
|
|
1930
|
+
}) => {
|
|
1931
|
+
const { key, rendered, type } = item;
|
|
1932
|
+
const {
|
|
1933
|
+
themeName = "option",
|
|
1934
|
+
tokens,
|
|
1935
|
+
as = "li",
|
|
1936
|
+
customTheme,
|
|
1937
|
+
linkElementType: LinkElement = Anchor,
|
|
1938
|
+
...rest
|
|
1939
|
+
} = mergeDefaultComponentProps(props, item.props);
|
|
1940
|
+
const ref = React.useRef(null);
|
|
1941
|
+
const {
|
|
1942
|
+
optionProps,
|
|
1943
|
+
isFocused,
|
|
1944
|
+
isDisabled,
|
|
1945
|
+
isFocusVisible,
|
|
1946
|
+
isPressed,
|
|
1947
|
+
isSelected,
|
|
1948
|
+
allowsSelection,
|
|
1949
|
+
descriptionProps,
|
|
1950
|
+
labelProps,
|
|
1951
|
+
hasAction
|
|
1952
|
+
} = reactAria.useOption({ key }, state, ref);
|
|
1953
|
+
const isLink = state.selectionManager.isLink(key);
|
|
1954
|
+
const isSelectable = state.selectionManager.canSelectItem(key);
|
|
1955
|
+
const optionTokens = {
|
|
1956
|
+
...tokens,
|
|
1957
|
+
type,
|
|
1958
|
+
isFocused,
|
|
1959
|
+
isDisabled,
|
|
1960
|
+
isFocusVisible,
|
|
1961
|
+
isPressed,
|
|
1962
|
+
isSelected,
|
|
1963
|
+
allowsSelection,
|
|
1964
|
+
hasAction,
|
|
1965
|
+
isLink,
|
|
1966
|
+
isSelectable
|
|
1967
|
+
};
|
|
1968
|
+
const Component = isLink ? LinkElement : BoxWithForwardRef;
|
|
1969
|
+
const elementType = isLink ? "a" : as;
|
|
1970
|
+
const renderChildren = () => {
|
|
1971
|
+
if (React.Children.count(rendered) > 1) {
|
|
1972
|
+
const [label, description] = React.Children.toArray(rendered);
|
|
1973
|
+
const isLabelValid = React.isValidElement(label);
|
|
1974
|
+
const isDescriptionValid = React.isValidElement(description);
|
|
1975
|
+
if (!isLabelValid && !isDescriptionValid) {
|
|
1976
|
+
return rendered;
|
|
1977
|
+
}
|
|
1978
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1979
|
+
isLabelValid && /* @__PURE__ */ jsxRuntime.jsx(Box, { themeName: `${themeName}.label`, tokens: optionTokens, children: React.cloneElement(label, labelProps) }),
|
|
1980
|
+
isDescriptionValid && /* @__PURE__ */ jsxRuntime.jsx(Box, { themeName: `${themeName}.description`, tokens: optionTokens, children: React.cloneElement(description, descriptionProps) })
|
|
1981
|
+
] });
|
|
1982
|
+
}
|
|
1983
|
+
return rendered;
|
|
1984
|
+
};
|
|
1985
|
+
return /* @__PURE__ */ jsxRuntime.jsx(reactAria.FocusRing, { focusRingClass: "has-focus-ring", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1986
|
+
Component,
|
|
1987
|
+
{
|
|
1988
|
+
as: elementType,
|
|
1989
|
+
...reactAria.mergeProps(rest, optionProps),
|
|
1990
|
+
ref,
|
|
1991
|
+
themeName: `${themeName}.option`,
|
|
1992
|
+
tokens: optionTokens,
|
|
1993
|
+
customTheme,
|
|
1994
|
+
children: renderChildren()
|
|
1995
|
+
}
|
|
1996
|
+
) });
|
|
1997
|
+
};
|
|
1998
|
+
const ListBoxSection = ({
|
|
1999
|
+
section,
|
|
2000
|
+
state,
|
|
2001
|
+
...props
|
|
2002
|
+
}) => {
|
|
2003
|
+
var _a, _b;
|
|
2004
|
+
const { key, rendered, props: sectionProps, level, hasChildNodes, type } = section;
|
|
2005
|
+
const {
|
|
2006
|
+
themeName = "listBox.section",
|
|
2007
|
+
tokens,
|
|
2008
|
+
as = "li",
|
|
2009
|
+
customTheme,
|
|
2010
|
+
...rest
|
|
2011
|
+
} = mergeDefaultComponentProps(props, sectionProps);
|
|
2012
|
+
const sectionTokens = {
|
|
2013
|
+
...tokens,
|
|
2014
|
+
type,
|
|
2015
|
+
level: level.toString(),
|
|
2016
|
+
hasChildNodes
|
|
2017
|
+
};
|
|
2018
|
+
const { itemProps, headingProps, groupProps } = reactAria.useListBoxSection(props);
|
|
2019
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2020
|
+
Box,
|
|
2021
|
+
{
|
|
2022
|
+
as,
|
|
2023
|
+
themeName: `${themeName}.wrapper`,
|
|
2024
|
+
tokens: sectionTokens,
|
|
2025
|
+
...reactAria.mergeProps(utils.filterDOMProps(rest), itemProps),
|
|
2026
|
+
customTheme,
|
|
2027
|
+
children: [
|
|
2028
|
+
rendered && /* @__PURE__ */ jsxRuntime.jsx(Typography, { themeName: `${themeName}.heading`, tokens, ...headingProps, children: rendered }),
|
|
2029
|
+
/* @__PURE__ */ jsxRuntime.jsx(Box, { as: "ul", themeName: `${themeName}.group`, tokens: sectionTokens, ...groupProps, children: [...((_b = (_a = state.collection).getChildren) == null ? void 0 : _b.call(_a, key)) ?? []].map((item) => /* @__PURE__ */ jsxRuntime.jsx(Option, { item, state, tokens, themeName: `${themeName}.item` }, item.key)) })
|
|
2030
|
+
]
|
|
2031
|
+
}
|
|
2032
|
+
);
|
|
2033
|
+
};
|
|
2034
|
+
const itemComponents = {
|
|
2035
|
+
item: Option,
|
|
2036
|
+
section: ListBoxSection
|
|
2037
|
+
};
|
|
2038
|
+
const ControlledListBox = React.forwardRef(
|
|
2039
|
+
(props, listBoxRef) => {
|
|
2040
|
+
const {
|
|
2041
|
+
themeName = "listBox",
|
|
2042
|
+
tokens,
|
|
2043
|
+
customTheme,
|
|
2044
|
+
label,
|
|
2045
|
+
escapeKeyBehavior = "clearSelection",
|
|
2046
|
+
linkElementType = Anchor,
|
|
2047
|
+
isDisabled = false,
|
|
2048
|
+
isRequired = false,
|
|
2049
|
+
isInvalid = false,
|
|
2050
|
+
isError = false,
|
|
2051
|
+
errorMessage,
|
|
2052
|
+
disabledKeys,
|
|
2053
|
+
fieldRef,
|
|
2054
|
+
...rest
|
|
2055
|
+
} = props;
|
|
2056
|
+
const state = reactStately.useListState(props);
|
|
2057
|
+
const keys = state.collection.getKeys();
|
|
2058
|
+
const mergeRefs = (newRef) => {
|
|
2059
|
+
if (newRef) {
|
|
2060
|
+
fieldRef == null ? void 0 : fieldRef(newRef);
|
|
2061
|
+
if (!listBoxRef) return;
|
|
2062
|
+
if (typeof listBoxRef === "function") {
|
|
2063
|
+
listBoxRef(newRef);
|
|
2064
|
+
} else {
|
|
2065
|
+
listBoxRef.current = newRef;
|
|
2066
|
+
}
|
|
2067
|
+
}
|
|
2068
|
+
};
|
|
2069
|
+
const { listBoxProps, labelProps } = reactAria.useListBox(
|
|
2070
|
+
{
|
|
2071
|
+
...rest,
|
|
2072
|
+
escapeKeyBehavior,
|
|
2073
|
+
label,
|
|
2074
|
+
disabledKeys: isDisabled ? keys : disabledKeys
|
|
2075
|
+
},
|
|
2076
|
+
state,
|
|
2077
|
+
mergeRefs
|
|
2078
|
+
);
|
|
2079
|
+
const listBoxTokens = {
|
|
2080
|
+
...tokens,
|
|
2081
|
+
isDisabled,
|
|
2082
|
+
isRequired,
|
|
2083
|
+
isInvalid,
|
|
2084
|
+
isError
|
|
2085
|
+
};
|
|
2086
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(Box, { themeName: `${themeName}.wrapper`, tokens: listBoxTokens, customTheme, children: [
|
|
2087
|
+
label && /* @__PURE__ */ jsxRuntime.jsx(Typography, { ...labelProps, themeName: `${themeName}.label`, tokens: listBoxTokens, children: label }),
|
|
2088
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2089
|
+
BoxWithForwardRef,
|
|
2090
|
+
{
|
|
2091
|
+
ref: listBoxRef,
|
|
2092
|
+
as: "ul",
|
|
2093
|
+
...listBoxProps,
|
|
2094
|
+
themeName: `${themeName}.list`,
|
|
2095
|
+
tokens: listBoxTokens,
|
|
2096
|
+
children: [...state.collection].map((item) => {
|
|
2097
|
+
const { key } = item;
|
|
2098
|
+
const type = item.type ?? "item";
|
|
2099
|
+
const Component = itemComponents[type];
|
|
2100
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2101
|
+
Component,
|
|
2102
|
+
{
|
|
2103
|
+
...{ [type]: item },
|
|
2104
|
+
state,
|
|
2105
|
+
tokens: { ...tokens, type },
|
|
2106
|
+
themeName: `${themeName}.${type}`,
|
|
2107
|
+
linkElementType
|
|
2108
|
+
},
|
|
2109
|
+
key
|
|
2110
|
+
);
|
|
2111
|
+
})
|
|
2112
|
+
}
|
|
2113
|
+
),
|
|
2114
|
+
isError && errorMessage && /* @__PURE__ */ jsxRuntime.jsx(Typography, { themeName: `${themeName}.errorMessage`, tokens: listBoxTokens, children: errorMessage })
|
|
2115
|
+
] });
|
|
2116
|
+
}
|
|
2117
|
+
);
|
|
2118
|
+
ControlledListBox.displayName = "ControlledListBox";
|
|
2119
|
+
const ControlledReactHookFormListBox = React.forwardRef((props, listBoxRef) => {
|
|
2120
|
+
const { name, rules, isRequired, isDisabled, tokens, selectionMode = "single", errorMessage, ...rest } = props;
|
|
2121
|
+
const { control, setValue, watch, getValues } = reactHookForm.useFormContext();
|
|
2122
|
+
const { selectedKeys = watch(name), defaultSelectedKeys = getValues(name) } = rest;
|
|
2123
|
+
const { t } = useTranslation();
|
|
2124
|
+
const mergedRules = {
|
|
2125
|
+
required: isRequired ? t("FORM.ERROR.REQUIRED") ?? "required" : false,
|
|
2126
|
+
disabled: isDisabled,
|
|
2127
|
+
...rules
|
|
2128
|
+
};
|
|
2129
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2130
|
+
reactHookForm.Controller,
|
|
2131
|
+
{
|
|
2132
|
+
...rest,
|
|
2133
|
+
defaultValue: defaultSelectedKeys,
|
|
2134
|
+
name,
|
|
2135
|
+
control,
|
|
2136
|
+
rules: mergedRules,
|
|
2137
|
+
disabled: mergedRules == null ? void 0 : mergedRules.disabled,
|
|
2138
|
+
render: ({ field, fieldState }) => {
|
|
2139
|
+
var _a;
|
|
2140
|
+
const { ref, ...fieldProps } = field;
|
|
2141
|
+
const isError = !radashi.isEmpty(fieldState.error);
|
|
2142
|
+
const validityField = {
|
|
2143
|
+
isDisabled: field.disabled ?? false,
|
|
2144
|
+
isRequired: (mergedRules == null ? void 0 : mergedRules.required) === true || (mergedRules == null ? void 0 : mergedRules.required) === "required",
|
|
2145
|
+
isInvalid: fieldState.invalid,
|
|
2146
|
+
isError
|
|
2147
|
+
};
|
|
2148
|
+
const validityTokens = {
|
|
2149
|
+
...tokens,
|
|
2150
|
+
...validityField
|
|
2151
|
+
};
|
|
2152
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2153
|
+
ControlledListBox,
|
|
2154
|
+
{
|
|
2155
|
+
...utils.mergeProps(rest, fieldProps, validityField, {
|
|
2156
|
+
onSelectionChange: (keys) => {
|
|
2157
|
+
setValue(name, keys);
|
|
2158
|
+
}
|
|
2159
|
+
}),
|
|
2160
|
+
tokens: validityTokens,
|
|
2161
|
+
selectionMode,
|
|
2162
|
+
selectedKeys,
|
|
2163
|
+
defaultSelectedKeys,
|
|
2164
|
+
errorMessage: errorMessage ?? ((_a = fieldState.error) == null ? void 0 : _a.message),
|
|
2165
|
+
ref: listBoxRef
|
|
2166
|
+
}
|
|
2167
|
+
);
|
|
2168
|
+
}
|
|
2169
|
+
}
|
|
2170
|
+
);
|
|
2171
|
+
});
|
|
2172
|
+
ControlledReactHookFormListBox.displayName = "ControlledReactHookFormListBox";
|
|
2173
|
+
const SvgComponent$n = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: 24, height: 24, fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M17.728 13.66 12.388 19 7.05 13.66M12.4 5v14", stroke: "currentColor" }) });
|
|
2174
|
+
const ArrowDown = React.memo(SvgComponent$n, radashi.isEqual);
|
|
2175
|
+
const ArrowDown$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2176
|
+
__proto__: null,
|
|
2177
|
+
default: ArrowDown
|
|
2178
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2179
|
+
const ComboBoxButton = React.forwardRef((props, ref) => {
|
|
2180
|
+
const { state, handlePress: handlePressProp, ...rest } = props;
|
|
2181
|
+
const handlePress = React.useCallback(
|
|
2182
|
+
(e) => {
|
|
2183
|
+
state.setInputValue("");
|
|
2184
|
+
state.selectionManager.clearSelection();
|
|
2185
|
+
handlePressProp == null ? void 0 : handlePressProp(e);
|
|
2186
|
+
},
|
|
2187
|
+
[handlePressProp, state]
|
|
2188
|
+
);
|
|
2189
|
+
return /* @__PURE__ */ jsxRuntime.jsx(ButtonWithForwardRef, { ...rest, ref, handlePress });
|
|
2190
|
+
});
|
|
2191
|
+
ComboBoxButton.displayName = "ComboBoxButton";
|
|
2192
|
+
const SvgComponent$m = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: 24, height: 24, fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props, children: [
|
|
2193
|
+
/* @__PURE__ */ jsxRuntime.jsx("g", { children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M.075 11.622a1 1 0 0 0 0 .76 1 1 0 0 0 .21.33l8 8a1.004 1.004 0 0 0 1.42-1.42l-6.3-6.29h19.59a1 1 0 0 0 0-2H3.405l6.3-6.29a1 1 0 0 0 0-1.42 1 1 0 0 0-1.42 0l-8 8a1 1 0 0 0-.21.33Z" }) }),
|
|
2194
|
+
/* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsx("clipPath", { children: /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "currentColor", d: "M0 0h24v24H0z" }) }) })
|
|
2195
|
+
] });
|
|
2196
|
+
const ArrowLeft = React.memo(SvgComponent$m, radashi.isEqual);
|
|
2197
|
+
const ArrowLeft$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2198
|
+
__proto__: null,
|
|
2199
|
+
default: ArrowLeft
|
|
2200
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2201
|
+
const SvgComponent$l = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: 24, height: 24, fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props, children: [
|
|
2202
|
+
/* @__PURE__ */ jsxRuntime.jsx("g", { children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M23.92 12.38a1 1 0 0 0 0-.76 1 1 0 0 0-.21-.33l-8-8a1.003 1.003 0 1 0-1.42 1.42l6.3 6.29H1a1 1 0 1 0 0 2h19.59l-6.3 6.29a1 1 0 0 0 0 1.42 1.002 1.002 0 0 0 1.42 0l8-8c.091-.095.162-.207.21-.33Z" }) }),
|
|
2203
|
+
/* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsx("clipPath", { children: /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "currentColor", d: "M0 0h24v24H0z" }) }) })
|
|
2204
|
+
] });
|
|
2205
|
+
const ArrowRight = React.memo(SvgComponent$l, radashi.isEqual);
|
|
2206
|
+
const ArrowRight$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2207
|
+
__proto__: null,
|
|
2208
|
+
default: ArrowRight
|
|
2209
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2210
|
+
const SvgComponent$k = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: 48, width: 48, fill: "currentColor", viewBox: "0 0 48 48", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M21.05 33.1 35.2 18.95l-2.3-2.25-11.85 11.85-6-6-2.25 2.25ZM24 44q-4.1 0-7.75-1.575-3.65-1.575-6.375-4.3-2.725-2.725-4.3-6.375Q4 28.1 4 24q0-4.15 1.575-7.8 1.575-3.65 4.3-6.35 2.725-2.7 6.375-4.275Q19.9 4 24 4q4.15 0 7.8 1.575 3.65 1.575 6.35 4.275 2.7 2.7 4.275 6.35Q44 19.85 44 24q0 4.1-1.575 7.75-1.575 3.65-4.275 6.375t-6.35 4.3Q28.15 44 24 44Z" }) });
|
|
2211
|
+
const Check = React.memo(SvgComponent$k, radashi.isEqual);
|
|
2212
|
+
const Check$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2213
|
+
__proto__: null,
|
|
2214
|
+
default: Check
|
|
2215
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2216
|
+
const SvgComponent$j = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: "48", width: "48", fill: "currentColor", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M28.05 36 16 23.95 28.05 11.9l2.15 2.15-9.9 9.9 9.9 9.9Z" }) });
|
|
2217
|
+
const ChevronLeft = React.memo(SvgComponent$j, radashi.isEqual);
|
|
2218
|
+
const ChevronLeft$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2219
|
+
__proto__: null,
|
|
2220
|
+
default: ChevronLeft
|
|
2221
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2222
|
+
const SvgComponent$i = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: "48", width: "48", fill: "currentColor", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m18.75 36-2.15-2.15 9.9-9.9-9.9-9.9 2.15-2.15L30.8 23.95Z" }) });
|
|
2223
|
+
const ChevronRight = React.memo(SvgComponent$i, radashi.isEqual);
|
|
2224
|
+
const ChevronRight$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2225
|
+
__proto__: null,
|
|
2226
|
+
default: ChevronRight
|
|
2227
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2228
|
+
const SvgComponent$h = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: 24, height: 24, fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2229
|
+
"path",
|
|
2230
|
+
{
|
|
2231
|
+
d: "M9.161 5.889v2.753H7V12h2.161v10h4.442V12h2.977s.28-1.614.417-3.38h-3.379V6.316a.963.963 0 0 1 .332-.558c.174-.146.396-.233.63-.248H17V2h-3.275C9.063 2 9.173 5.37 9.173 5.889h-.012Z",
|
|
2232
|
+
fill: "currentColor"
|
|
2233
|
+
}
|
|
2234
|
+
) });
|
|
2235
|
+
const Facebook = React.memo(SvgComponent$h, radashi.isEqual);
|
|
2236
|
+
const Facebook$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2237
|
+
__proto__: null,
|
|
2238
|
+
default: Facebook
|
|
2239
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2240
|
+
const SvgComponent$g = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2241
|
+
"path",
|
|
2242
|
+
{
|
|
2243
|
+
fill: "#3b5998",
|
|
2244
|
+
strokeMiterlimit: "10",
|
|
2245
|
+
strokeWidth: "0",
|
|
2246
|
+
d: "M147.5 254.3V139.1h38.7l6-45h-44.7V65.2c0-13 3.6-21.9 22.3-21.9h23.7V3.2c-11.6-1.2-23.1-1.8-34.7-1.8-34.3 0-57.8 20.9-57.8 59.4V94H62.2v45.1H101v115.2h46.5z"
|
|
2247
|
+
}
|
|
2248
|
+
) });
|
|
2249
|
+
const FacebookColored = React.memo(SvgComponent$g, radashi.isEqual);
|
|
2250
|
+
const FacebookColored$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2251
|
+
__proto__: null,
|
|
2252
|
+
default: FacebookColored
|
|
2253
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2254
|
+
const SvgComponent$f = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 25, viewBox: "0 0 24 25", fill: "none", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2255
|
+
"path",
|
|
2256
|
+
{
|
|
2257
|
+
fillRule: "evenodd",
|
|
2258
|
+
clipRule: "evenodd",
|
|
2259
|
+
d: "M2 12.5001C2 17.4501 5.6 21.5501 10.35 22.4001L10.4094 22.3515C10.4063 22.3509 10.4032 22.3503 10.4001 22.3498V15.2998H7.90015V12.4998H10.4001V10.2998C10.4001 7.79978 12.0001 6.39978 14.3001 6.39978C15.0001 6.39978 15.8001 6.49978 16.5001 6.59978V9.14978H15.2001C14.0001 9.14978 13.7001 9.74978 13.7001 10.5498V12.4998H16.3501L15.9001 15.2998H13.7001V22.3498C13.6696 22.3553 13.639 22.3608 13.6084 22.366L13.65 22.4001C18.4 21.5501 22 17.4501 22 12.5001C22 7.00006 17.5 2.50006 12 2.50006C6.5 2.50006 2 7.00006 2 12.5001Z",
|
|
2260
|
+
fill: "currentColor"
|
|
2261
|
+
}
|
|
2262
|
+
) });
|
|
2263
|
+
const FacebookRounded = React.memo(SvgComponent$f, radashi.isEqual);
|
|
2264
|
+
const FacebookRounded$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2265
|
+
__proto__: null,
|
|
2266
|
+
default: FacebookRounded
|
|
2267
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2268
|
+
const SvgComponent$e = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "40", height: "40", viewBox: "0 0 67 67", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
|
|
2269
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2270
|
+
"path",
|
|
2271
|
+
{
|
|
2272
|
+
d: "M16.1339 8.5415C18.1397 10.0645 19.8152 11.9792 21.0587 14.1693C22.2848 16.2537 25.064 22.0491 22.5341 25.3227C19.6732 29.0215 11.3848 30.2721 11.3848 33.6807C11.3848 36.2473 15.0181 39.1736 16.9594 42.0386C18.0736 43.6842 18.6691 45.626 18.6691 47.6133C18.6691 49.6006 18.0736 51.5423 16.9594 53.1879C16.0541 54.6088 14.817 55.7884 13.3547 56.6251",
|
|
2273
|
+
stroke: "currentColor",
|
|
2274
|
+
strokeWidth: "5",
|
|
2275
|
+
strokeLinecap: "round",
|
|
2276
|
+
strokeLinejoin: "round"
|
|
2277
|
+
}
|
|
2278
|
+
),
|
|
2279
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2280
|
+
"path",
|
|
2281
|
+
{
|
|
2282
|
+
d: "M57.8289 14.8058C52.7905 17.106 47.4837 18.766 42.0327 19.747C39.1227 19.9555 38.6895 17.5605 36.4621 14.1724C34.7905 11.6302 30.8874 8.45055 30.8874 5.81443C30.8648 4.90303 30.9876 3.99386 31.2511 3.12109",
|
|
2283
|
+
stroke: "currentColor",
|
|
2284
|
+
strokeWidth: "5",
|
|
2285
|
+
strokeLinecap: "round",
|
|
2286
|
+
strokeLinejoin: "round"
|
|
2287
|
+
}
|
|
2288
|
+
),
|
|
2289
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2290
|
+
"path",
|
|
2291
|
+
{
|
|
2292
|
+
d: "M33.6799 64.3334C50.6088 64.3334 64.3324 50.6098 64.3324 33.6809C64.3324 16.7519 50.6088 3.02832 33.6799 3.02832C16.751 3.02832 3.02734 16.7519 3.02734 33.6809C3.02734 50.6098 16.751 64.3334 33.6799 64.3334Z",
|
|
2293
|
+
stroke: "currentColor",
|
|
2294
|
+
strokeWidth: "5",
|
|
2295
|
+
strokeLinecap: "round",
|
|
2296
|
+
strokeLinejoin: "round"
|
|
2297
|
+
}
|
|
2298
|
+
),
|
|
2299
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2300
|
+
"path",
|
|
2301
|
+
{
|
|
2302
|
+
d: "M53.2225 36.1983C53.341 44.781 42.1549 55.5094 36.4658 53.188C31.4796 51.1445 34.9944 47.2291 33.7193 36.1983C33.188 31.6127 38.0842 27.8404 43.4872 27.8404C45.8806 27.6839 48.24 28.4711 50.0597 30.0335C51.8795 31.5958 53.2225 32.8948 53.2225 36.1983Z",
|
|
2303
|
+
stroke: "currentColor",
|
|
2304
|
+
strokeWidth: "5",
|
|
2305
|
+
strokeLinecap: "round",
|
|
2306
|
+
strokeLinejoin: "round"
|
|
2307
|
+
}
|
|
2308
|
+
)
|
|
2309
|
+
] });
|
|
2310
|
+
const Globe = React.memo(SvgComponent$e, radashi.isEqual);
|
|
2311
|
+
const Globe$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2312
|
+
__proto__: null,
|
|
2313
|
+
default: Globe
|
|
2314
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2315
|
+
const SvgComponent$d = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxRuntime.jsxs("g", { fill: "currentColor", strokeMiterlimit: "10", strokeWidth: "0", children: [
|
|
2316
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M253.5 75.7a92.8 92.8 0 0 0-5.8-30.7A62 62 0 0 0 233 22.6 62 62 0 0 0 210.7 8c-8-3-17.2-5.2-30.7-5.8-13.5-.6-17.8-.8-52.1-.8s-38.7.2-52.2.8A92.8 92.8 0 0 0 45 8c-8.4 3.2-16 8.2-22.4 14.6A62 62 0 0 0 8 45c-3 8-5.2 17.3-5.8 30.7a890 890 0 0 0-.8 52.2c0 34.3.2 38.6.8 52.1A92.8 92.8 0 0 0 8 210.7a62 62 0 0 0 14.5 22.4A62 62 0 0 0 45 247.7c8 3.1 17.3 5.2 30.7 5.9 13.5.6 17.8.7 52.2.7s38.6-.1 52-.7a92.8 92.8 0 0 0 30.8-6c17-6.5 30.4-20 37-36.9 3-8 5.2-17.2 5.8-30.7.7-13.5.8-17.8.8-52.1s-.1-38.7-.8-52.2zM230.8 179c-.6 12.3-2.6 19-4.4 23.4-4.2 11-13 19.8-24 24a69.9 69.9 0 0 1-23.4 4.4c-13.4.6-17.4.7-51.1.7-33.8 0-37.8-.1-51.1-.7-12.4-.6-19-2.6-23.5-4.4-5.5-2-10.5-5.2-14.5-9.4-4.2-4.1-7.5-9-9.5-14.6a69.9 69.9 0 0 1-4.4-23.4c-.6-13.4-.7-17.4-.7-51.1s.1-37.8.7-51.1c.6-12.4 2.6-19 4.4-23.5 2-5.5 5.2-10.5 9.4-14.6 4.1-4.2 9-7.4 14.6-9.4a69.9 69.9 0 0 1 23.5-4.4c13.3-.6 17.3-.7 51-.7 33.8 0 37.8.1 51.1.7 12.4.6 19 2.7 23.5 4.4 5.5 2 10.5 5.2 14.6 9.4 4.2 4.1 7.4 9.1 9.4 14.6a69.9 69.9 0 0 1 4.4 23.5c.6 13.3.7 17.3.7 51s-.1 37.8-.7 51.2z" }),
|
|
2317
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M127.9 63a65 65 0 1 0 0 129.8 65 65 0 0 0 0-129.9zm0 107a42.2 42.2 0 1 1 0-84.3 42.2 42.2 0 0 1 0 84.3zM210.5 60.4a15.2 15.2 0 1 1-30.3 0 15.2 15.2 0 0 1 30.3 0z" })
|
|
2318
|
+
] }) });
|
|
2319
|
+
const Instagram = React.memo(SvgComponent$d, radashi.isEqual);
|
|
2320
|
+
const Instagram$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2321
|
+
__proto__: null,
|
|
2322
|
+
default: Instagram
|
|
2323
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2324
|
+
const SvgComponent$c = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxRuntime.jsxs("g", { fill: "none", strokeMiterlimit: "10", strokeWidth: "0", transform: "matrix(2.8 0 0 2.8 1.4 1.4)", children: [
|
|
2325
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
2326
|
+
"linearGradient",
|
|
2327
|
+
{
|
|
2328
|
+
id: "a",
|
|
2329
|
+
x1: "7.6",
|
|
2330
|
+
x2: "82.4",
|
|
2331
|
+
y1: "9.6",
|
|
2332
|
+
y2: "84.4",
|
|
2333
|
+
gradientTransform: "matrix(1 0 0 -1 0 92)",
|
|
2334
|
+
gradientUnits: "userSpaceOnUse",
|
|
2335
|
+
children: [
|
|
2336
|
+
/* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "0%", stopColor: "#ffd600" }),
|
|
2337
|
+
/* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "50%", stopColor: "#ff0100" }),
|
|
2338
|
+
/* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "100%", stopColor: "#d800b9" })
|
|
2339
|
+
]
|
|
2340
|
+
}
|
|
2341
|
+
),
|
|
2342
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2343
|
+
"path",
|
|
2344
|
+
{
|
|
2345
|
+
fill: "url(#a)",
|
|
2346
|
+
d: "M89.7 26.4c-.2-4.7-1-8-2-10.9a22 22 0 0 0-5.3-8 22 22 0 0 0-8-5.1A33 33 0 0 0 63.7.3C58.8 0 57.2 0 45 0S31.2 0 26.4.3c-4.7.2-8 1-10.9 2a22 22 0 0 0-8 5.3 22 22 0 0 0-5.1 8A33 33 0 0 0 .3 26.3C0 31.2 0 32.8 0 45c0 12.2 0 13.8.3 18.6.2 4.7 1 8 2 10.9a22 22 0 0 0 5.3 8c2.2 2.2 5 4 8 5.1a33 33 0 0 0 10.8 2.1c4.8.2 6.4.3 18.6.3s13.8 0 18.6-.3c4.7-.2 8-1 10.9-2a23 23 0 0 0 13.1-13.2 33 33 0 0 0 2.1-11c.2-4.7.3-6.3.3-18.5s0-13.8-.3-18.6zm-8 36.8c-.3 4.4-1 6.8-1.6 8.3-1.5 4-4.6 7-8.6 8.6-1.5.6-4 1.3-8.3 1.5-4.8.2-6.2.3-18.2.3s-13.4 0-18.2-.3a25 25 0 0 1-8.3-1.5 14 14 0 0 1-5.2-3.4 14 14 0 0 1-3.4-5.2c-.6-1.5-1.3-4-1.5-8.3A313 313 0 0 1 8 45c0-12 0-13.4.3-18.2a25 25 0 0 1 1.5-8.3 14 14 0 0 1 3.4-5.2 14 14 0 0 1 5.2-3.4c1.5-.6 4-1.3 8.3-1.5C31.6 8.2 33 8 45 8s13.4 0 18.2.3c4.4.2 6.8.9 8.3 1.5a14 14 0 0 1 5.2 3.4 14 14 0 0 1 3.4 5.2c.6 1.5 1.3 4 1.5 8.3.2 4.8.3 6.2.3 18.2s0 13.4-.3 18.2z"
|
|
2347
|
+
}
|
|
2348
|
+
),
|
|
2349
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
2350
|
+
"linearGradient",
|
|
2351
|
+
{
|
|
2352
|
+
id: "b",
|
|
2353
|
+
x1: "28.7",
|
|
2354
|
+
x2: "61.3",
|
|
2355
|
+
y1: "30.7",
|
|
2356
|
+
y2: "63.3",
|
|
2357
|
+
gradientTransform: "matrix(1 0 0 -1 0 92)",
|
|
2358
|
+
gradientUnits: "userSpaceOnUse",
|
|
2359
|
+
children: [
|
|
2360
|
+
/* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "0%", stopColor: "#ff6400" }),
|
|
2361
|
+
/* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "50%", stopColor: "#ff0100" }),
|
|
2362
|
+
/* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "100%", stopColor: "#fd0056" })
|
|
2363
|
+
]
|
|
2364
|
+
}
|
|
2365
|
+
),
|
|
2366
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2367
|
+
"path",
|
|
2368
|
+
{
|
|
2369
|
+
fill: "url(#b)",
|
|
2370
|
+
d: "M45 21.9A23.1 23.1 0 1 0 45 68 23.1 23.1 0 0 0 45 22zM45 60a15 15 0 1 1 0-30 15 15 0 0 1 0 30z"
|
|
2371
|
+
}
|
|
2372
|
+
),
|
|
2373
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
2374
|
+
"linearGradient",
|
|
2375
|
+
{
|
|
2376
|
+
id: "c",
|
|
2377
|
+
x1: "65.2",
|
|
2378
|
+
x2: "72.8",
|
|
2379
|
+
y1: "67.2",
|
|
2380
|
+
y2: "74.8",
|
|
2381
|
+
gradientTransform: "matrix(1 0 0 -1 0 92)",
|
|
2382
|
+
gradientUnits: "userSpaceOnUse",
|
|
2383
|
+
children: [
|
|
2384
|
+
/* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "0%", stopColor: "#f30072" }),
|
|
2385
|
+
/* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "100%", stopColor: "#e50097" })
|
|
2386
|
+
]
|
|
2387
|
+
}
|
|
2388
|
+
),
|
|
2389
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { fill: "url(#c)", d: "M74.4 21a5.4 5.4 0 1 1-10.8 0 5.4 5.4 0 0 1 10.8 0z" })
|
|
2390
|
+
] }) });
|
|
2391
|
+
const InstagramColored = React.memo(SvgComponent$c, radashi.isEqual);
|
|
2392
|
+
const InstagramColored$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2393
|
+
__proto__: null,
|
|
2394
|
+
default: InstagramColored
|
|
2395
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2396
|
+
const SvgComponent$b = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxRuntime.jsxs("g", { fill: "currentColor", strokeMiterlimit: "10", strokeWidth: "0", children: [
|
|
2397
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M61.4 254.3A59.8 59.8 0 0 1 19 151.8L65.8 105a11.2 11.2 0 0 1 15.9 16l-46.8 46.7a37.3 37.3 0 0 0 0 53.1 37.6 37.6 0 0 0 53 0l46.9-46.8a11.2 11.2 0 1 1 15.9 16l-46.8 46.7a59.8 59.8 0 0 1-42.5 17.6zM182 154a11.2 11.2 0 0 1-8-19.2L220.8 88a37.6 37.6 0 0 0-53-53.1l-46.9 46.8a11.2 11.2 0 0 1-15.9-16L151.8 19a59.6 59.6 0 0 1 85 0 60.1 60.1 0 0 1 0 84.9l-46.9 46.8c-2.2 2.2-5 3.3-8 3.3z" }),
|
|
2398
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M72.6 194.3a11.2 11.2 0 0 1-8-19.1L175.3 64.7A11.2 11.2 0 1 1 191 80.6L80.6 191c-2.2 2.2-5.1 3.2-8 3.2z" })
|
|
2399
|
+
] }) });
|
|
2400
|
+
const Link = React.memo(SvgComponent$b, radashi.isEqual);
|
|
2401
|
+
const Link$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2402
|
+
__proto__: null,
|
|
2403
|
+
default: Link
|
|
2404
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2405
|
+
const SvgComponent$a = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: 18, height: 19, viewBox: "0 0 18 19", fill: "none", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2406
|
+
"path",
|
|
2407
|
+
{
|
|
2408
|
+
fillRule: "evenodd",
|
|
2409
|
+
clipRule: "evenodd",
|
|
2410
|
+
d: "M0 1.79773C0 1.07677 0.604838 0.5 1.33064 0.5H16.6694C17.3952 0.5 18 1.07677 18 1.79773V17.2023C18 17.9232 17.3952 18.5 16.6694 18.5H1.33064C0.604838 18.5 0 17.9232 0 17.2023V1.79773ZM5.44373 15.5677V7.44492H2.73405V15.5677H5.44373ZM4.08889 6.31541C5.03244 6.31541 5.63728 5.69058 5.63728 4.92155C5.61308 4.1285 5.05663 3.52769 4.11308 3.52769C3.19373 3.52769 2.5647 4.1285 2.5647 4.92155C2.5647 5.69058 3.14534 6.31541 4.08889 6.31541ZM9.65304 15.5677H6.94336C6.94336 15.5677 6.99175 8.18991 6.94336 7.44492H9.67723V8.58586C9.66903 8.59819 9.66097 8.6104 9.65304 8.62249H9.67723V8.58586C10.0439 8.03441 10.6772 7.25266 12.1208 7.25266C13.9111 7.25266 15.2417 8.4062 15.2417 10.9055V15.5677H12.5321V11.2179C12.5321 10.1365 12.145 9.39151 11.153 9.39151C10.403 9.39151 9.94336 9.89619 9.74981 10.3768C9.67723 10.5451 9.65304 10.7854 9.65304 11.0257V15.5677Z",
|
|
2411
|
+
fill: "currentColor"
|
|
2412
|
+
}
|
|
2413
|
+
) });
|
|
2414
|
+
const LinkedIn = React.memo(SvgComponent$a, radashi.isEqual);
|
|
2415
|
+
const LinkedIn$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2416
|
+
__proto__: null,
|
|
2417
|
+
default: LinkedIn
|
|
2418
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2419
|
+
const SvgComponent$9 = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxRuntime.jsxs("g", { fill: "currentColor", strokeMiterlimit: "10", strokeWidth: "0", transform: "matrix(2.8 0 0 2.8 1.4 1.4)", children: [
|
|
2420
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M80.9 78.8H9c-5 0-9.1-4.1-9.1-9.1V20.3c0-5 4-9 9.1-9H81c5 0 9.1 4 9.1 9v49.4c0 5-4 9-9.1 9zM9 17.2A3.1 3.1 0 0 0 6 20.3v49.4c0 1.7 1.4 3 3.1 3H81c1.7 0 3.1-1.3 3.1-3V20.3c0-1.7-1.4-3-3.1-3H9z" }),
|
|
2421
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M45 55.4c-5.4 0-10.6-2.3-14.2-6.3l-28.3-31 4.4-4 28.3 31c2.5 2.8 6 4.3 9.8 4.3 3.8 0 7.3-1.5 9.8-4.3l28.3-31 4.4 4-28.3 31c-3.6 4-8.8 6.3-14.2 6.3z" }),
|
|
2422
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { width: "39", height: "6", x: "-1", y: "57.2", rx: "0", ry: "0", transform: "rotate(-45.1 18.5 60.2)" }),
|
|
2423
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { width: "6", height: "39", x: "68.5", y: "40.7", rx: "0", ry: "0", transform: "rotate(-44.8 71.5 60.2)" })
|
|
2424
|
+
] }) });
|
|
2425
|
+
const Mail = React.memo(SvgComponent$9, radashi.isEqual);
|
|
2426
|
+
const Mail$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2427
|
+
__proto__: null,
|
|
2428
|
+
default: Mail
|
|
2429
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2430
|
+
const SvgComponent$8 = (props) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { height: 48, width: 48, fill: "currentColor", ...props, xmlns: "http://www.w3.org/2000/svg", children: [
|
|
2431
|
+
/* @__PURE__ */ jsxRuntime.jsx("ellipse", { cx: "26", cy: "24.095", rx: "26", ry: "23.547", fill: "#fff" }),
|
|
2432
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2433
|
+
"path",
|
|
2434
|
+
{
|
|
2435
|
+
d: "M37.742 24.095H14.258M26 13.46V34.73 13.46Z",
|
|
2436
|
+
stroke: "#9E9E9E",
|
|
2437
|
+
strokeWidth: "5",
|
|
2438
|
+
strokeLinecap: "round",
|
|
2439
|
+
strokeLinejoin: "round"
|
|
2440
|
+
}
|
|
2441
|
+
)
|
|
2442
|
+
] });
|
|
2443
|
+
const Plus = React.memo(SvgComponent$8, radashi.isEqual);
|
|
2444
|
+
const Plus$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2445
|
+
__proto__: null,
|
|
2446
|
+
default: Plus
|
|
2447
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2448
|
+
const SvgComponent$7 = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 18 18", fill: "none", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2449
|
+
"path",
|
|
2450
|
+
{
|
|
2451
|
+
d: "M11.7001 17.9999H6.30011C5.58427 17.9993 4.89798 17.7144 4.39212 17.2079C4.13889 16.9593 3.93828 16.6622 3.80222 16.3344C3.66616 16.0066 3.59743 15.6548 3.60012 15.2999V14.3999H2.70012C1.98428 14.3993 1.29799 14.1144 0.792133 13.6079C0.538909 13.3593 0.338298 13.0622 0.202237 12.7344C0.0661752 12.4066 -0.0025547 12.0548 0.000137153 11.6999V8.09996C0.000767338 7.38412 0.285642 6.69783 0.792133 6.19197C1.29799 5.68548 1.98428 5.40061 2.70012 5.39998H3.60012V2.69999C3.60075 1.98415 3.88563 1.29786 4.39212 0.791996C4.89798 0.285506 5.58427 0.000630184 6.30011 0H11.7001C12.4159 0.000630184 13.1022 0.285506 13.6081 0.791996C14.1146 1.29786 14.3994 1.98415 14.4001 2.69999V5.39998H15.3001C16.0159 5.40061 16.7022 5.68548 17.2081 6.19197C17.7145 6.69783 17.9994 7.38412 18.0001 8.09996V11.6999C18.0009 12.0559 17.9314 12.4085 17.7955 12.7375C17.6596 13.0665 17.4599 13.3654 17.2081 13.6169C16.7007 14.1201 16.0146 14.4017 15.3001 14.3999H14.4001V15.2999C14.4009 15.6559 14.3314 16.0085 14.1955 16.3375C14.0596 16.6665 13.8599 16.9654 13.6081 17.2169C13.1007 17.7201 12.4146 18.0017 11.7001 17.9999ZM5.40011 13.4999V15.2999C5.39943 15.4184 5.42213 15.5358 5.46692 15.6454C5.5117 15.7551 5.5777 15.8548 5.66111 15.9389C5.74521 16.0223 5.84494 16.0883 5.95459 16.1331C6.06425 16.1779 6.18166 16.2006 6.30011 16.1999H11.7001C11.8185 16.2006 11.9359 16.1779 12.0456 16.1331C12.1552 16.0883 12.255 16.0223 12.3391 15.9389C12.4225 15.8548 12.4885 15.7551 12.5333 15.6454C12.5781 15.5358 12.6008 15.4184 12.6001 15.2999V11.6999C12.5991 11.4638 12.5053 11.2376 12.3391 11.0699C12.2557 10.9849 12.1563 10.9173 12.0466 10.8709C11.937 10.8246 11.8192 10.8004 11.7001 10.8H6.30011C6.18103 10.8004 6.06324 10.8246 5.95355 10.8709C5.84386 10.9173 5.74446 10.9849 5.66111 11.0699C5.49484 11.2376 5.40111 11.4638 5.40011 11.6999V13.4999ZM14.4001 12.5999H15.3001C15.4185 12.6006 15.5359 12.5779 15.6456 12.5331C15.7552 12.4883 15.855 12.4224 15.9391 12.3389C16.0225 12.2548 16.0885 12.1551 16.1333 12.0455C16.178 11.9358 16.2007 11.8184 16.2001 11.6999V8.09996C16.1991 7.86386 16.1053 7.6376 15.9391 7.46996C15.8557 7.38493 15.7563 7.31727 15.6466 7.27093C15.5369 7.22458 15.4191 7.20046 15.3001 7.19997H2.70012C2.58105 7.20046 2.46325 7.22458 2.35357 7.27093C2.24388 7.31727 2.14448 7.38493 2.06113 7.46996C1.89486 7.6376 1.80112 7.86386 1.80013 8.09996V11.6999C1.79944 11.8184 1.82215 11.9358 1.86693 12.0455C1.91172 12.1551 1.97771 12.2548 2.06113 12.3389C2.14522 12.4224 2.24496 12.4883 2.35461 12.5331C2.46426 12.5779 2.58168 12.6006 2.70012 12.5999H3.60012V11.6999C3.60075 10.9841 3.88563 10.2978 4.39212 9.79195C4.89798 9.28546 5.58427 9.00059 6.30011 8.99996H11.7001C12.4159 9.00059 13.1022 9.28546 13.6081 9.79195C14.1146 10.2978 14.3994 10.9841 14.4001 11.6999V12.5999ZM5.40011 5.39998H12.6001V2.69999C12.5991 2.46388 12.5053 2.23762 12.3391 2.06999C12.2557 1.98495 12.1563 1.9173 12.0466 1.87095C11.937 1.82461 11.8192 1.80049 11.7001 1.79999H6.30011C6.18103 1.80049 6.06324 1.82461 5.95355 1.87095C5.84386 1.9173 5.74446 1.98495 5.66111 2.06999C5.49484 2.23762 5.40111 2.46388 5.40011 2.69999V5.39998Z",
|
|
2452
|
+
fill: "currentColor"
|
|
2453
|
+
}
|
|
2454
|
+
) });
|
|
2455
|
+
const Print = React.memo(SvgComponent$7, radashi.isEqual);
|
|
2456
|
+
const Print$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2457
|
+
__proto__: null,
|
|
2458
|
+
default: Print
|
|
2459
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2460
|
+
const SvgComponent$6 = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2461
|
+
"path",
|
|
2462
|
+
{
|
|
2463
|
+
fill: "currentColor",
|
|
2464
|
+
strokeMiterlimit: "10",
|
|
2465
|
+
strokeWidth: "0",
|
|
2466
|
+
d: "M199.75 145.13a54.45 54.45 0 0 0-43.54 21.82l-47.88-23.93c1.4-4.82 2.2-9.9 2.2-15.17a54.3 54.3 0 0 0-2.2-15.16l47.88-23.93a54.45 54.45 0 0 0 43.54 21.82 54.61 54.61 0 0 0 54.56-54.56c0-30.08-24.48-54.56-54.56-54.56s-54.56 24.48-54.56 54.56c0 5.27.79 10.35 2.19 15.17L99.5 95.11A54.45 54.45 0 0 0 55.97 73.3C25.88 73.3 1.4 97.77 1.4 127.86s24.47 54.56 54.56 54.56c17.79 0 33.56-8.6 43.53-21.82l47.88 23.92a54.32 54.32 0 0 0-2.2 15.17c0 30.09 24.48 54.56 54.57 54.56s54.56-24.47 54.56-54.56a54.62 54.62 0 0 0-54.56-54.56zm0-124c19.24 0 34.89 15.65 34.89 34.9s-15.65 34.88-34.9 34.88-34.88-15.65-34.88-34.89 15.65-34.89 34.89-34.89zM55.97 162.75c-19.24 0-34.9-15.65-34.9-34.9s15.66-34.88 34.9-34.88 34.88 15.65 34.88 34.89-15.65 34.89-34.88 34.89zm143.78 71.83a34.93 34.93 0 0 1-34.9-34.89c0-19.24 15.66-34.89 34.9-34.89s34.89 15.65 34.89 34.9a34.93 34.93 0 0 1-34.9 34.88z"
|
|
2467
|
+
}
|
|
2468
|
+
) });
|
|
2469
|
+
const Share = React.memo(SvgComponent$6, radashi.isEqual);
|
|
2470
|
+
const Share$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2471
|
+
__proto__: null,
|
|
2472
|
+
default: Share
|
|
2473
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2474
|
+
const SvgComponent$5 = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2475
|
+
"path",
|
|
2476
|
+
{
|
|
2477
|
+
fill: "currentColor",
|
|
2478
|
+
strokeMiterlimit: "10",
|
|
2479
|
+
strokeWidth: "0",
|
|
2480
|
+
d: "M81 231A147 147 0 0 0 228 76c11-7 19-16 26-27-9 5-19 7-29 9 10-7 18-17 22-29-10 6-21 10-33 12a52 52 0 0 0-88 48C83 87 45 66 19 35a52 52 0 0 0 16 69c-8 0-16-3-23-7v1c0 25 17 46 41 51a52 52 0 0 1-23 1c6 20 26 35 48 36a104 104 0 0 1-77 21c23 15 51 24 80 24"
|
|
2481
|
+
}
|
|
2482
|
+
) });
|
|
2483
|
+
const Twitter = React.memo(SvgComponent$5, radashi.isEqual);
|
|
2484
|
+
const Twitter$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2485
|
+
__proto__: null,
|
|
2486
|
+
default: Twitter
|
|
2487
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2488
|
+
const SvgComponent$4 = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2489
|
+
"path",
|
|
2490
|
+
{
|
|
2491
|
+
fill: "#1da1f2",
|
|
2492
|
+
strokeMiterlimit: "10",
|
|
2493
|
+
strokeWidth: "0",
|
|
2494
|
+
d: "M81 230.6c95.4 0 147.6-79 147.6-147.6 0-2.3 0-4.5-.2-6.7 10.2-7.4 19-16.5 25.9-26.9-9.5 4.2-19.5 7-29.8 8.2a52 52 0 0 0 22.8-28.7 104 104 0 0 1-33 12.6A52 52 0 0 0 126 88.8C84.2 86.7 45.4 67 19 34.6a52 52 0 0 0 16 69.2 51.5 51.5 0 0 1-23.5-6.5v.7c0 24.7 17.4 46 41.6 50.9-7.6 2-15.6 2.4-23.4.9a52 52 0 0 0 48.5 36 104.1 104.1 0 0 1-76.8 21.5A146.9 146.9 0 0 0 81 230.6"
|
|
2495
|
+
}
|
|
2496
|
+
) });
|
|
2497
|
+
const TwitterColored = React.memo(SvgComponent$4, radashi.isEqual);
|
|
2498
|
+
const TwitterColored$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2499
|
+
__proto__: null,
|
|
2500
|
+
default: TwitterColored
|
|
2501
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2502
|
+
const SvgComponent$3 = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: 24, height: 24, fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2503
|
+
"path",
|
|
2504
|
+
{
|
|
2505
|
+
d: "M17 21H7a4 4 0 0 1-4-4v-1a1 1 0 1 1 2 0v1a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-1a1 1 0 0 1 2 0v1a4 4 0 0 1-4 4Zm-5-4a1 1 0 0 1-1-1V6.41l-2.29 2.3a1.004 1.004 0 0 1-1.42-1.42l4-4a1 1 0 0 1 .33-.21A1 1 0 0 1 12 3a1 1 0 0 1 .38.08 1 1 0 0 1 .33.21l4 4a1.004 1.004 0 1 1-1.42 1.42L13 6.41V16a1 1 0 0 1-1 1Z",
|
|
2506
|
+
fill: "currentColor"
|
|
2507
|
+
}
|
|
2508
|
+
) });
|
|
2509
|
+
const Upload = React.memo(SvgComponent$3, radashi.isEqual);
|
|
2510
|
+
const Upload$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2511
|
+
__proto__: null,
|
|
2512
|
+
default: Upload
|
|
2513
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2514
|
+
const SvgComponent$2 = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 25, viewBox: "0 0 24 25", fill: "none", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2515
|
+
"path",
|
|
2516
|
+
{
|
|
2517
|
+
d: "M14.119 11.7052L20.4486 4.5H18.9492L13.4509 10.7549L9.0626 4.5H4L10.6374 13.9594L4 21.5142H5.4994L11.3021 14.9074L15.9374 21.5142H21M6.04057 5.60727H8.34407L18.9481 20.4613H16.644",
|
|
2518
|
+
fill: "currentColor"
|
|
2519
|
+
}
|
|
2520
|
+
) });
|
|
2521
|
+
const X = React.memo(SvgComponent$2, radashi.isEqual);
|
|
2522
|
+
const X$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2523
|
+
__proto__: null,
|
|
2524
|
+
default: X
|
|
2525
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2526
|
+
const SvgComponent$1 = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2527
|
+
"path",
|
|
2528
|
+
{
|
|
2529
|
+
fill: "currentColor",
|
|
2530
|
+
strokeMiterlimit: "10",
|
|
2531
|
+
strokeWidth: "0",
|
|
2532
|
+
d: "M249 67c-3-11-11-19-22-22-20-6-99-6-99-6s-79 0-99 6C18 48 10 56 7 67c-6 20-6 61-6 61s0 41 6 61c3 11 11 19 22 22 20 5 99 5 99 5s79 0 99-5c11-3 19-11 22-22 5-20 5-61 5-61s0-41-5-61zm-146 99V90l65 38-65 38z"
|
|
2533
|
+
}
|
|
2534
|
+
) });
|
|
2535
|
+
const YouTube = React.memo(SvgComponent$1, radashi.isEqual);
|
|
2536
|
+
const YouTube$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2537
|
+
__proto__: null,
|
|
2538
|
+
default: YouTube
|
|
2539
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2540
|
+
const SvgComponent = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxRuntime.jsxs("g", { fill: "currentColor", strokeMiterlimit: "10", strokeWidth: "0", children: [
|
|
2541
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2542
|
+
"path",
|
|
2543
|
+
{
|
|
2544
|
+
fill: "red",
|
|
2545
|
+
d: "M249.02 66.99a31.68 31.68 0 0 0-22.36-22.36c-19.72-5.29-98.8-5.29-98.8-5.29s-79.09 0-98.8 5.29A31.68 31.68 0 0 0 6.68 66.99c-5.28 19.72-5.28 60.87-5.28 60.87s0 41.15 5.28 60.87a31.68 31.68 0 0 0 22.36 22.36c19.72 5.28 98.8 5.28 98.8 5.28s79.1 0 98.81-5.28a31.68 31.68 0 0 0 22.36-22.36c5.29-19.72 5.29-60.87 5.29-60.87s0-41.15-5.29-60.87z"
|
|
2546
|
+
}
|
|
2547
|
+
),
|
|
2548
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { fill: "#fff", d: "m102.57 165.8 65.7-37.94-65.7-37.94z" })
|
|
2549
|
+
] }) });
|
|
2550
|
+
const YouTubeColored = React.memo(SvgComponent, radashi.isEqual);
|
|
2551
|
+
const YouTubeColored$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2552
|
+
__proto__: null,
|
|
2553
|
+
default: YouTubeColored
|
|
2554
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
2555
|
+
const [useIsClient, IsClientProvider] = coreLib.createCtx();
|
|
2556
|
+
const [useDraftMode, DraftModeProvider] = coreLib.createCtx();
|
|
9
2557
|
function createServerContext(defaultValue) {
|
|
10
|
-
const getRef =
|
|
2558
|
+
const getRef = React.cache(() => ({ current: defaultValue }));
|
|
11
2559
|
const getValue = () => getRef().current;
|
|
12
2560
|
const setValue = (value) => {
|
|
13
2561
|
getRef().current = value;
|