@esic-lab/data-core-ui 0.0.16 → 0.0.17

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.
Files changed (8) hide show
  1. package/dist/{STO-logo-KFQUNTJ3.svg → STO-logo-ADYYAPS3.svg} +92 -92
  2. package/dist/assets/STO-logo.svg +92 -92
  3. package/dist/index.css +164 -0
  4. package/dist/index.d.mts +21 -8
  5. package/dist/index.d.ts +21 -8
  6. package/dist/index.js +110 -114
  7. package/dist/index.mjs +149 -153
  8. package/package.json +6 -2
package/dist/index.css CHANGED
@@ -27,10 +27,13 @@
27
27
  --color-red-400: #f16965;
28
28
  --color-red-500: #ee443f;
29
29
  --color-red-600: #d93e39;
30
+ --color-red-700: #a9302d;
30
31
  --color-yellow-400: #ffbb33;
31
32
  --color-green-400: #69c57d;
32
33
  --color-green-500: #43b75d;
34
+ --color-green-600: #3da755;
33
35
  --color-blue-500: #0095ff;
36
+ --color-blue-800: #00528c;
34
37
  --color-indigo-100: oklch(93% 0.034 272.788);
35
38
  --color-indigo-800: oklch(39.8% 0.195 277.366);
36
39
  --color-gray-50: #f9fafb;
@@ -44,12 +47,15 @@
44
47
  --color-black: #000;
45
48
  --color-white: #fff;
46
49
  --spacing: 0.25rem;
50
+ --text-xs: 0.75rem;
51
+ --text-xs--line-height: calc(1 / 0.75);
47
52
  --text-sm: 0.875rem;
48
53
  --text-sm--line-height: calc(1.25 / 0.875);
49
54
  --text-lg: 1.125rem;
50
55
  --text-lg--line-height: calc(1.75 / 1.125);
51
56
  --font-weight-medium: 500;
52
57
  --font-weight-semibold: 600;
58
+ --radius-sm: 0.25rem;
53
59
  --radius-md: 0.375rem;
54
60
  --radius-lg: 0.5rem;
55
61
  --radius-2xl: 1rem;
@@ -284,6 +290,12 @@
284
290
  .top-3 {
285
291
  top: calc(var(--spacing) * 3);
286
292
  }
293
+ .top-12 {
294
+ top: calc(var(--spacing) * 12);
295
+ }
296
+ .right-0 {
297
+ right: calc(var(--spacing) * 0);
298
+ }
287
299
  .right-3 {
288
300
  right: calc(var(--spacing) * 3);
289
301
  }
@@ -296,9 +308,18 @@
296
308
  .z-50 {
297
309
  z-index: 50;
298
310
  }
311
+ .mx-2 {
312
+ margin-inline: calc(var(--spacing) * 2);
313
+ }
314
+ .my-1 {
315
+ margin-block: calc(var(--spacing) * 1);
316
+ }
299
317
  .my-2 {
300
318
  margin-block: calc(var(--spacing) * 2);
301
319
  }
320
+ .mt-2 {
321
+ margin-top: calc(var(--spacing) * 2);
322
+ }
302
323
  .mt-4 {
303
324
  margin-top: calc(var(--spacing) * 4);
304
325
  }
@@ -308,6 +329,9 @@
308
329
  .mt-\[10px\] {
309
330
  margin-top: 10px;
310
331
  }
332
+ .mr-2 {
333
+ margin-right: calc(var(--spacing) * 2);
334
+ }
311
335
  .mr-\[8px\] {
312
336
  margin-right: 8px;
313
337
  }
@@ -320,6 +344,9 @@
320
344
  .mb-\[8px\] {
321
345
  margin-bottom: 8px;
322
346
  }
347
+ .ml-2 {
348
+ margin-left: calc(var(--spacing) * 2);
349
+ }
323
350
  .ml-3 {
324
351
  margin-left: calc(var(--spacing) * 3);
325
352
  }
@@ -344,6 +371,12 @@
344
371
  .inline-block {
345
372
  display: inline-block;
346
373
  }
374
+ .inline-flex {
375
+ display: inline-flex;
376
+ }
377
+ .h-4 {
378
+ height: calc(var(--spacing) * 4);
379
+ }
347
380
  .h-5 {
348
381
  height: calc(var(--spacing) * 5);
349
382
  }
@@ -362,6 +395,9 @@
362
395
  .h-\[16px\] {
363
396
  height: 16px;
364
397
  }
398
+ .h-\[20px\] {
399
+ height: 20px;
400
+ }
365
401
  .h-\[24px\] {
366
402
  height: 24px;
367
403
  }
@@ -404,12 +440,27 @@
404
440
  .h-screen {
405
441
  height: 100vh;
406
442
  }
443
+ .max-h-\[250px\] {
444
+ max-height: 250px;
445
+ }
446
+ .max-h-\[300px\] {
447
+ max-height: 300px;
448
+ }
407
449
  .min-h-\[120px\] {
408
450
  min-height: 120px;
409
451
  }
410
452
  .w-0 {
411
453
  width: calc(var(--spacing) * 0);
412
454
  }
455
+ .w-1\/2 {
456
+ width: calc(1/2 * 100%);
457
+ }
458
+ .w-1\/4 {
459
+ width: calc(1/4 * 100%);
460
+ }
461
+ .w-4 {
462
+ width: calc(var(--spacing) * 4);
463
+ }
413
464
  .w-5 {
414
465
  width: calc(var(--spacing) * 5);
415
466
  }
@@ -437,6 +488,9 @@
437
488
  .w-\[16px\] {
438
489
  width: 16px;
439
490
  }
491
+ .w-\[20px\] {
492
+ width: 20px;
493
+ }
440
494
  .w-\[24px\] {
441
495
  width: 24px;
442
496
  }
@@ -470,6 +524,9 @@
470
524
  .w-\[250px\] {
471
525
  width: 250px;
472
526
  }
527
+ .w-\[300px\] {
528
+ width: 300px;
529
+ }
473
530
  .w-\[500px\] {
474
531
  width: 500px;
475
532
  }
@@ -493,6 +550,10 @@
493
550
  --tw-translate-x: calc(var(--spacing) * 0);
494
551
  translate: var(--tw-translate-x) var(--tw-translate-y);
495
552
  }
553
+ .translate-x-2 {
554
+ --tw-translate-x: calc(var(--spacing) * 2);
555
+ translate: var(--tw-translate-x) var(--tw-translate-y);
556
+ }
496
557
  .translate-x-6 {
497
558
  --tw-translate-x: calc(var(--spacing) * 6);
498
559
  translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -501,6 +562,10 @@
501
562
  --tw-translate-y: calc(calc(1/2 * 100%) * -1);
502
563
  translate: var(--tw-translate-x) var(--tw-translate-y);
503
564
  }
565
+ .-translate-y-2 {
566
+ --tw-translate-y: calc(var(--spacing) * -2);
567
+ translate: var(--tw-translate-x) var(--tw-translate-y);
568
+ }
504
569
  .scale-0 {
505
570
  --tw-scale-x: 0%;
506
571
  --tw-scale-y: 0%;
@@ -531,6 +596,9 @@
531
596
  .\[grid-template-columns\:repeat\(var\(--cols\)\,minmax\(0\,1fr\)\)\] {
532
597
  grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
533
598
  }
599
+ .grid-cols-3 {
600
+ grid-template-columns: repeat(3, minmax(0, 1fr));
601
+ }
534
602
  .flex-col {
535
603
  flex-direction: column;
536
604
  }
@@ -561,6 +629,20 @@
561
629
  .gap-\[20px\] {
562
630
  gap: 20px;
563
631
  }
632
+ .space-y-1 {
633
+ :where(& > :not(:last-child)) {
634
+ --tw-space-y-reverse: 0;
635
+ margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
636
+ margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
637
+ }
638
+ }
639
+ .-space-x-2 {
640
+ :where(& > :not(:last-child)) {
641
+ --tw-space-x-reverse: 0;
642
+ margin-inline-start: calc(calc(var(--spacing) * -2) * var(--tw-space-x-reverse));
643
+ margin-inline-end: calc(calc(var(--spacing) * -2) * calc(1 - var(--tw-space-x-reverse)));
644
+ }
645
+ }
564
646
  .truncate {
565
647
  overflow: hidden;
566
648
  text-overflow: ellipsis;
@@ -569,6 +651,9 @@
569
651
  .overflow-hidden {
570
652
  overflow: hidden;
571
653
  }
654
+ .overflow-y-auto {
655
+ overflow-y: auto;
656
+ }
572
657
  .rounded {
573
658
  border-radius: 0.25rem;
574
659
  }
@@ -596,14 +681,25 @@
596
681
  .rounded-md {
597
682
  border-radius: var(--radius-md);
598
683
  }
684
+ .rounded-sm {
685
+ border-radius: var(--radius-sm);
686
+ }
599
687
  .border {
600
688
  border-style: var(--tw-border-style);
601
689
  border-width: 1px;
602
690
  }
691
+ .border-1 {
692
+ border-style: var(--tw-border-style);
693
+ border-width: 1px;
694
+ }
603
695
  .border-2 {
604
696
  border-style: var(--tw-border-style);
605
697
  border-width: 2px;
606
698
  }
699
+ .border-4 {
700
+ border-style: var(--tw-border-style);
701
+ border-width: 4px;
702
+ }
607
703
  .border-\[1px\] {
608
704
  border-style: var(--tw-border-style);
609
705
  border-width: 1px;
@@ -642,9 +738,15 @@
642
738
  .border-primary-500 {
643
739
  border-color: var(--color-primary-500);
644
740
  }
741
+ .border-red-500 {
742
+ border-color: var(--color-red-500);
743
+ }
645
744
  .border-red-600 {
646
745
  border-color: var(--color-red-600);
647
746
  }
747
+ .border-white {
748
+ border-color: var(--color-white);
749
+ }
648
750
  .bg-\[\#E9E9E9\] {
649
751
  background-color: #E9E9E9;
650
752
  }
@@ -696,6 +798,9 @@
696
798
  .p-1\.5 {
697
799
  padding: calc(var(--spacing) * 1.5);
698
800
  }
801
+ .p-2 {
802
+ padding: calc(var(--spacing) * 2);
803
+ }
699
804
  .p-4 {
700
805
  padding: calc(var(--spacing) * 4);
701
806
  }
@@ -758,6 +863,10 @@
758
863
  font-size: var(--text-sm);
759
864
  line-height: var(--tw-leading, var(--text-sm--line-height));
760
865
  }
866
+ .text-xs {
867
+ font-size: var(--text-xs);
868
+ line-height: var(--tw-leading, var(--text-xs--line-height));
869
+ }
761
870
  .text-\[20px\] {
762
871
  font-size: 20px;
763
872
  }
@@ -778,6 +887,9 @@
778
887
  .text-black {
779
888
  color: var(--color-black);
780
889
  }
890
+ .text-gray-300 {
891
+ color: var(--color-gray-300);
892
+ }
781
893
  .text-gray-400 {
782
894
  color: var(--color-gray-400);
783
895
  }
@@ -790,6 +902,9 @@
790
902
  .text-gray-700 {
791
903
  color: var(--color-gray-700);
792
904
  }
905
+ .text-green-600 {
906
+ color: var(--color-green-600);
907
+ }
793
908
  .text-indigo-800 {
794
909
  color: var(--color-indigo-800);
795
910
  }
@@ -805,6 +920,12 @@
805
920
  .uppercase {
806
921
  text-transform: uppercase;
807
922
  }
923
+ .italic {
924
+ font-style: italic;
925
+ }
926
+ .underline {
927
+ text-decoration-line: underline;
928
+ }
808
929
  .opacity-0 {
809
930
  opacity: 0%;
810
931
  }
@@ -938,6 +1059,14 @@
938
1059
  }
939
1060
  }
940
1061
  }
1062
+ .group-hover\:border-2 {
1063
+ &:is(:where(.group):hover *) {
1064
+ @media (hover: hover) {
1065
+ border-style: var(--tw-border-style);
1066
+ border-width: 2px;
1067
+ }
1068
+ }
1069
+ }
941
1070
  .group-hover\:border-\[1px\] {
942
1071
  &:is(:where(.group):hover *) {
943
1072
  @media (hover: hover) {
@@ -953,6 +1082,13 @@
953
1082
  }
954
1083
  }
955
1084
  }
1085
+ .group-hover\:border-red-500 {
1086
+ &:is(:where(.group):hover *) {
1087
+ @media (hover: hover) {
1088
+ border-color: var(--color-red-500);
1089
+ }
1090
+ }
1091
+ }
956
1092
  .group-hover\:bg-white {
957
1093
  &:is(:where(.group):hover *) {
958
1094
  @media (hover: hover) {
@@ -1043,6 +1179,13 @@
1043
1179
  }
1044
1180
  }
1045
1181
  }
1182
+ .hover\:text-blue-800 {
1183
+ &:hover {
1184
+ @media (hover: hover) {
1185
+ color: var(--color-blue-800);
1186
+ }
1187
+ }
1188
+ }
1046
1189
  .hover\:text-gray-400 {
1047
1190
  &:hover {
1048
1191
  @media (hover: hover) {
@@ -1071,6 +1214,13 @@
1071
1214
  }
1072
1215
  }
1073
1216
  }
1217
+ .hover\:text-red-700 {
1218
+ &:hover {
1219
+ @media (hover: hover) {
1220
+ color: var(--color-red-700);
1221
+ }
1222
+ }
1223
+ }
1074
1224
  .hover\:text-white {
1075
1225
  &:hover {
1076
1226
  @media (hover: hover) {
@@ -1355,6 +1505,16 @@
1355
1505
  .custom-select .ant-select-selection-item {
1356
1506
  color: #fff !important;
1357
1507
  }
1508
+ :where(.css-dev-only-do-not-override-mfr87o).ant-color-picker-trigger {
1509
+ justify-content: left;
1510
+ }
1511
+ @layer utilities {
1512
+ .container-input {
1513
+ display: flex;
1514
+ flex-direction: column;
1515
+ gap: 8px;
1516
+ }
1517
+ }
1358
1518
  @property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; }
1359
1519
  @property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; }
1360
1520
  @property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0; }
@@ -1366,6 +1526,8 @@
1366
1526
  @property --tw-rotate-z { syntax: "*"; inherits: false; }
1367
1527
  @property --tw-skew-x { syntax: "*"; inherits: false; }
1368
1528
  @property --tw-skew-y { syntax: "*"; inherits: false; }
1529
+ @property --tw-space-y-reverse { syntax: "*"; inherits: false; initial-value: 0; }
1530
+ @property --tw-space-x-reverse { syntax: "*"; inherits: false; initial-value: 0; }
1369
1531
  @property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; }
1370
1532
  @property --tw-font-weight { syntax: "*"; inherits: false; }
1371
1533
  @property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@@ -1419,6 +1581,8 @@
1419
1581
  --tw-rotate-z: initial;
1420
1582
  --tw-skew-x: initial;
1421
1583
  --tw-skew-y: initial;
1584
+ --tw-space-y-reverse: 0;
1585
+ --tw-space-x-reverse: 0;
1422
1586
  --tw-border-style: solid;
1423
1587
  --tw-font-weight: initial;
1424
1588
  --tw-shadow: 0 0 #0000;
package/dist/index.d.mts CHANGED
@@ -185,8 +185,9 @@ interface InputFieldProps {
185
185
  addonBefore?: ReactNode;
186
186
  addonAfter?: ReactNode;
187
187
  defaultValue?: string;
188
+ className?: string;
188
189
  }
189
- declare function InputField({ value, onChange, placeholder, title, require, bottomText, disabled, showError, errorMessage, addonBefore, addonAfter, defaultValue, }: InputFieldProps): react_jsx_runtime.JSX.Element;
190
+ declare function InputField({ value, onChange, placeholder, title, require, bottomText, disabled, showError, errorMessage, addonBefore, addonAfter, defaultValue, className, }: InputFieldProps): react_jsx_runtime.JSX.Element;
190
191
 
191
192
  interface TextAreaProps {
192
193
  label?: string;
@@ -701,8 +702,9 @@ interface TimePickerBasicProps {
701
702
  errorMessage?: string;
702
703
  placeholder?: string;
703
704
  disabled?: boolean;
705
+ className?: string;
704
706
  }
705
- declare function TimePickerBasic({ value, onChange, require, title, bottomText, showError, errorMessage, placeholder, disabled, }: TimePickerBasicProps): react_jsx_runtime.JSX.Element;
707
+ declare function TimePickerBasic({ value, onChange, require, title, bottomText, showError, errorMessage, placeholder, disabled, className }: TimePickerBasicProps): react_jsx_runtime.JSX.Element;
706
708
 
707
709
  interface TimePickerRangePickerProps {
708
710
  value: [dayjs.Dayjs | null, dayjs.Dayjs | null] | null;
@@ -714,8 +716,9 @@ interface TimePickerRangePickerProps {
714
716
  showError?: boolean;
715
717
  errorMessage?: string;
716
718
  disabled?: boolean;
719
+ className?: string;
717
720
  }
718
- declare function TimePickerRangePicker({ value, onChange, placeholder, title, require, bottomText, showError, errorMessage, disabled, }: TimePickerRangePickerProps): react_jsx_runtime.JSX.Element;
721
+ declare function TimePickerRangePicker({ value, onChange, placeholder, title, require, bottomText, showError, errorMessage, disabled, className }: TimePickerRangePickerProps): react_jsx_runtime.JSX.Element;
719
722
 
720
723
  interface SelectFieldProps$1 {
721
724
  value?: SelectProps["value"];
@@ -737,8 +740,9 @@ interface SelectFieldProps$1 {
737
740
  handleSearch?: (value: string) => void;
738
741
  prefix?: ReactNode;
739
742
  prefixSize?: number;
743
+ className?: string;
740
744
  }
741
- declare function SelectField({ value, onChange, placeholder, title, require, bottomText, showError, errorMessage, disabled, defaultValue, options, mode, prefix, prefixSize, handleSearch, }: SelectFieldProps$1): react_jsx_runtime.JSX.Element;
745
+ declare function SelectField({ value, onChange, placeholder, title, require, bottomText, showError, errorMessage, disabled, defaultValue, options, mode, prefix, prefixSize, handleSearch, className }: SelectFieldProps$1): react_jsx_runtime.JSX.Element;
742
746
 
743
747
  interface SelectFieldProps {
744
748
  value?: SelectProps["value"];
@@ -763,8 +767,9 @@ interface SelectFieldProps {
763
767
  handleSearch?: (value: string) => void;
764
768
  prefix?: ReactNode;
765
769
  prefixSize?: number;
770
+ className?: string;
766
771
  }
767
- declare function SelectFieldGroup({ value, onChange, placeholder, title, require, bottomText, showError, errorMessage, disabled, defaultValue, options, mode, prefix, prefixSize, handleSearch, }: SelectFieldProps): react_jsx_runtime.JSX.Element;
772
+ declare function SelectFieldGroup({ value, onChange, placeholder, title, require, bottomText, showError, errorMessage, disabled, defaultValue, options, mode, prefix, prefixSize, handleSearch, className }: SelectFieldProps): react_jsx_runtime.JSX.Element;
768
773
 
769
774
  interface SelectFieldStatusProps {
770
775
  value: string | undefined;
@@ -776,8 +781,14 @@ interface SelectFieldStatusProps {
776
781
  disabled?: boolean;
777
782
  showError?: boolean;
778
783
  errorMessage?: string;
784
+ options?: {
785
+ label: ReactNode;
786
+ value: string | number | null;
787
+ disabled?: boolean;
788
+ }[];
789
+ className?: string;
779
790
  }
780
- declare function SelectFieldStatus({ value, onChange, placeholder, title, require, bottomText, disabled, showError, errorMessage }: SelectFieldStatusProps): react_jsx_runtime.JSX.Element;
791
+ declare function SelectFieldStatus({ value, onChange, placeholder, title, require, bottomText, disabled, showError, errorMessage, options, className }: SelectFieldStatusProps): react_jsx_runtime.JSX.Element;
781
792
 
782
793
  interface SelectFieldStatusReportProps {
783
794
  value: string | undefined;
@@ -789,8 +800,9 @@ interface SelectFieldStatusReportProps {
789
800
  disabled?: boolean;
790
801
  showError?: boolean;
791
802
  errorMessage?: string;
803
+ className?: string;
792
804
  }
793
- declare function SelectFieldStatusReport({ value, onChange, placeholder, title, require, bottomText, disabled, showError, errorMessage, }: SelectFieldStatusReportProps): react_jsx_runtime.JSX.Element;
805
+ declare function SelectFieldStatusReport({ value, onChange, placeholder, title, require, bottomText, disabled, showError, errorMessage, className }: SelectFieldStatusReportProps): react_jsx_runtime.JSX.Element;
794
806
 
795
807
  interface SelectFieldTagProps {
796
808
  title?: string | null;
@@ -806,8 +818,9 @@ interface SelectFieldTagProps {
806
818
  errorMessage?: string;
807
819
  value?: string[];
808
820
  onChange?: (val: string[]) => void;
821
+ className?: string;
809
822
  }
810
- declare function SelectFieldTag({ title, require, bottomText, placeholder, options, showError, errorMessage, value: controlledValue, onChange, }: SelectFieldTagProps): react_jsx_runtime.JSX.Element;
823
+ declare function SelectFieldTag({ title, require, bottomText, placeholder, options, showError, errorMessage, value: controlledValue, className, onChange, }: SelectFieldTagProps): react_jsx_runtime.JSX.Element;
811
824
 
812
825
  interface SortFilterProps {
813
826
  showYear?: boolean;
package/dist/index.d.ts CHANGED
@@ -185,8 +185,9 @@ interface InputFieldProps {
185
185
  addonBefore?: ReactNode;
186
186
  addonAfter?: ReactNode;
187
187
  defaultValue?: string;
188
+ className?: string;
188
189
  }
189
- declare function InputField({ value, onChange, placeholder, title, require, bottomText, disabled, showError, errorMessage, addonBefore, addonAfter, defaultValue, }: InputFieldProps): react_jsx_runtime.JSX.Element;
190
+ declare function InputField({ value, onChange, placeholder, title, require, bottomText, disabled, showError, errorMessage, addonBefore, addonAfter, defaultValue, className, }: InputFieldProps): react_jsx_runtime.JSX.Element;
190
191
 
191
192
  interface TextAreaProps {
192
193
  label?: string;
@@ -701,8 +702,9 @@ interface TimePickerBasicProps {
701
702
  errorMessage?: string;
702
703
  placeholder?: string;
703
704
  disabled?: boolean;
705
+ className?: string;
704
706
  }
705
- declare function TimePickerBasic({ value, onChange, require, title, bottomText, showError, errorMessage, placeholder, disabled, }: TimePickerBasicProps): react_jsx_runtime.JSX.Element;
707
+ declare function TimePickerBasic({ value, onChange, require, title, bottomText, showError, errorMessage, placeholder, disabled, className }: TimePickerBasicProps): react_jsx_runtime.JSX.Element;
706
708
 
707
709
  interface TimePickerRangePickerProps {
708
710
  value: [dayjs.Dayjs | null, dayjs.Dayjs | null] | null;
@@ -714,8 +716,9 @@ interface TimePickerRangePickerProps {
714
716
  showError?: boolean;
715
717
  errorMessage?: string;
716
718
  disabled?: boolean;
719
+ className?: string;
717
720
  }
718
- declare function TimePickerRangePicker({ value, onChange, placeholder, title, require, bottomText, showError, errorMessage, disabled, }: TimePickerRangePickerProps): react_jsx_runtime.JSX.Element;
721
+ declare function TimePickerRangePicker({ value, onChange, placeholder, title, require, bottomText, showError, errorMessage, disabled, className }: TimePickerRangePickerProps): react_jsx_runtime.JSX.Element;
719
722
 
720
723
  interface SelectFieldProps$1 {
721
724
  value?: SelectProps["value"];
@@ -737,8 +740,9 @@ interface SelectFieldProps$1 {
737
740
  handleSearch?: (value: string) => void;
738
741
  prefix?: ReactNode;
739
742
  prefixSize?: number;
743
+ className?: string;
740
744
  }
741
- declare function SelectField({ value, onChange, placeholder, title, require, bottomText, showError, errorMessage, disabled, defaultValue, options, mode, prefix, prefixSize, handleSearch, }: SelectFieldProps$1): react_jsx_runtime.JSX.Element;
745
+ declare function SelectField({ value, onChange, placeholder, title, require, bottomText, showError, errorMessage, disabled, defaultValue, options, mode, prefix, prefixSize, handleSearch, className }: SelectFieldProps$1): react_jsx_runtime.JSX.Element;
742
746
 
743
747
  interface SelectFieldProps {
744
748
  value?: SelectProps["value"];
@@ -763,8 +767,9 @@ interface SelectFieldProps {
763
767
  handleSearch?: (value: string) => void;
764
768
  prefix?: ReactNode;
765
769
  prefixSize?: number;
770
+ className?: string;
766
771
  }
767
- declare function SelectFieldGroup({ value, onChange, placeholder, title, require, bottomText, showError, errorMessage, disabled, defaultValue, options, mode, prefix, prefixSize, handleSearch, }: SelectFieldProps): react_jsx_runtime.JSX.Element;
772
+ declare function SelectFieldGroup({ value, onChange, placeholder, title, require, bottomText, showError, errorMessage, disabled, defaultValue, options, mode, prefix, prefixSize, handleSearch, className }: SelectFieldProps): react_jsx_runtime.JSX.Element;
768
773
 
769
774
  interface SelectFieldStatusProps {
770
775
  value: string | undefined;
@@ -776,8 +781,14 @@ interface SelectFieldStatusProps {
776
781
  disabled?: boolean;
777
782
  showError?: boolean;
778
783
  errorMessage?: string;
784
+ options?: {
785
+ label: ReactNode;
786
+ value: string | number | null;
787
+ disabled?: boolean;
788
+ }[];
789
+ className?: string;
779
790
  }
780
- declare function SelectFieldStatus({ value, onChange, placeholder, title, require, bottomText, disabled, showError, errorMessage }: SelectFieldStatusProps): react_jsx_runtime.JSX.Element;
791
+ declare function SelectFieldStatus({ value, onChange, placeholder, title, require, bottomText, disabled, showError, errorMessage, options, className }: SelectFieldStatusProps): react_jsx_runtime.JSX.Element;
781
792
 
782
793
  interface SelectFieldStatusReportProps {
783
794
  value: string | undefined;
@@ -789,8 +800,9 @@ interface SelectFieldStatusReportProps {
789
800
  disabled?: boolean;
790
801
  showError?: boolean;
791
802
  errorMessage?: string;
803
+ className?: string;
792
804
  }
793
- declare function SelectFieldStatusReport({ value, onChange, placeholder, title, require, bottomText, disabled, showError, errorMessage, }: SelectFieldStatusReportProps): react_jsx_runtime.JSX.Element;
805
+ declare function SelectFieldStatusReport({ value, onChange, placeholder, title, require, bottomText, disabled, showError, errorMessage, className }: SelectFieldStatusReportProps): react_jsx_runtime.JSX.Element;
794
806
 
795
807
  interface SelectFieldTagProps {
796
808
  title?: string | null;
@@ -806,8 +818,9 @@ interface SelectFieldTagProps {
806
818
  errorMessage?: string;
807
819
  value?: string[];
808
820
  onChange?: (val: string[]) => void;
821
+ className?: string;
809
822
  }
810
- declare function SelectFieldTag({ title, require, bottomText, placeholder, options, showError, errorMessage, value: controlledValue, onChange, }: SelectFieldTagProps): react_jsx_runtime.JSX.Element;
823
+ declare function SelectFieldTag({ title, require, bottomText, placeholder, options, showError, errorMessage, value: controlledValue, className, onChange, }: SelectFieldTagProps): react_jsx_runtime.JSX.Element;
811
824
 
812
825
  interface SortFilterProps {
813
826
  showYear?: boolean;