@grazziotin/react-components 1.0.3 → 1.0.5

package/dist/components/datatable/index.js

@@ -0,0 +1,103 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { DataGrid, GridOverlay, GridColumnMenu, GridFilterPanel, GridColumnsPanel, GridPagination, } from '@mui/x-data-grid';
+import { Box, ThemeProvider, Typography } from '@mui/material';
+import { localeText, filtroPainel, stylesPaginacao, stylesMenuColuna, stylesFiltroPainel, stylesPainelColuna, estiloTabela, } from './utils/constants';
+function CustomColumnsPanel(props) {
+    return _jsx(GridColumnsPanel, __assign({}, props, { sx: stylesPainelColuna }));
+}
+function CustomColumnMenu(props) {
+    return (_jsx(Box, { sx: stylesMenuColuna, children: _jsx(GridColumnMenu, __assign({}, props)) }));
+}
+function CustomFilterPanel(props) {
+    return (_jsx(ThemeProvider, { theme: filtroPainel, children: _jsx(GridFilterPanel, __assign({}, props, { sx: stylesFiltroPainel })) }));
+}
+function CustomNoRowsOverlay() {
+    return (_jsx(GridOverlay, { children: _jsx(Box, { sx: { mt: 1 }, children: "Nenhum dado encontrado." }) }));
+}
+function CustomPagination() {
+    return (_jsx(Box, { sx: stylesPaginacao, children: _jsx(GridPagination, {}) }));
+}
+var DataTable = function (_a) {
+    var _b, _c, _d, _e, _f, _g, _h;
+    var title = _a.title, countText = _a.countText, rest = __rest(_a, ["title", "countText"]);
+    var useAutoHeight = Boolean(rest.autoHeight);
+    var pageSizeOptions = rest.pageSizeOptions, initialState = rest.initialState, paginationModel = rest.paginationModel, gridProps = __rest(rest, ["pageSizeOptions", "initialState", "paginationModel"]);
+    var defaultPageSizeOptions = [5, 10, 25];
+    var currentOptions = pageSizeOptions && pageSizeOptions.length > 0
+        ? pageSizeOptions
+        : defaultPageSizeOptions;
+    var getOptionValue = function (option) {
+        return typeof option === 'number' ? option : option.value;
+    };
+    var fallbackPageSize = getOptionValue(currentOptions[0]) || 10;
+    var currentPageSize = (_e = (_b = paginationModel === null || paginationModel === void 0 ? void 0 : paginationModel.pageSize) !== null && _b !== void 0 ? _b : (_d = (_c = initialState === null || initialState === void 0 ? void 0 : initialState.pagination) === null || _c === void 0 ? void 0 : _c.paginationModel) === null || _d === void 0 ? void 0 : _d.pageSize) !== null && _e !== void 0 ? _e : fallbackPageSize;
+    var pageSizeExists = currentOptions.some(function (option) { return getOptionValue(option) === currentPageSize; });
+    var normalizedPageSizeOptions = pageSizeExists
+        ? currentOptions
+        : __spreadArray(__spreadArray([], currentOptions, true), [currentPageSize], false);
+    var normalizedInitialState = paginationModel
+        ? initialState
+        : __assign(__assign({}, initialState), { pagination: __assign(__assign({}, initialState === null || initialState === void 0 ? void 0 : initialState.pagination), { paginationModel: {
+                    page: (_h = (_g = (_f = initialState === null || initialState === void 0 ? void 0 : initialState.pagination) === null || _f === void 0 ? void 0 : _f.paginationModel) === null || _g === void 0 ? void 0 : _g.page) !== null && _h !== void 0 ? _h : 0,
+                    pageSize: currentPageSize,
+                } }) });
+    return (_jsxs(Box, { sx: { mb: 2, mt: 2, width: '100%' }, children: [(title !== null && title !== void 0 ? title : countText) && (_jsxs(Box, { sx: {
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'space-between',
+                    flexWrap: 'wrap',
+                    gap: 1,
+                    mb: 2,
+                }, children: [title && (_jsx(Typography, { component: "h2", variant: "h6", sx: {
+                            fontWeight: 700,
+                            fontSize: '1.25rem',
+                            color: 'text.primary',
+                        }, children: title })), countText && (_jsx(Typography, { variant: "body2", sx: { color: 'text.secondary' }, children: countText }))] })), _jsx(Box, { sx: {
+                    width: '100%',
+                    minHeight: 210,
+                    height: useAutoHeight ? 'auto' : 420,
+                }, children: _jsx(DataGrid, __assign({ sx: estiloTabela }, gridProps, { className: "min-h-[210px]", pageSizeOptions: normalizedPageSizeOptions, initialState: normalizedInitialState, paginationModel: paginationModel, localeText: localeText, disableRowSelectionOnClick: true, slotProps: {
+                        loadingOverlay: {
+                            variant: 'linear-progress',
+                            noRowsVariant: 'skeleton',
+                        },
+                    }, slots: {
+                        columnMenu: CustomColumnMenu,
+                        filterPanel: CustomFilterPanel,
+                        columnsPanel: CustomColumnsPanel,
+                        noRowsOverlay: CustomNoRowsOverlay,
+                        pagination: CustomPagination,
+                    } })) })] }));
+};
+export default DataTable;

package/dist/components/datatable/utils/constants.d.ts

@@ -0,0 +1,8 @@
+import type { SxProps, Theme } from '@mui/material';
+export declare const localeText: Partial<import("@mui/x-data-grid").GridLocaleText>;
+export declare const filtroPainel: Theme;
+export declare const stylesPaginacao: SxProps<Theme>;
+export declare const stylesMenuColuna: SxProps<Theme>;
+export declare const stylesFiltroPainel: SxProps<Theme>;
+export declare const stylesPainelColuna: SxProps<Theme>;
+export declare const estiloTabela: SxProps<Theme>;

package/dist/components/datatable/utils/constants.js

@@ -0,0 +1,42 @@
+var _a, _b, _c, _d;
+import { createTheme } from '@mui/material/styles';
+import { ptBR } from '@mui/x-data-grid/locales';
+export var localeText = (_d = (_c = (_b = (_a = ptBR === null || ptBR === void 0 ? void 0 : ptBR.components) === null || _a === void 0 ? void 0 : _a.MuiDataGrid) === null || _b === void 0 ? void 0 : _b.defaultProps) === null || _c === void 0 ? void 0 : _c.localeText) !== null && _d !== void 0 ? _d : {};
+export var filtroPainel = createTheme({});
+export var stylesPaginacao = {
+    display: 'flex',
+    alignItems: 'center',
+    gap: 1,
+    flexWrap: 'wrap',
+    justifyContent: 'flex-end',
+    py: 1,
+};
+export var stylesMenuColuna = {
+    '& .MuiDataGrid-columnMenuList': {
+        minWidth: 180,
+    },
+};
+export var stylesFiltroPainel = {
+    p: 2,
+    '& .MuiDataGrid-filterForm': {
+        gap: 1,
+    },
+};
+export var stylesPainelColuna = {
+    p: 2,
+    '& .MuiDataGrid-columnsPanelRow': {
+        gap: 1,
+    },
+};
+export var estiloTabela = {
+    border: 'none',
+    '& .MuiDataGrid-cell:focus': {
+        outline: 'none',
+    },
+    '& .MuiDataGrid-columnHeaders': {
+        backgroundColor: 'action.hover',
+    },
+    '& .MuiDataGrid-row:hover': {
+        backgroundColor: 'action.hover',
+    },
+};

package/dist/components/filtro/components/card.d.ts

@@ -0,0 +1,24 @@
+import { FiltroCardProps } from 'src/components/filtro/utils/interface';
+/**
+ * Componente de card para filtros, permitindo a aplicação de filtros e ações de exportação.
+ *
+ *
+ * @version 0.0.1
+ * @author Flaviasoz
+ * @date 2024-10-21
+ *
+ * @template T - O tipo de dados utilizado no card de filtro.
+ *
+ * @param {Object} props - Propriedades do componente.
+ * @param {boolean} props.csv - Indica se a funcionalidade de exportação em CSV está habilitada.
+ * @param {string} props.title - Título do card de filtro.
+ * @param {Function} props.setOpen - Função para abrir o modal de filtros.
+ * @param {string} props.pesquisa - Valor da pesquisa atual.
+ * @param {Object} props.excelProps - Propriedades específicas para o botão de exportação em Excel.
+ * @param {Function} props.setPesquisa - Função para atualizar o valor da pesquisa.
+ * @param {boolean} props.renderFiltro - Indica se os filtros devem ser renderizados.
+ *
+ * @returns {JSX.Element} O card de filtro renderizado.
+ */
+declare const FiltroCard: <T>({ csv, title, setOpen, pesquisa, excelProps, setPesquisa, renderFiltro, }: FiltroCardProps<T>) => JSX.Element;
+export default FiltroCard;

package/dist/components/filtro/components/card.js

@@ -0,0 +1,49 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from 'src/lib/utils';
+import { Tooltip } from '@mantine/core';
+import { CircularProgress } from '@mui/material';
+import Input from 'src/components/inputs/input';
+import { FilterList } from '@mui/icons-material';
+import { ExcelIcon, Loading } from 'src/components/icons';
+import Button from 'src/components/button';
+import ButtonExcel from 'src/components/button/button-excel';
+import { Suspense } from 'react';
+/**
+ * Componente de card para filtros, permitindo a aplicação de filtros e ações de exportação.
+ *
+ *
+ * @version 0.0.1
+ * @author Flaviasoz
+ * @date 2024-10-21
+ *
+ * @template T - O tipo de dados utilizado no card de filtro.
+ *
+ * @param {Object} props - Propriedades do componente.
+ * @param {boolean} props.csv - Indica se a funcionalidade de exportação em CSV está habilitada.
+ * @param {string} props.title - Título do card de filtro.
+ * @param {Function} props.setOpen - Função para abrir o modal de filtros.
+ * @param {string} props.pesquisa - Valor da pesquisa atual.
+ * @param {Object} props.excelProps - Propriedades específicas para o botão de exportação em Excel.
+ * @param {Function} props.setPesquisa - Função para atualizar o valor da pesquisa.
+ * @param {boolean} props.renderFiltro - Indica se os filtros devem ser renderizados.
+ *
+ * @returns {JSX.Element} O card de filtro renderizado.
+ */
+var FiltroCard = function (_a) {
+    var csv = _a.csv, title = _a.title, setOpen = _a.setOpen, pesquisa = _a.pesquisa, excelProps = _a.excelProps, setPesquisa = _a.setPesquisa, renderFiltro = _a.renderFiltro;
+    return (_jsxs("div", { className: "min-h-14 flex w-full bg-white shadow-3-strong rounded-md mb-2 border-2 border-gray-200 transition-shadow duration-200 hover:shadow-full", children: [_jsx("div", { className: "h-16 w-2 bg-grzprimary rounded-tl-sm rounded-bl-sm" }), _jsxs("div", { className: "w-full flex justify-between items-center gap-4 px-4 py-3 min-h-14", children: [_jsx("h1", { className: "font-semibold text-lg whitespace-nowrap text-ellipsis overflow-hidden text-black/80", children: title !== null && title !== void 0 ? title : 'Filtros' }), _jsxs("div", { className: "flex items-center gap-3", children: [renderFiltro && (_jsx(Tooltip, { withArrow: true, arrowSize: 4, color: "#00b2a6", arrowOffset: 20, label: "Ver filtros", position: "bottom-end", transitionProps: { transition: 'pop', duration: 300 }, children: _jsx("span", { className: "inline-flex", children: _jsx(Button, { variant: "contained", color: "primary", borderRadius: "6px", onClick: function () { return setOpen(true); }, className: "rounded-sm w-10 h-9", children: _jsx(FilterList, { className: "h-6 w-7 text-white" }) }) }) })), csv && (_jsx(Tooltip, { withArrow: true, arrowSize: 4, color: "#00b2a6", arrowOffset: 20, label: "Exportar CSV", position: "bottom-end", transitionProps: { transition: 'pop', duration: 300 }, children: _jsx("span", { className: "inline-flex", children: _jsx(Button, { variant: "contained", color: "primary", borderRadius: "6px", onClick: csv.onClick, disabled: csv.isLoading, className: cn('w-10 h-9 p-0 [&_img]:w-5 [&_img]:h-5', {
+                                            'bg-system-100': csv.isLoading,
+                                        }), children: csv.isLoading ? _jsx(Loading, {}) : _jsx(ExcelIcon, {}) }) }) })), excelProps && !csv && (_jsx(Suspense, { fallback: _jsx(CircularProgress, {}), children: _jsx(ButtonExcel, __assign({}, excelProps)) })), setPesquisa && (_jsx(Input, { label: "Pesquisa", type: "search", value: pesquisa, placeholder: "Digite para filtrar", onChange: function (e) { return setPesquisa(e.target.value); } }))] })] })] }));
+};
+export default FiltroCard;

package/dist/components/filtro/components/filtros.d.ts

@@ -0,0 +1,19 @@
+import { FiltrosProps } from 'src/components/filtro/utils/interface';
+/**
+ * Componente que renderiza um drawer com campos de filtros personalizáveis.
+ *
+ * @template T - Tipo dos dados utilizados nos filtros.
+ * @template M - Tipo opcional que define um parâmetro booleano.
+ *
+ * @param {Object} props - Propriedades do componente.
+ * @param {boolean} props.open - Estado que determina se o drawer está aberto.
+ * @param {Function} props.setOpen - Função para alterar o estado do drawer.
+ * @param {Function} [props.onClear] - Função chamada ao limpar os filtros.
+ * @param {Function} [props.onSubmit] - Função chamada ao submeter os filtros.
+ * @param {(InputProps & AdicionalPropsInput)[]} [props.inputs] - Lista de entradas do tipo Input.
+ * @param {(InputSelectProps<T, M> & AdicionalPropsInput)[]} [props.inputSelect] - Lista de entradas do tipo InputSelect.
+ *
+ * @returns {JSX.Element} O drawer com campos de filtro.
+ */
+declare const Filtros: <T, M extends boolean = false>({ open, setOpen, onClear, onSubmit, inputs, inputSelect, }: FiltrosProps<T, M>) => JSX.Element;
+export default Filtros;

package/dist/components/filtro/components/filtros.js

@@ -0,0 +1,77 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Button from 'src/components/button';
+import { Drawer, Grid } from '@mui/material';
+import Input from 'src/components/inputs/input';
+import InputSelect from 'src/components/inputs/input-select';
+import { useDimension } from 'src/hooks';
+/**
+ * Componente que renderiza um drawer com campos de filtros personalizáveis.
+ *
+ * @template T - Tipo dos dados utilizados nos filtros.
+ * @template M - Tipo opcional que define um parâmetro booleano.
+ *
+ * @param {Object} props - Propriedades do componente.
+ * @param {boolean} props.open - Estado que determina se o drawer está aberto.
+ * @param {Function} props.setOpen - Função para alterar o estado do drawer.
+ * @param {Function} [props.onClear] - Função chamada ao limpar os filtros.
+ * @param {Function} [props.onSubmit] - Função chamada ao submeter os filtros.
+ * @param {(InputProps & AdicionalPropsInput)[]} [props.inputs] - Lista de entradas do tipo Input.
+ * @param {(InputSelectProps<T, M> & AdicionalPropsInput)[]} [props.inputSelect] - Lista de entradas do tipo InputSelect.
+ *
+ * @returns {JSX.Element} O drawer com campos de filtro.
+ */
+var Filtros = function (_a) {
+    var _b;
+    var open = _a.open, setOpen = _a.setOpen, onClear = _a.onClear, onSubmit = _a.onSubmit, _c = _a.inputs, inputs = _c === void 0 ? [] : _c, _d = _a.inputSelect, inputSelect = _d === void 0 ? [] : _d;
+    var m640 = useDimension(640);
+    var m1120 = useDimension(1120);
+    var allInputs = __spreadArray(__spreadArray([], inputs, true), inputSelect, true).sort(function (a, b) {
+        var _a, _b;
+        var orderA = 'textFieldProps' in a && a.textFieldProps
+            ? ((_a = a.textFieldProps.order) !== null && _a !== void 0 ? _a : 99)
+            : 99;
+        var orderB = 'order' in b ? ((_b = b.order) !== null && _b !== void 0 ? _b : 99) : 99;
+        return orderA - orderB;
+    });
+    var isInputSelect = function (obj) {
+        return 'options' in obj;
+    };
+    var render = function (input, i) {
+        var _a, _b, _c;
+        if (isInputSelect(input)) {
+            return (_jsx(Grid, { size: (_b = (_a = input === null || input === void 0 ? void 0 : input.textFieldProps) === null || _a === void 0 ? void 0 : _a.xs) !== null && _b !== void 0 ? _b : 1, children: _jsx(InputSelect, __assign({}, input, { id: "inputSM".concat(i), fullWidth: true })) }, "inputSelect-".concat(i)));
+        }
+        else {
+            return (_jsx(Grid, { size: (_c = input.xs) !== null && _c !== void 0 ? _c : 1, children: _jsx(Input, __assign({}, input, { fullWidth: true })) }, "input-".concat(i)));
+        }
+    };
+    var handleSubmit = function (event) {
+        event.preventDefault();
+        if (onSubmit) {
+            onSubmit(event);
+            setOpen(false);
+        }
+    };
+    return (_jsx(Drawer, { anchor: "top", open: open, onClose: function () { return setOpen(false); }, sx: (_b = {}, _b["& .MuiDrawer-paper"] = { borderRadius: '0px 0px 20px 20px' }, _b), children: _jsxs("form", { className: "w-full flex flex-col pl-5 py-4 select-none", onSubmit: handleSubmit, children: [_jsx("p", { className: "text-system-900 font-semibold text-lg", children: "Filtros" }), _jsx("p", { className: "text-system-700 text-sm pt-1 pb-5", children: "Para que possamos apresentar dados espec\u00EDficos, por favor, preencha os campos abaixo." }), _jsx(Grid, { container: true, pr: 2, rowSpacing: 2, columnSpacing: 1, columns: (m640 && 1) || (m1120 && 3) || 7, children: allInputs.map(function (input, index) { return render(input, index); }) }), _jsxs("div", { className: "flex justify-end pt-4 pr-4 gap-4", children: [onClear && (_jsx(Button, { onClick: onClear, variant: "outlined", color: "secondary", children: "Limpar Filtros" })), onSubmit && (_jsx(Button, { variant: "contained", type: "submit", children: "Pesquisar" }))] })] }) }));
+};
+export default Filtros;

package/dist/components/filtro/index.d.ts

@@ -0,0 +1,28 @@
+import { FiltroProps } from './utils/interface';
+/**
+ * Componente de filtro genérico que permite a busca e filtragem de dados.
+ *
+ *
+ * @version 0.0.1
+ * @author Flaviasoz
+ * @date 2024-10-21
+ *
+ * @template T - O tipo de dados a ser filtrado.
+ * @template M - Tipo que indica se a seleção múltipla está habilitada (padrão: false).
+ *
+ * @param {Object} props - Propriedades do componente.
+ * @param {boolean} props.csv - Indica se a exportação para CSV está habilitada.
+ * @param {string} props.title - Título do filtro.
+ * @param {Array} props.inputs - Lista de inputs a serem exibidos no filtro.
+ * @param {Function} props.onClear - Função chamada ao limpar os filtros.
+ * @param {Function} props.onSubmit - Função chamada ao enviar os filtros.
+ * @param {string} props.pesquisa - Valor da pesquisa.
+ * @param {Object} props.excelProps - Propriedades específicas para exportação em Excel.
+ * @param {Function} props.setPesquisa - Função para atualizar o valor da pesquisa.
+ * @param {Array} props.inputSelect - Lista de inputs de seleção.
+ *
+ * @returns {JSX.Element} O componente de filtro renderizado.
+ */
+declare const Filtro: <T, M extends boolean = false>({ csv, title, inputs, onClear, onSubmit, pesquisa, excelProps, setPesquisa, inputSelect, }: FiltroProps<T, M>) => JSX.Element;
+export default Filtro;
+export type { FiltroProps, CsvProps } from './utils/interface';

package/dist/components/filtro/index.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import FiltroCard from './components/card';
+import Filtros from './components/filtros';
+/**
+ * Componente de filtro genérico que permite a busca e filtragem de dados.
+ *
+ *
+ * @version 0.0.1
+ * @author Flaviasoz
+ * @date 2024-10-21
+ *
+ * @template T - O tipo de dados a ser filtrado.
+ * @template M - Tipo que indica se a seleção múltipla está habilitada (padrão: false).
+ *
+ * @param {Object} props - Propriedades do componente.
+ * @param {boolean} props.csv - Indica se a exportação para CSV está habilitada.
+ * @param {string} props.title - Título do filtro.
+ * @param {Array} props.inputs - Lista de inputs a serem exibidos no filtro.
+ * @param {Function} props.onClear - Função chamada ao limpar os filtros.
+ * @param {Function} props.onSubmit - Função chamada ao enviar os filtros.
+ * @param {string} props.pesquisa - Valor da pesquisa.
+ * @param {Object} props.excelProps - Propriedades específicas para exportação em Excel.
+ * @param {Function} props.setPesquisa - Função para atualizar o valor da pesquisa.
+ * @param {Array} props.inputSelect - Lista de inputs de seleção.
+ *
+ * @returns {JSX.Element} O componente de filtro renderizado.
+ */
+var Filtro = function (_a) {
+    var csv = _a.csv, title = _a.title, inputs = _a.inputs, onClear = _a.onClear, onSubmit = _a.onSubmit, pesquisa = _a.pesquisa, excelProps = _a.excelProps, setPesquisa = _a.setPesquisa, inputSelect = _a.inputSelect;
+    var _b = useState(false), open = _b[0], setOpen = _b[1];
+    function renderFiltro() {
+        var _a, _b;
+        return ((_a = inputs === null || inputs === void 0 ? void 0 : inputs.length) !== null && _a !== void 0 ? _a : 0) > 0 || ((_b = inputSelect === null || inputSelect === void 0 ? void 0 : inputSelect.length) !== null && _b !== void 0 ? _b : 0) > 0;
+    }
+    return (_jsxs("div", { className: "w-full", children: [_jsx(FiltroCard, { csv: csv, title: title, setOpen: setOpen, pesquisa: pesquisa, excelProps: excelProps, setPesquisa: setPesquisa, renderFiltro: renderFiltro() }), _jsx(Filtros, { open: open, inputs: inputs, setOpen: setOpen, onClear: onClear, onSubmit: onSubmit, inputSelect: inputSelect })] }));
+};
+export default Filtro;

package/dist/components/filtro/utils/interface.d.ts

@@ -0,0 +1,105 @@
+import { InputSelectProps } from 'src/components/inputs/input-select';
+import { ButtonExcelProps } from 'src/components/button/button-excel';
+import { InputProps } from 'src/components/inputs/input';
+/**
+ * Propriedades para o componente CSV.
+ */
+export interface CsvProps {
+    /**
+     * Função chamada ao clicar no botão CSV.
+     */
+    onClick: () => void;
+    /**
+     * Indica se o CSV está em processo de carregamento.
+     */
+    isLoading: boolean;
+}
+/**
+ * Propriedades para o componente FiltroCard.
+ *
+ * @template T - Tipo dos dados utilizados.
+ */
+export interface FiltroCardProps<T> {
+    /**
+     * Propriedades para manipulação do CSV.
+     */
+    csv?: CsvProps;
+    /**
+     * Título do cartão de filtros.
+     */
+    title?: string;
+    /**
+     * Texto de pesquisa utilizado para filtrar dados.
+     */
+    pesquisa?: string;
+    /**
+     * Indica se os filtros devem ser renderizados.
+     */
+    renderFiltro: boolean;
+    /**
+     * Propriedades para o botão Excel.
+     */
+    excelProps?: ButtonExcelProps<T>;
+    /**
+     * Função para atualizar o valor da pesquisa.
+     */
+    setPesquisa?: (value: string) => void;
+    /**
+     * Função para alterar o estado de abertura do cartão.
+     */
+    setOpen: React.Dispatch<React.SetStateAction<boolean>>;
+}
+/**
+ * Propriedades adicionais para inputs.
+ */
+export interface AdicionalPropsInput {
+    /**
+     * Ordem de exibição do input.
+     */
+    order?: number;
+    /**
+     * Tamanho do grid para o input.
+     */
+    xs?: number;
+}
+export type InputsTypeFiltro = Omit<InputProps, 'sx'> & AdicionalPropsInput;
+/**
+ * Propriedades para o componente Filtros.
+ *
+ * @template T - Tipo dos dados utilizados.
+ * @template M - Tipo opcional que define um parâmetro booleano.
+ */
+export interface FiltrosProps<T, M extends boolean = false> {
+    /**
+     * Estado que determina se o drawer está aberto.
+     */
+    open?: boolean;
+    /**
+     * Função para alterar o estado do drawer.
+     */
+    setOpen: React.Dispatch<React.SetStateAction<boolean>>;
+    /**
+     * Lista de entradas do tipo Input.
+     */
+    inputs?: InputsTypeFiltro[];
+    /**
+     * Lista de entradas do tipo InputSelect.
+     */
+    inputSelect?: Array<Omit<InputSelectProps<T, M>, 'sx'> & AdicionalPropsInput>;
+    /**
+     * Função chamada ao limpar os filtros.
+     */
+    onClear?: () => void;
+    /**
+     * Função chamada ao submeter os filtros.
+     */
+    onSubmit?: (event: React.FormEvent<HTMLFormElement>) => void;
+}
+/**
+ * Propriedades para o componente Filtro.
+ *
+ * @template T - Tipo dos dados utilizados.
+ * @template M - Tipo opcional que define um parâmetro booleano.
+ */
+export interface FiltroProps<T, M extends boolean = false> extends Omit<FiltroCardProps<T>, 'renderFiltro' | 'setOpen'>, Omit<FiltrosProps<T, M>, 'open' | 'setOpen'> {
+}

package/dist/components/filtro/utils/interface.js

@@ -0,0 +1 @@
+export {};

package/dist/components/icons/index.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Este é um arquivo de ícones. Para obter os ícones, visite https://icons8.com/icons
+ * @ViniciusCLoeblein
+ */
+/**
+ * ![img](./svgs/excel.svg)
+ */
+declare const ExcelIcon: import("react").MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+/**
+ * ![img](./svgs/check.svg)
+ */
+declare const Check: import("react").MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+/**
+ * ![img](./svgs/config.svg)
+ */
+declare const Config: import("react").MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+/**
+ * ![img](./svgs/loading.svg|height=20|width=20)
+ */
+declare const Loading: import("react").MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+export { ExcelIcon, Check, Config, Loading };

package/dist/components/icons/index.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from 'react';
+import ExcelSvg from './svgs/excel.svg';
+import CheckSvg from './svgs/check.svg';
+import ConfigSvg from './svgs/config.svg';
+import LoadingSvg from './svgs/loading.svg';
+/**
+ * Este é um arquivo de ícones. Para obter os ícones, visite https://icons8.com/icons
+ * @ViniciusCLoeblein
+ */
+/**
+ * ![img](./svgs/excel.svg)
+ */
+var ExcelIcon = memo(function () {
+    return _jsx("img", { src: ExcelSvg, alt: "Excel", loading: "lazy" });
+});
+ExcelIcon.displayName = 'ExcelIcon';
+/**
+ * ![img](./svgs/check.svg)
+ */
+var Check = memo(function () {
+    return _jsx("img", { src: CheckSvg, alt: "Check", loading: "lazy" });
+});
+Check.displayName = 'Check';
+/**
+ * ![img](./svgs/config.svg)
+ */
+var Config = memo(function () {
+    return _jsx("img", { src: ConfigSvg, alt: "Config", loading: "lazy" });
+});
+Config.displayName = 'Config';
+/**
+ * ![img](./svgs/loading.svg|height=20|width=20)
+ */
+var Loading = memo(function () {
+    return (_jsx("img", { src: LoadingSvg, alt: "Loading", loading: "lazy", className: "inline w-5 h-5 animate-spin" }));
+});
+Loading.displayName = 'Loading';
+export { ExcelIcon, Check, Config, Loading };

package/dist/components/tabs/index.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+type TabsValue = string | number;
+export interface TabsItem {
+    label: React.ReactNode;
+    content: React.ReactNode;
+    disabled?: boolean;
+    icon?: React.ReactElement;
+    iconPosition?: 'top' | 'bottom' | 'start' | 'end';
+    value?: TabsValue;
+}
+export interface TabsProps {
+    items: TabsItem[];
+    value?: TabsValue;
+    defaultValue?: TabsValue;
+    onChange?: (value: TabsValue) => void;
+    ariaLabel?: string;
+    variant?: 'standard' | 'scrollable' | 'fullWidth';
+    centered?: boolean;
+    orientation?: 'horizontal' | 'vertical';
+    allowScrollButtonsMobile?: boolean;
+    scrollButtons?: 'auto' | true | false;
+}
+declare const Tabs: ({ items, value, defaultValue, onChange, ariaLabel, variant, centered, orientation, allowScrollButtonsMobile, scrollButtons, }: Readonly<TabsProps>) => import("react/jsx-runtime").JSX.Element;
+export default Tabs;

package/dist/components/tabs/index.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from 'react';
+import { Box, Tab, Tabs as MuiTabs, ThemeProvider, createTheme, } from '@mui/material';
+var tabsTheme = createTheme({
+    palette: {
+        primary: {
+            main: '#00b2a6',
+            light: '#00b2a6',
+            dark: '#00b2a6',
+            contrastText: '#ffffff',
+        },
+    },
+});
+function CustomTabPanel(_a) {
+    var value = _a.value, currentValue = _a.currentValue, children = _a.children, idPrefix = _a.idPrefix;
+    var isActive = currentValue === value;
+    return (_jsx("div", { role: "tabpanel", hidden: !isActive, id: "".concat(idPrefix, "-tabpanel-").concat(value), "aria-labelledby": "".concat(idPrefix, "-tab-").concat(value), children: isActive && _jsx(Box, { sx: { pt: 2 }, children: children }) }));
+}
+var Tabs = function (_a) {
+    var _b;
+    var items = _a.items, value = _a.value, defaultValue = _a.defaultValue, onChange = _a.onChange, _c = _a.ariaLabel, ariaLabel = _c === void 0 ? 'tabs' : _c, _d = _a.variant, variant = _d === void 0 ? 'standard' : _d, _e = _a.centered, centered = _e === void 0 ? false : _e, _f = _a.orientation, orientation = _f === void 0 ? 'horizontal' : _f, _g = _a.allowScrollButtonsMobile, allowScrollButtonsMobile = _g === void 0 ? false : _g, _h = _a.scrollButtons, scrollButtons = _h === void 0 ? 'auto' : _h;
+    var idPrefix = useMemo(function () { return "tabs-".concat(Math.random().toString(36).slice(2, 9)); }, []);
+    var tabValues = useMemo(function () { return items.map(function (item, index) { var _a; return (_a = item.value) !== null && _a !== void 0 ? _a : index; }); }, [items]);
+    var _j = useState((_b = defaultValue !== null && defaultValue !== void 0 ? defaultValue : tabValues[0]) !== null && _b !== void 0 ? _b : 0), internalValue = _j[0], setInternalValue = _j[1];
+    var currentValue = value !== null && value !== void 0 ? value : internalValue;
+    var handleChange = function (_event, newValue) {
+        if (value === undefined)
+            setInternalValue(newValue);
+        onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
+    };
+    return (_jsx(ThemeProvider, { theme: tabsTheme, children: _jsxs(Box, { sx: { width: '100%' }, children: [_jsx(Box, { sx: { borderBottom: 1, borderColor: 'divider' }, children: _jsx(MuiTabs, { value: currentValue, onChange: handleChange, "aria-label": ariaLabel, textColor: "primary", indicatorColor: "primary", variant: variant, centered: centered, orientation: orientation, allowScrollButtonsMobile: allowScrollButtonsMobile, scrollButtons: scrollButtons, children: items.map(function (item, index) {
+                            var tabValue = tabValues[index];
+                            return (_jsx(Tab, { label: item.label, icon: item.icon, iconPosition: item.iconPosition, disabled: item.disabled, value: tabValue, id: "".concat(idPrefix, "-tab-").concat(tabValue), "aria-controls": "".concat(idPrefix, "-tabpanel-").concat(tabValue) }, String(tabValue)));
+                        }) }) }), items.map(function (item, index) {
+                    var tabValue = tabValues[index];
+                    return (_jsx(CustomTabPanel, { value: tabValue, currentValue: currentValue, idPrefix: idPrefix, children: item.content }, String(tabValue)));
+                })] }) }));
+};
+export default Tabs;

package/dist/functions/mascaras/index.js

@@ -128,7 +128,7 @@ export var mascaradorMilharDecimal = function (v) {
  */
 export var mascaradorValorReal = function (v) {
     // Convertendo para um número, se for uma string
-    var valorNumerico = typeof v === 'string' ? parseFloat(v) : v !== null && v !== void 0 ? v : 0;
+    var valorNumerico = typeof v === 'string' ? parseFloat(v) : (v !== null && v !== void 0 ? v : 0);
     // Verificando se a conversão foi bem-sucedida
     if (!isNaN(valorNumerico)) {
         // Formatando o número como moeda