analytica-frontend-lib 1.0.23 → 1.0.25
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.d.mts +260 -319
- package/dist/index.d.ts +260 -319
- package/dist/index.js +659 -599
- package/dist/index.mjs +647 -580
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,8 +1,63 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as react from 'react';
|
|
3
|
-
import react__default, {
|
|
3
|
+
import react__default, { ElementType, ReactNode, ComponentPropsWithoutRef, ButtonHTMLAttributes, HTMLAttributes, InputHTMLAttributes } from 'react';
|
|
4
4
|
import * as zustand from 'zustand';
|
|
5
5
|
|
|
6
|
+
/**
|
|
7
|
+
* Base text component props
|
|
8
|
+
*/
|
|
9
|
+
type BaseTextProps = {
|
|
10
|
+
/** Content to be displayed */
|
|
11
|
+
children?: ReactNode;
|
|
12
|
+
/** Text size variant */
|
|
13
|
+
size?: '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl';
|
|
14
|
+
/** Font weight variant */
|
|
15
|
+
weight?: 'hairline' | 'light' | 'normal' | 'medium' | 'semibold' | 'bold' | 'extrabold' | 'black';
|
|
16
|
+
/** Color variant - white for light backgrounds, black for dark backgrounds */
|
|
17
|
+
color?: string;
|
|
18
|
+
/** Additional CSS classes to apply */
|
|
19
|
+
className?: string;
|
|
20
|
+
};
|
|
21
|
+
/**
|
|
22
|
+
* Polymorphic text component props that ensures type safety based on the 'as' prop
|
|
23
|
+
*/
|
|
24
|
+
type TextProps<T extends ElementType = 'p'> = BaseTextProps & {
|
|
25
|
+
/** HTML tag to render */
|
|
26
|
+
as?: T;
|
|
27
|
+
} & Omit<ComponentPropsWithoutRef<T>, keyof BaseTextProps>;
|
|
28
|
+
/**
|
|
29
|
+
* Text component for Analytica Ensino platforms
|
|
30
|
+
*
|
|
31
|
+
* A flexible polymorphic text component with multiple sizes, weights, and colors.
|
|
32
|
+
* Automatically adapts to dark and light themes with full type safety.
|
|
33
|
+
* Fully compatible with Next.js 15 and React 19.
|
|
34
|
+
*
|
|
35
|
+
* @param children - The content to display
|
|
36
|
+
* @param size - The text size variant (2xs, xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl, 6xl)
|
|
37
|
+
* @param weight - The font weight variant (hairline, light, normal, medium, semibold, bold, extrabold, black)
|
|
38
|
+
* @param color - The color variant - adapts to theme
|
|
39
|
+
* @param as - The HTML tag to render - determines allowed attributes via TypeScript
|
|
40
|
+
* @param className - Additional CSS classes
|
|
41
|
+
* @param props - HTML attributes valid for the chosen tag only
|
|
42
|
+
* @returns A styled text element with type-safe attributes
|
|
43
|
+
*
|
|
44
|
+
* @example
|
|
45
|
+
* ```tsx
|
|
46
|
+
* <Text size="lg" weight="bold" color="text-info-800">
|
|
47
|
+
* This is a large, bold text
|
|
48
|
+
* </Text>
|
|
49
|
+
*
|
|
50
|
+
* <Text as="a" href="/link" target="_blank">
|
|
51
|
+
* Link with type-safe anchor attributes
|
|
52
|
+
* </Text>
|
|
53
|
+
*
|
|
54
|
+
* <Text as="button" onClick={handleClick} disabled>
|
|
55
|
+
* Button with type-safe button attributes
|
|
56
|
+
* </Text>
|
|
57
|
+
* ```
|
|
58
|
+
*/
|
|
59
|
+
declare const Text: <T extends ElementType = "p">({ children, size, weight, color, as, className, ...props }: TextProps<T>) => react_jsx_runtime.JSX.Element;
|
|
60
|
+
|
|
6
61
|
/**
|
|
7
62
|
* Button component props interface
|
|
8
63
|
*/
|
|
@@ -45,6 +100,118 @@ type ButtonProps = {
|
|
|
45
100
|
*/
|
|
46
101
|
declare const Button: ({ children, iconLeft, iconRight, size, variant, action, className, disabled, type, ...props }: ButtonProps) => react_jsx_runtime.JSX.Element;
|
|
47
102
|
|
|
103
|
+
/**
|
|
104
|
+
* Badge component props interface
|
|
105
|
+
*/
|
|
106
|
+
type BadgeProps = {
|
|
107
|
+
/** Content to be displayed inside the badge */
|
|
108
|
+
children?: ReactNode;
|
|
109
|
+
/** Ícone à direita do texto */
|
|
110
|
+
iconRight?: ReactNode;
|
|
111
|
+
/** Ícone à esquerda do texto */
|
|
112
|
+
iconLeft?: ReactNode;
|
|
113
|
+
/** Size of the badge */
|
|
114
|
+
size?: 'small' | 'medium' | 'large';
|
|
115
|
+
/** Visual variant of the badge */
|
|
116
|
+
variant?: 'solid' | 'outlined' | 'exams' | 'resultStatus' | 'notification';
|
|
117
|
+
/** Action type of the badge */
|
|
118
|
+
action?: 'error' | 'warning' | 'success' | 'info' | 'muted' | 'exam1' | 'exam2' | 'exam3' | 'exam4' | 'positive' | 'negative';
|
|
119
|
+
/** Additional CSS classes to apply */
|
|
120
|
+
className?: string;
|
|
121
|
+
notificationActive?: boolean;
|
|
122
|
+
} & HTMLAttributes<HTMLDivElement>;
|
|
123
|
+
/**
|
|
124
|
+
* Badge component for Analytica Ensino platforms
|
|
125
|
+
*
|
|
126
|
+
* A flexible button component with multiple variants, sizes and actions.
|
|
127
|
+
* Fully compatible with Next.js 15 and React 19.
|
|
128
|
+
*
|
|
129
|
+
* @param children - The content to display inside the badge
|
|
130
|
+
* @param size - The size variant (extra-small, small, medium, large, extra-large)
|
|
131
|
+
* @param variant - The visual style variant (solid, outline, link)
|
|
132
|
+
* @param action - The action type (primary, positive, negative)
|
|
133
|
+
* @param className - Additional CSS classes
|
|
134
|
+
* @param props - All other standard div HTML attributes
|
|
135
|
+
* @returns A styled badge element
|
|
136
|
+
*
|
|
137
|
+
* @example
|
|
138
|
+
* ```tsx
|
|
139
|
+
* <Badge variant="solid" action="info" size="medium">
|
|
140
|
+
* Information
|
|
141
|
+
* </Badge>
|
|
142
|
+
* ```
|
|
143
|
+
*/
|
|
144
|
+
declare const Badge: ({ children, iconLeft, iconRight, size, variant, action, className, notificationActive, ...props }: BadgeProps) => react_jsx_runtime.JSX.Element;
|
|
145
|
+
|
|
146
|
+
type AlertProps = {
|
|
147
|
+
title?: string;
|
|
148
|
+
description: string;
|
|
149
|
+
variant?: 'solid' | 'outline';
|
|
150
|
+
action?: 'default' | 'info' | 'success' | 'warning' | 'error';
|
|
151
|
+
className?: string;
|
|
152
|
+
} & HTMLAttributes<HTMLDivElement>;
|
|
153
|
+
declare const Alert: ({ variant, title, description, action, className, ...props }: AlertProps) => react_jsx_runtime.JSX.Element;
|
|
154
|
+
|
|
155
|
+
/**
|
|
156
|
+
* IconButton component for Analytica Ensino platforms
|
|
157
|
+
*
|
|
158
|
+
* Um botão compacto apenas com ícone, ideal para menus dropdown,
|
|
159
|
+
* barras de ferramentas e ações secundárias.
|
|
160
|
+
* Oferece dois tamanhos com estilo consistente.
|
|
161
|
+
* Estado ativo permanece até ser clicado novamente ou outro botão ser ativado.
|
|
162
|
+
* Compatível com Next.js 15 e React 19.
|
|
163
|
+
* Suporta forwardRef para acesso programático ao elemento DOM.
|
|
164
|
+
*
|
|
165
|
+
* @param icon - O ícone a ser exibido no botão
|
|
166
|
+
* @param size - Tamanho do botão (sm, md)
|
|
167
|
+
* @param active - Estado ativo/selecionado do botão
|
|
168
|
+
* @param className - Classes CSS adicionais
|
|
169
|
+
* @param props - Todos os outros atributos HTML padrão de button
|
|
170
|
+
* @returns Um elemento button compacto estilizado apenas com ícone
|
|
171
|
+
*
|
|
172
|
+
* @example
|
|
173
|
+
* ```tsx
|
|
174
|
+
* <IconButton
|
|
175
|
+
* icon={<MoreVerticalIcon />}
|
|
176
|
+
* size="sm"
|
|
177
|
+
* onClick={() => openMenu()}
|
|
178
|
+
* />
|
|
179
|
+
* ```
|
|
180
|
+
*
|
|
181
|
+
* @example
|
|
182
|
+
* ```tsx
|
|
183
|
+
* // Botão ativo em uma barra de ferramentas - permanece ativo até outro clique
|
|
184
|
+
* <IconButton
|
|
185
|
+
* icon={<BoldIcon />}
|
|
186
|
+
* active={isBold}
|
|
187
|
+
* onClick={toggleBold}
|
|
188
|
+
* />
|
|
189
|
+
* ```
|
|
190
|
+
*
|
|
191
|
+
* @example
|
|
192
|
+
* ```tsx
|
|
193
|
+
* // Usando ref para controle programático
|
|
194
|
+
* const buttonRef = useRef<HTMLButtonElement>(null);
|
|
195
|
+
*
|
|
196
|
+
* <IconButton
|
|
197
|
+
* ref={buttonRef}
|
|
198
|
+
* icon={<EditIcon />}
|
|
199
|
+
* size="md"
|
|
200
|
+
* onClick={() => startEditing()}
|
|
201
|
+
* />
|
|
202
|
+
* ```
|
|
203
|
+
*/
|
|
204
|
+
declare const IconButton: react.ForwardRefExoticComponent<{
|
|
205
|
+
/** Ícone a ser exibido no botão */
|
|
206
|
+
icon: ReactNode;
|
|
207
|
+
/** Tamanho do botão */
|
|
208
|
+
size?: "sm" | "md";
|
|
209
|
+
/** Estado de seleção/ativo do botão - permanece ativo até ser clicado novamente ou outro botão ser ativado */
|
|
210
|
+
active?: boolean;
|
|
211
|
+
/** Additional CSS classes to apply */
|
|
212
|
+
className?: string;
|
|
213
|
+
} & ButtonHTMLAttributes<HTMLButtonElement> & react.RefAttributes<HTMLButtonElement>>;
|
|
214
|
+
|
|
48
215
|
/**
|
|
49
216
|
* IconRoundedButton component props interface
|
|
50
217
|
*/
|
|
@@ -76,6 +243,60 @@ type IconRoundedButtonProps = {
|
|
|
76
243
|
*/
|
|
77
244
|
declare const IconRoundedButton: ({ icon, className, disabled, ...props }: IconRoundedButtonProps) => react_jsx_runtime.JSX.Element;
|
|
78
245
|
|
|
246
|
+
/**
|
|
247
|
+
* NavButton component for Analytica Ensino platforms
|
|
248
|
+
*
|
|
249
|
+
* Um botão de navegação com ícone e texto para navegação principal.
|
|
250
|
+
* Ideal para menus de navegação, sidebar, tabs de navegação, etc.
|
|
251
|
+
* Compatível com Next.js 15 e React 19.
|
|
252
|
+
* Suporta forwardRef para acesso programático ao elemento DOM.
|
|
253
|
+
*
|
|
254
|
+
* @param icon - O ícone a ser exibido no botão
|
|
255
|
+
* @param label - O texto/label a ser exibido
|
|
256
|
+
* @param selected - Estado de seleção do botão
|
|
257
|
+
* @param className - Classes CSS adicionais
|
|
258
|
+
* @param props - Todos os outros atributos HTML padrão de button
|
|
259
|
+
* @returns Um elemento button estilizado para navegação
|
|
260
|
+
*
|
|
261
|
+
* @example
|
|
262
|
+
* ```tsx
|
|
263
|
+
* <NavButton
|
|
264
|
+
* icon={<HomeIcon />}
|
|
265
|
+
* label="Início"
|
|
266
|
+
* selected={false}
|
|
267
|
+
* onClick={() => navigate('/')}
|
|
268
|
+
* />
|
|
269
|
+
* ```
|
|
270
|
+
*
|
|
271
|
+
* @example
|
|
272
|
+
* ```tsx
|
|
273
|
+
* // Usando ref para foco programático
|
|
274
|
+
* const buttonRef = useRef<HTMLButtonElement>(null);
|
|
275
|
+
*
|
|
276
|
+
* const handleFocus = () => {
|
|
277
|
+
* buttonRef.current?.focus();
|
|
278
|
+
* };
|
|
279
|
+
*
|
|
280
|
+
* <NavButton
|
|
281
|
+
* ref={buttonRef}
|
|
282
|
+
* icon={<HomeIcon />}
|
|
283
|
+
* label="Dashboard"
|
|
284
|
+
* selected={isActive}
|
|
285
|
+
* onClick={() => setActiveTab('dashboard')}
|
|
286
|
+
* />
|
|
287
|
+
* ```
|
|
288
|
+
*/
|
|
289
|
+
declare const NavButton: react.ForwardRefExoticComponent<{
|
|
290
|
+
/** Ícone a ser exibido no botão */
|
|
291
|
+
icon: ReactNode;
|
|
292
|
+
/** Texto/label a ser exibido ao lado do ícone */
|
|
293
|
+
label: string;
|
|
294
|
+
/** Estado de seleção do botão */
|
|
295
|
+
selected?: boolean;
|
|
296
|
+
/** Additional CSS classes to apply */
|
|
297
|
+
className?: string;
|
|
298
|
+
} & ButtonHTMLAttributes<HTMLButtonElement> & react.RefAttributes<HTMLButtonElement>>;
|
|
299
|
+
|
|
79
300
|
/**
|
|
80
301
|
* SelectionButton component for Analytica Ensino platforms
|
|
81
302
|
*
|
|
@@ -130,60 +351,56 @@ declare const SelectionButton: react.ForwardRefExoticComponent<{
|
|
|
130
351
|
className?: string;
|
|
131
352
|
} & ButtonHTMLAttributes<HTMLButtonElement> & react.RefAttributes<HTMLButtonElement>>;
|
|
132
353
|
|
|
354
|
+
declare const Table: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
|
|
355
|
+
|
|
133
356
|
/**
|
|
134
|
-
*
|
|
357
|
+
* CheckBox size variants
|
|
135
358
|
*/
|
|
136
|
-
type
|
|
137
|
-
/** Content to be displayed */
|
|
138
|
-
children?: ReactNode;
|
|
139
|
-
/** Text size variant */
|
|
140
|
-
size?: '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl';
|
|
141
|
-
/** Font weight variant */
|
|
142
|
-
weight?: 'hairline' | 'light' | 'normal' | 'medium' | 'semibold' | 'bold' | 'extrabold' | 'black';
|
|
143
|
-
/** Color variant - white for light backgrounds, black for dark backgrounds */
|
|
144
|
-
color?: string;
|
|
145
|
-
/** Additional CSS classes to apply */
|
|
146
|
-
className?: string;
|
|
147
|
-
};
|
|
359
|
+
type CheckBoxSize = 'small' | 'medium' | 'large';
|
|
148
360
|
/**
|
|
149
|
-
*
|
|
361
|
+
* CheckBox visual state
|
|
150
362
|
*/
|
|
151
|
-
type
|
|
152
|
-
/** HTML tag to render */
|
|
153
|
-
as?: T;
|
|
154
|
-
} & Omit<ComponentPropsWithoutRef<T>, keyof BaseTextProps>;
|
|
363
|
+
type CheckBoxState = 'default' | 'hovered' | 'focused' | 'invalid' | 'disabled';
|
|
155
364
|
/**
|
|
156
|
-
*
|
|
157
|
-
*
|
|
158
|
-
* A flexible polymorphic text component with multiple sizes, weights, and colors.
|
|
159
|
-
* Automatically adapts to dark and light themes with full type safety.
|
|
160
|
-
* Fully compatible with Next.js 15 and React 19.
|
|
365
|
+
* CheckBox component for Analytica Ensino platforms
|
|
161
366
|
*
|
|
162
|
-
*
|
|
163
|
-
*
|
|
164
|
-
*
|
|
165
|
-
* @param color - The color variant - adapts to theme
|
|
166
|
-
* @param as - The HTML tag to render - determines allowed attributes via TypeScript
|
|
167
|
-
* @param className - Additional CSS classes
|
|
168
|
-
* @param props - HTML attributes valid for the chosen tag only
|
|
169
|
-
* @returns A styled text element with type-safe attributes
|
|
367
|
+
* A checkbox component with essential states, sizes and themes.
|
|
368
|
+
* Uses the Analytica Ensino Design System colors from styles.css with automatic
|
|
369
|
+
* light/dark mode support. Includes Text component integration for consistent typography.
|
|
170
370
|
*
|
|
171
371
|
* @example
|
|
172
372
|
* ```tsx
|
|
173
|
-
*
|
|
174
|
-
*
|
|
175
|
-
* </Text>
|
|
373
|
+
* // Basic checkbox
|
|
374
|
+
* <CheckBox label="Option" />
|
|
176
375
|
*
|
|
177
|
-
*
|
|
178
|
-
*
|
|
179
|
-
* </Text>
|
|
376
|
+
* // Small size
|
|
377
|
+
* <CheckBox size="small" label="Small option" />
|
|
180
378
|
*
|
|
181
|
-
*
|
|
182
|
-
*
|
|
183
|
-
*
|
|
379
|
+
* // Invalid state
|
|
380
|
+
* <CheckBox state="invalid" label="Required field" />
|
|
381
|
+
*
|
|
382
|
+
* // Disabled state
|
|
383
|
+
* <CheckBox disabled label="Disabled option" />
|
|
184
384
|
* ```
|
|
185
385
|
*/
|
|
186
|
-
declare const
|
|
386
|
+
declare const CheckBox: react.ForwardRefExoticComponent<{
|
|
387
|
+
/** Label text to display next to the checkbox */
|
|
388
|
+
label?: ReactNode;
|
|
389
|
+
/** Size variant of the checkbox */
|
|
390
|
+
size?: CheckBoxSize;
|
|
391
|
+
/** Visual state of the checkbox */
|
|
392
|
+
state?: CheckBoxState;
|
|
393
|
+
/** Indeterminate state for partial selections */
|
|
394
|
+
indeterminate?: boolean;
|
|
395
|
+
/** Error message to display */
|
|
396
|
+
errorMessage?: string;
|
|
397
|
+
/** Helper text to display */
|
|
398
|
+
helperText?: string;
|
|
399
|
+
/** Additional CSS classes */
|
|
400
|
+
className?: string;
|
|
401
|
+
/** Label CSS classes */
|
|
402
|
+
labelClassName?: string;
|
|
403
|
+
} & Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & react.RefAttributes<HTMLInputElement>>;
|
|
187
404
|
|
|
188
405
|
/**
|
|
189
406
|
* TextArea size variants
|
|
@@ -193,25 +410,6 @@ type TextAreaSize = 'small' | 'medium' | 'large' | 'extraLarge';
|
|
|
193
410
|
* TextArea visual state
|
|
194
411
|
*/
|
|
195
412
|
type TextAreaState = 'default' | 'hovered' | 'focused' | 'invalid' | 'disabled';
|
|
196
|
-
/**
|
|
197
|
-
* TextArea component props interface
|
|
198
|
-
*/
|
|
199
|
-
type TextAreaProps = {
|
|
200
|
-
/** Label text to display above the textarea */
|
|
201
|
-
label?: ReactNode;
|
|
202
|
-
/** Size variant of the textarea */
|
|
203
|
-
size?: TextAreaSize;
|
|
204
|
-
/** Visual state of the textarea */
|
|
205
|
-
state?: TextAreaState;
|
|
206
|
-
/** Error message to display */
|
|
207
|
-
errorMessage?: string;
|
|
208
|
-
/** Helper text to display */
|
|
209
|
-
helperMessage?: string;
|
|
210
|
-
/** Additional CSS classes */
|
|
211
|
-
className?: string;
|
|
212
|
-
/** Label CSS classes */
|
|
213
|
-
labelClassName?: string;
|
|
214
|
-
} & Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'>;
|
|
215
413
|
/**
|
|
216
414
|
* TextArea component for Analytica Ensino platforms
|
|
217
415
|
*
|
|
@@ -251,132 +449,6 @@ declare const TextArea: react__default.ForwardRefExoticComponent<{
|
|
|
251
449
|
labelClassName?: string;
|
|
252
450
|
} & Omit<react__default.TextareaHTMLAttributes<HTMLTextAreaElement>, "size"> & react__default.RefAttributes<HTMLTextAreaElement>>;
|
|
253
451
|
|
|
254
|
-
/**
|
|
255
|
-
* Badge component props interface
|
|
256
|
-
*/
|
|
257
|
-
type BadgeProps = {
|
|
258
|
-
/** Content to be displayed inside the badge */
|
|
259
|
-
children?: ReactNode;
|
|
260
|
-
/** Ícone à direita do texto */
|
|
261
|
-
iconRight?: ReactNode;
|
|
262
|
-
/** Ícone à esquerda do texto */
|
|
263
|
-
iconLeft?: ReactNode;
|
|
264
|
-
/** Size of the badge */
|
|
265
|
-
size?: 'small' | 'medium' | 'large';
|
|
266
|
-
/** Visual variant of the badge */
|
|
267
|
-
variant?: 'solid' | 'outlined' | 'exams' | 'resultStatus' | 'notification';
|
|
268
|
-
/** Action type of the badge */
|
|
269
|
-
action?: 'error' | 'warning' | 'success' | 'info' | 'muted' | 'exam1' | 'exam2' | 'exam3' | 'exam4' | 'positive' | 'negative';
|
|
270
|
-
/** Additional CSS classes to apply */
|
|
271
|
-
className?: string;
|
|
272
|
-
notificationActive?: boolean;
|
|
273
|
-
} & HTMLAttributes<HTMLDivElement>;
|
|
274
|
-
/**
|
|
275
|
-
* Badge component for Analytica Ensino platforms
|
|
276
|
-
*
|
|
277
|
-
* A flexible button component with multiple variants, sizes and actions.
|
|
278
|
-
* Fully compatible with Next.js 15 and React 19.
|
|
279
|
-
*
|
|
280
|
-
* @param children - The content to display inside the badge
|
|
281
|
-
* @param size - The size variant (extra-small, small, medium, large, extra-large)
|
|
282
|
-
* @param variant - The visual style variant (solid, outline, link)
|
|
283
|
-
* @param action - The action type (primary, positive, negative)
|
|
284
|
-
* @param className - Additional CSS classes
|
|
285
|
-
* @param props - All other standard div HTML attributes
|
|
286
|
-
* @returns A styled badge element
|
|
287
|
-
*
|
|
288
|
-
* @example
|
|
289
|
-
* ```tsx
|
|
290
|
-
* <Badge variant="solid" action="info" size="medium">
|
|
291
|
-
* Information
|
|
292
|
-
* </Badge>
|
|
293
|
-
* ```
|
|
294
|
-
*/
|
|
295
|
-
declare const Badge: ({ children, iconLeft, iconRight, size, variant, action, className, notificationActive, ...props }: BadgeProps) => react_jsx_runtime.JSX.Element;
|
|
296
|
-
|
|
297
|
-
/**
|
|
298
|
-
* CheckBox size variants
|
|
299
|
-
*/
|
|
300
|
-
type CheckBoxSize = 'small' | 'medium' | 'large';
|
|
301
|
-
/**
|
|
302
|
-
* CheckBox visual state
|
|
303
|
-
*/
|
|
304
|
-
type CheckBoxState = 'default' | 'hovered' | 'focused' | 'invalid' | 'disabled';
|
|
305
|
-
/**
|
|
306
|
-
* CheckBox component props interface
|
|
307
|
-
*/
|
|
308
|
-
type CheckBoxProps = {
|
|
309
|
-
/** Label text to display next to the checkbox */
|
|
310
|
-
label?: ReactNode;
|
|
311
|
-
/** Size variant of the checkbox */
|
|
312
|
-
size?: CheckBoxSize;
|
|
313
|
-
/** Visual state of the checkbox */
|
|
314
|
-
state?: CheckBoxState;
|
|
315
|
-
/** Indeterminate state for partial selections */
|
|
316
|
-
indeterminate?: boolean;
|
|
317
|
-
/** Error message to display */
|
|
318
|
-
errorMessage?: string;
|
|
319
|
-
/** Helper text to display */
|
|
320
|
-
helperText?: string;
|
|
321
|
-
/** Additional CSS classes */
|
|
322
|
-
className?: string;
|
|
323
|
-
/** Label CSS classes */
|
|
324
|
-
labelClassName?: string;
|
|
325
|
-
} & Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'>;
|
|
326
|
-
/**
|
|
327
|
-
* CheckBox component for Analytica Ensino platforms
|
|
328
|
-
*
|
|
329
|
-
* A checkbox component with essential states, sizes and themes.
|
|
330
|
-
* Uses the Analytica Ensino Design System colors from styles.css with automatic
|
|
331
|
-
* light/dark mode support. Includes Text component integration for consistent typography.
|
|
332
|
-
*
|
|
333
|
-
* @example
|
|
334
|
-
* ```tsx
|
|
335
|
-
* // Basic checkbox
|
|
336
|
-
* <CheckBox label="Option" />
|
|
337
|
-
*
|
|
338
|
-
* // Small size
|
|
339
|
-
* <CheckBox size="small" label="Small option" />
|
|
340
|
-
*
|
|
341
|
-
* // Invalid state
|
|
342
|
-
* <CheckBox state="invalid" label="Required field" />
|
|
343
|
-
*
|
|
344
|
-
* // Disabled state
|
|
345
|
-
* <CheckBox disabled label="Disabled option" />
|
|
346
|
-
* ```
|
|
347
|
-
*/
|
|
348
|
-
declare const CheckBox: react.ForwardRefExoticComponent<{
|
|
349
|
-
/** Label text to display next to the checkbox */
|
|
350
|
-
label?: ReactNode;
|
|
351
|
-
/** Size variant of the checkbox */
|
|
352
|
-
size?: CheckBoxSize;
|
|
353
|
-
/** Visual state of the checkbox */
|
|
354
|
-
state?: CheckBoxState;
|
|
355
|
-
/** Indeterminate state for partial selections */
|
|
356
|
-
indeterminate?: boolean;
|
|
357
|
-
/** Error message to display */
|
|
358
|
-
errorMessage?: string;
|
|
359
|
-
/** Helper text to display */
|
|
360
|
-
helperText?: string;
|
|
361
|
-
/** Additional CSS classes */
|
|
362
|
-
className?: string;
|
|
363
|
-
/** Label CSS classes */
|
|
364
|
-
labelClassName?: string;
|
|
365
|
-
} & Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type"> & react.RefAttributes<HTMLInputElement>>;
|
|
366
|
-
|
|
367
|
-
type TableRowState = 'default' | 'selected' | 'invalid' | 'disabled';
|
|
368
|
-
interface TableRowProps extends HTMLAttributes<HTMLTableRowElement> {
|
|
369
|
-
state?: TableRowState;
|
|
370
|
-
}
|
|
371
|
-
declare const Table: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
|
|
372
|
-
declare const TableHeader: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
373
|
-
declare const TableBody: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
374
|
-
declare const TableFooter: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
375
|
-
declare const TableRow: react.ForwardRefExoticComponent<TableRowProps & react.RefAttributes<HTMLTableRowElement>>;
|
|
376
|
-
declare const TableHead: react.ForwardRefExoticComponent<TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
|
|
377
|
-
declare const TableCell: react.ForwardRefExoticComponent<TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
|
|
378
|
-
declare const TableCaption: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableCaptionElement> & react.RefAttributes<HTMLTableCaptionElement>>;
|
|
379
|
-
|
|
380
452
|
interface DropdownMenuProps {
|
|
381
453
|
children: ReactNode;
|
|
382
454
|
open?: boolean;
|
|
@@ -401,133 +473,6 @@ declare const MenuItem: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivEl
|
|
|
401
473
|
} & react.RefAttributes<HTMLDivElement>>;
|
|
402
474
|
declare const MenuSeparator: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
|
|
403
475
|
|
|
404
|
-
/**
|
|
405
|
-
* NavButton component for Analytica Ensino platforms
|
|
406
|
-
*
|
|
407
|
-
* Um botão de navegação com ícone e texto para navegação principal.
|
|
408
|
-
* Ideal para menus de navegação, sidebar, tabs de navegação, etc.
|
|
409
|
-
* Compatível com Next.js 15 e React 19.
|
|
410
|
-
* Suporta forwardRef para acesso programático ao elemento DOM.
|
|
411
|
-
*
|
|
412
|
-
* @param icon - O ícone a ser exibido no botão
|
|
413
|
-
* @param label - O texto/label a ser exibido
|
|
414
|
-
* @param selected - Estado de seleção do botão
|
|
415
|
-
* @param className - Classes CSS adicionais
|
|
416
|
-
* @param props - Todos os outros atributos HTML padrão de button
|
|
417
|
-
* @returns Um elemento button estilizado para navegação
|
|
418
|
-
*
|
|
419
|
-
* @example
|
|
420
|
-
* ```tsx
|
|
421
|
-
* <NavButton
|
|
422
|
-
* icon={<HomeIcon />}
|
|
423
|
-
* label="Início"
|
|
424
|
-
* selected={false}
|
|
425
|
-
* onClick={() => navigate('/')}
|
|
426
|
-
* />
|
|
427
|
-
* ```
|
|
428
|
-
*
|
|
429
|
-
* @example
|
|
430
|
-
* ```tsx
|
|
431
|
-
* // Usando ref para foco programático
|
|
432
|
-
* const buttonRef = useRef<HTMLButtonElement>(null);
|
|
433
|
-
*
|
|
434
|
-
* const handleFocus = () => {
|
|
435
|
-
* buttonRef.current?.focus();
|
|
436
|
-
* };
|
|
437
|
-
*
|
|
438
|
-
* <NavButton
|
|
439
|
-
* ref={buttonRef}
|
|
440
|
-
* icon={<HomeIcon />}
|
|
441
|
-
* label="Dashboard"
|
|
442
|
-
* selected={isActive}
|
|
443
|
-
* onClick={() => setActiveTab('dashboard')}
|
|
444
|
-
* />
|
|
445
|
-
* ```
|
|
446
|
-
*/
|
|
447
|
-
declare const NavButton: react.ForwardRefExoticComponent<{
|
|
448
|
-
/** Ícone a ser exibido no botão */
|
|
449
|
-
icon: ReactNode;
|
|
450
|
-
/** Texto/label a ser exibido ao lado do ícone */
|
|
451
|
-
label: string;
|
|
452
|
-
/** Estado de seleção do botão */
|
|
453
|
-
selected?: boolean;
|
|
454
|
-
/** Additional CSS classes to apply */
|
|
455
|
-
className?: string;
|
|
456
|
-
} & ButtonHTMLAttributes<HTMLButtonElement> & react.RefAttributes<HTMLButtonElement>>;
|
|
457
|
-
|
|
458
|
-
/**
|
|
459
|
-
* IconButton component props interface
|
|
460
|
-
*/
|
|
461
|
-
type IconButtonProps = {
|
|
462
|
-
/** Ícone a ser exibido no botão */
|
|
463
|
-
icon: ReactNode;
|
|
464
|
-
/** Tamanho do botão */
|
|
465
|
-
size?: 'sm' | 'md';
|
|
466
|
-
/** Estado de seleção/ativo do botão - permanece ativo até ser clicado novamente ou outro botão ser ativado */
|
|
467
|
-
active?: boolean;
|
|
468
|
-
/** Additional CSS classes to apply */
|
|
469
|
-
className?: string;
|
|
470
|
-
} & ButtonHTMLAttributes<HTMLButtonElement>;
|
|
471
|
-
/**
|
|
472
|
-
* IconButton component for Analytica Ensino platforms
|
|
473
|
-
*
|
|
474
|
-
* Um botão compacto apenas com ícone, ideal para menus dropdown,
|
|
475
|
-
* barras de ferramentas e ações secundárias.
|
|
476
|
-
* Oferece dois tamanhos com estilo consistente.
|
|
477
|
-
* Estado ativo permanece até ser clicado novamente ou outro botão ser ativado.
|
|
478
|
-
* Compatível com Next.js 15 e React 19.
|
|
479
|
-
* Suporta forwardRef para acesso programático ao elemento DOM.
|
|
480
|
-
*
|
|
481
|
-
* @param icon - O ícone a ser exibido no botão
|
|
482
|
-
* @param size - Tamanho do botão (sm, md)
|
|
483
|
-
* @param active - Estado ativo/selecionado do botão
|
|
484
|
-
* @param className - Classes CSS adicionais
|
|
485
|
-
* @param props - Todos os outros atributos HTML padrão de button
|
|
486
|
-
* @returns Um elemento button compacto estilizado apenas com ícone
|
|
487
|
-
*
|
|
488
|
-
* @example
|
|
489
|
-
* ```tsx
|
|
490
|
-
* <IconButton
|
|
491
|
-
* icon={<MoreVerticalIcon />}
|
|
492
|
-
* size="sm"
|
|
493
|
-
* onClick={() => openMenu()}
|
|
494
|
-
* />
|
|
495
|
-
* ```
|
|
496
|
-
*
|
|
497
|
-
* @example
|
|
498
|
-
* ```tsx
|
|
499
|
-
* // Botão ativo em uma barra de ferramentas - permanece ativo até outro clique
|
|
500
|
-
* <IconButton
|
|
501
|
-
* icon={<BoldIcon />}
|
|
502
|
-
* active={isBold}
|
|
503
|
-
* onClick={toggleBold}
|
|
504
|
-
* />
|
|
505
|
-
* ```
|
|
506
|
-
*
|
|
507
|
-
* @example
|
|
508
|
-
* ```tsx
|
|
509
|
-
* // Usando ref para controle programático
|
|
510
|
-
* const buttonRef = useRef<HTMLButtonElement>(null);
|
|
511
|
-
*
|
|
512
|
-
* <IconButton
|
|
513
|
-
* ref={buttonRef}
|
|
514
|
-
* icon={<EditIcon />}
|
|
515
|
-
* size="md"
|
|
516
|
-
* onClick={() => startEditing()}
|
|
517
|
-
* />
|
|
518
|
-
* ```
|
|
519
|
-
*/
|
|
520
|
-
declare const IconButton: react.ForwardRefExoticComponent<{
|
|
521
|
-
/** Ícone a ser exibido no botão */
|
|
522
|
-
icon: ReactNode;
|
|
523
|
-
/** Tamanho do botão */
|
|
524
|
-
size?: "sm" | "md";
|
|
525
|
-
/** Estado de seleção/ativo do botão - permanece ativo até ser clicado novamente ou outro botão ser ativado */
|
|
526
|
-
active?: boolean;
|
|
527
|
-
/** Additional CSS classes to apply */
|
|
528
|
-
className?: string;
|
|
529
|
-
} & ButtonHTMLAttributes<HTMLButtonElement> & react.RefAttributes<HTMLButtonElement>>;
|
|
530
|
-
|
|
531
476
|
type ToastPosition$1 = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right' | 'default';
|
|
532
477
|
type ToastProps = {
|
|
533
478
|
title: string;
|
|
@@ -558,9 +503,5 @@ type ToastStore = {
|
|
|
558
503
|
declare const useToastStore: zustand.UseBoundStore<zustand.StoreApi<ToastStore>>;
|
|
559
504
|
|
|
560
505
|
declare const Toaster: () => react_jsx_runtime.JSX.Element;
|
|
561
|
-
declare const useToast: () => {
|
|
562
|
-
addToast: (toast: Omit<ToastData, "id">) => void;
|
|
563
|
-
removeToast: (id: string) => void;
|
|
564
|
-
};
|
|
565
506
|
|
|
566
|
-
export { Badge, Button, CheckBox,
|
|
507
|
+
export { Alert, Badge, Button, CheckBox, DropdownMenu, MenuContent as DropdownMenuContent, MenuItem as DropdownMenuItem, MenuLabel as DropdownMenuLabel, MenuSeparator as DropdownMenuSeparator, DropdownMenuTrigger, IconButton, IconRoundedButton, NavButton, SelectionButton, Table, Text, TextArea, Toast, type ToastData, Toaster, useToastStore };
|