@nypl/design-system-react-components 3.5.3 → 3.5.5-rc
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/dist/design-system-react-components.cjs +52 -52
- package/dist/design-system-react-components.js +13093 -12925
- package/dist/src/components/Icons/IconSvgs.d.ts +1 -0
- package/dist/src/components/Icons/iconVariables.d.ts +1 -1
- package/dist/src/components/Image/Image.d.ts +1 -1
- package/dist/src/components/StatusBadge/StatusBadge.d.ts +2 -3
- package/dist/src/components/TextInput/TextInput.d.ts +1 -1
- package/dist/src/theme/components/alphabetFilter.d.ts +0 -1
- package/dist/src/theme/components/breadcrumb.d.ts +4 -0
- package/dist/src/theme/components/card.d.ts +17 -71
- package/dist/src/theme/components/checkbox.d.ts +1 -2
- package/dist/src/theme/components/featuredContent.d.ts +1 -32
- package/dist/src/theme/components/feedbackBox.d.ts +1 -0
- package/dist/src/theme/components/fieldset.d.ts +3 -3
- package/dist/src/theme/components/hero.d.ts +12 -9
- package/dist/src/theme/components/image.d.ts +254 -0
- package/dist/src/theme/components/label.d.ts +3 -3
- package/dist/src/theme/components/menu.d.ts +15 -14
- package/dist/src/theme/components/modal.d.ts +21 -0
- package/dist/src/theme/components/searchBar.d.ts +4 -46
- package/dist/src/theme/components/statusBadge.d.ts +2 -2
- package/dist/src/utils/setContainerStyles.d.ts +11 -0
- package/dist/src/utils/utils.d.ts +2 -0
- package/package.json +1 -1
|
@@ -75,6 +75,12 @@ declare const imageRatios: {
|
|
|
75
75
|
fourByThree: {
|
|
76
76
|
paddingBottom: string;
|
|
77
77
|
};
|
|
78
|
+
fourByOne: {
|
|
79
|
+
paddingBottom: string;
|
|
80
|
+
};
|
|
81
|
+
twoByThree: {
|
|
82
|
+
paddingBottom: string;
|
|
83
|
+
};
|
|
78
84
|
oneByTwo: {
|
|
79
85
|
paddingBottom: string;
|
|
80
86
|
};
|
|
@@ -418,6 +424,145 @@ declare const ReservoirImageWrapper: {
|
|
|
418
424
|
height: string;
|
|
419
425
|
overflow: string;
|
|
420
426
|
} | {
|
|
427
|
+
maxWidth: string;
|
|
428
|
+
paddingBottom: string;
|
|
429
|
+
position: string;
|
|
430
|
+
width: string;
|
|
431
|
+
height: string;
|
|
432
|
+
overflow: string;
|
|
433
|
+
} | {
|
|
434
|
+
maxWidth: string;
|
|
435
|
+
paddingBottom: string;
|
|
436
|
+
position: string;
|
|
437
|
+
width: string;
|
|
438
|
+
height: string;
|
|
439
|
+
overflow: string;
|
|
440
|
+
} | {
|
|
441
|
+
paddingBottom: string;
|
|
442
|
+
position: string;
|
|
443
|
+
width: string;
|
|
444
|
+
height: string;
|
|
445
|
+
overflow: string;
|
|
446
|
+
} | {
|
|
447
|
+
maxWidth: string;
|
|
448
|
+
paddingBottom: string;
|
|
449
|
+
position: string;
|
|
450
|
+
width: string;
|
|
451
|
+
height: string;
|
|
452
|
+
overflow: string;
|
|
453
|
+
} | {
|
|
454
|
+
maxWidth: string;
|
|
455
|
+
paddingBottom: string;
|
|
456
|
+
position: string;
|
|
457
|
+
width: string;
|
|
458
|
+
height: string;
|
|
459
|
+
overflow: string;
|
|
460
|
+
} | {
|
|
461
|
+
maxWidth: string;
|
|
462
|
+
paddingBottom: string;
|
|
463
|
+
position: string;
|
|
464
|
+
width: string;
|
|
465
|
+
height: string;
|
|
466
|
+
overflow: string;
|
|
467
|
+
} | {
|
|
468
|
+
maxWidth: string;
|
|
469
|
+
paddingBottom: string;
|
|
470
|
+
position: string;
|
|
471
|
+
width: string;
|
|
472
|
+
height: string;
|
|
473
|
+
overflow: string;
|
|
474
|
+
} | {
|
|
475
|
+
maxWidth: string;
|
|
476
|
+
paddingBottom: string;
|
|
477
|
+
position: string;
|
|
478
|
+
width: string;
|
|
479
|
+
height: string;
|
|
480
|
+
overflow: string;
|
|
481
|
+
} | {
|
|
482
|
+
maxWidth: string;
|
|
483
|
+
paddingBottom: string;
|
|
484
|
+
position: string;
|
|
485
|
+
width: string;
|
|
486
|
+
height: string;
|
|
487
|
+
overflow: string;
|
|
488
|
+
} | {
|
|
489
|
+
maxWidth: string;
|
|
490
|
+
paddingBottom: string;
|
|
491
|
+
position: string;
|
|
492
|
+
width: string;
|
|
493
|
+
height: string;
|
|
494
|
+
overflow: string;
|
|
495
|
+
} | {
|
|
496
|
+
maxWidth: string;
|
|
497
|
+
paddingBottom: string;
|
|
498
|
+
position: string;
|
|
499
|
+
width: string;
|
|
500
|
+
height: string;
|
|
501
|
+
overflow: string;
|
|
502
|
+
} | {
|
|
503
|
+
maxWidth: string;
|
|
504
|
+
paddingBottom: string;
|
|
505
|
+
position: string;
|
|
506
|
+
width: string;
|
|
507
|
+
height: string;
|
|
508
|
+
overflow: string;
|
|
509
|
+
} | {
|
|
510
|
+
paddingBottom: string;
|
|
511
|
+
position: string;
|
|
512
|
+
width: string;
|
|
513
|
+
height: string;
|
|
514
|
+
overflow: string;
|
|
515
|
+
} | {
|
|
516
|
+
maxWidth: string;
|
|
517
|
+
paddingBottom: string;
|
|
518
|
+
position: string;
|
|
519
|
+
width: string;
|
|
520
|
+
height: string;
|
|
521
|
+
overflow: string;
|
|
522
|
+
} | {
|
|
523
|
+
maxWidth: string;
|
|
524
|
+
paddingBottom: string;
|
|
525
|
+
position: string;
|
|
526
|
+
width: string;
|
|
527
|
+
height: string;
|
|
528
|
+
overflow: string;
|
|
529
|
+
} | {
|
|
530
|
+
maxWidth: string;
|
|
531
|
+
paddingBottom: string;
|
|
532
|
+
position: string;
|
|
533
|
+
width: string;
|
|
534
|
+
height: string;
|
|
535
|
+
overflow: string;
|
|
536
|
+
} | {
|
|
537
|
+
maxWidth: string;
|
|
538
|
+
paddingBottom: string;
|
|
539
|
+
position: string;
|
|
540
|
+
width: string;
|
|
541
|
+
height: string;
|
|
542
|
+
overflow: string;
|
|
543
|
+
} | {
|
|
544
|
+
maxWidth: string;
|
|
545
|
+
paddingBottom: string;
|
|
546
|
+
position: string;
|
|
547
|
+
width: string;
|
|
548
|
+
height: string;
|
|
549
|
+
overflow: string;
|
|
550
|
+
} | {
|
|
551
|
+
maxWidth: string;
|
|
552
|
+
paddingBottom: string;
|
|
553
|
+
position: string;
|
|
554
|
+
width: string;
|
|
555
|
+
height: string;
|
|
556
|
+
overflow: string;
|
|
557
|
+
} | {
|
|
558
|
+
maxWidth: string;
|
|
559
|
+
paddingBottom: string;
|
|
560
|
+
position: string;
|
|
561
|
+
width: string;
|
|
562
|
+
height: string;
|
|
563
|
+
overflow: string;
|
|
564
|
+
} | {
|
|
565
|
+
maxWidth: string;
|
|
421
566
|
paddingBottom: string;
|
|
422
567
|
position: string;
|
|
423
568
|
width: string;
|
|
@@ -430,6 +575,12 @@ declare const ReservoirImageWrapper: {
|
|
|
430
575
|
width: string;
|
|
431
576
|
height: string;
|
|
432
577
|
overflow: string;
|
|
578
|
+
} | {
|
|
579
|
+
paddingBottom: string;
|
|
580
|
+
position: string;
|
|
581
|
+
width: string;
|
|
582
|
+
height: string;
|
|
583
|
+
overflow: string;
|
|
433
584
|
} | {
|
|
434
585
|
maxWidth: string;
|
|
435
586
|
paddingBottom: string;
|
|
@@ -473,6 +624,7 @@ declare const ReservoirImageWrapper: {
|
|
|
473
624
|
height: string;
|
|
474
625
|
overflow: string;
|
|
475
626
|
} | {
|
|
627
|
+
maxWidth: string;
|
|
476
628
|
paddingBottom: string;
|
|
477
629
|
position: string;
|
|
478
630
|
width: string;
|
|
@@ -492,6 +644,12 @@ declare const ReservoirImageWrapper: {
|
|
|
492
644
|
width: string;
|
|
493
645
|
height: string;
|
|
494
646
|
overflow: string;
|
|
647
|
+
} | {
|
|
648
|
+
paddingBottom: string;
|
|
649
|
+
position: string;
|
|
650
|
+
width: string;
|
|
651
|
+
height: string;
|
|
652
|
+
overflow: string;
|
|
495
653
|
} | {
|
|
496
654
|
maxWidth: string;
|
|
497
655
|
paddingBottom: string;
|
|
@@ -513,6 +671,49 @@ declare const ReservoirImageWrapper: {
|
|
|
513
671
|
width: string;
|
|
514
672
|
height: string;
|
|
515
673
|
overflow: string;
|
|
674
|
+
} | {
|
|
675
|
+
maxWidth: string;
|
|
676
|
+
paddingBottom: string;
|
|
677
|
+
position: string;
|
|
678
|
+
width: string;
|
|
679
|
+
height: string;
|
|
680
|
+
overflow: string;
|
|
681
|
+
} | {
|
|
682
|
+
maxWidth: string;
|
|
683
|
+
paddingBottom: string;
|
|
684
|
+
position: string;
|
|
685
|
+
width: string;
|
|
686
|
+
height: string;
|
|
687
|
+
overflow: string;
|
|
688
|
+
} | {
|
|
689
|
+
maxWidth: string;
|
|
690
|
+
position: string;
|
|
691
|
+
width: string;
|
|
692
|
+
height: string;
|
|
693
|
+
overflow: string;
|
|
694
|
+
} | {
|
|
695
|
+
maxWidth: string;
|
|
696
|
+
position: string;
|
|
697
|
+
width: string;
|
|
698
|
+
height: string;
|
|
699
|
+
overflow: string;
|
|
700
|
+
} | {
|
|
701
|
+
maxWidth: string;
|
|
702
|
+
position: string;
|
|
703
|
+
width: string;
|
|
704
|
+
height: string;
|
|
705
|
+
overflow: string;
|
|
706
|
+
} | {
|
|
707
|
+
maxWidth: string;
|
|
708
|
+
position: string;
|
|
709
|
+
width: string;
|
|
710
|
+
height: string;
|
|
711
|
+
overflow: string;
|
|
712
|
+
} | {
|
|
713
|
+
position: string;
|
|
714
|
+
width: string;
|
|
715
|
+
height: string;
|
|
716
|
+
overflow: string;
|
|
516
717
|
} | {
|
|
517
718
|
maxWidth: string;
|
|
518
719
|
position: string;
|
|
@@ -526,6 +727,7 @@ declare const ReservoirImageWrapper: {
|
|
|
526
727
|
height: string;
|
|
527
728
|
overflow: string;
|
|
528
729
|
} | {
|
|
730
|
+
maxWidth: string;
|
|
529
731
|
position: string;
|
|
530
732
|
width: string;
|
|
531
733
|
height: string;
|
|
@@ -544,18 +746,21 @@ declare const ReservoirImageWrapper: {
|
|
|
544
746
|
overflow: string;
|
|
545
747
|
} | {
|
|
546
748
|
maxWidth: string;
|
|
749
|
+
paddingBottom: string;
|
|
547
750
|
position: string;
|
|
548
751
|
width: string;
|
|
549
752
|
height: string;
|
|
550
753
|
overflow: string;
|
|
551
754
|
} | {
|
|
552
755
|
maxWidth: string;
|
|
756
|
+
paddingBottom: string;
|
|
553
757
|
position: string;
|
|
554
758
|
width: string;
|
|
555
759
|
height: string;
|
|
556
760
|
overflow: string;
|
|
557
761
|
} | {
|
|
558
762
|
maxWidth: string;
|
|
763
|
+
paddingBottom: string;
|
|
559
764
|
position: string;
|
|
560
765
|
width: string;
|
|
561
766
|
height: string;
|
|
@@ -567,6 +772,12 @@ declare const ReservoirImageWrapper: {
|
|
|
567
772
|
width: string;
|
|
568
773
|
height: string;
|
|
569
774
|
overflow: string;
|
|
775
|
+
} | {
|
|
776
|
+
paddingBottom: string;
|
|
777
|
+
position: string;
|
|
778
|
+
width: string;
|
|
779
|
+
height: string;
|
|
780
|
+
overflow: string;
|
|
570
781
|
} | {
|
|
571
782
|
maxWidth: string;
|
|
572
783
|
paddingBottom: string;
|
|
@@ -575,6 +786,7 @@ declare const ReservoirImageWrapper: {
|
|
|
575
786
|
height: string;
|
|
576
787
|
overflow: string;
|
|
577
788
|
} | {
|
|
789
|
+
maxWidth: string;
|
|
578
790
|
paddingBottom: string;
|
|
579
791
|
position: string;
|
|
580
792
|
width: string;
|
|
@@ -685,6 +897,7 @@ declare const ReservoirImageWrapper: {
|
|
|
685
897
|
height: string;
|
|
686
898
|
overflow: string;
|
|
687
899
|
} | {
|
|
900
|
+
maxWidth: string;
|
|
688
901
|
paddingBottom: string;
|
|
689
902
|
position: string;
|
|
690
903
|
width: string;
|
|
@@ -697,6 +910,12 @@ declare const ReservoirImageWrapper: {
|
|
|
697
910
|
width: string;
|
|
698
911
|
height: string;
|
|
699
912
|
overflow: string;
|
|
913
|
+
} | {
|
|
914
|
+
paddingBottom: string;
|
|
915
|
+
position: string;
|
|
916
|
+
width: string;
|
|
917
|
+
height: string;
|
|
918
|
+
overflow: string;
|
|
700
919
|
} | {
|
|
701
920
|
maxWidth: string;
|
|
702
921
|
paddingBottom: string;
|
|
@@ -740,6 +959,41 @@ declare const ReservoirImageWrapper: {
|
|
|
740
959
|
height: string;
|
|
741
960
|
overflow: string;
|
|
742
961
|
} | {
|
|
962
|
+
maxWidth: string;
|
|
963
|
+
paddingBottom: string;
|
|
964
|
+
position: string;
|
|
965
|
+
width: string;
|
|
966
|
+
height: string;
|
|
967
|
+
overflow: string;
|
|
968
|
+
} | {
|
|
969
|
+
maxWidth: string;
|
|
970
|
+
paddingBottom: string;
|
|
971
|
+
position: string;
|
|
972
|
+
width: string;
|
|
973
|
+
height: string;
|
|
974
|
+
overflow: string;
|
|
975
|
+
} | {
|
|
976
|
+
maxWidth: string;
|
|
977
|
+
paddingBottom: string;
|
|
978
|
+
position: string;
|
|
979
|
+
width: string;
|
|
980
|
+
height: string;
|
|
981
|
+
overflow: string;
|
|
982
|
+
} | {
|
|
983
|
+
paddingBottom: string;
|
|
984
|
+
position: string;
|
|
985
|
+
width: string;
|
|
986
|
+
height: string;
|
|
987
|
+
overflow: string;
|
|
988
|
+
} | {
|
|
989
|
+
maxWidth: string;
|
|
990
|
+
paddingBottom: string;
|
|
991
|
+
position: string;
|
|
992
|
+
width: string;
|
|
993
|
+
height: string;
|
|
994
|
+
overflow: string;
|
|
995
|
+
} | {
|
|
996
|
+
maxWidth: string;
|
|
743
997
|
paddingBottom: string;
|
|
744
998
|
position: string;
|
|
745
999
|
width: string;
|
|
@@ -6,15 +6,15 @@ declare const Label: {
|
|
|
6
6
|
baseStyle?: (props: LabelBaseStyle) => {
|
|
7
7
|
flex: string;
|
|
8
8
|
whiteSpace: string;
|
|
9
|
+
span: {
|
|
10
|
+
fontWeight: string;
|
|
11
|
+
};
|
|
9
12
|
color: string;
|
|
10
13
|
display: string;
|
|
11
14
|
fontSize: string;
|
|
12
15
|
fontWeight: string;
|
|
13
16
|
marginBottom: string;
|
|
14
17
|
width: string;
|
|
15
|
-
span: {
|
|
16
|
-
fontWeight: string;
|
|
17
|
-
};
|
|
18
18
|
_dark: {
|
|
19
19
|
color: string;
|
|
20
20
|
};
|
|
@@ -28,40 +28,41 @@ declare const Menu: {
|
|
|
28
28
|
};
|
|
29
29
|
};
|
|
30
30
|
actionItem: {
|
|
31
|
-
outline: string;
|
|
32
|
-
textColor: string;
|
|
33
|
-
paddingY: string;
|
|
34
|
-
paddingX: string;
|
|
35
31
|
fontSize: string;
|
|
36
32
|
fontWeight: string;
|
|
33
|
+
lineHeight: string;
|
|
34
|
+
outline: string;
|
|
35
|
+
paddingX: string;
|
|
36
|
+
paddingY: string;
|
|
37
|
+
textColor: string;
|
|
37
38
|
_hover: {
|
|
38
|
-
fontWeight: number;
|
|
39
39
|
bg: string;
|
|
40
|
+
fontWeight: string;
|
|
40
41
|
};
|
|
41
42
|
_focus: {
|
|
42
|
-
fontWeight: number;
|
|
43
43
|
bg: string;
|
|
44
|
+
fontWeight: string;
|
|
44
45
|
};
|
|
45
46
|
_dark: {
|
|
46
|
-
textColor: string;
|
|
47
47
|
bg: string;
|
|
48
|
+
textColor: string;
|
|
48
49
|
"> div > svg": {
|
|
49
50
|
fill: string;
|
|
50
51
|
};
|
|
51
52
|
_hover: {
|
|
52
|
-
textColor: string;
|
|
53
|
-
fontWeight: number;
|
|
54
53
|
bg: string;
|
|
54
|
+
fontWeight: string;
|
|
55
|
+
textColor: string;
|
|
55
56
|
};
|
|
56
57
|
_focus: {
|
|
57
|
-
textColor: string;
|
|
58
|
-
fontWeight: number;
|
|
59
58
|
bg: string;
|
|
59
|
+
fontWeight: string;
|
|
60
|
+
textColor: string;
|
|
60
61
|
};
|
|
61
62
|
};
|
|
62
63
|
};
|
|
63
64
|
selected: {
|
|
64
|
-
fontWeight:
|
|
65
|
+
fontWeight: string;
|
|
65
66
|
borderLeftColor: string | {
|
|
66
67
|
primary: string;
|
|
67
68
|
secondary: string;
|
|
@@ -76,12 +77,12 @@ declare const Menu: {
|
|
|
76
77
|
textColor: string;
|
|
77
78
|
_hover: {
|
|
78
79
|
textColor: string;
|
|
79
|
-
fontWeight:
|
|
80
|
+
fontWeight: string;
|
|
80
81
|
background: string;
|
|
81
82
|
};
|
|
82
83
|
_focus: {
|
|
83
84
|
textColor: string;
|
|
84
|
-
fontWeight:
|
|
85
|
+
fontWeight: string;
|
|
85
86
|
bg: string;
|
|
86
87
|
};
|
|
87
88
|
background: string;
|
|
@@ -4,6 +4,7 @@ declare const Modal: {
|
|
|
4
4
|
_dark: {
|
|
5
5
|
bg: string;
|
|
6
6
|
};
|
|
7
|
+
borderRadius: string;
|
|
7
8
|
};
|
|
8
9
|
header: {
|
|
9
10
|
color: string;
|
|
@@ -11,11 +12,31 @@ declare const Modal: {
|
|
|
11
12
|
_dark: {
|
|
12
13
|
color: string;
|
|
13
14
|
};
|
|
15
|
+
paddingTop: string;
|
|
16
|
+
paddingLeft: string;
|
|
17
|
+
paddingRight: string;
|
|
18
|
+
paddingBottom: string;
|
|
19
|
+
"h2, h3, h4, h5, h6": {
|
|
20
|
+
marginBottom: number;
|
|
21
|
+
};
|
|
14
22
|
};
|
|
15
23
|
body: {
|
|
16
24
|
_dark: {
|
|
17
25
|
color: string;
|
|
18
26
|
};
|
|
27
|
+
paddingTop: number;
|
|
28
|
+
paddingLeft: string;
|
|
29
|
+
paddingRight: string;
|
|
30
|
+
paddingBottom: string;
|
|
31
|
+
};
|
|
32
|
+
footer: {
|
|
33
|
+
paddingTop: number;
|
|
34
|
+
paddingBottom: string;
|
|
35
|
+
paddingLeft: string;
|
|
36
|
+
paddingRight: string;
|
|
37
|
+
};
|
|
38
|
+
closeButton: {
|
|
39
|
+
marginRight: string;
|
|
19
40
|
};
|
|
20
41
|
};
|
|
21
42
|
sizes?: {
|
|
@@ -1,67 +1,24 @@
|
|
|
1
1
|
declare const SearchBar: {
|
|
2
2
|
baseStyle?: {
|
|
3
|
-
display: string;
|
|
4
|
-
marginBottom: {
|
|
5
|
-
base: string;
|
|
6
|
-
md: string;
|
|
7
|
-
};
|
|
8
3
|
".textInput": {
|
|
9
4
|
flexGrow: number;
|
|
10
5
|
"div > input": {
|
|
11
6
|
borderRightRadius: number;
|
|
12
7
|
};
|
|
13
8
|
};
|
|
14
|
-
flexFlow: {
|
|
15
|
-
base: string;
|
|
16
|
-
md: string;
|
|
17
|
-
};
|
|
18
9
|
".searchButton": {
|
|
19
10
|
minWidth: string;
|
|
20
11
|
borderLeftRadius: string;
|
|
21
12
|
lineHeight: string;
|
|
22
13
|
marginBottom: string;
|
|
23
|
-
paddingTop: {
|
|
24
|
-
base: string;
|
|
25
|
-
md: string;
|
|
26
|
-
};
|
|
27
|
-
paddingLeft: {
|
|
28
|
-
base: string;
|
|
29
|
-
md: string;
|
|
30
|
-
};
|
|
31
|
-
paddingBottom: {
|
|
32
|
-
base: string;
|
|
33
|
-
md: string;
|
|
34
|
-
};
|
|
35
|
-
paddingRight: {
|
|
36
|
-
base: string;
|
|
37
|
-
md: string;
|
|
38
|
-
};
|
|
39
14
|
gap: string;
|
|
40
15
|
borderRightRadius: string;
|
|
41
|
-
" > span": {
|
|
42
|
-
display: {
|
|
43
|
-
base: string;
|
|
44
|
-
md: string;
|
|
45
|
-
};
|
|
46
|
-
};
|
|
47
16
|
" > svg": {
|
|
48
17
|
margin: number;
|
|
49
18
|
};
|
|
50
19
|
};
|
|
51
20
|
select: {
|
|
52
|
-
paddingBottom: {
|
|
53
|
-
base: "xs";
|
|
54
|
-
md: "unset";
|
|
55
|
-
};
|
|
56
21
|
flexShrink: string;
|
|
57
|
-
marginBottom: {
|
|
58
|
-
base: "-1px";
|
|
59
|
-
md: "0";
|
|
60
|
-
};
|
|
61
|
-
maxWidth: {
|
|
62
|
-
base: any;
|
|
63
|
-
md: "255px";
|
|
64
|
-
};
|
|
65
22
|
textOverflow: string;
|
|
66
23
|
_hover: {
|
|
67
24
|
zIndex: string;
|
|
@@ -70,15 +27,16 @@ declare const SearchBar: {
|
|
|
70
27
|
};
|
|
71
28
|
};
|
|
72
29
|
};
|
|
30
|
+
display: string;
|
|
73
31
|
};
|
|
74
32
|
sizes?: {
|
|
75
33
|
[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
|
|
76
|
-
keys: "select"[];
|
|
34
|
+
keys: ("select" | "button")[];
|
|
77
35
|
}>;
|
|
78
36
|
};
|
|
79
37
|
variants?: {
|
|
80
38
|
[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
|
|
81
|
-
keys: "select"[];
|
|
39
|
+
keys: ("select" | "button")[];
|
|
82
40
|
}>;
|
|
83
41
|
};
|
|
84
42
|
defaultProps?: {
|
|
@@ -86,6 +44,6 @@ declare const SearchBar: {
|
|
|
86
44
|
variant?: string | number;
|
|
87
45
|
colorScheme?: string;
|
|
88
46
|
};
|
|
89
|
-
parts: "select"[];
|
|
47
|
+
parts: ("select" | "button")[];
|
|
90
48
|
};
|
|
91
49
|
export default SearchBar;
|
|
@@ -45,7 +45,7 @@ export declare const recommendation: {
|
|
|
45
45
|
};
|
|
46
46
|
};
|
|
47
47
|
declare const StatusBadge: {
|
|
48
|
-
baseStyle?: {
|
|
48
|
+
baseStyle?: ({ labelFontSize }: import("@chakra-ui/styled-system").StyleFunctionProps) => {
|
|
49
49
|
alignItems: string;
|
|
50
50
|
bgColor: string;
|
|
51
51
|
borderLeft: string;
|
|
@@ -53,7 +53,7 @@ declare const StatusBadge: {
|
|
|
53
53
|
borderRadius: string;
|
|
54
54
|
color: string;
|
|
55
55
|
display: string;
|
|
56
|
-
fontSize:
|
|
56
|
+
fontSize: any;
|
|
57
57
|
fontWeight: string;
|
|
58
58
|
py: string;
|
|
59
59
|
paddingInlineEnd: string;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Generates container query styles based on the provided breakpoint and styles.
|
|
3
|
+
*
|
|
4
|
+
* @param {string} props.breakpoint - The breakpoint at which the container query should apply. It can be "base" or a key from the breakpoints object.
|
|
5
|
+
* @param {object} props.styles - The styles to apply within the container query.
|
|
6
|
+
* @returns {object} An object containing the container query styles.
|
|
7
|
+
*/
|
|
8
|
+
export declare const setContainerStyles: (props: {
|
|
9
|
+
breakpoint: string;
|
|
10
|
+
styles: object;
|
|
11
|
+
}) => object;
|