@giro-ds/react 3.0.7 → 4.0.0

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 (38) hide show
  1. package/dist/components/Avatar/Avatar.d.ts +2 -1
  2. package/dist/components/Avatar/Avatar.types.d.ts +12 -12
  3. package/dist/components/Avatar/__tests__/Avatar.test.d.ts +1 -0
  4. package/dist/components/Avatar/index.d.ts +1 -0
  5. package/dist/components/Button/Button.types.d.ts +6 -0
  6. package/dist/components/Calendar/Calendar.d.ts +3 -7
  7. package/dist/components/Calendar/Calendar.types.d.ts +102 -79
  8. package/dist/components/Calendar/__tests__/Calendar.test.d.ts +1 -0
  9. package/dist/components/Container/__tests__/Container.test.d.ts +1 -0
  10. package/dist/components/Dialog/Dialog.d.ts +4 -4
  11. package/dist/components/Dialog/Dialog.types.d.ts +17 -37
  12. package/dist/components/Dialog/__tests__/Dialog.test.d.ts +1 -0
  13. package/dist/components/Popover/Popover.d.ts +4 -0
  14. package/dist/components/Popover/Popover.types.d.ts +8 -0
  15. package/dist/components/Popover/__test__/Popover.test.d.ts +1 -0
  16. package/dist/components/Popover/index.d.ts +2 -0
  17. package/dist/components/Search/Search.types.d.ts +4 -1
  18. package/dist/components/Search/__tests__/Search.test.d.ts +1 -0
  19. package/dist/components/Toast/Toast.d.ts +34 -13
  20. package/dist/components/Toast/Toast.types.d.ts +50 -52
  21. package/dist/components/Toast/__tests__/Toast.test.d.ts +1 -0
  22. package/dist/components/Toast/components/ToastContainer.d.ts +22 -0
  23. package/dist/components/Toast/components/ToastProvider.d.ts +35 -0
  24. package/dist/components/Toast/index.d.ts +5 -2
  25. package/dist/components/Tooltip/Tooltip.types.d.ts +1 -26
  26. package/dist/components/index.d.ts +6 -4
  27. package/dist/contexts/ToastContext.d.ts +43 -0
  28. package/dist/hooks/useToast.d.ts +46 -0
  29. package/dist/index.cjs +4296 -5738
  30. package/dist/index.cjs.map +1 -1
  31. package/dist/index.d.ts +315 -193
  32. package/dist/index.esm.js +4275 -5719
  33. package/dist/index.esm.js.map +1 -1
  34. package/dist/styles.css +1 -1
  35. package/package.json +3 -2
  36. package/dist/components/Calendar/i18n.d.ts +0 -56
  37. package/dist/components/Dialog/utils/DialogUtils.d.ts +0 -1
  38. /package/dist/components/Container/{index.d.ts → Container.d.ts} +0 -0
package/dist/index.d.ts CHANGED
@@ -1,6 +1,9 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
1
  import * as React$1 from 'react';
3
- import React__default, { ReactNode, ReactElement, CSSProperties } from 'react';
2
+ import React__default, { ReactNode, ReactElement, ComponentPropsWithoutRef, CSSProperties } from 'react';
3
+ import * as react_jsx_runtime from 'react/jsx-runtime';
4
+ import { Matcher } from 'react-day-picker';
5
+ import { Toast as Toast$1 } from 'radix-ui';
6
+ import { BaseProps as BaseProps$1, Side as Side$1, Align as Align$1 } from '@/types';
4
7
 
5
8
  type Size = 'sm' | 'lg';
6
9
  type Variant = 'filled' | 'outlined' | 'text';
@@ -19,25 +22,25 @@ interface BaseProps {
19
22
  * Props do componente Avatar
20
23
  * @example
21
24
  * ```tsx
25
+ * // Avatar com ícone
22
26
  * <Avatar icon={<UserIcon />} size="lg" />
23
- * ```
24
- * @example
25
- * ```tsx
26
- * <Avatar
27
- * icon={<ProfileIcon />}
28
- * size="sm"
29
- * className="custom-avatar"
30
- * />
27
+ *
28
+ * // Avatar com imagem
29
+ * <Avatar src="https://example.com/avatar.jpg" icon={<UserIcon />} size="sm" />
31
30
  * ```
32
31
  */
33
32
  interface AvatarProps extends BaseProps {
34
- /** Ícone ou conteúdo a ser exibido no avatar */
35
- icon: React$1.ReactNode;
36
- /** Tamanho do avatar */
33
+ /** Ícone ou conteúdo a ser exibido no fallback quando não há imagem ou ela falha ao carregar */
34
+ icon?: React$1.ReactNode;
35
+ /** Tamanho do avatar: 'sm' (32px) ou 'lg' (44px). @default 'lg' */
37
36
  size?: Size;
37
+ /** URL da imagem do avatar. Quando fornecido, exibe a imagem; caso contrário, mostra o ícone */
38
+ src?: string;
39
+ /** Texto alternativo da imagem do avatar, usado como as iniciais do nome */
40
+ initialLetters?: string;
38
41
  }
39
42
 
40
- declare let Avatar: ({ id, icon, size, className, ...rest }: AvatarProps) => react_jsx_runtime.JSX.Element;
43
+ declare const Avatar: React__default.FC<AvatarProps>;
41
44
 
42
45
  /** Tipos de badge suportados */
43
46
  type BadgeType = 'notification' | 'status';
@@ -130,97 +133,124 @@ interface ButtonProps extends BaseProps, React__default.HTMLAttributes<HTMLEleme
130
133
  ariaLabel?: string;
131
134
  /** Estado de carregamento (exibe spinner) */
132
135
  loading?: boolean;
136
+ /** Texto do tooltip exibido quando o botão é apenas ícone */
137
+ tooltipText?: string;
138
+ /** Lado em que o tooltip será exibido */
139
+ tooltipSide?: 'top' | 'bottom' | 'left' | 'right';
140
+ /** Alinhamento do tooltip */
141
+ tooltipAlign?: 'start' | 'center' | 'end';
133
142
  }
134
143
 
135
144
  declare const Button: React__default.ForwardRefExoticComponent<ButtonProps & React__default.RefAttributes<HTMLElement>>;
136
145
 
137
- /** Formatos de exibição de data disponíveis */
138
- type DateFormat = 'dd/mm/yyyy' | 'mm/dd/yyyy';
139
- /**
140
- * Representa um dia no calendário
141
- */
142
- interface DayItem {
143
- /** Tipo do item (sempre 'day') */
144
- type: 'day';
145
- /** Chave única para renderização */
146
- key: number;
147
- /** Número do dia */
148
- day: number;
149
- /** Objeto Date completo */
150
- date: Date;
151
- /** Indica se é o dia atual */
152
- isToday: boolean;
153
- /** Indica se o dia está selecionado */
154
- isSelected: boolean;
155
- /** Label acessível do dia */
156
- label: string;
157
- }
158
- /**
159
- * Representa um espaço vazio no grid do calendário
160
- */
161
- interface EmptyItem {
162
- /** Tipo do item (sempre 'empty') */
163
- type: 'empty';
164
- /** Chave única para renderização */
165
- key: string;
166
- }
167
- /** Item do calendário (pode ser um dia ou espaço vazio) */
168
- type CalendarItem = DayItem | EmptyItem;
169
- /**
170
- * Representa um ano na visualização de seleção de ano
171
- */
172
- interface YearItem {
173
- /** Número do ano */
174
- year: number;
175
- /** Indica se é o ano atual */
176
- isCurrent: boolean;
177
- /** Chave única para renderização */
178
- key: number;
179
- }
180
- /**
181
- * Props do componente Calendar
182
- * @example
183
- * ```tsx
184
- * <Calendar
185
- * currentDate={new Date()}
186
- * onDateChange={(date) => console.log(date)}
187
- * locale="pt-br"
188
- * />
189
- * ```
190
- * @example
191
- * ```tsx
192
- * <Calendar
193
- * currentDate={new Date()}
194
- * selectedDate={selectedDate}
195
- * onDaySelect={handleDaySelect}
196
- * minDate={new Date('2024-01-01')}
197
- * maxDate={new Date('2024-12-31')}
198
- * format="dd/mm/yyyy"
199
- * />
200
- * ```
201
- */
202
- interface CalendarProps extends BaseProps {
203
- /** Data do dia atual */
204
- currentDate: Date | null;
205
- /** Dia selecionado pelo usuário */
146
+ /** Formato de exibição da data aceito pelo componente. */
147
+ type DateFormat = 'dd/mm/yyyy' | 'mm/dd/yyyy' | (string & {});
148
+ interface CalendarProps extends Omit<BaseProps, 'disabled'> {
149
+ /** Data selecionada atualmente (usada pelo DatePicker). */
150
+ selected?: Date | null;
151
+ /** Data selecionada atualmente (usada pelo Filter). */
206
152
  selectedDate?: Date | null;
207
- /** Callback executado quando a data escolhida é alterada: (date) => void */
208
- onDateChange?: (date: Date) => void;
209
- /** Callback executado quando um dia é selecionado: (date) => void */
153
+ /**
154
+ * Mês exibido no calendário. Use junto com `onDateChange` para
155
+ * controlar a navegação externamente.
156
+ */
157
+ currentDate?: Date | null;
158
+ /**
159
+ * Mês inicial padrão exibido quando não controlado.
160
+ * @default currentMonth
161
+ */
162
+ defaultMonth?: Date;
163
+ /** Primeiro mês navegável. */
164
+ startMonth?: Date;
165
+ /** Último mês navegável. */
166
+ endMonth?: Date;
167
+ /** Número de meses exibidos simultaneamente. @default 1 */
168
+ numberOfMonths?: number;
169
+ /** Chamado quando o usuário seleciona um dia. */
210
170
  onDaySelect?: (date: Date) => void;
211
- /** Callback executado ao limpar a seleção: () => void */
171
+ /** Chamado quando o usuário navega entre meses. */
172
+ onDateChange?: (date: Date) => void;
173
+ /** Chamado quando o usuário limpa a seleção. */
212
174
  onClear?: () => void;
213
- /** Data mínima selecionável */
175
+ /** Data mínima selecionável. */
214
176
  minDate?: Date;
215
- /** Data máxima selecionável */
177
+ /** Data máxima selecionável. */
216
178
  maxDate?: Date;
217
- /** Locale do calendário */
218
- locale?: Locale;
219
- /** Formato de exibição da data */
179
+ /**
180
+ * Dias desabilitados — aceita qualquer `Matcher` do react-day-picker
181
+ * (Date, DateRange, DateBefore, DateAfter, DayOfWeek, função…).
182
+ */
183
+ disabled?: Matcher | Matcher[];
184
+ /**
185
+ * Dias ocultados — aceita qualquer `Matcher` do react-day-picker.
186
+ */
187
+ hidden?: Matcher | Matcher[];
188
+ /**
189
+ * Formato de exibição da data.
190
+ * @example 'dd/mm/yyyy' | 'mm/dd/yyyy'
191
+ */
220
192
  format?: DateFormat;
193
+ /**
194
+ * Locale da interface — aceita os códigos internos do design system.
195
+ * @default 'pt-br'
196
+ */
197
+ locale?: Locale;
198
+ /**
199
+ * Layout do cabeçalho do calendário.
200
+ * - `'label'` — exibe mês/ano como texto (padrão).
201
+ * - `'dropdown'` — exibe dropdowns para mês e ano.
202
+ * - `'dropdown-months'` — dropdown apenas para mês.
203
+ * - `'dropdown-years'` — dropdown apenas para ano.
204
+ */
205
+ captionLayout?: 'dropdown' | 'label' | 'dropdown-months' | 'dropdown-years';
206
+ /** Inverte a ordem dos anos no dropdown. */
207
+ reverseYears?: boolean;
208
+ /** Sempre exibe 6 semanas por mês, preenchendo com dias do mês seguinte. */
209
+ fixedWeeks?: boolean;
210
+ /** Exibe os dias pertencentes ao mês anterior/próximo. */
211
+ showOutsideDays?: boolean;
212
+ /** Exibe a coluna com o número da semana. */
213
+ showWeekNumber?: boolean;
214
+ /** Oculta os botões de navegação (sem desabilitar a navegação). */
215
+ hideNavigation?: boolean;
216
+ /** Desabilita a navegação entre meses. */
217
+ disableNavigation?: boolean;
218
+ /**
219
+ * Posicionamento dos botões de navegação.
220
+ * - `'around'` — um botão de cada lado do caption.
221
+ * - `'after'` — ambos após o caption.
222
+ */
223
+ navLayout?: 'after' | 'around';
224
+ /** Atributo `aria-label` para o elemento raiz. */
225
+ 'aria-label'?: string;
226
+ /** Atributo `aria-labelledby` para o elemento raiz. */
227
+ 'aria-labelledby'?: string;
228
+ /** Foca automaticamente o primeiro dia selecionado ou hoje. */
229
+ autoFocus?: boolean;
230
+ /** Atributo `role` do elemento raiz (`'application'` ou `'dialog'`). */
231
+ role?: 'application' | 'dialog';
232
+ /** Atributo `title` do elemento raiz. */
233
+ title?: string;
234
+ /** Anima a transição entre meses. */
235
+ animate?: boolean;
236
+ /**
237
+ * Fuso horário IANA usado nos cálculos de datas.
238
+ * @example 'America/Sao_Paulo'
239
+ */
240
+ timeZone?: string;
241
+ /** Estilos inline para o elemento raiz. */
242
+ style?: React__default.CSSProperties;
243
+ /** Substitui os `classNames` padrão do react-day-picker. */
244
+ classNames?: Partial<Record<string, string>>;
245
+ /** Modificadores customizados para dias específicos. */
246
+ modifiers?: Record<string, Matcher | Matcher[] | undefined>;
247
+ /** ClassNames aplicadas aos dias que correspondem aos `modifiers`. */
248
+ modifiersClassNames?: Record<string, string>;
249
+ /** Rodapé do calendário — exibido como live region para acessibilidade. */
250
+ footer?: React__default.ReactNode;
221
251
  }
222
252
 
223
- declare const MemoizedCalendar: React__default.NamedExoticComponent<CalendarProps>;
253
+ declare const Calendar: ({ selected, selectedDate, currentDate, defaultMonth, startMonth, endMonth, numberOfMonths, onDaySelect, onDateChange, onClear: _onClear, minDate, maxDate, disabled, hidden, format: _format, locale, captionLayout, reverseYears, fixedWeeks, showOutsideDays, showWeekNumber, hideNavigation, disableNavigation, navLayout, role, title, animate, timeZone, modifiers, modifiersClassNames, footer, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, }: CalendarProps) => react_jsx_runtime.JSX.Element;
224
254
 
225
255
  /**
226
256
  * Props do componente Callout
@@ -399,51 +429,31 @@ declare const _default$1: React__default.NamedExoticComponent<DatePickerProps>;
399
429
  /**
400
430
  * Props do componente Dialog
401
431
  * @example
402
- * ```tsx
403
432
  * <Dialog
404
- * show={isOpen}
405
- * title="Confirmar exclusão"
406
- * text="Tem certeza que deseja excluir este item?"
407
- * textConfirm="Excluir"
433
+ * title="Confirmar ação"
434
+ * bodyContent="Tem certeza que deseja continuar?"
435
+ * textConfirm="Confirmar"
408
436
  * textCancel="Cancelar"
409
- * fnConfirm={handleDelete}
410
- * fnCancel={handleCancel}
411
- * onClose={handleClose}
412
437
  * />
413
- * ```
414
- * @example
415
- * ```tsx
416
- * <Dialog
417
- * show={showDialog}
418
- * title="Informação"
419
- * onClose={() => setShowDialog(false)}
420
- * >
421
- * <p>Conteúdo customizado do dialog</p>
422
- * </Dialog>
423
- * ```
424
438
  */
425
- interface DialogProps extends BaseProps {
426
- /** Conteúdo customizado do dialog */
427
- children?: ReactNode;
428
- /** Define se o dialog está visível */
439
+ interface DialogProps extends BaseProps, React.HTMLAttributes<HTMLDivElement> {
440
+ /** Conteúdo customizado do diálogo */
429
441
  show: boolean;
430
- /** Título exibido no cabeçalho do dialog */
431
- title: string;
432
- /** Texto ou conteúdo do corpo do dialog */
433
- text?: ReactNode;
434
- /** Texto do botão de confirmação */
435
- textConfirm?: string;
436
- /** Texto do botão de cancelamento */
437
- textCancel?: string;
438
- /** Callback executado ao confirmar: () => void */
439
- fnConfirm?: () => void;
440
- /** Callback executado ao cancelar: () => void */
441
- fnCancel?: () => void;
442
- /** Callback executado ao fechar o dialog: () => void */
443
- onClose?: () => void;
442
+ /** Título exibido no cabeçalho do diálogo */
443
+ title?: string;
444
+ /** Texto ou conteúdo do corpo do diálogo */
445
+ bodyContent?: ReactNode;
446
+ /** Texto do botão de ação primária */
447
+ textPrimaryAction?: string;
448
+ /** Texto do botão de ação secundária */
449
+ textSecondaryAction?: string;
450
+ /** Função chamada ao executar a ação primária */
451
+ onPrimaryAction?: () => void;
452
+ /** Função chamada ao executar a ação secundária */
453
+ onSecondaryAction?: () => void;
444
454
  }
445
455
 
446
- declare const MemoizedDialog: React__default.NamedExoticComponent<DialogProps>;
456
+ declare const Dialog: React$1.FC<DialogProps>;
447
457
 
448
458
  /**
449
459
  * Props do componente Drawer
@@ -791,6 +801,16 @@ interface MenuProps extends BaseProps {
791
801
 
792
802
  declare const Menu: React__default.FC<MenuProps>;
793
803
 
804
+ interface PopoverProps {
805
+ trigger: React.ReactNode;
806
+ content: React.ReactNode;
807
+ onDateSelect?: (date: Date) => void;
808
+ align?: Align;
809
+ side?: Side;
810
+ }
811
+
812
+ declare const Popover: React$1.FC<PopoverProps>;
813
+
794
814
  /**
795
815
  * Props do componente Quantity
796
816
  * @example
@@ -906,7 +926,8 @@ declare const Radio: React__default.FC<RadioGroupProps>;
906
926
  * />
907
927
  * ```
908
928
  */
909
- interface SearchProps extends BaseProps {
929
+ type NativeInputProps = Omit<ComponentPropsWithoutRef<'input'>, 'value' | 'defaultValue' | 'onChange' | 'onClick' | 'onMouseDown'>;
930
+ interface SearchProps extends BaseProps, NativeInputProps {
910
931
  /** Placeholder do campo de busca */
911
932
  placeholder?: string;
912
933
  /** Valor controlado do campo */
@@ -1212,88 +1233,189 @@ interface TextFieldProps extends Omit<React__default.InputHTMLAttributes<HTMLInp
1212
1233
 
1213
1234
  declare const _default: React__default.NamedExoticComponent<TextFieldProps & React__default.RefAttributes<HTMLInputElement>>;
1214
1235
 
1215
- /** Tipos de toast disponíveis */
1216
- type ToastType = 'success' | 'alert' | 'info';
1217
1236
  /**
1218
- * Representa uma mensagem de toast
1237
+ * Props do componente individual de notificação `Toast`.
1238
+ *
1239
+ * Estende {@link BaseProps} e os atributos nativos do `Toast.Root` do Radix UI,
1240
+ * excluindo as propriedades controladas internamente (`open`, `onOpenChange`,
1241
+ * `duration`, `className`).
1242
+ *
1243
+ * @example
1244
+ * ```tsx
1245
+ * showToast({
1246
+ * title: 'Sucesso!',
1247
+ * iconType: 'Success',
1248
+ * duration: 3000,
1249
+ * });
1250
+ * ```
1219
1251
  */
1220
- interface ToastMessage {
1221
- /** ID único da mensagem */
1222
- id: string;
1223
- /** Conteúdo da mensagem */
1224
- message: string;
1225
- /** Tipo visual do toast */
1226
- type: ToastType;
1227
- /** Define se o toast permanece até ser fechado manualmente */
1228
- persistent?: boolean;
1229
- /** Duração em milissegundos antes de auto-fechar */
1252
+ interface ToastProps extends BaseProps, Omit<React$1.ComponentPropsWithoutRef<typeof Toast$1.Root>, 'open' | 'onOpenChange' | 'duration' | 'className'> {
1253
+ /**
1254
+ * Título principal exibido no toast.
1255
+ */
1256
+ title: string;
1257
+ /**
1258
+ * Define se o toast fecha automaticamente após o tempo definido em `duration`.
1259
+ * @default true
1260
+ */
1261
+ automaticClose?: boolean;
1262
+ /**
1263
+ * Tempo em milissegundos até o toast fechar automaticamente.
1264
+ * Só tem efeito quando `automaticClose` é `true`.
1265
+ * @default 5000
1266
+ */
1230
1267
  duration?: number;
1231
- /** Timestamp de quando foi criado */
1232
- timestamp: number;
1268
+ /**
1269
+ * Ícone customizado exibido no toast.
1270
+ * Quando fornecido, substitui o ícone gerado automaticamente por `iconType`.
1271
+ */
1272
+ icon?: React$1.ReactNode;
1273
+ /**
1274
+ * Ícone exibido no botão de fechar o toast.
1275
+ * @default <Dismiss16Filled />
1276
+ */
1277
+ iconClosed?: React$1.ReactNode;
1278
+ /**
1279
+ * Tipo do ícone exibido automaticamente no toast.
1280
+ *
1281
+ * - `'Info'` → ícone informativo (`Info20Filled`)
1282
+ * - `'Success'` → ícone de sucesso (`CheckmarkCircle20Filled`)
1283
+ * - `'Alert'` → ícone de alerta/erro (`Warning20Filled`)
1284
+ *
1285
+ * Ignorado quando a prop `icon` for fornecida.
1286
+ * @default 'Info'
1287
+ */
1288
+ iconType?: 'Info' | 'Success' | 'Alert';
1233
1289
  }
1290
+
1234
1291
  /**
1235
- * Opções para exibição do toast
1292
+ * Componente individual de notificação Toast.
1293
+ *
1294
+ * Consome o contexto do `ToastProvider` para gerenciar seu próprio ciclo de vida.
1295
+ * Cada instância recebe um `id` único gerado pelo provider e o utiliza para
1296
+ * se remover da fila ao ser fechada.
1297
+ *
1298
+ * Construído sobre `Toast.Root` do **Radix UI**, com suporte completo a
1299
+ * acessibilidade (ARIA) e gesto de swipe para a esquerda.
1300
+ *
1301
+ * @remarks
1302
+ * Este componente não deve ser usado diretamente. Utilize o hook `useToast`
1303
+ * para exibir toasts programaticamente.
1304
+ *
1305
+ * @example
1306
+ * ```tsx
1307
+ * // Uso indireto via hook (recomendado)
1308
+ * const { showToast } = useToast();
1309
+ *
1310
+ * showToast({
1311
+ * title: 'Item salvo',
1312
+ * iconType: 'Success',
1313
+ * duration: 3000,
1314
+ * });
1315
+ * ```
1316
+ *
1317
+ * @param props - {@link ToastProps} combinadas com o `id` único do toast
1236
1318
  */
1237
- interface ToastOptions {
1238
- /** Define se o toast permanece até ser fechado manualmente */
1239
- persistent?: boolean;
1240
- /** Duração em milissegundos antes de auto-fechar */
1241
- duration?: number;
1242
- }
1319
+ declare const Toast: React$1.FC<ToastProps & {
1320
+ id: string;
1321
+ }>;
1322
+
1243
1323
  /**
1244
- * Contexto do sistema de toasts
1324
+ * Provider que gerencia o estado global dos toasts na aplicação.
1325
+ *
1326
+ * Deve envolver toda a árvore de componentes que precisará exibir toasts.
1327
+ * Disponibiliza o contexto com `showToast` e `dismissToast` para todos os
1328
+ * componentes filhos via `useToast()`.
1329
+ *
1330
+ * @remarks
1331
+ * O `ToastContainer` deve ser renderizado **dentro** do `ToastProvider`.
1332
+ *
1245
1333
  * @example
1246
1334
  * ```tsx
1247
- * const { showToast, hideToast } = useToast();
1335
+ * // App.tsx ou layout principal
1336
+ * import { ToastProvider, ToastContainer } from '@giro-ds/react';
1248
1337
  *
1249
- * showToast('Operação realizada com sucesso!', 'success');
1338
+ * function App() {
1339
+ * return (
1340
+ * <ToastProvider maxToasts={5}>
1341
+ * <Routes />
1342
+ * <ToastContainer />
1343
+ * </ToastProvider>
1344
+ * );
1345
+ * }
1250
1346
  * ```
1347
+ *
1348
+ * @param children - Árvore de componentes filhos da aplicação.
1349
+ * @param maxToasts - Número máximo de toasts exibidos simultaneamente.
1350
+ * Quando o limite é excedido, o toast mais antigo é removido automaticamente.
1351
+ * @default 5
1251
1352
  */
1252
- interface ToastContextType {
1253
- /** Exibe um toast e retorna seu ID: (message, type?, options?) => string */
1254
- showToast: (message: string, type?: ToastType, options?: ToastOptions) => string;
1255
- /** Oculta um toast específico: (id) => void */
1256
- hideToast: (id: string) => void;
1257
- /** Oculta todos os toasts: () => void */
1258
- hideAllToasts: () => void;
1259
- }
1260
-
1261
- interface ToastProviderProps {
1262
- children: ReactNode;
1353
+ declare const ToastProvider: React$1.FC<{
1354
+ children: React$1.ReactNode;
1263
1355
  maxToasts?: number;
1264
- }
1265
- declare const ToastProvider: React__default.FC<ToastProviderProps>;
1266
- declare const useToast: () => ToastContextType;
1356
+ }>;
1267
1357
 
1268
1358
  /**
1269
- * Props do componente Tooltip
1359
+ * Componente responsável por renderizar todos os toasts ativos na tela.
1360
+ *
1361
+ * Lê a lista de toasts do contexto fornecido pelo `ToastProvider` e os
1362
+ * renderiza individualmente. Configura o `Toast.Provider` do Radix UI com
1363
+ * direção de swipe para a esquerda.
1364
+ *
1365
+ * @remarks
1366
+ * - Deve ser posicionado **dentro** do `ToastProvider`.
1367
+ * - Geralmente é colocado próximo à raiz da aplicação, após os demais filhos.
1368
+ * - Toasts sem `id` são ignorados automaticamente.
1369
+ *
1270
1370
  * @example
1271
1371
  * ```tsx
1272
- * <Tooltip text="Informação adicional">
1273
- * <Button>Hover me</Button>
1274
- * </Tooltip>
1372
+ * <ToastProvider>
1373
+ * <App />
1374
+ * <ToastContainer /> {/* Deve estar aqui *\/}
1375
+ * </ToastProvider>
1275
1376
  * ```
1377
+ */
1378
+ declare const ToastContainer: React$1.FC;
1379
+
1380
+ /**
1381
+ * Hook para exibir e remover toasts na aplicação.
1382
+ *
1383
+ * O componente que usa este hook deve ser filho de um `ToastProvider`.
1384
+ *
1385
+ * @throws {Error} Lança um erro se utilizado fora de um `ToastProvider`:
1386
+ * *"useToastContext deve ser usado dentro de ToastProvider"*
1387
+ *
1388
+ * @returns Objeto com os métodos `showToast` e `dismissToast`.
1389
+ *
1276
1390
  * @example
1277
1391
  * ```tsx
1278
- * <Tooltip
1279
- * text="Clique para mais detalhes"
1280
- * side="top"
1281
- * align="center"
1282
- * sideOffset={10}
1283
- * maxWidth={300}
1284
- * >
1285
- * <IconButton icon={<InfoIcon />} />
1286
- * </Tooltip>
1392
+ * import { useToast } from '@giro-ds/react';
1393
+ *
1394
+ * function MeuComponente() {
1395
+ * const { showToast } = useToast();
1396
+ *
1397
+ * const handleSalvar = async () => {
1398
+ * try {
1399
+ * await salvarDados();
1400
+ * showToast({ title: 'Sucesso!', iconType: 'Success', duration: 3000 });
1401
+ * } catch (err) {
1402
+ * showToast({ title: 'Erro ao salvar', iconType: 'Alert', automaticClose: false });
1403
+ * }
1404
+ * };
1405
+ *
1406
+ * return <button onClick={handleSalvar}>Salvar</button>;
1407
+ * }
1287
1408
  * ```
1288
1409
  */
1289
- interface TooltipProps extends BaseProps {
1290
- /** Conteúdo do tooltip */
1410
+ declare const useToast: () => {
1411
+ showToast: (toast: Omit<ToastProps, "id">) => void;
1412
+ dismissToast: (id: string) => void;
1413
+ };
1414
+
1415
+ interface TooltipProps extends BaseProps$1 {
1291
1416
  text: React__default.ReactNode;
1292
- /** Lado onde o tooltip aparece em relação ao elemento */
1293
- side?: Side;
1294
- /** Alinhamento do tooltip */
1295
- align?: Align;
1296
- /** Distância em pixels do lado do elemento */
1417
+ side?: Side$1;
1418
+ align?: Align$1;
1297
1419
  sideOffset?: number;
1298
1420
  /** Deslocamento em pixels no eixo de alinhamento */
1299
1421
  alignOffset?: number;
@@ -1492,5 +1614,5 @@ declare function useInfiniteScroll({ status, page, lastPage, onLoadMore, thresho
1492
1614
 
1493
1615
  declare const normalizeText: (text: React.ReactNode) => string;
1494
1616
 
1495
- export { Avatar, Badge, Button, MemoizedCalendar as Calendar, Callout, Checkbox, MemoizedChips as Chips, Container, _default$1 as DatePicker, MemoizedDialog as Dialog, Drawer, MemoizedDropdown as Dropdown, Filter, ListItem, Menu, memorizedQuantity as Quantity, Radio, Search, Select, Switch, Table, TableHeader, TablePagination, _default as TextField, ToastProvider as Toast, ToastProvider, Tooltip, VerificationCode, normalizeText, useApiSimulation, useInfiniteScroll, useToast };
1496
- export type { AvatarProps, BadgeProps, ButtonProps, CalendarItem, CalendarProps, CalloutProps, CheckboxProps, ChipsProps, ContainerProps, DateFormat, DatePickerProps, DayItem, DialogProps, DrawerProps, DropdownItem, DropdownProps, DropdownType, EmptyItem, FilterItem, FilterProps, ListItemProps, MenuProps, QuantityProps, RadioGroupProps, RadioProps, SearchProps, SelectProps, SwitchProps, TableHeaderProps, TablePaginationProps, TableProps, TextFieldProps, ToastContextType, ToastMessage, ToastOptions, ToastType, TooltipProps, VerificationCodeProps, YearItem };
1617
+ export { Avatar, Badge, Button, Calendar, Callout, Checkbox, MemoizedChips as Chips, Container, _default$1 as DatePicker, Dialog, Drawer, MemoizedDropdown as Dropdown, Filter, ListItem, Menu, Popover, memorizedQuantity as Quantity, Radio, Search, Select, Switch, Table, TableHeader, TablePagination, _default as TextField, Toast, ToastContainer, ToastProvider, Tooltip, VerificationCode, normalizeText, useApiSimulation, useInfiniteScroll, useToast };
1618
+ export type { AvatarProps, BadgeProps, ButtonProps, CalendarProps, CalloutProps, CheckboxProps, ChipsProps, ContainerProps, DatePickerProps, DialogProps, DrawerProps, DropdownItem, DropdownProps, DropdownType, FilterItem, FilterProps, ListItemProps, MenuProps, PopoverProps, QuantityProps, RadioGroupProps, RadioProps, SearchProps, SelectProps, SwitchProps, TableHeaderProps, TablePaginationProps, TableProps, TextFieldProps, ToastProps, TooltipProps, VerificationCodeProps };