@giro-ds/react 8.0.0 → 9.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.
- package/dist/index.cjs +131 -62
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +126 -20
- package/dist/index.esm.js +133 -64
- package/dist/index.esm.js.map +1 -1
- package/dist/styles.css +2 -2
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -523,25 +523,27 @@ interface DrawerProps extends BaseProps {
|
|
|
523
523
|
closeOnEscape?: boolean;
|
|
524
524
|
/** Classe CSS opcional */
|
|
525
525
|
className?: string;
|
|
526
|
+
/** Conteúdo fixo exibido abaixo da área rolável, sem acompanhar o scroll */
|
|
527
|
+
footer?: ReactNode;
|
|
526
528
|
}
|
|
527
529
|
|
|
528
530
|
declare const Drawer: React__default.FC<DrawerProps>;
|
|
529
531
|
|
|
530
532
|
interface FilterItem$2 {
|
|
531
|
-
id?:
|
|
533
|
+
id?: BaseProps['id'];
|
|
532
534
|
text: string;
|
|
533
535
|
subText?: string;
|
|
534
536
|
icon?: ReactNode;
|
|
535
|
-
disabled?:
|
|
537
|
+
disabled?: BaseProps['disabled'];
|
|
536
538
|
}
|
|
537
|
-
type FilterType = '
|
|
539
|
+
type FilterType = 'single' | 'multiple' | 'calendar';
|
|
538
540
|
/**
|
|
539
541
|
* Props do componente Filter
|
|
540
542
|
* @example
|
|
541
543
|
* ```tsx
|
|
542
544
|
* <Filter
|
|
543
545
|
* items={filterItems}
|
|
544
|
-
* type="
|
|
546
|
+
* type="multiple"
|
|
545
547
|
* placeholder="Filtrar por categoria"
|
|
546
548
|
* onApplyFilter={(ids) => handleFilter(ids)}
|
|
547
549
|
* buttonText="Filtros"
|
|
@@ -599,7 +601,27 @@ interface FilterProps extends BaseProps {
|
|
|
599
601
|
/** Idioma do calendário */
|
|
600
602
|
locale?: Locale;
|
|
601
603
|
/** Classe CSS opcional */
|
|
602
|
-
className?:
|
|
604
|
+
className?: BaseProps['className'];
|
|
605
|
+
/**
|
|
606
|
+
* Modo de exibição do filtro
|
|
607
|
+
* - `'simple'`: filtro simples com popover (padrão)
|
|
608
|
+
* - `'combined'`: filtro combinado com painel lateral onde o conteúdo é composto via children
|
|
609
|
+
*/
|
|
610
|
+
mode?: 'simple' | 'combined';
|
|
611
|
+
/** Largura do painel lateral no modo combined (ex: '400px', '50vw'). Quando omitido, usa o tamanho padrão do Drawer */
|
|
612
|
+
drawerWidth?: string;
|
|
613
|
+
/** Título do painel lateral (padrão: 'Filtrar') */
|
|
614
|
+
title?: string;
|
|
615
|
+
/** Número de filtros ativos exibido como badge no botão */
|
|
616
|
+
activeCount?: number;
|
|
617
|
+
/** Conteúdo customizado no cabeçalho do Drawer */
|
|
618
|
+
drawerHeaderContent?: ReactNode;
|
|
619
|
+
/** Conteúdo do painel lateral no modo combined */
|
|
620
|
+
children?: ReactNode;
|
|
621
|
+
/** Callback ao aplicar no modo combined: () => void */
|
|
622
|
+
onApply?: () => void;
|
|
623
|
+
/** Callback ao limpar no modo combined: () => void */
|
|
624
|
+
onClear?: () => void;
|
|
603
625
|
}
|
|
604
626
|
|
|
605
627
|
declare const Filter: React__default.FC<FilterProps>;
|
|
@@ -974,6 +996,18 @@ interface SearchProps extends BaseProps, NativeInputProps {
|
|
|
974
996
|
onClick?: (e: React$1.MouseEvent<HTMLDivElement>) => void;
|
|
975
997
|
/** Callback executado ao pressionar mouse no componente: (e) => void */
|
|
976
998
|
onMouseDown?: (e: React$1.MouseEvent<HTMLDivElement>) => void;
|
|
999
|
+
/**
|
|
1000
|
+
* Modo de pesquisa:
|
|
1001
|
+
* - `'instant'` (padrão): dispara a busca a cada tecla digitada
|
|
1002
|
+
* - `'on-enter'`: dispara a busca somente ao pressionar Enter
|
|
1003
|
+
*/
|
|
1004
|
+
searchMode?: 'instant' | 'on-enter';
|
|
1005
|
+
/**
|
|
1006
|
+
* Callback executado quando a busca é acionada.
|
|
1007
|
+
* - No modo `'instant'`: chamado a cada mudança de valor
|
|
1008
|
+
* - No modo `'on-enter'`: chamado somente ao pressionar Enter
|
|
1009
|
+
*/
|
|
1010
|
+
onSearch?: (value: string) => void;
|
|
977
1011
|
/** ID para testes automatizados */
|
|
978
1012
|
'data-testid'?: string;
|
|
979
1013
|
/** Classe CSS opcional */
|
|
@@ -1167,7 +1201,7 @@ interface BaseFilterItem$1 {
|
|
|
1167
1201
|
tooltip?: string;
|
|
1168
1202
|
}
|
|
1169
1203
|
interface CheckboxFilterItem$1 extends BaseFilterItem$1 {
|
|
1170
|
-
type: '
|
|
1204
|
+
type: 'multiple' | 'single';
|
|
1171
1205
|
items: FilterItem$2[];
|
|
1172
1206
|
selectedIds?: string[];
|
|
1173
1207
|
onSelectionChange?: (selectedIds: string[]) => void;
|
|
@@ -1239,12 +1273,12 @@ interface BaseFilterItem {
|
|
|
1239
1273
|
onToggle?: (isOpen: boolean) => void;
|
|
1240
1274
|
}
|
|
1241
1275
|
/**
|
|
1242
|
-
* Props de filtro do tipo
|
|
1276
|
+
* Props de filtro do tipo multiple, single ou ícone.
|
|
1243
1277
|
* Renderiza uma lista de opções selecionáveis.
|
|
1244
1278
|
*/
|
|
1245
1279
|
interface CheckboxFilterItem extends BaseFilterItem {
|
|
1246
1280
|
/** Tipo do filtro */
|
|
1247
|
-
type: '
|
|
1281
|
+
type: 'multiple' | 'single';
|
|
1248
1282
|
/** Lista de itens disponíveis para seleção */
|
|
1249
1283
|
items: FilterItem$2[];
|
|
1250
1284
|
/** IDs dos itens atualmente selecionados */
|
|
@@ -1278,21 +1312,57 @@ interface CalendarFilterItem extends BaseFilterItem {
|
|
|
1278
1312
|
/** Placeholder exibido quando nenhuma data está selecionada */
|
|
1279
1313
|
placeholder?: string;
|
|
1280
1314
|
}
|
|
1315
|
+
/**
|
|
1316
|
+
* Props de filtro do tipo combined.
|
|
1317
|
+
* Abre um painel lateral (Drawer) com conteúdo composto via children.
|
|
1318
|
+
*/
|
|
1319
|
+
interface CombinedFilterItem extends BaseFilterItem {
|
|
1320
|
+
/** Tipo do filtro */
|
|
1321
|
+
type: 'combined';
|
|
1322
|
+
/** Título do painel lateral (padrão: 'Filtrar') */
|
|
1323
|
+
title?: string;
|
|
1324
|
+
/** Largura do painel lateral (ex: '400px', '50vw') */
|
|
1325
|
+
drawerWidth?: string;
|
|
1326
|
+
/** Número de filtros ativos exibido como badge no botão */
|
|
1327
|
+
activeCount?: number;
|
|
1328
|
+
/** Conteúdo customizado no cabeçalho do Drawer */
|
|
1329
|
+
drawerHeaderContent?: ReactNode;
|
|
1330
|
+
/** Conteúdo do painel lateral */
|
|
1331
|
+
children?: ReactNode;
|
|
1332
|
+
/** Callback ao clicar em Aplicar */
|
|
1333
|
+
onApply?: () => void;
|
|
1334
|
+
/** Callback ao clicar em Limpar */
|
|
1335
|
+
onClear?: () => void;
|
|
1336
|
+
/** Variante visual do botão (padrão: 'outlined') */
|
|
1337
|
+
variant?: Variant;
|
|
1338
|
+
}
|
|
1281
1339
|
/**
|
|
1282
1340
|
* Union type representando um item de filtro da tabela.
|
|
1283
|
-
* Pode ser do tipo
|
|
1341
|
+
* Pode ser do tipo multiple/single, calendário ou combined (Drawer).
|
|
1284
1342
|
*/
|
|
1285
|
-
type FilterItem = CheckboxFilterItem | CalendarFilterItem;
|
|
1343
|
+
type FilterItem = CheckboxFilterItem | CalendarFilterItem | CombinedFilterItem;
|
|
1286
1344
|
/**
|
|
1287
1345
|
* Props do cabeçalho do TableV2, com busca global e filtros.
|
|
1288
1346
|
*/
|
|
1289
1347
|
interface TableV2HeaderProps {
|
|
1290
1348
|
/** Placeholder do campo de busca global */
|
|
1291
1349
|
searchPlaceholder?: string;
|
|
1292
|
-
/** Exibe o campo de busca (padrão: true) */
|
|
1293
|
-
showSearch?: boolean;
|
|
1294
1350
|
/** Items de filtro (Status, Data de início, etc.) */
|
|
1295
1351
|
filterItems?: FilterItem[];
|
|
1352
|
+
/** Modo de busca: 'instant' chama onSearchChange a cada tecla; 'on-enter' chama apenas ao pressionar Enter (padrão) */
|
|
1353
|
+
searchMode?: 'instant' | 'on-enter';
|
|
1354
|
+
/**
|
|
1355
|
+
* Valor controlado do campo de busca.
|
|
1356
|
+
* Permite que o pai redefina o texto exibido no campo (ex: ao limpar filtros).
|
|
1357
|
+
*/
|
|
1358
|
+
searchValue?: string;
|
|
1359
|
+
/**
|
|
1360
|
+
* Callback chamado quando o valor da busca é confirmado.
|
|
1361
|
+
* A presença deste callback é o que exibe o campo de busca —
|
|
1362
|
+
* quando não fornecido, o campo de busca não é renderizado.
|
|
1363
|
+
* A paginação é automaticamente resetada para a página 1 ao buscar.
|
|
1364
|
+
*/
|
|
1365
|
+
onSearchChange?: (value: string) => void;
|
|
1296
1366
|
}
|
|
1297
1367
|
/**
|
|
1298
1368
|
* Props do rodapé do TableV2, com controles de paginação.
|
|
@@ -1308,6 +1378,14 @@ interface TableV2FooterProps {
|
|
|
1308
1378
|
onPageChange?: (page: number) => void;
|
|
1309
1379
|
/** Callback chamado quando o tamanho da página muda */
|
|
1310
1380
|
onPageSizeChange?: (pageSize: number) => void;
|
|
1381
|
+
/**
|
|
1382
|
+
* Página atual (1-based) para controle externo da paginação.
|
|
1383
|
+
* Quando fornecido, sincroniza o estado interno com este valor,
|
|
1384
|
+
* permitindo que o pai redefina a página — por exemplo, ao aplicar
|
|
1385
|
+
* um filtro externo que deva redefinir para a página 1.
|
|
1386
|
+
* Funciona tanto no modo client-side quanto no modo `manualPagination`.
|
|
1387
|
+
*/
|
|
1388
|
+
currentPage?: number;
|
|
1311
1389
|
}
|
|
1312
1390
|
/**
|
|
1313
1391
|
* Props para personalização do estado vazio da tabela.
|
|
@@ -1320,6 +1398,27 @@ interface EmptyStateProps {
|
|
|
1320
1398
|
/** Texto descritivo exibido no estado vazio */
|
|
1321
1399
|
emptyText?: ReactNode;
|
|
1322
1400
|
}
|
|
1401
|
+
/**
|
|
1402
|
+
* Props de configuração de seleção de linhas do TableV2.
|
|
1403
|
+
*/
|
|
1404
|
+
interface TableV2RowSelectionProps<T = Record<string, unknown>> {
|
|
1405
|
+
/**
|
|
1406
|
+
* Keys das linhas selecionadas (modo controlado).
|
|
1407
|
+
* Quando fornecido, o componente não gerencia o estado de seleção internamente —
|
|
1408
|
+
* o pai é responsável por atualizar este array via `onRowChange`.
|
|
1409
|
+
*/
|
|
1410
|
+
selectedRowKeys?: (string | number)[];
|
|
1411
|
+
/**
|
|
1412
|
+
* Desabilita a seleção de uma linha específica.
|
|
1413
|
+
* Pode ser um booleano global ou uma função chamada por linha.
|
|
1414
|
+
*/
|
|
1415
|
+
disabled?: boolean | ((row: T, index: number) => boolean);
|
|
1416
|
+
/** Callback chamado quando a seleção de linhas muda.
|
|
1417
|
+
* Recebe os dados das linhas selecionadas e suas keys (índices). */
|
|
1418
|
+
onRowChange?: (selectedRows: T[], selectedKeys: (string | number)[]) => void;
|
|
1419
|
+
/** Desabilita o checkbox "selecionar todos" */
|
|
1420
|
+
disableSelectAll?: boolean;
|
|
1421
|
+
}
|
|
1323
1422
|
/**
|
|
1324
1423
|
* Definição de uma ação em massa disponível na barra de seleção.
|
|
1325
1424
|
*/
|
|
@@ -1355,7 +1454,7 @@ interface TableV2BulkActionsProps<T = Record<string, unknown>> {
|
|
|
1355
1454
|
* columns={columns}
|
|
1356
1455
|
* data={data}
|
|
1357
1456
|
* enableSorting
|
|
1358
|
-
*
|
|
1457
|
+
* rowSelection={{ onRowChange: (rows, keys) => console.log(rows, keys) }}
|
|
1359
1458
|
* loading={isLoading}
|
|
1360
1459
|
* />
|
|
1361
1460
|
* ```
|
|
@@ -1365,14 +1464,21 @@ interface TableV2Props<T = Record<string, unknown>> extends EmptyStateProps {
|
|
|
1365
1464
|
columns: ColumnDef<T, any>[];
|
|
1366
1465
|
/** Dados exibidos na tabela */
|
|
1367
1466
|
data: T[];
|
|
1368
|
-
/**
|
|
1369
|
-
|
|
1370
|
-
|
|
1371
|
-
|
|
1467
|
+
/**
|
|
1468
|
+
* Configuração de seleção de linhas via checkbox.
|
|
1469
|
+
* A presença deste objeto habilita a seleção. Use `disabled` para controlar
|
|
1470
|
+
* linhas específicas e `onRowChange` para reagir às mudanças.
|
|
1471
|
+
* @example
|
|
1472
|
+
* ```tsx
|
|
1473
|
+
* rowSelection={{
|
|
1474
|
+
* disabled: (row) => row.status !== 'pronto_para_fechar',
|
|
1475
|
+
* onRowChange: (rows, keys) => handleRowChange(rows, keys),
|
|
1476
|
+
* }}
|
|
1477
|
+
* ```
|
|
1478
|
+
*/
|
|
1479
|
+
rowSelection?: TableV2RowSelectionProps<T>;
|
|
1372
1480
|
/** Habilita ordenação de colunas ao clicar no cabeçalho */
|
|
1373
1481
|
enableSorting?: boolean;
|
|
1374
|
-
/** Callback chamado quando a seleção de linhas muda */
|
|
1375
|
-
onRowSelectionChange?: (selectedRows: T[]) => void;
|
|
1376
1482
|
/** Configuração das ações em massa exibidas quando há linhas selecionadas */
|
|
1377
1483
|
bulkActions?: TableV2BulkActionsProps<T>;
|
|
1378
1484
|
/** Header acima da tabela com busca + filtros */
|
|
@@ -1391,7 +1497,7 @@ interface TableV2Props<T = Record<string, unknown>> extends EmptyStateProps {
|
|
|
1391
1497
|
};
|
|
1392
1498
|
}
|
|
1393
1499
|
|
|
1394
|
-
declare const TableV2: <T>({ columns, data,
|
|
1500
|
+
declare const TableV2: <T>({ columns, data, rowSelection: rowSelectionConfig, enableSorting, bulkActions, header, footer, loading, emptyIcon, emptyTitle, emptyText, onRow, className, }: TableV2Props<T>) => react_jsx_runtime.JSX.Element;
|
|
1395
1501
|
|
|
1396
1502
|
/**
|
|
1397
1503
|
* Props do componente TextArea
|