@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/server.mjs CHANGED
@@ -1,10 +1,2558 @@
1
1
  "use server";
2
- import { c as log } from "./router-CA4ItnAc.mjs";
2
+ import { c as log$1 } from "./router-CA4ItnAc.mjs";
3
3
  import { d } from "./router-CA4ItnAc.mjs";
4
- import "server-only";
5
- import { cache } from "react";
4
+ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
5
+ import React, { useMemo, useRef, memo, lazy, Suspense, forwardRef, createContext, Children, isValidElement, cloneElement, useCallback, cache } from "react";
6
+ import { tv } from "tailwind-variants";
7
+ import { get, isEqual, isEmpty, invert } from "radashi";
8
+ import "@react-aria/accordion";
9
+ import { createCtxNullable as createCtxNullable$1, createCtx } from "@okam/core-lib";
10
+ import { useLink, FocusRing, useButton, usePress, mergeProps, useOption, useListBoxSection, useListBox } from "react-aria";
11
+ import "react-use";
12
+ import "@react-spring/web";
13
+ import { useListState } from "react-stately";
14
+ import "react-div-100vh";
15
+ import "@react-aria/focus";
16
+ import "swiper/react";
17
+ import "swiper/modules";
18
+ import "sanitize-html";
19
+ import "@react-aria/i18n";
20
+ import { useFormContext, Controller } from "react-hook-form";
21
+ import { createLogger } from "@okam/logger";
22
+ import { filterDOMProps, mergeProps as mergeProps$1 } from "@react-aria/utils";
23
+ import "next/headers";
6
24
  import { queryGql } from "@okam/directus-query";
7
- import { isEqual, get, invert } from "radashi";
25
+ const makeTheme = (theme) => theme;
26
+ function createCtxNullable() {
27
+ const ctx = React.createContext(void 0);
28
+ function useCtx() {
29
+ const c = React.useContext(ctx);
30
+ if (c === void 0) {
31
+ return null;
32
+ }
33
+ return c;
34
+ }
35
+ return [useCtx, ctx.Provider];
36
+ }
37
+ const defaultTheme = {
38
+ typography: () => ""
39
+ };
40
+ const [useTheme, ThemeProvider] = createCtxNullable();
41
+ function ThemeContextProvider({ children, brandTheme = defaultTheme }) {
42
+ const value = useMemo(() => ({ brandTheme }), [brandTheme]);
43
+ return /* @__PURE__ */ jsx(ThemeProvider, { value, children });
44
+ }
45
+ const createThemeProvider = (brandTheme) => {
46
+ const ThemeProviderContext = ({ children }) => /* @__PURE__ */ jsx(ThemeContextProvider, { brandTheme, children });
47
+ return ThemeProviderContext;
48
+ };
49
+ const accordionContainer = tv({
50
+ base: "[border-radius: 32px] p-1.5 focus:outline-none text-color-1-500",
51
+ defaultVariants: {
52
+ textAlign: "left",
53
+ isOpen: false
54
+ },
55
+ variants: {
56
+ textAlign: {
57
+ center: "text-center",
58
+ left: "text-left"
59
+ }
60
+ }
61
+ });
62
+ const accordionButton = tv({
63
+ base: "grid overflow-hidden w-full items-center border-b-2 border-color-1-500 focus-ring-black",
64
+ variants: {
65
+ titleBold: {
66
+ true: "font-bold"
67
+ },
68
+ textAlign: {
69
+ center: "grid-cols-[3rem_1fr_3rem] pl-0 sm:pl-0",
70
+ left: "grid-cols-[1fr_3rem]"
71
+ },
72
+ bgColor: {
73
+ gray: "bg-gray-300",
74
+ white: "bg-white"
75
+ }
76
+ },
77
+ defaultVariants: {
78
+ titleBold: false,
79
+ textAlign: "left",
80
+ bgColor: "white"
81
+ }
82
+ });
83
+ const accordionTitle = tv({
84
+ base: "",
85
+ defaultVariants: {
86
+ textAlign: "left"
87
+ },
88
+ variants: {
89
+ textAlign: {
90
+ center: "justify-self-center col-start-2",
91
+ left: "justify-self-start"
92
+ }
93
+ }
94
+ });
95
+ const accordionIcon = tv({
96
+ 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",
97
+ variants: {
98
+ isOpen: {
99
+ true: "-rotate-90",
100
+ false: ""
101
+ }
102
+ }
103
+ });
104
+ const accordionRegion = tv({
105
+ base: `
106
+ font-body
107
+ text-inherit
108
+ h-auto
109
+ grid
110
+ `,
111
+ defaultVariants: {
112
+ textAlign: "left"
113
+ },
114
+ variants: {
115
+ textAlign: {
116
+ center: "grid-cols-[3rem_1fr_3rem] px-6 text-center",
117
+ left: "grid-cols-[1fr_3rem] text-left"
118
+ }
119
+ }
120
+ });
121
+ const accordionContent = tv({
122
+ base: "overflow-hidden flex flex-col gap-2 items-start",
123
+ defaultVariants: {
124
+ textAlign: "left"
125
+ },
126
+ variants: {
127
+ textAlign: {
128
+ center: "col-start-2",
129
+ left: ""
130
+ }
131
+ }
132
+ });
133
+ const accordionTheme = {
134
+ container: (props) => accordionContainer(props),
135
+ button: (props) => accordionButton(props),
136
+ title: (props) => accordionTitle(props),
137
+ icon: (props) => accordionIcon(props),
138
+ region: (props) => accordionRegion(props),
139
+ content: (props) => accordionContent(props)
140
+ };
141
+ const button = tv({
142
+ base: `
143
+ flex
144
+ items-center
145
+ justify-center
146
+ gap-4
147
+ transition
148
+ duration-300
149
+ ease-in-out
150
+ disabled:pointer-events-none
151
+ disabled:opacity-30
152
+ focus-ring-black
153
+ h-fit
154
+ `,
155
+ defaultVariants: {
156
+ buttonStyle: "default",
157
+ type: "button",
158
+ size: "default",
159
+ shape: "rounded"
160
+ },
161
+ variants: {
162
+ type: {
163
+ button: "",
164
+ menu: "text-2xl"
165
+ },
166
+ buttonStyle: {
167
+ default: `
168
+ px-4
169
+ py-2
170
+ text-white
171
+ bg-color-1-500
172
+ hover:bg-color-1-400
173
+ active:bg-color-1-400
174
+ `,
175
+ outline: `
176
+ px-4
177
+ py-2
178
+ bg-transparent
179
+ border-color-1-500
180
+ text-color-1-500
181
+ hover:bg-color-1-500
182
+ hover:text-white
183
+ active:bg-color-1-500
184
+ active:text-white
185
+ `,
186
+ hollow: `
187
+ px-2
188
+ bg-transparent
189
+ text-color-1-500
190
+ hover:border-b-color-1-500
191
+ active:border-b-color-1-500
192
+ focus:border-b-color-1-500
193
+
194
+ `
195
+ },
196
+ intent: {
197
+ danger: ``,
198
+ error: `
199
+ bg-error
200
+ text-white
201
+ pointer-events-none
202
+ border-error
203
+ `
204
+ },
205
+ size: {
206
+ default: `min-w-12 min-h-6`,
207
+ large: `min-w-36 min-h-18`
208
+ },
209
+ shape: {
210
+ rounded: `rounded-md`,
211
+ circular: `rounded-full`
212
+ }
213
+ },
214
+ compoundVariants: [
215
+ {
216
+ intent: "danger",
217
+ buttonStyle: "default",
218
+ className: `
219
+ bg-danger-500
220
+ text-white
221
+ border-danger-500
222
+ hover:bg-danger-400
223
+ hover:border-danger-400
224
+ focus:bg-danger-400
225
+ focus:border-danger-400
226
+ `
227
+ }
228
+ ]
229
+ });
230
+ const typography = tv({
231
+ variants: {
232
+ size: {
233
+ h1: `text-5xl`,
234
+ h2: `text-4xl`,
235
+ h3: `text-3xl`,
236
+ h4: `text-2xl`,
237
+ h5: `text-xl`,
238
+ h6: `text-lg`,
239
+ leading: `text-md font-bold leading-normal`,
240
+ paragraph: `text-md inline`,
241
+ footnotes: `text-sm`,
242
+ xs: `text-xs`
243
+ },
244
+ font: {
245
+ body: `font-body`
246
+ },
247
+ weight: {
248
+ normal: `font-normal`,
249
+ light: `font-light`,
250
+ bold: "font-bold"
251
+ },
252
+ color: {
253
+ gray: `text-gray-500`,
254
+ white: `text-white`
255
+ },
256
+ isError: {
257
+ true: "text-sm text-error"
258
+ },
259
+ align: {
260
+ center: "text-center",
261
+ left: "text-left",
262
+ right: "text-right"
263
+ }
264
+ },
265
+ defaultVariants: {
266
+ size: "paragraph",
267
+ font: "body"
268
+ }
269
+ });
270
+ const alertsWrapper = tv({
271
+ base: "bg-color-1-200 p-4 flex flex-col gap-4"
272
+ });
273
+ const alertsCarouselWrapper = tv({
274
+ base: "flex flex-wrap justify-between items-center gap-4 relative"
275
+ });
276
+ const alertsCloseBtn = tv({
277
+ extend: button,
278
+ base: "self-end"
279
+ });
280
+ const alertsSwiperSwiper = tv({
281
+ base: "bg-color-1-300 m-2 rounded-lg order-2 basis-9/12"
282
+ });
283
+ const alertsSwiperWrapper = tv({
284
+ base: "m-4"
285
+ });
286
+ const alertsItemWrapper = tv({
287
+ base: ""
288
+ });
289
+ const alertsItemContainer = tv({
290
+ base: ""
291
+ });
292
+ const alertsItemTitle = tv({
293
+ extend: typography,
294
+ defaultVariants: {
295
+ size: "h1"
296
+ }
297
+ });
298
+ const alertsItemContent = tv({
299
+ extend: typography
300
+ });
301
+ const alertsItemIcon = tv({
302
+ base: "block w-min bg-color-1-400 p-2 rounded-lg"
303
+ });
304
+ const alertsNavigationButton = tv({
305
+ extend: button,
306
+ base: "basis-1/12",
307
+ variants: {
308
+ order: {
309
+ prev: "order-1",
310
+ next: "order-3"
311
+ }
312
+ }
313
+ });
314
+ const alertsPaginationWrapper = tv({
315
+ base: "flex gap-4 justify-center bg-color-1-200 z-10 bottom-4 left-0 right-0 order-4 basis-full"
316
+ });
317
+ const alertsPaginationBullet = tv({
318
+ base: "w-4 h-4 rounded-full block bg-color-1-600 focus-ring-black",
319
+ variants: {
320
+ active: {
321
+ true: "bg-color-1-100",
322
+ false: ""
323
+ }
324
+ }
325
+ });
326
+ const alertsTheme = {
327
+ wrapper: alertsWrapper,
328
+ carouselWrapper: alertsCarouselWrapper,
329
+ closeBtn: alertsCloseBtn,
330
+ swiper: {
331
+ swiper: alertsSwiperSwiper,
332
+ wrapper: alertsSwiperWrapper
333
+ },
334
+ item: {
335
+ wrapper: alertsItemWrapper,
336
+ container: alertsItemContainer,
337
+ title: alertsItemTitle,
338
+ content: alertsItemContent,
339
+ icon: alertsItemIcon
340
+ },
341
+ navigation: {
342
+ button: alertsNavigationButton
343
+ },
344
+ pagination: {
345
+ wrapper: alertsPaginationWrapper,
346
+ bullet: alertsPaginationBullet
347
+ }
348
+ };
349
+ const main = tv({
350
+ base: "w-full bg-slate-100"
351
+ });
352
+ const container = tv({
353
+ base: "max-w-screen-lg mx-auto w-full",
354
+ variants: {
355
+ fullWidth: {
356
+ true: "max-w-full col-span-full p-0"
357
+ },
358
+ spacing: {
359
+ small: "mb-3",
360
+ medium: "mb-6",
361
+ large: "mb-8",
362
+ none: "mb-0"
363
+ }
364
+ }
365
+ });
366
+ const grid = tv({
367
+ extend: container,
368
+ base: "grid grid-cols-12 gap-6 px-4 col-span-full",
369
+ variants: {
370
+ fullWidth: {
371
+ true: "max-w-full col-span-full p-0"
372
+ }
373
+ }
374
+ });
375
+ const gridItem = tv({
376
+ base: "bg-slate-300 h-64 p-4 flex justify-start items-end",
377
+ defaultVariants: {
378
+ size: "small"
379
+ },
380
+ variants: {
381
+ size: {
382
+ small: "col-span-12 sm:col-span-6 md:col-span-4 lg:col-span-4",
383
+ medium: "col-span-12 sm:col-span-12 md:col-span-8 lg:col-span-8",
384
+ 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"
385
+ }
386
+ }
387
+ });
388
+ const calendarContainer = tv({
389
+ base: "text-gray-800 flex flex-col gap-4"
390
+ });
391
+ const calendarHeader = tv({
392
+ base: "flex items-center justify-between"
393
+ });
394
+ const calendarTitle = tv({
395
+ base: "text-2xl text-color-1-500 font-bold"
396
+ });
397
+ const calendarHeaderContainer = tv({
398
+ base: ""
399
+ });
400
+ tv({
401
+ base: ""
402
+ });
403
+ tv({
404
+ base: ""
405
+ });
406
+ tv({
407
+ base: ""
408
+ });
409
+ const calendarNavigationButtonsContainer = tv({
410
+ base: "flex items-center gap-1"
411
+ });
412
+ const calendarNavigationButtons = tv({
413
+ base: `
414
+ active:bg-color-1-500
415
+ p-2
416
+ rounded-full
417
+ active:text-color-1-100
418
+ hover:bg-color-1-200
419
+ focus-ring-black
420
+ transition-all
421
+ duration-300
422
+ ease-in-out
423
+ `
424
+ });
425
+ const calendarTable = tv({
426
+ base: `
427
+ border-spacing-2
428
+ border-separate
429
+ `
430
+ });
431
+ const calendarDayLabel = tv({
432
+ base: `
433
+ text-center
434
+ capitalize
435
+ rounded-lg
436
+ p-2
437
+ mx-2
438
+ bg-color-1-300
439
+ `
440
+ });
441
+ const calendarCellContainer = tv({
442
+ base: "text-center",
443
+ variants: {
444
+ isFocusVisible: {
445
+ true: "z-10",
446
+ false: ""
447
+ }
448
+ }
449
+ });
450
+ const calendarCell = tv({
451
+ base: "w-10 h-10",
452
+ variants: {
453
+ isSelected: {
454
+ true: "",
455
+ false: ""
456
+ },
457
+ isInvalid: {
458
+ true: "",
459
+ false: ""
460
+ },
461
+ isDisabled: {
462
+ true: "disabled pointer-events-none",
463
+ false: ""
464
+ },
465
+ isUnavailable: {
466
+ true: "pointer-events-none",
467
+ false: ""
468
+ },
469
+ isOutsideRange: {
470
+ true: "pointer-events-none",
471
+ false: ""
472
+ },
473
+ isOutsideVisibleRange: {
474
+ true: "pointer-events-none",
475
+ false: ""
476
+ },
477
+ isRoundedLeft: {
478
+ true: "rounded-l-full",
479
+ false: ""
480
+ },
481
+ isRoundedRight: {
482
+ true: "rounded-r-full",
483
+ false: ""
484
+ }
485
+ },
486
+ compoundVariants: [
487
+ {
488
+ isSelected: [true, false],
489
+ isInvalid: true,
490
+ class: "bg-error-400 hover:bg-error-500"
491
+ },
492
+ {
493
+ isSelected: true
494
+ }
495
+ ]
496
+ });
497
+ const calendarCellDate = tv({
498
+ base: `
499
+ w-full
500
+ h-full
501
+ flex
502
+ items-center
503
+ justify-center
504
+ cursor-pointer
505
+ transition-all
506
+ duration-100
507
+ ease-in-out
508
+ relative
509
+ `,
510
+ variants: {
511
+ isSelected: {
512
+ true: `
513
+ bg-color-1-400
514
+ text-white
515
+ hover:bg-color-1-500
516
+ `,
517
+ false: `
518
+ rounded-full
519
+ hover:text-white
520
+ hover:bg-color-1-400
521
+ `
522
+ },
523
+ isInvalid: {
524
+ true: "",
525
+ fasle: ""
526
+ },
527
+ isDisabled: {
528
+ true: "opacity-50",
529
+ false: ""
530
+ },
531
+ isUnavailable: {
532
+ true: "text-gray-200",
533
+ false: ""
534
+ },
535
+ isOutsideRange: {
536
+ true: `
537
+ text-black
538
+ before:content-['/']
539
+ before:text-gray-400
540
+ before:[font-weight:100]
541
+ before:text-4xl
542
+ before:absolute
543
+ before:inset-0
544
+ before:flex
545
+ before:items-center
546
+ before:justify-center
547
+ `,
548
+ false: ""
549
+ },
550
+ isOutsideVisibleRange: {
551
+ true: `text-gray-400`,
552
+ false: ""
553
+ },
554
+ isFocusVisible: {
555
+ true: "",
556
+ false: ""
557
+ },
558
+ isSelectionStart: {
559
+ true: "",
560
+ false: ""
561
+ },
562
+ isSelectionEnd: {
563
+ true: "",
564
+ false: ""
565
+ }
566
+ },
567
+ compoundVariants: [
568
+ {
569
+ isSelectionStart: [true, false],
570
+ isSelectionEnd: [true, false],
571
+ isDisabled: false,
572
+ isOutsideRange: false,
573
+ isUnavailable: false,
574
+ isInvalid: true,
575
+ class: `
576
+ bg-error-400
577
+ hover:bg-error-500
578
+ `
579
+ },
580
+ {
581
+ isSelectionStart: true,
582
+ class: `
583
+ rounded-l-full
584
+ bg-color-1-400
585
+ text-white
586
+ hover:bg-color-1-500
587
+ `
588
+ },
589
+ {
590
+ isSelectionEnd: true,
591
+ class: `
592
+ rounded-r-full
593
+ bg-color-1-400
594
+ text-white
595
+ hover:bg-color-1-500
596
+ `
597
+ }
598
+ ]
599
+ });
600
+ const calendarTheme = {
601
+ container: calendarContainer,
602
+ header: calendarHeader,
603
+ calendarHeaderContainer,
604
+ title: calendarTitle,
605
+ navigationButtonsContainer: calendarNavigationButtonsContainer,
606
+ navigationButtons: calendarNavigationButtons,
607
+ calendarTable,
608
+ calendarDayLabel,
609
+ cellContainer: calendarCellContainer,
610
+ cell: calendarCell,
611
+ cellDate: calendarCellDate
612
+ };
613
+ const carouselWrapper = tv({
614
+ base: "flex flex-wrap justify-between items-center gap-4 relative"
615
+ });
616
+ const carouselSwiperSwiper = tv({
617
+ base: `
618
+ basis-9/12
619
+ bg-color-1-300
620
+ m-2
621
+ rounded-lg
622
+ order-2
623
+ focus-visible:outline-2
624
+ focus-visible:outline-black
625
+ focus-visible:outline-offset-2
626
+ `
627
+ });
628
+ const carouselSwiperWrapper = tv({
629
+ base: ""
630
+ });
631
+ const carouselNavigationButton = tv({
632
+ extend: button,
633
+ base: "basis-1/12",
634
+ variants: {
635
+ order: {
636
+ prev: "order-1",
637
+ next: "order-3"
638
+ }
639
+ }
640
+ });
641
+ const carouselPaginationWrapper = tv({
642
+ base: "flex gap-4 justify-center z-10 bottom-4 left-0 right-0 order-4 basis-full"
643
+ });
644
+ const carouselPaginationBullet = tv({
645
+ base: "w-4 h-4 rounded-full block bg-color-1-600 focus-ring-black",
646
+ variants: {
647
+ active: {
648
+ true: "bg-color-1-100",
649
+ false: ""
650
+ }
651
+ }
652
+ });
653
+ const carouselPaginationFractionWrapper = tv({
654
+ base: "bg-color-1-300 rounded-lg p-2"
655
+ });
656
+ const carouselSlideWrapper = tv({
657
+ base: "px-4 flex flex-col justify-center h-full"
658
+ });
659
+ const carouselSlideContainer = tv({
660
+ base: "flex flex-col gap-2 bg-color-1-400 my-4 rounded-lg p-4"
661
+ });
662
+ const carouselSlideTitle = tv({
663
+ extend: typography,
664
+ defaultVariants: {
665
+ size: "h3"
666
+ }
667
+ });
668
+ const carouselTheme = {
669
+ carouselWrapper,
670
+ swiper: {
671
+ swiper: carouselSwiperSwiper,
672
+ wrapper: carouselSwiperWrapper
673
+ },
674
+ navigation: {
675
+ button: carouselNavigationButton
676
+ },
677
+ pagination: {
678
+ wrapper: carouselPaginationWrapper,
679
+ bullet: carouselPaginationBullet,
680
+ fraction: {
681
+ wrapper: carouselPaginationFractionWrapper
682
+ }
683
+ },
684
+ slide: {
685
+ wrapper: carouselSlideWrapper,
686
+ container: carouselSlideContainer,
687
+ title: carouselSlideTitle
688
+ }
689
+ };
690
+ const checkboxContainer = tv({
691
+ base: "flex focus-ring-black"
692
+ });
693
+ const checkboxLabel = tv({
694
+ base: `hover:cursor-pointer`,
695
+ variants: {
696
+ color: {
697
+ gray: "text-gray-300",
698
+ black: "text-black"
699
+ },
700
+ isDisabled: {
701
+ true: "text-gray-6"
702
+ }
703
+ },
704
+ defaultVariants: {
705
+ color: "black"
706
+ }
707
+ });
708
+ const checkBox = tv({
709
+ 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`,
710
+ variants: {
711
+ isDisabled: {
712
+ true: "border-gray-6"
713
+ },
714
+ isFocused: {
715
+ true: `outline-black [outline-offset: 2px]`
716
+ },
717
+ isError: {
718
+ true: "border-red-500"
719
+ }
720
+ }
721
+ });
722
+ const checkMark = tv({
723
+ base: `hidden w-4 h-4 bg-gray-300 rounded-full`,
724
+ variants: {
725
+ selected: {
726
+ true: "block text-white"
727
+ }
728
+ }
729
+ });
730
+ const checkMarkIcon = tv({
731
+ base: "text-white w-4 h-4 [&_svg]:w-4 [&_svg]:h-4"
732
+ });
733
+ const checkboxGroup = tv({
734
+ base: `block`,
735
+ variants: {
736
+ isDisabled: {
737
+ true: "opacity-60 pointer-events-none"
738
+ }
739
+ }
740
+ });
741
+ const checkboxGroupItemsGroup = tv({
742
+ base: `flex flex-col gap-4 py-8`
743
+ });
744
+ const listBoxWrapper = tv({
745
+ base: "flex flex-col gap-2"
746
+ });
747
+ const listBoxLabel = tv({
748
+ extend: typography,
749
+ defaultVariants: {
750
+ size: "h3"
751
+ }
752
+ });
753
+ const listBoxList = tv({
754
+ base: "flex flex-col gap-2"
755
+ });
756
+ const listBoxSectionWrapper = tv({
757
+ base: "flex flex-col gap-2 pt-2 mb-2 border-t border-border first:border-t-0 first:pt-0 last:mb-0"
758
+ });
759
+ const listBoxSectionHeading = tv({
760
+ extend: typography,
761
+ defaultVariants: {
762
+ size: "h4"
763
+ }
764
+ });
765
+ const listBoxSectionGroup = tv({
766
+ base: "flex flex-col gap-2"
767
+ });
768
+ const listBoxOptionOption = tv({
769
+ extend: typography,
770
+ base: "p-1 rounded-md",
771
+ variants: {
772
+ isSelectable: {
773
+ true: "cursor-pointer"
774
+ },
775
+ isLink: {
776
+ 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",
777
+ false: ""
778
+ },
779
+ isFocused: {
780
+ true: "outline outline-2 outline-offset-1 outline-gray-400"
781
+ },
782
+ isFocusVisible: {
783
+ true: "outline outline-4 outline-offset-2 outline-black"
784
+ },
785
+ isSelected: {
786
+ true: "bg-color-1-400 text-white hover:bg-color-1-500 active:bg-color-1-600"
787
+ },
788
+ isDisabled: {
789
+ true: "opacity-50 pointer-events-none"
790
+ },
791
+ allowsSelection: {
792
+ true: ""
793
+ }
794
+ },
795
+ defaultVariants: {
796
+ size: "paragraph"
797
+ },
798
+ compoundVariants: [
799
+ {
800
+ isFocused: true,
801
+ isFocusVisible: true,
802
+ className: "outline outline-4 outline-offset-2 outline-black"
803
+ },
804
+ {
805
+ isSelectable: true,
806
+ isLink: false,
807
+ className: "hover:bg-color-1-100 active:bg-color-1-200"
808
+ }
809
+ ]
810
+ });
811
+ const listBoxOptionLabel = tv({
812
+ extend: typography,
813
+ defaultVariants: {
814
+ size: "h5"
815
+ }
816
+ });
817
+ const listBoxOptionDescription = tv({
818
+ extend: typography,
819
+ defaultVariants: {
820
+ size: "footnotes"
821
+ }
822
+ });
823
+ const listBoxErrorMessage = tv({
824
+ extend: typography,
825
+ defaultVariants: {
826
+ size: "footnotes",
827
+ isError: true
828
+ }
829
+ });
830
+ const itemTheme = {
831
+ option: listBoxOptionOption,
832
+ label: listBoxOptionLabel,
833
+ description: listBoxOptionDescription
834
+ };
835
+ const listBoxTheme = {
836
+ wrapper: listBoxWrapper,
837
+ label: listBoxLabel,
838
+ list: listBoxList,
839
+ section: {
840
+ wrapper: listBoxSectionWrapper,
841
+ heading: listBoxSectionHeading,
842
+ group: listBoxSectionGroup,
843
+ item: itemTheme
844
+ },
845
+ item: itemTheme,
846
+ errorMessage: listBoxErrorMessage
847
+ };
848
+ const comboBoxButton = tv({
849
+ base: [
850
+ button.base,
851
+ `
852
+ px-4
853
+ py-2
854
+ text-white
855
+ bg-color-1-500
856
+ `
857
+ ],
858
+ variants: {
859
+ isOpen: {
860
+ true: "pointer-events-none",
861
+ false: "hover:bg-color-1-400 active:bg-color-1-400"
862
+ }
863
+ }
864
+ });
865
+ const comboBoxTheme = {
866
+ wrapper: () => "flex flex-col gap-4 relative",
867
+ label: (props) => typography({ ...props, className: "text-gray-3" }),
868
+ container: () => "flex flex-col gap-4",
869
+ 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",
870
+ button: comboBoxButton,
871
+ popover: {
872
+ 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"
873
+ },
874
+ listContainer: (props) => typography({
875
+ ...props,
876
+ 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"
877
+ }),
878
+ ul: (props) => typography({
879
+ ...props,
880
+ className: "w-full flex flex-col gap-6"
881
+ }),
882
+ li: () => "transition w-full hover:text-gray-300 focus-ring-white",
883
+ group: () => "flex flex-col gap-4",
884
+ section: () => "flex flex-col gap-4",
885
+ list: {
886
+ ...listBoxTheme
887
+ },
888
+ headerText: () => "text-gray-300",
889
+ noResults: () => "p-4 text-center",
890
+ noResultsText: (props) => typography({ ...props, className: "text-gray-400" }),
891
+ errorMessage: (props) => typography({ ...props, size: "footnotes", isError: true })
892
+ };
893
+ const focusable = tv({
894
+ base: `
895
+ focus-ring-black
896
+ transition-all
897
+ duration-200
898
+ `
899
+ });
900
+ const datePickerContainer = tv({
901
+ base: "relative inline-flex flex-col text-left"
902
+ });
903
+ const datePickerButton = tv({
904
+ extend: focusable,
905
+ base: "flex gap-4 justify-between items-center border-2 border-color-1-500 rounded-md bg-gray-100 p-4",
906
+ variants: {
907
+ dateFieldShown: {
908
+ true: "w-full",
909
+ false: "w-fit"
910
+ },
911
+ isInvalid: {
912
+ true: "bg-red-100 border-red-500",
913
+ false: "bg-gray-100 border-color-1-500"
914
+ }
915
+ },
916
+ defaultVariants: {
917
+ dateFieldShown: true
918
+ }
919
+ });
920
+ const datePickerIcon = tv({
921
+ base: "text-white bg-color-1-500 rounded-md h-full p-2"
922
+ });
923
+ const datePickerLabel = tv({
924
+ base: "text-color-1-500 font-bold pb-2 text-2xl"
925
+ });
926
+ const datePickerWrapper = tv({
927
+ base: "w-fit flex flex-col gap-4"
928
+ });
929
+ const datePickerCalendarPopoverUnderlay = tv({
930
+ base: "fixed inset-0"
931
+ });
932
+ const datePickerCalendarPopoverContainer = tv({
933
+ base: "absolute top-full bg-white border border-gray-300 rounded-md shadow-lg mt-2 p-8 z-10"
934
+ });
935
+ const datePickerDialog = tv({
936
+ base: "flex flex-col gap-4"
937
+ });
938
+ const datePickerDateFieldContainer = tv({
939
+ base: "flex gap-2 items-center justify-between",
940
+ defaultVariants: {
941
+ dateFieldShown: true
942
+ },
943
+ variants: {
944
+ dateFieldShown: {
945
+ true: "",
946
+ false: "hidden"
947
+ }
948
+ }
949
+ });
950
+ const datePickerDateField = tv({
951
+ base: "flex bg-gray-300 p-2 rounded-md"
952
+ });
953
+ const datePickerDateSegment = tv({
954
+ extend: focusable,
955
+ base: `rounded-sm p-1 focus:bg-color-1-400 focus:text-white`
956
+ });
957
+ const datePickerInvalidIndicator = tv({
958
+ base: "rounded-lg p-2 border-2 border-red-500",
959
+ variants: {
960
+ position: {
961
+ inner: "text-red-500 bg-white",
962
+ outer: "text-black bg-red-100"
963
+ }
964
+ }
965
+ });
966
+ const datePickerTheme = {
967
+ container: datePickerContainer,
968
+ wrapper: datePickerWrapper,
969
+ button: datePickerButton,
970
+ icon: datePickerIcon,
971
+ dateField: datePickerDateField,
972
+ dateSegment: datePickerDateSegment,
973
+ label: datePickerLabel,
974
+ calendarPopover: datePickerCalendarPopoverContainer,
975
+ calendarUnderlay: datePickerCalendarPopoverUnderlay,
976
+ dialog: datePickerDialog,
977
+ dateFieldContainer: datePickerDateFieldContainer,
978
+ invalidIndicator: datePickerInvalidIndicator
979
+ };
980
+ const imgStyles = tv({
981
+ base: "object-contain"
982
+ });
983
+ const imgTheme = (props) => imgStyles(props);
984
+ const lightBoxWrapper = tv({
985
+ base: "focus-ring-black"
986
+ });
987
+ const lightBoxContainer = tv({
988
+ base: `rounded-3xl overflow-hidden`
989
+ });
990
+ const lightBoxCloseBtn = tv({
991
+ base: `
992
+ absolute
993
+ xl:top-10
994
+ xl:right-20
995
+ lg:top-8
996
+ lg:right-8
997
+ z-[10000]
998
+ top-4
999
+ right-4
1000
+ size-10
1001
+ focus-ring-black
1002
+ `
1003
+ });
1004
+ const lightBoxLabel = tv({
1005
+ extend: typography,
1006
+ base: "sr-only"
1007
+ });
1008
+ const lightBoxModalUnderlay = tv({
1009
+ base: "w-screen h-screen bg-black/50 absolute top-0 left-0 flex justify-center items-center"
1010
+ });
1011
+ const lightBoxModalOverlay = tv({
1012
+ base: ""
1013
+ });
1014
+ const lightBoxModalDialog = tv({
1015
+ base: "flex flex-col gap-4 items-center"
1016
+ });
1017
+ const lightboxTheme = {
1018
+ wrapper: lightBoxWrapper,
1019
+ container: lightBoxContainer,
1020
+ label: lightBoxLabel,
1021
+ closeBtn: lightBoxCloseBtn,
1022
+ modal: {
1023
+ underlay: lightBoxModalUnderlay,
1024
+ overlay: lightBoxModalOverlay,
1025
+ dialog: lightBoxModalDialog
1026
+ }
1027
+ };
1028
+ const popoverPopover = tv({
1029
+ base: "border-2 text-black p-4 bg-gray-300"
1030
+ });
1031
+ const popoverUnderlay = tv({});
1032
+ const popoverArrow = tv({});
1033
+ const popoverButton = tv({
1034
+ extend: button
1035
+ });
1036
+ const popoverTheme = {
1037
+ popover: popoverPopover,
1038
+ underlay: popoverUnderlay,
1039
+ arrow: popoverArrow,
1040
+ button: popoverButton
1041
+ };
1042
+ const printButton = tv({
1043
+ 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"
1044
+ });
1045
+ const printButtonIcon = tv({
1046
+ base: "text-white"
1047
+ });
1048
+ const radioLabel = tv({
1049
+ base: `text-black flex flex-row items-center hover:cursor-pointer focus-ring-black`,
1050
+ variants: {
1051
+ isDisabled: {
1052
+ true: "text-gray-6"
1053
+ }
1054
+ }
1055
+ });
1056
+ const radio = tv({
1057
+ 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`,
1058
+ variants: {
1059
+ isDisabled: {
1060
+ true: "border-gray-6"
1061
+ },
1062
+ isFocused: {
1063
+ true: `outline-black [outline-offset: 2px]`
1064
+ }
1065
+ }
1066
+ });
1067
+ const selectedMark = tv({
1068
+ base: `hidden w-4 h-4 bg-gray-300 rounded-full`,
1069
+ variants: {
1070
+ selected: {
1071
+ true: "block text-white"
1072
+ }
1073
+ }
1074
+ });
1075
+ const radioGroup = tv({
1076
+ base: `block`,
1077
+ variants: {
1078
+ isDisabled: {
1079
+ true: "opacity-60 pointer-events-none"
1080
+ }
1081
+ }
1082
+ });
1083
+ const radioGroupItemsGroup = tv({
1084
+ base: `flex flex-col gap-4 py-8`
1085
+ });
1086
+ const searchInput = tv({
1087
+ base: "p-4 w-full outline-0 search-cancel:appearance-none",
1088
+ variants: {
1089
+ isDisabled: {
1090
+ true: "opacity-60 pointer-events-none"
1091
+ }
1092
+ }
1093
+ });
1094
+ const searchIcon = tv({
1095
+ base: `
1096
+ box-border
1097
+ absolute
1098
+ right-4
1099
+ focus-ring-black
1100
+ outline-0
1101
+ `
1102
+ });
1103
+ const shareButtonContainer = tv({
1104
+ base: "flex print:hidden relative",
1105
+ defaultVariants: {
1106
+ listDirection: "row"
1107
+ },
1108
+ variants: {
1109
+ listDirection: {
1110
+ row: "flex-row",
1111
+ column: "flex-col"
1112
+ }
1113
+ }
1114
+ });
1115
+ const shareButton = tv({
1116
+ 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",
1117
+ variants: {
1118
+ isOpen: {
1119
+ true: "",
1120
+ false: ""
1121
+ }
1122
+ }
1123
+ });
1124
+ const shareButtonLinksList = tv({
1125
+ 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",
1126
+ defaultVariants: {
1127
+ listDirection: "row"
1128
+ },
1129
+ variants: {
1130
+ listDirection: {
1131
+ row: "flex-row pl-14 h-16 left-0",
1132
+ column: "flex-col [width:calc(100% + .5rem)] pt-14 w-16 top-0"
1133
+ },
1134
+ isOpen: {
1135
+ true: "opacity-100 visible",
1136
+ false: ""
1137
+ }
1138
+ }
1139
+ });
1140
+ const shareButtonLink = tv({
1141
+ base: `
1142
+ flex
1143
+ items-center
1144
+ justify-center
1145
+ cursor-pointer
1146
+ bg-color-1-200
1147
+ hover:bg-color-1-300
1148
+ w-full
1149
+ text-color-1-500
1150
+ rounded-none
1151
+ p-2
1152
+ focus-ring-black
1153
+ z-10
1154
+ has-focus-ring:z-20
1155
+ `,
1156
+ defaultVariants: {
1157
+ listDirection: "row"
1158
+ },
1159
+ variants: {
1160
+ listDirection: {
1161
+ row: "last:rounded-r-full h-full",
1162
+ column: "last:rounded-b-full"
1163
+ }
1164
+ }
1165
+ });
1166
+ const shareButtonIcon = tv({
1167
+ base: "text-white"
1168
+ });
1169
+ const shareButtonLinkIcons = tv({
1170
+ base: ""
1171
+ });
1172
+ const sidePanelWrapper = tv({
1173
+ base: "m-auto fixed right-0 top-0 bottom-0 w-full max-w-[512px] [&>div]:h-full"
1174
+ });
1175
+ const sidePanelContainer = tv({ base: "h-full w-full flex justify-end" });
1176
+ const sidePanelInnerContainer = tv({ base: "bg-gray-300 h-full w-full overflow-y-auto" });
1177
+ const skipToMain = tv({
1178
+ extend: button,
1179
+ base: `
1180
+ left-1/2
1181
+ absolute
1182
+ -translate-x-1/2
1183
+ -translate-y-[300px]
1184
+ transition-transform
1185
+ focus:-translate-x-1/2
1186
+ focus:translate-y-[75px]
1187
+ `
1188
+ });
1189
+ const tabListWrapper = tv({
1190
+ base: `
1191
+ flex
1192
+ flex-col
1193
+ gap-4
1194
+ `
1195
+ });
1196
+ const tabListContainer = tv({
1197
+ base: `
1198
+ flex
1199
+ gap-4
1200
+ `,
1201
+ variants: {
1202
+ orientation: {
1203
+ horizontal: "flex-col",
1204
+ vertical: "flex-row"
1205
+ }
1206
+ }
1207
+ });
1208
+ const tabListList = tv({
1209
+ base: `
1210
+ flex
1211
+ flex-wrap
1212
+ gap-4
1213
+ `,
1214
+ variants: {
1215
+ orientation: {
1216
+ horizontal: "flex-row items-center",
1217
+ vertical: "flex-col items-end"
1218
+ }
1219
+ },
1220
+ defaultVariants: {
1221
+ orientation: "horizontal"
1222
+ }
1223
+ });
1224
+ const tabListLabel = tv({
1225
+ extend: typography,
1226
+ defaultVariants: {
1227
+ size: "h3"
1228
+ }
1229
+ });
1230
+ const tabListTabPanelTransition = tv({
1231
+ base: `
1232
+ focus-ring-black
1233
+ transition-all
1234
+ duration-200
1235
+ `
1236
+ });
1237
+ const tabListTabPanelContainer = tv({
1238
+ base: `
1239
+ mt-4
1240
+ p-4
1241
+ bg-color-1-100
1242
+ rounded-md
1243
+ focus-ring-black
1244
+ transition-all
1245
+ duration-200
1246
+ `
1247
+ });
1248
+ const tabListTab = tv({
1249
+ extend: typography,
1250
+ base: `
1251
+ focus-ring-black
1252
+ transition-all
1253
+ duration-200
1254
+ px-4
1255
+ py-2
1256
+ `,
1257
+ variants: {
1258
+ orientation: {
1259
+ horizontal: "border-b border-b-4",
1260
+ vertical: "border-r border-r-4"
1261
+ },
1262
+ isSelected: {
1263
+ true: `
1264
+ border-color-1-500
1265
+ hover:border-color-1-900
1266
+ active:border-color-1-900
1267
+ `,
1268
+ false: `
1269
+ border-color-1-200
1270
+ hover:border-color-1-400
1271
+ active:border-color-1-400
1272
+ `
1273
+ },
1274
+ isDisabled: {
1275
+ true: `
1276
+ opacity-30
1277
+ pointer-events-none
1278
+ `
1279
+ },
1280
+ isFocusVisible: {
1281
+ true: `has-focus-ring`
1282
+ }
1283
+ },
1284
+ defaultVariants: {
1285
+ size: "h6"
1286
+ }
1287
+ });
1288
+ const tabListTheme = {
1289
+ wrapper: tabListWrapper,
1290
+ container: tabListContainer,
1291
+ list: tabListList,
1292
+ label: tabListLabel,
1293
+ panel: {
1294
+ transition: tabListTabPanelTransition,
1295
+ container: tabListTabPanelContainer
1296
+ },
1297
+ tab: tabListTab
1298
+ };
1299
+ const tagGroupWrapper = tv({
1300
+ base: `
1301
+ flex
1302
+ flex-col
1303
+ gap-4
1304
+ `
1305
+ });
1306
+ const tagGroupTags = tv({
1307
+ base: `
1308
+ w-full
1309
+ flex
1310
+ flex-wrap
1311
+ gap-2
1312
+ `
1313
+ });
1314
+ const tagGroupLabel = tv({
1315
+ extend: typography,
1316
+ defaultVariants: {
1317
+ size: "h4"
1318
+ }
1319
+ });
1320
+ const tagGroupDescription = tv({
1321
+ extend: typography,
1322
+ defaultVariants: {
1323
+ size: "paragraph"
1324
+ }
1325
+ });
1326
+ const tagGroupErrorMessage = tv({
1327
+ extend: typography,
1328
+ defaultVariants: {
1329
+ size: "paragraph",
1330
+ isError: true
1331
+ }
1332
+ });
1333
+ const tagGroupTagWrapper = tv({
1334
+ base: `
1335
+ focus-visible:outline
1336
+ focus-visible:outline-offset-2
1337
+ focus-visible:outline-2
1338
+ focus-visible:outline-black
1339
+ cursor-pointer
1340
+ transition-all
1341
+ duration-200
1342
+ `,
1343
+ variants: {
1344
+ isSelected: {
1345
+ true: `bg-color-1-800 text-white`
1346
+ },
1347
+ isDisabled: {
1348
+ true: `opacity-50 pointer-events-none`
1349
+ },
1350
+ isLink: {
1351
+ true: `
1352
+ border-b
1353
+ border-color-1-300
1354
+ px-2
1355
+ py-0.5
1356
+ mx-2
1357
+ text-color-1-500
1358
+ hover:text-color-1-700
1359
+ hover:border-color-1-700
1360
+ active:text-color-1-900
1361
+ active:border-color-1-900
1362
+ `,
1363
+ false: `
1364
+ p-2
1365
+ bg-color-1-200
1366
+ rounded-full
1367
+ hover:bg-color-1-300
1368
+ active:bg-color-1-400
1369
+ active:text-white
1370
+ `
1371
+ }
1372
+ },
1373
+ defaultVariants: {
1374
+ isLink: false
1375
+ }
1376
+ });
1377
+ const tagGroupTagContainer = tv({
1378
+ base: `
1379
+ flex
1380
+ items-center
1381
+ gap-2
1382
+ `
1383
+ });
1384
+ const tagGroupTagRemoveButton = tv({
1385
+ base: `
1386
+ aspect-square
1387
+ rounded-full
1388
+ bg-black/30
1389
+ p-1
1390
+ h-auto
1391
+ w-8
1392
+ `
1393
+ });
1394
+ const tagGroupTheme = {
1395
+ wrapper: tagGroupWrapper,
1396
+ tags: tagGroupTags,
1397
+ label: tagGroupLabel,
1398
+ description: tagGroupDescription,
1399
+ errorMessage: tagGroupErrorMessage,
1400
+ tag: {
1401
+ wrapper: tagGroupTagWrapper,
1402
+ container: tagGroupTagContainer,
1403
+ removeButton: tagGroupTagRemoveButton
1404
+ }
1405
+ };
1406
+ const textArea = tv({
1407
+ base: `
1408
+ w-full
1409
+ min-h-32
1410
+ rounded-2xl
1411
+ px-6
1412
+ h-12
1413
+ border-2
1414
+ border-solid
1415
+ transition
1416
+ duration-300
1417
+ ease-in-out
1418
+ text-gray-2
1419
+ placeholder:text-gray-2
1420
+ focus-ring-black
1421
+
1422
+ `,
1423
+ variants: {
1424
+ isError: {
1425
+ true: "border-red-500"
1426
+ }
1427
+ }
1428
+ });
1429
+ const textInputWrapper = tv({
1430
+ base: `
1431
+ relative
1432
+ group
1433
+ flex
1434
+ items-center
1435
+ gap-4
1436
+ rounded-md
1437
+ px-4
1438
+ py-1
1439
+ mb-3
1440
+ m-0.5
1441
+ border-2
1442
+ aria-disabled:pointer-events-none
1443
+ aria-disabled:opacity-30
1444
+ focus-ring-black
1445
+ `,
1446
+ variants: {
1447
+ isError: {
1448
+ true: `border-error`
1449
+ }
1450
+ }
1451
+ });
1452
+ const textInputInputWrapper = tv({
1453
+ base: `flex flex-col order-2`
1454
+ });
1455
+ const textInputContainer = tv({
1456
+ base: `flex items-center gap-2`
1457
+ });
1458
+ const textInputLabel = tv({
1459
+ base: `
1460
+ group-has-[:required]:after:content-["_*"]
1461
+ group-has-[:required]:after:text-red-500
1462
+ text-xs
1463
+ `
1464
+ });
1465
+ const textInputInput = tv({
1466
+ base: ``
1467
+ });
1468
+ const textInputErrorMessage = tv({
1469
+ extend: typography,
1470
+ base: `ml-0`,
1471
+ variants: {
1472
+ isError: {
1473
+ false: `hidden`
1474
+ }
1475
+ },
1476
+ defaultVariants: {
1477
+ isError: false,
1478
+ size: "footnotes"
1479
+ }
1480
+ });
1481
+ const textInputIcon = tv({
1482
+ base: [typography(), `order-1`],
1483
+ variants: {
1484
+ isDisabled: {
1485
+ true: `text-gray-300`
1486
+ },
1487
+ isError: {
1488
+ true: `hidden`
1489
+ }
1490
+ }
1491
+ });
1492
+ const textInputErrorIcon = tv({
1493
+ base: [typography({ isError: true }), `order-3`],
1494
+ variants: {
1495
+ isError: {
1496
+ false: `hidden`
1497
+ }
1498
+ }
1499
+ });
1500
+ const textInputTheme = {
1501
+ wrapper: textInputWrapper,
1502
+ container: textInputContainer,
1503
+ inputWrapper: textInputInputWrapper,
1504
+ label: textInputLabel,
1505
+ input: textInputInput,
1506
+ errorMessage: textInputErrorMessage,
1507
+ icon: textInputIcon,
1508
+ errorIcon: textInputErrorIcon
1509
+ };
1510
+ const BaseTheme = makeTheme({
1511
+ main: (props) => main(props),
1512
+ gridItem: (props) => gridItem(props),
1513
+ grid: (props) => grid(props),
1514
+ container: (props) => container(props),
1515
+ accordion: accordionTheme,
1516
+ carousel: carouselTheme,
1517
+ calendar: calendarTheme,
1518
+ datePicker: datePickerTheme,
1519
+ popover: popoverTheme,
1520
+ typography: (props) => typography(props),
1521
+ button: (props) => button(props),
1522
+ link: button,
1523
+ sidePanel: {
1524
+ wrapper: (props) => sidePanelWrapper(props),
1525
+ container: (props) => sidePanelContainer(props),
1526
+ innerContainer: (props) => sidePanelInnerContainer(props)
1527
+ },
1528
+ comboBox: comboBoxTheme,
1529
+ lightBox: lightboxTheme,
1530
+ printButton: {
1531
+ icon: (props) => printButtonIcon(props),
1532
+ button: (props) => printButton(props)
1533
+ },
1534
+ shareButton: {
1535
+ icon: (props) => shareButtonIcon(props),
1536
+ button: (props) => shareButton(props),
1537
+ container: (props) => shareButtonContainer(props),
1538
+ linksList: (props) => shareButtonLinksList(props),
1539
+ link: (props) => shareButtonLink(props),
1540
+ linkIcons: (props) => shareButtonLinkIcons(props)
1541
+ },
1542
+ skipToMain: (props) => skipToMain(props),
1543
+ checkbox: {
1544
+ container: (props) => checkboxContainer(props),
1545
+ label: (props) => checkboxLabel(props),
1546
+ checkBox: (props) => checkBox(props),
1547
+ checkMark: (props) => checkMark(props),
1548
+ checkMarkIcon: (props) => checkMarkIcon(props),
1549
+ errorMessage: (props) => typography(props)
1550
+ },
1551
+ radio: {
1552
+ label: (props) => radioLabel(props),
1553
+ radio: (props) => radio(props),
1554
+ selectedMark: (props) => selectedMark(props),
1555
+ errorMessage: (props) => typography(props)
1556
+ },
1557
+ radioGroup: {
1558
+ radioGroup: (props) => radioGroup(props),
1559
+ radioGroupItemsGroup: (props) => radioGroupItemsGroup(props),
1560
+ errorMessage: (props) => typography(props)
1561
+ },
1562
+ checkboxGroup: {
1563
+ checkboxGroup: (props) => checkboxGroup(props),
1564
+ checkboxGroupItemsGroup: (props) => checkboxGroupItemsGroup(props),
1565
+ errormessage: (props) => typography(props)
1566
+ },
1567
+ select: {
1568
+ button: (props) => button(props),
1569
+ ul: (props) => typography({
1570
+ ...props,
1571
+ className: "outline outline-2 outline-white outline-offset-2 p-2 my-4 rounded-md w-full flex flex-col gap-6"
1572
+ }),
1573
+ popover: (props) => button({ ...props, className: "w-[var(--select-container-width)]" }),
1574
+ errorMessage: (props) => typography({ ...props, size: "footnotes", isError: true }),
1575
+ wrapper: () => "flex flex-col gap-4 relative",
1576
+ container: () => "flex flex-col gap-4",
1577
+ list: () => "flex flex-col gap-4",
1578
+ li: () => "transition w-full hover:text-gray-300 focus-ring-white",
1579
+ headerText: () => "text-gray-300",
1580
+ section: () => "flex flex-col gap-4"
1581
+ },
1582
+ textarea: {
1583
+ wrapper: () => "flex flex-col",
1584
+ container: () => "flex items-center gap-4",
1585
+ label: () => "text-gray-3 px-6",
1586
+ input: (props) => textArea(props),
1587
+ errorMessage: (props) => typography({ ...props, size: "footnotes", isError: true })
1588
+ },
1589
+ textInput: textInputTheme,
1590
+ search: {
1591
+ wrapper: () => "min-w-fit sm:w-80 flex flex-col gap-2",
1592
+ container: () => "relative flex items-center outline outline-2 outline-gray-300 focus-within:outline focus-within:outline-black focus-within:outline-2",
1593
+ label: () => "text-gray-3",
1594
+ input: (props) => searchInput(props),
1595
+ icon: (props) => searchIcon(props),
1596
+ errorMessage: (props) => typography({ ...props, size: "footnotes", isError: true })
1597
+ },
1598
+ menu: {
1599
+ sidePanel: {
1600
+ wrapper: () => ``,
1601
+ container: () => "",
1602
+ innerContainer: () => ""
1603
+ },
1604
+ wrapper: () => ""
1605
+ },
1606
+ menuItem: {
1607
+ wrapper: () => ``,
1608
+ container: () => ``,
1609
+ innerContent: () => ``,
1610
+ button: () => ``,
1611
+ anchor: () => ``
1612
+ },
1613
+ img: imgTheme,
1614
+ alerts: alertsTheme,
1615
+ tagGroup: tagGroupTheme,
1616
+ tabList: tabListTheme,
1617
+ listBox: listBoxTheme
1618
+ });
1619
+ React.memo(createThemeProvider(BaseTheme));
1620
+ const useThemeContext = (func, props = {}, customTheme = null) => {
1621
+ const theme = useTheme();
1622
+ if (theme != null && func != null) {
1623
+ const { brandTheme } = theme;
1624
+ const themeFunc = get(brandTheme, func);
1625
+ if (typeof themeFunc === "function") {
1626
+ const returnValue = themeFunc == null ? void 0 : themeFunc(props);
1627
+ if (typeof returnValue === "string") {
1628
+ return returnValue;
1629
+ }
1630
+ }
1631
+ }
1632
+ if (!customTheme) {
1633
+ return void 0;
1634
+ }
1635
+ return customTheme;
1636
+ };
1637
+ const Typography = ({
1638
+ as: Component = "span",
1639
+ themeName = "typography",
1640
+ tokens,
1641
+ customTheme,
1642
+ children,
1643
+ ...rest
1644
+ }) => {
1645
+ const theme = useThemeContext(themeName, tokens, customTheme);
1646
+ return /* @__PURE__ */ jsx(Component, { ...rest, className: theme, children });
1647
+ };
1648
+ React.forwardRef((props, ref) => {
1649
+ const { as: Component = "span", tokens, themeName = "typography", customTheme, children, ...rest } = props;
1650
+ const theme = useThemeContext(themeName, tokens, customTheme);
1651
+ return /* @__PURE__ */ jsx(Component, { ...rest, ref, className: theme, children });
1652
+ });
1653
+ const [useAccordionCtx, AccordionProvider] = createCtxNullable$1();
1654
+ const Box = ({
1655
+ as: Component = "div",
1656
+ themeName = "box",
1657
+ tokens,
1658
+ customTheme,
1659
+ children,
1660
+ className,
1661
+ ...rest
1662
+ }) => {
1663
+ const theme = useThemeContext(themeName, tokens, customTheme);
1664
+ return /* @__PURE__ */ jsx(Component, { ...rest, className: theme, children });
1665
+ };
1666
+ const BoxWithForwardRef = React.forwardRef((props, ref) => {
1667
+ const { as: Component = "div", tokens, themeName = "box", customTheme, children, ...rest } = props;
1668
+ const theme = useThemeContext(themeName, tokens, customTheme);
1669
+ return /* @__PURE__ */ jsx(Component, { ...rest, ref, className: theme, children });
1670
+ });
1671
+ const Anchor = React.forwardRef((props, forwardRef2) => {
1672
+ var _a;
1673
+ const {
1674
+ as: Component = "a",
1675
+ handlePress,
1676
+ children,
1677
+ as,
1678
+ customTheme,
1679
+ tokens,
1680
+ themeName = "button",
1681
+ nextLinkProps: { onClick, ...nextLinkProps } = {},
1682
+ ...rest
1683
+ } = props;
1684
+ const { onPress, onFocusChange, excludeFromTabOrder, preventFocusOnPress, ...anchorProps } = rest;
1685
+ const ref = forwardRef2;
1686
+ const { linkProps } = useLink(
1687
+ {
1688
+ ...props,
1689
+ ...nextLinkProps,
1690
+ onClick: ({ currentTarget, ...e }) => {
1691
+ onClick == null ? void 0 : onClick({
1692
+ ...e,
1693
+ // @ts-expect-error Mismatch between react-aria and next/link. Happens since react-aria >3.36
1694
+ currentTarget
1695
+ });
1696
+ },
1697
+ href: props.href ?? ((_a = nextLinkProps == null ? void 0 : nextLinkProps.href) == null ? void 0 : _a.toString()),
1698
+ elementType: as == null ? void 0 : as.toString(),
1699
+ onPress: handlePress
1700
+ },
1701
+ forwardRef2 ?? ref
1702
+ );
1703
+ const theme = useThemeContext(themeName, tokens, customTheme);
1704
+ return /* @__PURE__ */ jsx(FocusRing, { focusRingClass: "has-focus-ring", children: /* @__PURE__ */ jsx(Component, { ref, ...linkProps, ...nextLinkProps, ...anchorProps, className: theme, children }) });
1705
+ });
1706
+ const Button = React.forwardRef((props, forwardRef2) => {
1707
+ const {
1708
+ as: Component = "button",
1709
+ handlePress,
1710
+ children,
1711
+ as,
1712
+ customTheme,
1713
+ tokens,
1714
+ themeName = "button",
1715
+ isDisabled = false,
1716
+ ...rest
1717
+ } = props;
1718
+ const ref = forwardRef2;
1719
+ const { buttonProps } = useButton(
1720
+ { ...props, isDisabled, elementType: as, onPress: handlePress },
1721
+ forwardRef2 ?? ref
1722
+ );
1723
+ const theme = useThemeContext(themeName, tokens, customTheme);
1724
+ const { onPress, onFocusChange, excludeFromTabOrder, preventFocusOnPress, ...allProps } = rest;
1725
+ return /* @__PURE__ */ jsx(FocusRing, { within: true, focusRingClass: "has-focus-ring", children: /* @__PURE__ */ jsx(Component, { ref, ...buttonProps, ...allProps, className: theme, children }) });
1726
+ });
1727
+ const ButtonWithForwardRef = React.forwardRef(
1728
+ (props, ref) => {
1729
+ const { as } = props;
1730
+ if (as === "a") return /* @__PURE__ */ jsx(Anchor, { ref, ...props });
1731
+ return /* @__PURE__ */ jsx(Button, { ref, ...props });
1732
+ }
1733
+ );
1734
+ const ButtonComponent = (props) => {
1735
+ const { as } = props;
1736
+ const ref = useRef(null);
1737
+ if (as === "a") return /* @__PURE__ */ jsx(Anchor, { ref, ...props });
1738
+ return /* @__PURE__ */ jsx(Button, { ref, ...props });
1739
+ };
1740
+ ButtonComponent.displayName = "Button";
1741
+ const __variableDynamicImportRuntimeHelper = (glob, path, segs) => {
1742
+ const v = glob[path];
1743
+ if (v) {
1744
+ return typeof v === "function" ? v() : Promise.resolve(v);
1745
+ }
1746
+ return new Promise((_, reject) => {
1747
+ (typeof queueMicrotask === "function" ? queueMicrotask : setTimeout)(
1748
+ reject.bind(
1749
+ null,
1750
+ new Error(
1751
+ "Unknown variable dynamic import: " + path + (path.split("/").length !== segs ? ". Note that variables only represent file names one level deep." : "")
1752
+ )
1753
+ )
1754
+ );
1755
+ });
1756
+ };
1757
+ const SvgComponent$q = (props) => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: 48, width: 48, fill: "currentColor", ...props });
1758
+ const Fallback = memo(SvgComponent$q);
1759
+ const IconFallback = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
1760
+ __proto__: null,
1761
+ default: Fallback
1762
+ }, Symbol.toStringTag, { value: "Module" }));
1763
+ const Icon = (props) => {
1764
+ const { icon, ...rest } = props;
1765
+ const ImportedIcon = useMemo(() => 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": () => import("./ErrorIcon-DM65zoku.mjs"), "../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]);
1766
+ return /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx(Fallback, { className: "overflow-visible pointer-events-none" }), children: /* @__PURE__ */ jsx(ImportedIcon, { ...rest, className: "overflow-visible pointer-events-none", ...props }) });
1767
+ };
1768
+ const IconDispatcher = (props) => {
1769
+ const { icon, as: Component = "span", tokens, customTheme, themeName = "icon", children, ...rest } = props;
1770
+ const theme = useThemeContext(themeName, tokens, customTheme);
1771
+ if (typeof icon !== "string") {
1772
+ return /* @__PURE__ */ jsxs(Component, { ...rest, className: theme, children: [
1773
+ children,
1774
+ icon
1775
+ ] });
1776
+ }
1777
+ return /* @__PURE__ */ jsxs(Component, { className: theme, children: [
1778
+ children,
1779
+ /* @__PURE__ */ jsx(Icon, { icon, ...rest })
1780
+ ] });
1781
+ };
1782
+ const [useSidePanel, SidePanelProvider] = createCtx();
1783
+ const [useCarousel, CarouselProvider] = createCtxNullable$1();
1784
+ const LegacyCarouselNavigationButton = forwardRef(
1785
+ (props, ref) => {
1786
+ const { themeName, tokens, customTheme, children, onSubmit, ...rest } = props;
1787
+ const { isDisabled } = rest;
1788
+ const { pressProps } = usePress({
1789
+ onPress: () => onSubmit == null ? void 0 : onSubmit()
1790
+ });
1791
+ return /* @__PURE__ */ jsx(FocusRing, { within: true, focusRingClass: "has-focus-ring", children: /* @__PURE__ */ jsx(
1792
+ ButtonWithForwardRef,
1793
+ {
1794
+ themeName,
1795
+ tokens,
1796
+ ref,
1797
+ ...pressProps,
1798
+ ...rest,
1799
+ ...{ "aria-disabled": isDisabled },
1800
+ children
1801
+ }
1802
+ ) });
1803
+ }
1804
+ );
1805
+ const LegacyCarouselNextNavigationButton = forwardRef(
1806
+ (props, ref) => {
1807
+ const { children, ...rest } = props;
1808
+ const { controller } = useCarousel();
1809
+ const { params, activeIndex = 1, slides } = controller ?? {};
1810
+ const { slidesPerView = 1, loop } = params ?? {};
1811
+ const slidesGroupIndex = Math.round(
1812
+ typeof slidesPerView === "number" ? (activeIndex + 1) / slidesPerView : activeIndex
1813
+ );
1814
+ const slidesGroupLength = Math.round(
1815
+ slides && typeof slidesPerView === "number" ? slides.length / slidesPerView : (slides == null ? void 0 : slides.length) ?? 1
1816
+ );
1817
+ const allowNavigateNext = slidesGroupIndex < slidesGroupLength;
1818
+ const disabled = !loop && !allowNavigateNext;
1819
+ return /* @__PURE__ */ jsx(
1820
+ LegacyCarouselNavigationButton,
1821
+ {
1822
+ onSubmit: () => controller == null ? void 0 : controller.slideNext(),
1823
+ ...rest,
1824
+ ref,
1825
+ isDisabled: disabled,
1826
+ children: children || /* @__PURE__ */ jsx(IconDispatcher, { icon: "ArrowRight" })
1827
+ }
1828
+ );
1829
+ }
1830
+ );
1831
+ const LegacyCarouselPrevNavigationButton = forwardRef(
1832
+ (props, ref) => {
1833
+ const { children, ...rest } = props;
1834
+ const { controller } = useCarousel();
1835
+ const { params, activeIndex = 1 } = controller ?? {};
1836
+ const { loop } = params ?? {};
1837
+ const allowNavigatePrev = activeIndex !== 0;
1838
+ const disabled = !loop && !allowNavigatePrev;
1839
+ return /* @__PURE__ */ jsx(
1840
+ LegacyCarouselNavigationButton,
1841
+ {
1842
+ onSubmit: () => controller == null ? void 0 : controller.slidePrev(),
1843
+ ...rest,
1844
+ ref,
1845
+ isDisabled: disabled,
1846
+ children: children || /* @__PURE__ */ jsx(IconDispatcher, { icon: "ArrowLeft" })
1847
+ }
1848
+ );
1849
+ }
1850
+ );
1851
+ LegacyCarouselNavigationButton.displayName = "LegacyCarouselNavigationButton";
1852
+ LegacyCarouselNextNavigationButton.displayName = "LegacyCarouselNextNavigationButton";
1853
+ LegacyCarouselPrevNavigationButton.displayName = "LegacyCarouselPrevNavigationButton";
1854
+ const logger = createLogger("[StackUI]");
1855
+ const { log } = logger;
1856
+ const [useTranslation, TranslationProvider] = createCtx();
1857
+ const [useUserQueryValHook, SearchProvider] = createCtx();
1858
+ const SvgComponent$p = (props) => /* @__PURE__ */ jsx("svg", { width: 24, height: 24, fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ jsx("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M18 6 6 18M6 6l12 12" }) });
1859
+ const CloseBtn = memo(SvgComponent$p, isEqual);
1860
+ const CloseBtn$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
1861
+ __proto__: null,
1862
+ default: CloseBtn
1863
+ }, Symbol.toStringTag, { value: "Module" }));
1864
+ const SvgComponent$o = (props) => /* @__PURE__ */ jsxs("svg", { width: 20, height: 20, xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 20 20", ...props, children: [
1865
+ /* @__PURE__ */ jsxs("g", { stroke: "currentColor", clipPath: "url(#a)", children: [
1866
+ /* @__PURE__ */ jsx("circle", { cx: "8.2727", cy: "8.2727", r: "7.2727" }),
1867
+ /* @__PURE__ */ jsx("path", { d: "M13.4551 13.4531L19.5005 19.4986" })
1868
+ ] }),
1869
+ /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { children: /* @__PURE__ */ jsx("path", { fill: "currentColor", d: "M0 0h14v14H0z" }) }) })
1870
+ ] });
1871
+ const Search = memo(SvgComponent$o, isEqual);
1872
+ const Search$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
1873
+ __proto__: null,
1874
+ default: Search
1875
+ }, Symbol.toStringTag, { value: "Module" }));
1876
+ createContext(null);
1877
+ const Wrapper = forwardRef((props, ref) => {
1878
+ const {
1879
+ themeName = "datePicker",
1880
+ tokens,
1881
+ groupProps,
1882
+ buttonProps,
1883
+ buttonLabel,
1884
+ buttonContent,
1885
+ icon,
1886
+ children
1887
+ } = props;
1888
+ return /* @__PURE__ */ jsxs(BoxWithForwardRef, { themeName: `${themeName}.wrapper`, tokens, ...groupProps, ref, children: [
1889
+ buttonLabel && /* @__PURE__ */ jsx(Typography, { themeName: `${themeName}.buttonLabel`, tokens, children: buttonLabel }),
1890
+ /* @__PURE__ */ jsx(Box, { themeName: `${themeName}.dateFieldContainer`, tokens, children }),
1891
+ /* @__PURE__ */ jsxs(
1892
+ ButtonComponent,
1893
+ {
1894
+ themeName: `${themeName}.button`,
1895
+ tokens,
1896
+ type: "button",
1897
+ ...buttonProps,
1898
+ handlePress: buttonProps.onPress,
1899
+ children: [
1900
+ buttonContent && /* @__PURE__ */ jsx(Typography, { themeName: `${themeName}.buttonContent`, tokens, children: buttonContent }),
1901
+ /* @__PURE__ */ jsx(IconDispatcher, { themeName: `${themeName}.icon`, tokens, icon: icon ?? "ArrowDown" })
1902
+ ]
1903
+ }
1904
+ )
1905
+ ] });
1906
+ });
1907
+ Wrapper.displayName = "Wrapper";
1908
+ createContext(null);
1909
+ const [useMenu, MenuProvider] = createCtxNullable$1();
1910
+ const AlertsCloseButton = forwardRef((props, ref) => {
1911
+ const { themeName = "alerts.closeBtn", ...rest } = props;
1912
+ return /* @__PURE__ */ jsx(ButtonWithForwardRef, { ref, themeName, ...rest, children: /* @__PURE__ */ jsx(IconDispatcher, { icon: /* @__PURE__ */ jsx(CloseBtn, {}) }) });
1913
+ });
1914
+ AlertsCloseButton.displayName = "AlertsCloseButton";
1915
+ function mergeDefaultComponentProps(firstArg, ...args) {
1916
+ const allArgs = [firstArg, ...args];
1917
+ const mergedTokens = allArgs.reduce(
1918
+ (acc, curr) => curr && "tokens" in curr ? Object.assign(acc, curr == null ? void 0 : curr.tokens) : acc,
1919
+ {}
1920
+ );
1921
+ const mergedCustomThemes = allArgs.map((arg) => arg && "customTheme" in arg ? arg == null ? void 0 : arg.customTheme : void 0).filter((theme) => !isEmpty(theme)).join(" ");
1922
+ const mergedArgs = mergeProps(...allArgs.filter((arg) => arg !== null));
1923
+ return { ...mergedArgs, tokens: mergedTokens, customTheme: mergedCustomThemes };
1924
+ }
1925
+ const Option = ({
1926
+ item,
1927
+ state,
1928
+ ...props
1929
+ }) => {
1930
+ const { key, rendered, type } = item;
1931
+ const {
1932
+ themeName = "option",
1933
+ tokens,
1934
+ as = "li",
1935
+ customTheme,
1936
+ linkElementType: LinkElement = Anchor,
1937
+ ...rest
1938
+ } = mergeDefaultComponentProps(props, item.props);
1939
+ const ref = useRef(null);
1940
+ const {
1941
+ optionProps,
1942
+ isFocused,
1943
+ isDisabled,
1944
+ isFocusVisible,
1945
+ isPressed,
1946
+ isSelected,
1947
+ allowsSelection,
1948
+ descriptionProps,
1949
+ labelProps,
1950
+ hasAction
1951
+ } = useOption({ key }, state, ref);
1952
+ const isLink = state.selectionManager.isLink(key);
1953
+ const isSelectable = state.selectionManager.canSelectItem(key);
1954
+ const optionTokens = {
1955
+ ...tokens,
1956
+ type,
1957
+ isFocused,
1958
+ isDisabled,
1959
+ isFocusVisible,
1960
+ isPressed,
1961
+ isSelected,
1962
+ allowsSelection,
1963
+ hasAction,
1964
+ isLink,
1965
+ isSelectable
1966
+ };
1967
+ const Component = isLink ? LinkElement : BoxWithForwardRef;
1968
+ const elementType = isLink ? "a" : as;
1969
+ const renderChildren = () => {
1970
+ if (Children.count(rendered) > 1) {
1971
+ const [label, description] = Children.toArray(rendered);
1972
+ const isLabelValid = isValidElement(label);
1973
+ const isDescriptionValid = isValidElement(description);
1974
+ if (!isLabelValid && !isDescriptionValid) {
1975
+ return rendered;
1976
+ }
1977
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
1978
+ isLabelValid && /* @__PURE__ */ jsx(Box, { themeName: `${themeName}.label`, tokens: optionTokens, children: cloneElement(label, labelProps) }),
1979
+ isDescriptionValid && /* @__PURE__ */ jsx(Box, { themeName: `${themeName}.description`, tokens: optionTokens, children: cloneElement(description, descriptionProps) })
1980
+ ] });
1981
+ }
1982
+ return rendered;
1983
+ };
1984
+ return /* @__PURE__ */ jsx(FocusRing, { focusRingClass: "has-focus-ring", children: /* @__PURE__ */ jsx(
1985
+ Component,
1986
+ {
1987
+ as: elementType,
1988
+ ...mergeProps(rest, optionProps),
1989
+ ref,
1990
+ themeName: `${themeName}.option`,
1991
+ tokens: optionTokens,
1992
+ customTheme,
1993
+ children: renderChildren()
1994
+ }
1995
+ ) });
1996
+ };
1997
+ const ListBoxSection = ({
1998
+ section,
1999
+ state,
2000
+ ...props
2001
+ }) => {
2002
+ var _a, _b;
2003
+ const { key, rendered, props: sectionProps, level, hasChildNodes, type } = section;
2004
+ const {
2005
+ themeName = "listBox.section",
2006
+ tokens,
2007
+ as = "li",
2008
+ customTheme,
2009
+ ...rest
2010
+ } = mergeDefaultComponentProps(props, sectionProps);
2011
+ const sectionTokens = {
2012
+ ...tokens,
2013
+ type,
2014
+ level: level.toString(),
2015
+ hasChildNodes
2016
+ };
2017
+ const { itemProps, headingProps, groupProps } = useListBoxSection(props);
2018
+ return /* @__PURE__ */ jsxs(
2019
+ Box,
2020
+ {
2021
+ as,
2022
+ themeName: `${themeName}.wrapper`,
2023
+ tokens: sectionTokens,
2024
+ ...mergeProps(filterDOMProps(rest), itemProps),
2025
+ customTheme,
2026
+ children: [
2027
+ rendered && /* @__PURE__ */ jsx(Typography, { themeName: `${themeName}.heading`, tokens, ...headingProps, children: rendered }),
2028
+ /* @__PURE__ */ 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__ */ jsx(Option, { item, state, tokens, themeName: `${themeName}.item` }, item.key)) })
2029
+ ]
2030
+ }
2031
+ );
2032
+ };
2033
+ const itemComponents = {
2034
+ item: Option,
2035
+ section: ListBoxSection
2036
+ };
2037
+ const ControlledListBox = forwardRef(
2038
+ (props, listBoxRef) => {
2039
+ const {
2040
+ themeName = "listBox",
2041
+ tokens,
2042
+ customTheme,
2043
+ label,
2044
+ escapeKeyBehavior = "clearSelection",
2045
+ linkElementType = Anchor,
2046
+ isDisabled = false,
2047
+ isRequired = false,
2048
+ isInvalid = false,
2049
+ isError = false,
2050
+ errorMessage,
2051
+ disabledKeys,
2052
+ fieldRef,
2053
+ ...rest
2054
+ } = props;
2055
+ const state = useListState(props);
2056
+ const keys = state.collection.getKeys();
2057
+ const mergeRefs = (newRef) => {
2058
+ if (newRef) {
2059
+ fieldRef == null ? void 0 : fieldRef(newRef);
2060
+ if (!listBoxRef) return;
2061
+ if (typeof listBoxRef === "function") {
2062
+ listBoxRef(newRef);
2063
+ } else {
2064
+ listBoxRef.current = newRef;
2065
+ }
2066
+ }
2067
+ };
2068
+ const { listBoxProps, labelProps } = useListBox(
2069
+ {
2070
+ ...rest,
2071
+ escapeKeyBehavior,
2072
+ label,
2073
+ disabledKeys: isDisabled ? keys : disabledKeys
2074
+ },
2075
+ state,
2076
+ mergeRefs
2077
+ );
2078
+ const listBoxTokens = {
2079
+ ...tokens,
2080
+ isDisabled,
2081
+ isRequired,
2082
+ isInvalid,
2083
+ isError
2084
+ };
2085
+ return /* @__PURE__ */ jsxs(Box, { themeName: `${themeName}.wrapper`, tokens: listBoxTokens, customTheme, children: [
2086
+ label && /* @__PURE__ */ jsx(Typography, { ...labelProps, themeName: `${themeName}.label`, tokens: listBoxTokens, children: label }),
2087
+ /* @__PURE__ */ jsx(
2088
+ BoxWithForwardRef,
2089
+ {
2090
+ ref: listBoxRef,
2091
+ as: "ul",
2092
+ ...listBoxProps,
2093
+ themeName: `${themeName}.list`,
2094
+ tokens: listBoxTokens,
2095
+ children: [...state.collection].map((item) => {
2096
+ const { key } = item;
2097
+ const type = item.type ?? "item";
2098
+ const Component = itemComponents[type];
2099
+ return /* @__PURE__ */ jsx(
2100
+ Component,
2101
+ {
2102
+ ...{ [type]: item },
2103
+ state,
2104
+ tokens: { ...tokens, type },
2105
+ themeName: `${themeName}.${type}`,
2106
+ linkElementType
2107
+ },
2108
+ key
2109
+ );
2110
+ })
2111
+ }
2112
+ ),
2113
+ isError && errorMessage && /* @__PURE__ */ jsx(Typography, { themeName: `${themeName}.errorMessage`, tokens: listBoxTokens, children: errorMessage })
2114
+ ] });
2115
+ }
2116
+ );
2117
+ ControlledListBox.displayName = "ControlledListBox";
2118
+ const ControlledReactHookFormListBox = forwardRef((props, listBoxRef) => {
2119
+ const { name, rules, isRequired, isDisabled, tokens, selectionMode = "single", errorMessage, ...rest } = props;
2120
+ const { control, setValue, watch, getValues } = useFormContext();
2121
+ const { selectedKeys = watch(name), defaultSelectedKeys = getValues(name) } = rest;
2122
+ const { t } = useTranslation();
2123
+ const mergedRules = {
2124
+ required: isRequired ? t("FORM.ERROR.REQUIRED") ?? "required" : false,
2125
+ disabled: isDisabled,
2126
+ ...rules
2127
+ };
2128
+ return /* @__PURE__ */ jsx(
2129
+ Controller,
2130
+ {
2131
+ ...rest,
2132
+ defaultValue: defaultSelectedKeys,
2133
+ name,
2134
+ control,
2135
+ rules: mergedRules,
2136
+ disabled: mergedRules == null ? void 0 : mergedRules.disabled,
2137
+ render: ({ field, fieldState }) => {
2138
+ var _a;
2139
+ const { ref, ...fieldProps } = field;
2140
+ const isError = !isEmpty(fieldState.error);
2141
+ const validityField = {
2142
+ isDisabled: field.disabled ?? false,
2143
+ isRequired: (mergedRules == null ? void 0 : mergedRules.required) === true || (mergedRules == null ? void 0 : mergedRules.required) === "required",
2144
+ isInvalid: fieldState.invalid,
2145
+ isError
2146
+ };
2147
+ const validityTokens = {
2148
+ ...tokens,
2149
+ ...validityField
2150
+ };
2151
+ return /* @__PURE__ */ jsx(
2152
+ ControlledListBox,
2153
+ {
2154
+ ...mergeProps$1(rest, fieldProps, validityField, {
2155
+ onSelectionChange: (keys) => {
2156
+ setValue(name, keys);
2157
+ }
2158
+ }),
2159
+ tokens: validityTokens,
2160
+ selectionMode,
2161
+ selectedKeys,
2162
+ defaultSelectedKeys,
2163
+ errorMessage: errorMessage ?? ((_a = fieldState.error) == null ? void 0 : _a.message),
2164
+ ref: listBoxRef
2165
+ }
2166
+ );
2167
+ }
2168
+ }
2169
+ );
2170
+ });
2171
+ ControlledReactHookFormListBox.displayName = "ControlledReactHookFormListBox";
2172
+ const SvgComponent$n = (props) => /* @__PURE__ */ jsx("svg", { width: 24, height: 24, fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx("path", { d: "M17.728 13.66 12.388 19 7.05 13.66M12.4 5v14", stroke: "currentColor" }) });
2173
+ const ArrowDown = memo(SvgComponent$n, isEqual);
2174
+ const ArrowDown$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2175
+ __proto__: null,
2176
+ default: ArrowDown
2177
+ }, Symbol.toStringTag, { value: "Module" }));
2178
+ const ComboBoxButton = forwardRef((props, ref) => {
2179
+ const { state, handlePress: handlePressProp, ...rest } = props;
2180
+ const handlePress = useCallback(
2181
+ (e) => {
2182
+ state.setInputValue("");
2183
+ state.selectionManager.clearSelection();
2184
+ handlePressProp == null ? void 0 : handlePressProp(e);
2185
+ },
2186
+ [handlePressProp, state]
2187
+ );
2188
+ return /* @__PURE__ */ jsx(ButtonWithForwardRef, { ...rest, ref, handlePress });
2189
+ });
2190
+ ComboBoxButton.displayName = "ComboBoxButton";
2191
+ const SvgComponent$m = (props) => /* @__PURE__ */ jsxs("svg", { width: 24, height: 24, fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props, children: [
2192
+ /* @__PURE__ */ jsx("g", { children: /* @__PURE__ */ 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" }) }),
2193
+ /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { children: /* @__PURE__ */ jsx("path", { fill: "currentColor", d: "M0 0h24v24H0z" }) }) })
2194
+ ] });
2195
+ const ArrowLeft = memo(SvgComponent$m, isEqual);
2196
+ const ArrowLeft$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2197
+ __proto__: null,
2198
+ default: ArrowLeft
2199
+ }, Symbol.toStringTag, { value: "Module" }));
2200
+ const SvgComponent$l = (props) => /* @__PURE__ */ jsxs("svg", { width: 24, height: 24, fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props, children: [
2201
+ /* @__PURE__ */ jsx("g", { children: /* @__PURE__ */ 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" }) }),
2202
+ /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { children: /* @__PURE__ */ jsx("path", { fill: "currentColor", d: "M0 0h24v24H0z" }) }) })
2203
+ ] });
2204
+ const ArrowRight = memo(SvgComponent$l, isEqual);
2205
+ const ArrowRight$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2206
+ __proto__: null,
2207
+ default: ArrowRight
2208
+ }, Symbol.toStringTag, { value: "Module" }));
2209
+ const SvgComponent$k = (props) => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: 48, width: 48, fill: "currentColor", viewBox: "0 0 48 48", ...props, children: /* @__PURE__ */ 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" }) });
2210
+ const Check = memo(SvgComponent$k, isEqual);
2211
+ const Check$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2212
+ __proto__: null,
2213
+ default: Check
2214
+ }, Symbol.toStringTag, { value: "Module" }));
2215
+ const SvgComponent$j = (props) => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: "48", width: "48", fill: "currentColor", ...props, children: /* @__PURE__ */ jsx("path", { d: "M28.05 36 16 23.95 28.05 11.9l2.15 2.15-9.9 9.9 9.9 9.9Z" }) });
2216
+ const ChevronLeft = memo(SvgComponent$j, isEqual);
2217
+ const ChevronLeft$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2218
+ __proto__: null,
2219
+ default: ChevronLeft
2220
+ }, Symbol.toStringTag, { value: "Module" }));
2221
+ const SvgComponent$i = (props) => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", height: "48", width: "48", fill: "currentColor", ...props, children: /* @__PURE__ */ 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" }) });
2222
+ const ChevronRight = memo(SvgComponent$i, isEqual);
2223
+ const ChevronRight$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2224
+ __proto__: null,
2225
+ default: ChevronRight
2226
+ }, Symbol.toStringTag, { value: "Module" }));
2227
+ const SvgComponent$h = (props) => /* @__PURE__ */ jsx("svg", { width: 24, height: 24, fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ jsx(
2228
+ "path",
2229
+ {
2230
+ 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",
2231
+ fill: "currentColor"
2232
+ }
2233
+ ) });
2234
+ const Facebook = memo(SvgComponent$h, isEqual);
2235
+ const Facebook$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2236
+ __proto__: null,
2237
+ default: Facebook
2238
+ }, Symbol.toStringTag, { value: "Module" }));
2239
+ const SvgComponent$g = (props) => /* @__PURE__ */ jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsx(
2240
+ "path",
2241
+ {
2242
+ fill: "#3b5998",
2243
+ strokeMiterlimit: "10",
2244
+ strokeWidth: "0",
2245
+ 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"
2246
+ }
2247
+ ) });
2248
+ const FacebookColored = memo(SvgComponent$g, isEqual);
2249
+ const FacebookColored$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2250
+ __proto__: null,
2251
+ default: FacebookColored
2252
+ }, Symbol.toStringTag, { value: "Module" }));
2253
+ const SvgComponent$f = (props) => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 25, viewBox: "0 0 24 25", fill: "none", ...props, children: /* @__PURE__ */ jsx(
2254
+ "path",
2255
+ {
2256
+ fillRule: "evenodd",
2257
+ clipRule: "evenodd",
2258
+ 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",
2259
+ fill: "currentColor"
2260
+ }
2261
+ ) });
2262
+ const FacebookRounded = memo(SvgComponent$f, isEqual);
2263
+ const FacebookRounded$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2264
+ __proto__: null,
2265
+ default: FacebookRounded
2266
+ }, Symbol.toStringTag, { value: "Module" }));
2267
+ const SvgComponent$e = (props) => /* @__PURE__ */ jsxs("svg", { width: "40", height: "40", viewBox: "0 0 67 67", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
2268
+ /* @__PURE__ */ jsx(
2269
+ "path",
2270
+ {
2271
+ 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",
2272
+ stroke: "currentColor",
2273
+ strokeWidth: "5",
2274
+ strokeLinecap: "round",
2275
+ strokeLinejoin: "round"
2276
+ }
2277
+ ),
2278
+ /* @__PURE__ */ jsx(
2279
+ "path",
2280
+ {
2281
+ 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",
2282
+ stroke: "currentColor",
2283
+ strokeWidth: "5",
2284
+ strokeLinecap: "round",
2285
+ strokeLinejoin: "round"
2286
+ }
2287
+ ),
2288
+ /* @__PURE__ */ jsx(
2289
+ "path",
2290
+ {
2291
+ 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",
2292
+ stroke: "currentColor",
2293
+ strokeWidth: "5",
2294
+ strokeLinecap: "round",
2295
+ strokeLinejoin: "round"
2296
+ }
2297
+ ),
2298
+ /* @__PURE__ */ jsx(
2299
+ "path",
2300
+ {
2301
+ 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",
2302
+ stroke: "currentColor",
2303
+ strokeWidth: "5",
2304
+ strokeLinecap: "round",
2305
+ strokeLinejoin: "round"
2306
+ }
2307
+ )
2308
+ ] });
2309
+ const Globe = memo(SvgComponent$e, isEqual);
2310
+ const Globe$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2311
+ __proto__: null,
2312
+ default: Globe
2313
+ }, Symbol.toStringTag, { value: "Module" }));
2314
+ const SvgComponent$d = (props) => /* @__PURE__ */ jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxs("g", { fill: "currentColor", strokeMiterlimit: "10", strokeWidth: "0", children: [
2315
+ /* @__PURE__ */ 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" }),
2316
+ /* @__PURE__ */ 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" })
2317
+ ] }) });
2318
+ const Instagram = memo(SvgComponent$d, isEqual);
2319
+ const Instagram$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2320
+ __proto__: null,
2321
+ default: Instagram
2322
+ }, Symbol.toStringTag, { value: "Module" }));
2323
+ const SvgComponent$c = (props) => /* @__PURE__ */ jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxs("g", { fill: "none", strokeMiterlimit: "10", strokeWidth: "0", transform: "matrix(2.8 0 0 2.8 1.4 1.4)", children: [
2324
+ /* @__PURE__ */ jsxs(
2325
+ "linearGradient",
2326
+ {
2327
+ id: "a",
2328
+ x1: "7.6",
2329
+ x2: "82.4",
2330
+ y1: "9.6",
2331
+ y2: "84.4",
2332
+ gradientTransform: "matrix(1 0 0 -1 0 92)",
2333
+ gradientUnits: "userSpaceOnUse",
2334
+ children: [
2335
+ /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: "#ffd600" }),
2336
+ /* @__PURE__ */ jsx("stop", { offset: "50%", stopColor: "#ff0100" }),
2337
+ /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: "#d800b9" })
2338
+ ]
2339
+ }
2340
+ ),
2341
+ /* @__PURE__ */ jsx(
2342
+ "path",
2343
+ {
2344
+ fill: "url(#a)",
2345
+ 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"
2346
+ }
2347
+ ),
2348
+ /* @__PURE__ */ jsxs(
2349
+ "linearGradient",
2350
+ {
2351
+ id: "b",
2352
+ x1: "28.7",
2353
+ x2: "61.3",
2354
+ y1: "30.7",
2355
+ y2: "63.3",
2356
+ gradientTransform: "matrix(1 0 0 -1 0 92)",
2357
+ gradientUnits: "userSpaceOnUse",
2358
+ children: [
2359
+ /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: "#ff6400" }),
2360
+ /* @__PURE__ */ jsx("stop", { offset: "50%", stopColor: "#ff0100" }),
2361
+ /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: "#fd0056" })
2362
+ ]
2363
+ }
2364
+ ),
2365
+ /* @__PURE__ */ jsx(
2366
+ "path",
2367
+ {
2368
+ fill: "url(#b)",
2369
+ 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"
2370
+ }
2371
+ ),
2372
+ /* @__PURE__ */ jsxs(
2373
+ "linearGradient",
2374
+ {
2375
+ id: "c",
2376
+ x1: "65.2",
2377
+ x2: "72.8",
2378
+ y1: "67.2",
2379
+ y2: "74.8",
2380
+ gradientTransform: "matrix(1 0 0 -1 0 92)",
2381
+ gradientUnits: "userSpaceOnUse",
2382
+ children: [
2383
+ /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: "#f30072" }),
2384
+ /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: "#e50097" })
2385
+ ]
2386
+ }
2387
+ ),
2388
+ /* @__PURE__ */ 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" })
2389
+ ] }) });
2390
+ const InstagramColored = memo(SvgComponent$c, isEqual);
2391
+ const InstagramColored$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2392
+ __proto__: null,
2393
+ default: InstagramColored
2394
+ }, Symbol.toStringTag, { value: "Module" }));
2395
+ const SvgComponent$b = (props) => /* @__PURE__ */ jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxs("g", { fill: "currentColor", strokeMiterlimit: "10", strokeWidth: "0", children: [
2396
+ /* @__PURE__ */ 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" }),
2397
+ /* @__PURE__ */ 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" })
2398
+ ] }) });
2399
+ const Link = memo(SvgComponent$b, isEqual);
2400
+ const Link$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2401
+ __proto__: null,
2402
+ default: Link
2403
+ }, Symbol.toStringTag, { value: "Module" }));
2404
+ const SvgComponent$a = (props) => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: 18, height: 19, viewBox: "0 0 18 19", fill: "none", ...props, children: /* @__PURE__ */ jsx(
2405
+ "path",
2406
+ {
2407
+ fillRule: "evenodd",
2408
+ clipRule: "evenodd",
2409
+ 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",
2410
+ fill: "currentColor"
2411
+ }
2412
+ ) });
2413
+ const LinkedIn = memo(SvgComponent$a, isEqual);
2414
+ const LinkedIn$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2415
+ __proto__: null,
2416
+ default: LinkedIn
2417
+ }, Symbol.toStringTag, { value: "Module" }));
2418
+ const SvgComponent$9 = (props) => /* @__PURE__ */ jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxs("g", { fill: "currentColor", strokeMiterlimit: "10", strokeWidth: "0", transform: "matrix(2.8 0 0 2.8 1.4 1.4)", children: [
2419
+ /* @__PURE__ */ 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" }),
2420
+ /* @__PURE__ */ 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" }),
2421
+ /* @__PURE__ */ jsx("rect", { width: "39", height: "6", x: "-1", y: "57.2", rx: "0", ry: "0", transform: "rotate(-45.1 18.5 60.2)" }),
2422
+ /* @__PURE__ */ jsx("rect", { width: "6", height: "39", x: "68.5", y: "40.7", rx: "0", ry: "0", transform: "rotate(-44.8 71.5 60.2)" })
2423
+ ] }) });
2424
+ const Mail = memo(SvgComponent$9, isEqual);
2425
+ const Mail$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2426
+ __proto__: null,
2427
+ default: Mail
2428
+ }, Symbol.toStringTag, { value: "Module" }));
2429
+ const SvgComponent$8 = (props) => /* @__PURE__ */ jsxs("svg", { height: 48, width: 48, fill: "currentColor", ...props, xmlns: "http://www.w3.org/2000/svg", children: [
2430
+ /* @__PURE__ */ jsx("ellipse", { cx: "26", cy: "24.095", rx: "26", ry: "23.547", fill: "#fff" }),
2431
+ /* @__PURE__ */ jsx(
2432
+ "path",
2433
+ {
2434
+ d: "M37.742 24.095H14.258M26 13.46V34.73 13.46Z",
2435
+ stroke: "#9E9E9E",
2436
+ strokeWidth: "5",
2437
+ strokeLinecap: "round",
2438
+ strokeLinejoin: "round"
2439
+ }
2440
+ )
2441
+ ] });
2442
+ const Plus = memo(SvgComponent$8, isEqual);
2443
+ const Plus$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2444
+ __proto__: null,
2445
+ default: Plus
2446
+ }, Symbol.toStringTag, { value: "Module" }));
2447
+ const SvgComponent$7 = (props) => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 18 18", fill: "none", ...props, children: /* @__PURE__ */ jsx(
2448
+ "path",
2449
+ {
2450
+ 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",
2451
+ fill: "currentColor"
2452
+ }
2453
+ ) });
2454
+ const Print = memo(SvgComponent$7, isEqual);
2455
+ const Print$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2456
+ __proto__: null,
2457
+ default: Print
2458
+ }, Symbol.toStringTag, { value: "Module" }));
2459
+ const SvgComponent$6 = (props) => /* @__PURE__ */ jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsx(
2460
+ "path",
2461
+ {
2462
+ fill: "currentColor",
2463
+ strokeMiterlimit: "10",
2464
+ strokeWidth: "0",
2465
+ 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"
2466
+ }
2467
+ ) });
2468
+ const Share = memo(SvgComponent$6, isEqual);
2469
+ const Share$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2470
+ __proto__: null,
2471
+ default: Share
2472
+ }, Symbol.toStringTag, { value: "Module" }));
2473
+ const SvgComponent$5 = (props) => /* @__PURE__ */ jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsx(
2474
+ "path",
2475
+ {
2476
+ fill: "currentColor",
2477
+ strokeMiterlimit: "10",
2478
+ strokeWidth: "0",
2479
+ 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"
2480
+ }
2481
+ ) });
2482
+ const Twitter = memo(SvgComponent$5, isEqual);
2483
+ const Twitter$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2484
+ __proto__: null,
2485
+ default: Twitter
2486
+ }, Symbol.toStringTag, { value: "Module" }));
2487
+ const SvgComponent$4 = (props) => /* @__PURE__ */ jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsx(
2488
+ "path",
2489
+ {
2490
+ fill: "#1da1f2",
2491
+ strokeMiterlimit: "10",
2492
+ strokeWidth: "0",
2493
+ 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"
2494
+ }
2495
+ ) });
2496
+ const TwitterColored = memo(SvgComponent$4, isEqual);
2497
+ const TwitterColored$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2498
+ __proto__: null,
2499
+ default: TwitterColored
2500
+ }, Symbol.toStringTag, { value: "Module" }));
2501
+ const SvgComponent$3 = (props) => /* @__PURE__ */ jsx("svg", { width: 24, height: 24, fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ jsx(
2502
+ "path",
2503
+ {
2504
+ 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",
2505
+ fill: "currentColor"
2506
+ }
2507
+ ) });
2508
+ const Upload = memo(SvgComponent$3, isEqual);
2509
+ const Upload$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2510
+ __proto__: null,
2511
+ default: Upload
2512
+ }, Symbol.toStringTag, { value: "Module" }));
2513
+ const SvgComponent$2 = (props) => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 25, viewBox: "0 0 24 25", fill: "none", ...props, children: /* @__PURE__ */ jsx(
2514
+ "path",
2515
+ {
2516
+ 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",
2517
+ fill: "currentColor"
2518
+ }
2519
+ ) });
2520
+ const X = memo(SvgComponent$2, isEqual);
2521
+ const X$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2522
+ __proto__: null,
2523
+ default: X
2524
+ }, Symbol.toStringTag, { value: "Module" }));
2525
+ const SvgComponent$1 = (props) => /* @__PURE__ */ jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsx(
2526
+ "path",
2527
+ {
2528
+ fill: "currentColor",
2529
+ strokeMiterlimit: "10",
2530
+ strokeWidth: "0",
2531
+ 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"
2532
+ }
2533
+ ) });
2534
+ const YouTube = memo(SvgComponent$1, isEqual);
2535
+ const YouTube$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2536
+ __proto__: null,
2537
+ default: YouTube
2538
+ }, Symbol.toStringTag, { value: "Module" }));
2539
+ const SvgComponent = (props) => /* @__PURE__ */ jsx("svg", { width: 24, height: 24, xmlns: "http://www.w3.org/2000/svg", xmlSpace: "preserve", viewBox: "0 0 256 256", ...props, children: /* @__PURE__ */ jsxs("g", { fill: "currentColor", strokeMiterlimit: "10", strokeWidth: "0", children: [
2540
+ /* @__PURE__ */ jsx(
2541
+ "path",
2542
+ {
2543
+ fill: "red",
2544
+ 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"
2545
+ }
2546
+ ),
2547
+ /* @__PURE__ */ jsx("path", { fill: "#fff", d: "m102.57 165.8 65.7-37.94-65.7-37.94z" })
2548
+ ] }) });
2549
+ const YouTubeColored = memo(SvgComponent, isEqual);
2550
+ const YouTubeColored$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
2551
+ __proto__: null,
2552
+ default: YouTubeColored
2553
+ }, Symbol.toStringTag, { value: "Module" }));
2554
+ const [useIsClient, IsClientProvider] = createCtx();
2555
+ const [useDraftMode, DraftModeProvider] = createCtx();
8
2556
  function createServerContext(defaultValue) {
9
2557
  const getRef = cache(() => ({ current: defaultValue }));
10
2558
  const getValue = () => getRef().current;
@@ -41,26 +2589,26 @@ async function getPageSettings(props, itemKey) {
41
2589
  const directusVariables = getDirectusVariables(variables, config);
42
2590
  const defaultReturn = getPageSettingsContext();
43
2591
  if (!props || isEqual(getVariables(), directusVariables)) {
44
- log("Using cached page settings", { path: (_c = (_b = (_a = defaultReturn.page_settings) == null ? void 0 : _a.translations) == null ? void 0 : _b[0]) == null ? void 0 : _c.path });
2592
+ log$1("Using cached page settings", { path: (_c = (_b = (_a = defaultReturn.page_settings) == null ? void 0 : _a.translations) == null ? void 0 : _b[0]) == null ? void 0 : _c.path });
45
2593
  return defaultReturn;
46
2594
  }
47
2595
  const { document } = props;
48
2596
  const key = itemKey ?? get(document, "definitions[0].selectionSet.selections[0].name.value");
49
- log("Querying new page settings", directusVariables);
2597
+ log$1("Querying new page settings", directusVariables);
50
2598
  const result = await queryGql(document, directusVariables);
51
2599
  const items = result == null ? void 0 : result[key];
52
2600
  const currentItem = Array.isArray(items) ? items == null ? void 0 : items[0] : items;
53
2601
  const currentPageSettings = currentItem == null ? void 0 : currentItem.page_settings;
54
2602
  const currentPath = (_e = (_d = currentPageSettings == null ? void 0 : currentPageSettings.translations) == null ? void 0 : _d[0]) == null ? void 0 : _e.path;
55
2603
  if (!currentItem) {
56
- log("No item found. Falling back to cached page settings", { path: currentPath }, "warn");
2604
+ log$1("No item found. Falling back to cached page settings", { path: currentPath }, "warn");
57
2605
  return defaultReturn;
58
2606
  }
59
2607
  if (!currentPageSettings) {
60
- log("No page settings found. Falling back to cached page settings", { path: currentPath }, "warn");
2608
+ log$1("No page settings found. Falling back to cached page settings", { path: currentPath }, "warn");
61
2609
  return defaultReturn;
62
2610
  }
63
- log("Caching new page settings", { path: currentPath });
2611
+ log$1("Caching new page settings", { path: currentPath });
64
2612
  setPageSettingsContext(currentItem);
65
2613
  setVariables(variables);
66
2614
  return currentItem;