analytica-frontend-lib 1.0.17 → 1.0.19

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/index.css CHANGED
@@ -22,6 +22,7 @@
22
22
  "Liberation Mono",
23
23
  "Courier New",
24
24
  monospace;
25
+ --color-white: #fff;
25
26
  --spacing: 0.25rem;
26
27
  --text-xs: 0.75rem;
27
28
  --text-xs--line-height: calc(1 / 0.75);
@@ -50,6 +51,7 @@
50
51
  --font-weight-bold: 700;
51
52
  --font-weight-extrabold: 800;
52
53
  --font-weight-black: 900;
54
+ --radius-xs: 0.125rem;
53
55
  --radius-sm: 0.25rem;
54
56
  --radius-md: 0.375rem;
55
57
  --radius-lg: 0.5rem;
@@ -58,6 +60,7 @@
58
60
  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
59
61
  --default-font-family: var(--font-sans);
60
62
  --default-mono-font-family: var(--font-mono);
63
+ --color-primary: #b3b3b3;
61
64
  --color-primary-50: #999999;
62
65
  --color-primary-100: #808080;
63
66
  --color-primary-400: #525252;
@@ -78,25 +81,47 @@
78
81
  --color-background-50: #f6f6f6;
79
82
  --color-background-100: #f2f1f1;
80
83
  --color-background-200: #dcdbdb;
84
+ --color-background-500: #8e8e8e;
85
+ --color-background-800: #414040;
81
86
  --color-background-muted: #f7f8f7;
82
87
  --color-border-50: #f3f3f3;
83
88
  --color-border-100: #e6e6e6;
84
89
  --color-border-200: #dddcdb;
90
+ --color-border-300: #d3d3d3;
85
91
  --color-border-400: #a5a3a3;
86
92
  --color-border-500: #8c8d8d;
93
+ --color-success: #e4fff4;
94
+ --color-success-200: #84d3a2;
87
95
  --color-success-300: #66b584;
88
96
  --color-success-400: #489766;
89
97
  --color-success-500: #348352;
90
98
  --color-success-600: #2a7948;
91
99
  --color-success-700: #206f3e;
100
+ --color-success-800: #166534;
101
+ --color-error: #fee9e9;
92
102
  --color-error-300: #f87171;
93
103
  --color-error-400: #ef4444;
94
104
  --color-error-500: #e63535;
95
105
  --color-error-600: #dc2626;
96
106
  --color-error-700: #b91c1c;
107
+ --color-error-800: #991b1b;
108
+ --color-warning: #fff9f5;
109
+ --color-warning-200: #fecdaa;
110
+ --color-warning-300: #fdad74;
111
+ --color-warning-800: #824417;
112
+ --color-info: #ecf8fe;
113
+ --color-info-200: #7ccff8;
114
+ --color-info-300: #57c2f6;
115
+ --color-info-800: #075a83;
97
116
  --color-indicator-primary: #373737;
98
117
  --color-indicator-info: #5399ec;
99
118
  --color-indicator-error: #b91c1c;
119
+ --color-exame-1: #e3f1fb;
120
+ --color-exame-2: #fde5fa;
121
+ --color-exame-3: #fff4d1;
122
+ --color-exame-4: #ddf5e5;
123
+ --color-typography-1: #b00c9e;
124
+ --color-typography-2: #745A07;
100
125
  --font-weight-hairline: 100;
101
126
  --text-2xs: 0.625rem;
102
127
  --text-2xs--line-height: calc(1 / 0.625);
@@ -324,12 +349,27 @@
324
349
  .relative {
325
350
  position: relative;
326
351
  }
352
+ .top-4 {
353
+ top: calc(var(--spacing) * 4);
354
+ }
355
+ .top-\[5px\] {
356
+ top: 5px;
357
+ }
327
358
  .top-full {
328
359
  top: 100%;
329
360
  }
330
361
  .right-0 {
331
362
  right: calc(var(--spacing) * 0);
332
363
  }
364
+ .right-4 {
365
+ right: calc(var(--spacing) * 4);
366
+ }
367
+ .right-\[10px\] {
368
+ right: 10px;
369
+ }
370
+ .bottom-4 {
371
+ bottom: calc(var(--spacing) * 4);
372
+ }
333
373
  .bottom-full {
334
374
  bottom: 100%;
335
375
  }
@@ -339,6 +379,9 @@
339
379
  .left-1\/2 {
340
380
  left: calc(1/2 * 100%);
341
381
  }
382
+ .left-4 {
383
+ left: calc(var(--spacing) * 4);
384
+ }
342
385
  .z-50 {
343
386
  z-index: 50;
344
387
  }
@@ -369,6 +412,9 @@
369
412
  .my-4 {
370
413
  margin-block: calc(var(--spacing) * 4);
371
414
  }
415
+ .mt-1 {
416
+ margin-top: calc(var(--spacing) * 1);
417
+ }
372
418
  .mt-1\.5 {
373
419
  margin-top: calc(var(--spacing) * 1.5);
374
420
  }
@@ -399,6 +445,9 @@
399
445
  .ml-2 {
400
446
  margin-left: calc(var(--spacing) * 2);
401
447
  }
448
+ .block {
449
+ display: block;
450
+ }
402
451
  .flex {
403
452
  display: flex;
404
453
  }
@@ -411,6 +460,21 @@
411
460
  .table {
412
461
  display: table;
413
462
  }
463
+ .size-3 {
464
+ width: calc(var(--spacing) * 3);
465
+ height: calc(var(--spacing) * 3);
466
+ }
467
+ .size-3\.5 {
468
+ width: calc(var(--spacing) * 3.5);
469
+ height: calc(var(--spacing) * 3.5);
470
+ }
471
+ .size-4 {
472
+ width: calc(var(--spacing) * 4);
473
+ height: calc(var(--spacing) * 4);
474
+ }
475
+ .h-2 {
476
+ height: calc(var(--spacing) * 2);
477
+ }
414
478
  .h-4 {
415
479
  height: calc(var(--spacing) * 4);
416
480
  }
@@ -435,6 +499,9 @@
435
499
  .h-px {
436
500
  height: 1px;
437
501
  }
502
+ .w-2 {
503
+ width: calc(var(--spacing) * 2);
504
+ }
438
505
  .w-4 {
439
506
  width: calc(var(--spacing) * 4);
440
507
  }
@@ -453,6 +520,9 @@
453
520
  .w-full {
454
521
  width: 100%;
455
522
  }
523
+ .max-w-\[390px\] {
524
+ max-width: 390px;
525
+ }
456
526
  .min-w-\[210px\] {
457
527
  min-width: 210px;
458
528
  }
@@ -490,6 +560,12 @@
490
560
  .items-end {
491
561
  align-items: flex-end;
492
562
  }
563
+ .items-start {
564
+ align-items: flex-start;
565
+ }
566
+ .justify-between {
567
+ justify-content: space-between;
568
+ }
493
569
  .justify-center {
494
570
  justify-content: center;
495
571
  }
@@ -499,6 +575,9 @@
499
575
  .gap-0\.5 {
500
576
  gap: calc(var(--spacing) * 0.5);
501
577
  }
578
+ .gap-1 {
579
+ gap: calc(var(--spacing) * 1);
580
+ }
502
581
  .gap-1\.5 {
503
582
  gap: calc(var(--spacing) * 1.5);
504
583
  }
@@ -538,6 +617,9 @@
538
617
  .rounded-xl {
539
618
  border-radius: var(--radius-xl);
540
619
  }
620
+ .rounded-xs {
621
+ border-radius: var(--radius-xs);
622
+ }
541
623
  .border {
542
624
  border-style: var(--tw-border-style);
543
625
  border-width: 1px;
@@ -562,6 +644,10 @@
562
644
  border-bottom-style: var(--tw-border-style);
563
645
  border-bottom-width: 2px;
564
646
  }
647
+ .border-none {
648
+ --tw-border-style: none;
649
+ border-style: none;
650
+ }
565
651
  .border-background-200 {
566
652
  border-color: var(--color-background-200);
567
653
  }
@@ -574,6 +660,9 @@
574
660
  .border-border-200 {
575
661
  border-color: var(--color-border-200);
576
662
  }
663
+ .border-border-300 {
664
+ border-color: var(--color-border-300);
665
+ }
577
666
  .border-border-400 {
578
667
  border-color: var(--color-border-400);
579
668
  }
@@ -598,6 +687,12 @@
598
687
  .border-indicator-primary {
599
688
  border-color: var(--color-indicator-primary);
600
689
  }
690
+ .border-info-200 {
691
+ border-color: var(--color-info-200);
692
+ }
693
+ .border-info-300 {
694
+ border-color: var(--color-info-300);
695
+ }
601
696
  .border-primary-600 {
602
697
  border-color: var(--color-primary-600);
603
698
  }
@@ -607,12 +702,21 @@
607
702
  .border-primary-950 {
608
703
  border-color: var(--color-primary-950);
609
704
  }
705
+ .border-success-200 {
706
+ border-color: var(--color-success-200);
707
+ }
610
708
  .border-success-300 {
611
709
  border-color: var(--color-success-300);
612
710
  }
613
711
  .border-success-500 {
614
712
  border-color: var(--color-success-500);
615
713
  }
714
+ .border-warning-200 {
715
+ border-color: var(--color-warning-200);
716
+ }
717
+ .border-warning-300 {
718
+ border-color: var(--color-warning-300);
719
+ }
616
720
  .\!bg-primary-50 {
617
721
  background-color: var(--color-primary-50) !important;
618
722
  }
@@ -628,9 +732,30 @@
628
732
  .bg-border-200 {
629
733
  background-color: var(--color-border-200);
630
734
  }
735
+ .bg-error {
736
+ background-color: var(--color-error);
737
+ }
631
738
  .bg-error-500 {
632
739
  background-color: var(--color-error-500);
633
740
  }
741
+ .bg-exame-1 {
742
+ background-color: var(--color-exame-1);
743
+ }
744
+ .bg-exame-2 {
745
+ background-color: var(--color-exame-2);
746
+ }
747
+ .bg-exame-3 {
748
+ background-color: var(--color-exame-3);
749
+ }
750
+ .bg-exame-4 {
751
+ background-color: var(--color-exame-4);
752
+ }
753
+ .bg-indicator-error {
754
+ background-color: var(--color-indicator-error);
755
+ }
756
+ .bg-info {
757
+ background-color: var(--color-info);
758
+ }
634
759
  .bg-primary-50 {
635
760
  background-color: var(--color-primary-50);
636
761
  }
@@ -643,12 +768,18 @@
643
768
  .bg-primary-950 {
644
769
  background-color: var(--color-primary-950);
645
770
  }
771
+ .bg-success {
772
+ background-color: var(--color-success);
773
+ }
646
774
  .bg-success-500 {
647
775
  background-color: var(--color-success-500);
648
776
  }
649
777
  .bg-transparent {
650
778
  background-color: transparent;
651
779
  }
780
+ .bg-warning {
781
+ background-color: var(--color-warning);
782
+ }
652
783
  .p-1 {
653
784
  padding: calc(var(--spacing) * 1);
654
785
  }
@@ -667,6 +798,9 @@
667
798
  .p-8 {
668
799
  padding: calc(var(--spacing) * 8);
669
800
  }
801
+ .px-2 {
802
+ padding-inline: calc(var(--spacing) * 2);
803
+ }
670
804
  .px-3\.5 {
671
805
  padding-inline: calc(var(--spacing) * 3.5);
672
806
  }
@@ -802,18 +936,45 @@
802
936
  .\!text-primary-950 {
803
937
  color: var(--color-primary-950) !important;
804
938
  }
939
+ .text-background-500 {
940
+ color: var(--color-background-500);
941
+ }
942
+ .text-background-800 {
943
+ color: var(--color-background-800);
944
+ }
805
945
  .text-error-500 {
806
946
  color: var(--color-error-500);
807
947
  }
808
948
  .text-error-600 {
809
949
  color: var(--color-error-600);
810
950
  }
951
+ .text-error-700 {
952
+ color: var(--color-error-700);
953
+ }
954
+ .text-error-800 {
955
+ color: var(--color-error-800);
956
+ }
957
+ .text-info-200 {
958
+ color: var(--color-info-200);
959
+ }
960
+ .text-info-800 {
961
+ color: var(--color-info-800);
962
+ }
963
+ .text-primary {
964
+ color: var(--color-primary);
965
+ }
811
966
  .text-primary-950 {
812
967
  color: var(--color-primary-950);
813
968
  }
814
969
  .text-success-500 {
815
970
  color: var(--color-success-500);
816
971
  }
972
+ .text-success-700 {
973
+ color: var(--color-success-700);
974
+ }
975
+ .text-success-800 {
976
+ color: var(--color-success-800);
977
+ }
817
978
  .text-text {
818
979
  color: var(--color-text);
819
980
  }
@@ -838,18 +999,39 @@
838
999
  .text-text-950 {
839
1000
  color: var(--color-text-950);
840
1001
  }
1002
+ .text-typography-1 {
1003
+ color: var(--color-typography-1);
1004
+ }
1005
+ .text-typography-2 {
1006
+ color: var(--color-typography-2);
1007
+ }
1008
+ .text-warning-800 {
1009
+ color: var(--color-warning-800);
1010
+ }
841
1011
  .capitalize {
842
1012
  text-transform: capitalize;
843
1013
  }
844
1014
  .italic {
845
1015
  font-style: italic;
846
1016
  }
1017
+ .opacity-0 {
1018
+ opacity: 0%;
1019
+ }
847
1020
  .opacity-40 {
848
1021
  opacity: 40%;
849
1022
  }
850
1023
  .opacity-50 {
851
1024
  opacity: 50%;
852
1025
  }
1026
+ .shadow-lg {
1027
+ --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1028
+ box-shadow:
1029
+ var(--tw-inset-shadow),
1030
+ var(--tw-inset-ring-shadow),
1031
+ var(--tw-ring-offset-shadow),
1032
+ var(--tw-ring-shadow),
1033
+ var(--tw-shadow);
1034
+ }
853
1035
  .shadow-md {
854
1036
  --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
855
1037
  box-shadow:
@@ -895,6 +1077,9 @@
895
1077
  .ring-primary-950 {
896
1078
  --tw-ring-color: var(--color-primary-950);
897
1079
  }
1080
+ .ring-white {
1081
+ --tw-ring-color: var(--color-white);
1082
+ }
898
1083
  .ring-offset-0 {
899
1084
  --tw-ring-offset-width: 0px;
900
1085
  --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
@@ -923,6 +1108,11 @@
923
1108
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
924
1109
  transition-duration: var(--tw-duration, var(--default-transition-duration));
925
1110
  }
1111
+ .transition-opacity {
1112
+ transition-property: opacity;
1113
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1114
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
1115
+ }
926
1116
  .duration-200 {
927
1117
  --tw-duration: 200ms;
928
1118
  transition-duration: 200ms;
@@ -936,6 +1126,13 @@
936
1126
  -moz-user-select: none;
937
1127
  user-select: none;
938
1128
  }
1129
+ .group-hover\:opacity-100 {
1130
+ &:is(:where(.group):hover *) {
1131
+ @media (hover: hover) {
1132
+ opacity: 100%;
1133
+ }
1134
+ }
1135
+ }
939
1136
  .hover\:border-border-500 {
940
1137
  &:hover {
941
1138
  @media (hover: hover) {
@@ -1495,6 +1692,8 @@
1495
1692
  --color-subject-14: #e7ec85;
1496
1693
  --color-subject-15: #a2d7e2;
1497
1694
  --color-subject-16: #badfc8;
1695
+ --color-typography-1: #b00c9e;
1696
+ --color-typography-2: #745A07;
1498
1697
  --shadow-hard-shadow-1: -2px 2px 8px rgba(255, 255, 255, 0.1);
1499
1698
  --shadow-hard-shadow-2: 0px 3px 10px rgba(255, 255, 255, 0.1);
1500
1699
  --shadow-hard-shadow-3: 2px 2px 8px rgba(255, 255, 255, 0.1);
@@ -1654,6 +1853,8 @@
1654
1853
  --color-subject-14: #e7ec85;
1655
1854
  --color-subject-15: #a2d7e2;
1656
1855
  --color-subject-16: #badfc8;
1856
+ --color-typography-1: #b00c9e;
1857
+ --color-typography-2: #745A07;
1657
1858
  --shadow-hard-shadow-1: -2px 2px 8px rgba(38, 38, 38, 0.2);
1658
1859
  --shadow-hard-shadow-2: 0px 3px 10px rgba(38, 38, 38, 0.2);
1659
1860
  --shadow-hard-shadow-3: 2px 2px 8px rgba(38, 38, 38, 0.2);
package/dist/index.d.mts CHANGED
@@ -1,6 +1,7 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import * as react from 'react';
3
- import { ReactNode, ButtonHTMLAttributes, ElementType, ComponentPropsWithoutRef, InputHTMLAttributes, HTMLAttributes, TdHTMLAttributes } from 'react';
3
+ import { ReactNode, ButtonHTMLAttributes, ElementType, ComponentPropsWithoutRef, HTMLAttributes, InputHTMLAttributes, TdHTMLAttributes } from 'react';
4
+ import * as zustand from 'zustand';
4
5
 
5
6
  /**
6
7
  * Button component props interface
@@ -184,6 +185,49 @@ type TextProps<T extends ElementType = 'p'> = BaseTextProps & {
184
185
  */
185
186
  declare const Text: <T extends ElementType = "p">({ children, size, weight, color, as, className, ...props }: TextProps<T>) => react_jsx_runtime.JSX.Element;
186
187
 
188
+ /**
189
+ * Badge component props interface
190
+ */
191
+ type BadgeProps = {
192
+ /** Content to be displayed inside the badge */
193
+ children?: ReactNode;
194
+ /** Ícone à direita do texto */
195
+ iconRight?: ReactNode;
196
+ /** Ícone à esquerda do texto */
197
+ iconLeft?: ReactNode;
198
+ /** Size of the badge */
199
+ size?: 'small' | 'medium' | 'large';
200
+ /** Visual variant of the badge */
201
+ variant?: 'solid' | 'outlined' | 'exams' | 'resultStatus' | 'notification';
202
+ /** Action type of the badge */
203
+ action?: 'error' | 'warning' | 'success' | 'info' | 'muted' | 'exam1' | 'exam2' | 'exam3' | 'exam4' | 'positive' | 'negative';
204
+ /** Additional CSS classes to apply */
205
+ className?: string;
206
+ notificationActive?: boolean;
207
+ } & HTMLAttributes<HTMLDivElement>;
208
+ /**
209
+ * Badge component for Analytica Ensino platforms
210
+ *
211
+ * A flexible button component with multiple variants, sizes and actions.
212
+ * Fully compatible with Next.js 15 and React 19.
213
+ *
214
+ * @param children - The content to display inside the badge
215
+ * @param size - The size variant (extra-small, small, medium, large, extra-large)
216
+ * @param variant - The visual style variant (solid, outline, link)
217
+ * @param action - The action type (primary, positive, negative)
218
+ * @param className - Additional CSS classes
219
+ * @param props - All other standard div HTML attributes
220
+ * @returns A styled badge element
221
+ *
222
+ * @example
223
+ * ```tsx
224
+ * <Badge variant="solid" action="info" size="medium">
225
+ * Information
226
+ * </Badge>
227
+ * ```
228
+ */
229
+ declare const Badge: ({ children, iconLeft, iconRight, size, variant, action, className, notificationActive, ...props }: BadgeProps) => react_jsx_runtime.JSX.Element;
230
+
187
231
  /**
188
232
  * CheckBox size variants
189
233
  */
@@ -418,4 +462,39 @@ declare const IconButton: react.ForwardRefExoticComponent<{
418
462
  className?: string;
419
463
  } & ButtonHTMLAttributes<HTMLButtonElement> & react.RefAttributes<HTMLButtonElement>>;
420
464
 
421
- export { Button, CheckBox, type CheckBoxProps, DropdownMenu, DropdownMenuTrigger, IconButton, type IconButtonProps, IconRoundedButton, MenuContent, MenuItem, MenuLabel, MenuSeparator, NavButton, SelectionButton, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Text };
465
+ type ToastPosition$1 = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right' | 'default';
466
+ type ToastProps = {
467
+ title: string;
468
+ description?: string;
469
+ onClose: () => void;
470
+ /** Visual variant of the badge */
471
+ variant?: 'solid' | 'outlined';
472
+ /** Action type of the badge */
473
+ action?: 'warning' | 'success' | 'info';
474
+ position?: ToastPosition$1;
475
+ } & HTMLAttributes<HTMLDivElement>;
476
+ declare const Toast: ({ variant, action, className, onClose, title, description, position, ...props }: ToastProps) => react_jsx_runtime.JSX.Element;
477
+
478
+ type ToastPosition = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right' | 'default';
479
+ type ToastData = {
480
+ id: string;
481
+ title: string;
482
+ description?: string;
483
+ variant?: 'solid' | 'outlined';
484
+ action?: 'warning' | 'success' | 'info';
485
+ position?: ToastPosition;
486
+ };
487
+ type ToastStore = {
488
+ toasts: ToastData[];
489
+ addToast: (toast: Omit<ToastData, 'id'>) => void;
490
+ removeToast: (id: string) => void;
491
+ };
492
+ declare const useToastStore: zustand.UseBoundStore<zustand.StoreApi<ToastStore>>;
493
+
494
+ declare const Toaster: () => react_jsx_runtime.JSX.Element;
495
+ declare const useToast: () => {
496
+ addToast: (toast: Omit<ToastData, "id">) => void;
497
+ removeToast: (id: string) => void;
498
+ };
499
+
500
+ export { Badge, Button, CheckBox, type CheckBoxProps, DropdownMenu, DropdownMenuTrigger, IconButton, type IconButtonProps, IconRoundedButton, MenuContent, MenuItem, MenuLabel, MenuSeparator, NavButton, SelectionButton, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Text, Toast, type ToastData, Toaster, useToast, useToastStore };
package/dist/index.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import * as react from 'react';
3
- import { ReactNode, ButtonHTMLAttributes, ElementType, ComponentPropsWithoutRef, InputHTMLAttributes, HTMLAttributes, TdHTMLAttributes } from 'react';
3
+ import { ReactNode, ButtonHTMLAttributes, ElementType, ComponentPropsWithoutRef, HTMLAttributes, InputHTMLAttributes, TdHTMLAttributes } from 'react';
4
+ import * as zustand from 'zustand';
4
5
 
5
6
  /**
6
7
  * Button component props interface
@@ -184,6 +185,49 @@ type TextProps<T extends ElementType = 'p'> = BaseTextProps & {
184
185
  */
185
186
  declare const Text: <T extends ElementType = "p">({ children, size, weight, color, as, className, ...props }: TextProps<T>) => react_jsx_runtime.JSX.Element;
186
187
 
188
+ /**
189
+ * Badge component props interface
190
+ */
191
+ type BadgeProps = {
192
+ /** Content to be displayed inside the badge */
193
+ children?: ReactNode;
194
+ /** Ícone à direita do texto */
195
+ iconRight?: ReactNode;
196
+ /** Ícone à esquerda do texto */
197
+ iconLeft?: ReactNode;
198
+ /** Size of the badge */
199
+ size?: 'small' | 'medium' | 'large';
200
+ /** Visual variant of the badge */
201
+ variant?: 'solid' | 'outlined' | 'exams' | 'resultStatus' | 'notification';
202
+ /** Action type of the badge */
203
+ action?: 'error' | 'warning' | 'success' | 'info' | 'muted' | 'exam1' | 'exam2' | 'exam3' | 'exam4' | 'positive' | 'negative';
204
+ /** Additional CSS classes to apply */
205
+ className?: string;
206
+ notificationActive?: boolean;
207
+ } & HTMLAttributes<HTMLDivElement>;
208
+ /**
209
+ * Badge component for Analytica Ensino platforms
210
+ *
211
+ * A flexible button component with multiple variants, sizes and actions.
212
+ * Fully compatible with Next.js 15 and React 19.
213
+ *
214
+ * @param children - The content to display inside the badge
215
+ * @param size - The size variant (extra-small, small, medium, large, extra-large)
216
+ * @param variant - The visual style variant (solid, outline, link)
217
+ * @param action - The action type (primary, positive, negative)
218
+ * @param className - Additional CSS classes
219
+ * @param props - All other standard div HTML attributes
220
+ * @returns A styled badge element
221
+ *
222
+ * @example
223
+ * ```tsx
224
+ * <Badge variant="solid" action="info" size="medium">
225
+ * Information
226
+ * </Badge>
227
+ * ```
228
+ */
229
+ declare const Badge: ({ children, iconLeft, iconRight, size, variant, action, className, notificationActive, ...props }: BadgeProps) => react_jsx_runtime.JSX.Element;
230
+
187
231
  /**
188
232
  * CheckBox size variants
189
233
  */
@@ -418,4 +462,39 @@ declare const IconButton: react.ForwardRefExoticComponent<{
418
462
  className?: string;
419
463
  } & ButtonHTMLAttributes<HTMLButtonElement> & react.RefAttributes<HTMLButtonElement>>;
420
464
 
421
- export { Button, CheckBox, type CheckBoxProps, DropdownMenu, DropdownMenuTrigger, IconButton, type IconButtonProps, IconRoundedButton, MenuContent, MenuItem, MenuLabel, MenuSeparator, NavButton, SelectionButton, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Text };
465
+ type ToastPosition$1 = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right' | 'default';
466
+ type ToastProps = {
467
+ title: string;
468
+ description?: string;
469
+ onClose: () => void;
470
+ /** Visual variant of the badge */
471
+ variant?: 'solid' | 'outlined';
472
+ /** Action type of the badge */
473
+ action?: 'warning' | 'success' | 'info';
474
+ position?: ToastPosition$1;
475
+ } & HTMLAttributes<HTMLDivElement>;
476
+ declare const Toast: ({ variant, action, className, onClose, title, description, position, ...props }: ToastProps) => react_jsx_runtime.JSX.Element;
477
+
478
+ type ToastPosition = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right' | 'default';
479
+ type ToastData = {
480
+ id: string;
481
+ title: string;
482
+ description?: string;
483
+ variant?: 'solid' | 'outlined';
484
+ action?: 'warning' | 'success' | 'info';
485
+ position?: ToastPosition;
486
+ };
487
+ type ToastStore = {
488
+ toasts: ToastData[];
489
+ addToast: (toast: Omit<ToastData, 'id'>) => void;
490
+ removeToast: (id: string) => void;
491
+ };
492
+ declare const useToastStore: zustand.UseBoundStore<zustand.StoreApi<ToastStore>>;
493
+
494
+ declare const Toaster: () => react_jsx_runtime.JSX.Element;
495
+ declare const useToast: () => {
496
+ addToast: (toast: Omit<ToastData, "id">) => void;
497
+ removeToast: (id: string) => void;
498
+ };
499
+
500
+ export { Badge, Button, CheckBox, type CheckBoxProps, DropdownMenu, DropdownMenuTrigger, IconButton, type IconButtonProps, IconRoundedButton, MenuContent, MenuItem, MenuLabel, MenuSeparator, NavButton, SelectionButton, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Text, Toast, type ToastData, Toaster, useToast, useToastStore };