@orangesix/react 1.0.10 → 1.1.0

package/style/scss/core/_reset.scss

@@ -0,0 +1,75 @@
+* {
+	box-sizing: border-box;
+}
+
+.p-component {
+    font-family: var(--font-family);
+    font-feature-settings: var(--font-feature-settings, normal);
+    font-size: $fontSize;
+    font-weight: $fontWeight;
+}
+
+.p-component-overlay {
+    background-color: $maskBg;
+    transition-duration: $transitionDuration;
+}
+
+.p-disabled, .p-component:disabled {
+    opacity: $disabledOpacity;
+}
+
+.p-error {
+    color: $errorColor;
+}
+
+.p-text-secondary {
+    color: $textSecondaryColor;
+}
+
+.pi {
+    font-size: $primeIconFontSize;
+}
+
+.p-icon {
+    width: $primeIconFontSize;
+    height: $primeIconFontSize;
+}
+
+.p-link {
+    font-family: var(--font-family);
+    font-feature-settings: var(--font-feature-settings, normal);
+    font-size: $fontSize;
+    border-radius: $borderRadius;
+
+    &:focus-visible {
+        @include focused();
+    }
+}
+
+.p-component-overlay-enter {
+    animation: p-component-overlay-enter-animation 150ms forwards;
+}
+
+.p-component-overlay-leave {
+    animation: p-component-overlay-leave-animation 150ms forwards;
+}
+
+.p-component-overlay {
+    @keyframes p-component-overlay-enter-animation {
+        from {
+            background-color: transparent;
+        }
+        to {
+            background-color: var(--maskbg);
+        }
+    }
+    
+    @keyframes p-component-overlay-leave-animation {
+        from {
+            background-color: var(--maskbg);
+        }
+        to {
+            background-color: transparent;
+        }
+    }
+}

package/table/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react"),t=require("primereact/utils"),a=require("primereact/column"),o=require("primereact/datatable");const r=({children:a,...o})=>{const r={size:`box-size-${o.size??"100"}`,direction:`box-direction-${o.direction??"row"}`,justify:void 0===o.justify?"":Array.isArray(o.justify)?o.justify?.join(" "):o.justify,align:void 0===o.align?"":Array.isArray(o.align)?o.align?.join(" "):o.align},n={className:t.classNames(["box",o.className??"",r.size,r.direction,r.justify,r.align]),style:o.css,id:o.id};return e.createElement("div",{...n},a)};function n(e){return{value:e.data,dataKey:"id",lazy:void 0!==e.lazy,resizableColumns:e.styleResizable??!1,columnResizeMode:"expand",emptyMessage:e.emptyMessage??"Não há informações disponíveis no momento.",header:e.templeteHeader,footer:e.templateFooter}}function i(e){return{sortField:e.lazy?.sortField,sortOrder:e.lazy?.sortOrder??null,onSort:void 0!==e.lazy?function(t){e.onSort&&e.onSort(t.sortField,t.sortOrder)}:void 0}}function l(e,t,a){return{groupRowsBy:e.rowGroup,rowGroupMode:e.rowGroupMode,rowGroupHeaderTemplate:e.rowGroupHeaderTemplate,rowGroupFooterTemplate:e.rowGroupFooterTemplate,expandableRowGroups:e.rowExpandable??!1,expandedRows:t,onRowToggle(e){a(e.data)}}}function s(e){return{metaKeySelection:void 0!==e.onSelection,selection:e.selection,selectionMode:void 0!==e.onSelection?e.selectionMode??"single":void 0,onSelectionChange:function(t){e.onSelection&&e.onSelection(t.value)}}}function d(t){return{paginator:t.paginator??!1,paginatorClassName:"pagination",totalRecords:t?.lazy?.paginationTotal??void 0,first:void 0===t?.lazy?.paginationPage?0:((t?.lazy?.paginationPage??0)-1)*(t.paginatorRow??10),rows:t.paginator?t.paginatorRow??10:void 0,rowsPerPageOptions:[5,10,15,20,50,100],paginatorTemplate:{layout:"RowsPerPageDropdown FirstPageLink PageLinks LastPageLink CurrentPageReport",CurrentPageReport:t=>e.createElement("p",{className:"text-secondary mx-2",style:{fontSize:".9em"}},"Total de registros: ",t.totalRecords),RowsPerPageDropdown:t=>e.createElement("select",{className:"form-select form-select-sm mx-2",style:{maxWidth:"60px"},value:t.value,onChange:e=>{const a={};a.value=Number(e.target.value),t.onChange(a)}},t.options.map((t=>e.createElement("option",{key:t.value,value:t.value},t.label))))},paginatorRight:t.templatePaginationRight,paginatorLeft:t.templatePaginationLeft,onPage:void 0!==t.lazy?function(e){let a=e.first/(t.paginatorRow??10);t.onPaginator&&t.onPaginator(a+1,e.rows)}:void 0}}function c(e){return{root:{className:"table-responsive"},table:{className:t.classNames(["table",e.styleHover?"table-hover":"",e.styleStriped?"table-striped":"","small"===e.styleSize?"table-sm":"","bordered"===e.styleType?"table-bordered":"borderless"===e.styleType?"table-borderless":""])},header:{className:"table-header"},footer:{className:"table-footer"},paginator:{root:{className:t.classNames(["p-0 d-flex mb-1 mt-2",`justify-content-${e.paginatorAlign??"center"}`]),style:{borderTop:"none"}},firstPageButton:{style:{borderTopLeftRadius:"3px",borderBottomLeftRadius:"3px"}},lastPageButton:{style:{borderTopRightRadius:"3px",borderBottomRightRadius:"3px"}}}}}function p(){return{sort:{className:"table-sort"},headerCell:e=>({className:t.classNames([e?.context.sorted?"table-sort-active":""])}),bodyCell:{className:"table-resizable"}}}exports.Table=function(t){const[u,m]=e.useState([]);return e.createElement(r,{className:"p-0",size:t.size??"100"},e.createElement(o.DataTable,{pt:{...c(t)},tableClassName:t.className,...n(t),...i(t),...s(t),...d(t),...l(t,u,m)},"checkbox"===t.selectionMode&&e.createElement(a.Column,{align:"center",headerStyle:{width:"2.5rem"},pt:{...p()},selectionMode:"multiple"}),t.column.map((t=>e.createElement(a.Column,{unstyled:!0,align:t.align,alignFrozen:t.frozen?"right":void 0,alignHeader:t.alignHeader,body:t.body,field:t.id,frozen:void 0!==t.frozen,header:t.header,key:t.id,pt:{...p()},sortable:t.sort??!1,style:t.style})))))};
+"use strict";var e=require("react"),o=require("primereact/utils"),t=require("primereact/column"),a=require("primereact/datatable");const r=({children:t,...a})=>{const r={size:`box-size-${a.size??"100"}`,direction:`box-direction-${a.direction??"row"}`,justify:void 0===a.justify?"":Array.isArray(a.justify)?a.justify?.join(" "):a.justify,align:void 0===a.align?"":Array.isArray(a.align)?a.align?.join(" "):a.align},i={className:o.classNames(["box",a.className??"",r.size,r.direction,r.justify,r.align]),style:a.css,id:a.id};return e.createElement("div",{...i},t)};function i(e){return{value:e.data,dataKey:"id",lazy:void 0!==e.lazy,resizableColumns:e.styleResizable??!1,columnResizeMode:"expand",emptyMessage:e.emptyMessage??"Não há informações disponíveis no momento.",header:e.templeteHeader,footer:e.templateFooter,stripedRows:e.styleStriped,size:e.styleSize,showGridlines:"bordered"===e.styleType}}function n(e){return{sortField:e.lazy?.sortField,sortOrder:e.lazy?.sortOrder??null,onSort:void 0!==e.lazy?function(o){e.onSort&&e.onSort(o.sortField,o.sortOrder)}:void 0}}function l(e,o,t){return{groupRowsBy:e.rowGroup,rowGroupMode:e.rowGroupMode,rowGroupHeaderTemplate:e.rowGroupHeaderTemplate,rowGroupFooterTemplate:e.rowGroupFooterTemplate,expandableRowGroups:e.rowExpandable??!1,expandedRows:o,onRowToggle(e){t(e.data)}}}function s(e){return{paginator:{root:{className:o.classNames([`justify-content-${e.paginatorAlign??"center"}`])}}}}function d(e){return{metaKeySelection:void 0!==e.onSelection,selection:e.selection,selectionMode:void 0!==e.onSelection?e.selectionMode??"single":void 0,onSelectionChange:function(o){e.onSelection&&e.onSelection(o.value)}}}function c(o){return{paginator:o.paginator??!1,totalRecords:o?.lazy?.paginationTotal??void 0,first:void 0===o?.lazy?.paginationPage?0:((o?.lazy?.paginationPage??0)-1)*(o.paginatorRow??10),rows:o.paginator?o.paginatorRow??10:void 0,rowsPerPageOptions:[5,10,15,20,50,100],paginatorTemplate:{layout:"RowsPerPageDropdown FirstPageLink PageLinks LastPageLink CurrentPageReport",CurrentPageReport:o=>e.createElement("span",{className:"ms-2"},"Total de registros: ",o.totalRecords)},paginatorRight:o.templatePaginationRight,paginatorLeft:o.templatePaginationLeft,onPage:void 0!==o.lazy?function(e){let t=e.first/(o.paginatorRow??10);o.onPaginator&&o.onPaginator(t+1,e.rows)}:void 0}}exports.Table=function(o){const[p,u]=e.useState([]);return e.createElement(r,{className:"p-0",size:o.size??"100"},e.createElement(a.DataTable,{pt:{...s(o)},tableClassName:o.className,...i(o),...n(o),...d(o),...c(o),...l(o,p,u)},"checkbox"===o.selectionMode&&e.createElement(t.Column,{align:"center",headerStyle:{width:"2.5rem"},selectionMode:"multiple"}),o.column.map((o=>e.createElement(t.Column,{align:o.align,alignFrozen:o.frozen?"right":void 0,alignHeader:o.alignHeader,body:o.body,field:o.id,frozen:void 0!==o.frozen,header:o.header,key:o.id,sortable:o.sort??!1,style:o.style})))))};
 //# sourceMappingURL=index.cjs.js.map

package/table/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../src/box/box.tsx","../../src/table/core/core.tsx","../../src/table/core/sort.tsx","../../src/table/core/group.tsx","../../src/table/core/selection.tsx","../../src/table/core/pagination.tsx","../../src/table/styled.ts","../../src/table/table.tsx"],"sourcesContent":["import { BoxProps } from \"./types\";\r\nimport React, { HTMLAttributes } from \"react\";\r\nimport { classNames } from \"primereact/utils\";\r\n\r\n/**\r\n * Componente - `Box`\r\n *\r\n * Um componente versátil que pode ser utilizado para criar seções ou caixas em uma página.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n *\r\n * Exemplo de uso:\r\n * ```tsx\r\n * <Box align=\"align-items-center\"\r\n *      justify=\"justify-content-end\"\r\n *      size=\"25\">\r\n *   ...conteúdo HTML\r\n * </Box>\r\n * ```\r\n */\r\nexport const Box = ({ children, ...props }: BoxProps) => {\r\n    const css = {\r\n        size: `box-size-${(props.size ?? \"100\")}`,\r\n        direction: `box-direction-${props.direction ?? \"row\"}`,\r\n        justify: props.justify === undefined ? \"\" : Array.isArray(props.justify) ? props.justify?.join(\" \") : props.justify,\r\n        align: props.align === undefined ? \"\" : Array.isArray(props.align) ? props.align?.join(\" \") : props.align\r\n    };\r\n\r\n    const attr: HTMLAttributes<\"div\"> & Omit<BoxProps, \"children\"> = {\r\n        className: classNames([\r\n            \"box\",\r\n            props.className ?? \"\",\r\n            css.size,\r\n            css.direction,\r\n            css.justify,\r\n            css.align\r\n        ]),\r\n        style: props.css,\r\n        id: props.id\r\n    };\r\n\r\n    return (\r\n        <div {...attr as any}>{children}</div>\r\n    );\r\n};","import { TableProps } from \"../types\";\r\nimport { DataTableBaseProps } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo principal da tabela.\r\n */\r\nexport function tableCore(\r\n    props: TableProps<any>\r\n): Partial<DataTableBaseProps<any>> {\r\n    return {\r\n        value: props.data as any,\r\n        dataKey: \"id\",\r\n        lazy: props.lazy !== undefined,\r\n        resizableColumns: props.styleResizable ?? false,\r\n        columnResizeMode: \"expand\",\r\n        emptyMessage: props.emptyMessage ?? \"Não há informações disponíveis no momento.\",\r\n        header: props.templeteHeader,\r\n        footer: props.templateFooter\r\n    };\r\n}","import { TableProps } from \"../types\";\r\nimport { DataTableProps, DataTableStateEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo de ordenação de resultado.\r\n */\r\nexport function tableSort(\r\n    props: TableProps<any>\r\n): Partial<DataTableProps<any>> {\r\n\r\n    function onSort(event: DataTableStateEvent) {\r\n        if (props.onSort) {\r\n            props.onSort(event.sortField, event.sortOrder);\r\n        }\r\n    }\r\n\r\n    return {\r\n        sortField: props.lazy?.sortField,\r\n        sortOrder: props.lazy?.sortOrder ?? null,\r\n        onSort: props.lazy !== undefined ? onSort : undefined\r\n    };\r\n}","import React from \"react\";\r\nimport { TableProps } from \"../types\";\r\nimport { DataTableBaseProps, DataTableRowToggleEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações de agrupamento da tabela.\r\n */\r\nexport function tableGroup(\r\n    props: TableProps<any>,\r\n    expandedRows: any,\r\n    setExpandedRows: React.Dispatch<any>\r\n): Partial<DataTableBaseProps<any>> {\r\n    return {\r\n        groupRowsBy: props.rowGroup,\r\n        rowGroupMode: props.rowGroupMode,\r\n        rowGroupHeaderTemplate: props.rowGroupHeaderTemplate,\r\n        rowGroupFooterTemplate: props.rowGroupFooterTemplate,\r\n        expandableRowGroups: props.rowExpandable ?? false,\r\n        expandedRows: expandedRows,\r\n        onRowToggle(event: DataTableRowToggleEvent) {\r\n            setExpandedRows(event.data);\r\n        }\r\n    };\r\n}","import { TableProps } from \"../types\";\r\nimport { DataTableProps, DataTableSelectionSingleChangeEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo de seleção de dados.\r\n */\r\nexport function tableSelection(\r\n    props: TableProps<any>\r\n): Partial<DataTableProps<any>> {\r\n\r\n    function onSelect(e: DataTableSelectionSingleChangeEvent<any>) {\r\n        if (props.onSelection) {\r\n            props.onSelection(e.value);\r\n        }\r\n    }\r\n\r\n    return {\r\n        metaKeySelection: props.onSelection !== undefined,\r\n        selection: props.selection,\r\n        selectionMode: props.onSelection !== undefined ? (props.selectionMode as any ?? \"single\") : undefined,\r\n        onSelectionChange: onSelect,\r\n    };\r\n}","import React from \"react\";\r\nimport { TableProps } from \"../types\";\r\nimport { PaginatorChangeEvent } from \"primereact/paginator\";\r\nimport { DataTableBaseProps, DataTableStateEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo de paginação de resultado.\r\n */\r\nexport function tablePagination(\r\n    props: TableProps<any>\r\n): Partial<DataTableBaseProps<any>> {\r\n\r\n    function onPage(event: DataTableStateEvent) {\r\n        let paginationPage = event.first / (props.paginatorRow ?? 10);\r\n        if (props.onPaginator) {\r\n            props.onPaginator(paginationPage + 1, event.rows);\r\n        }\r\n    }\r\n\r\n    return {\r\n        paginator: props.paginator ?? false,\r\n        paginatorClassName: \"pagination\",\r\n        totalRecords: props?.lazy?.paginationTotal ?? undefined,\r\n        first: props?.lazy?.paginationPage === undefined ? 0 : ((props?.lazy?.paginationPage ?? 0) - 1) * (props.paginatorRow ?? 10),\r\n        rows: props.paginator ? (props.paginatorRow ?? 10) : undefined,\r\n        rowsPerPageOptions: [5, 10, 15, 20, 50, 100],\r\n        paginatorTemplate: {\r\n            layout: \"RowsPerPageDropdown FirstPageLink PageLinks LastPageLink CurrentPageReport\",\r\n            CurrentPageReport: options => {\r\n                return (\r\n                    <p className=\"text-secondary mx-2\"\r\n                       style={{ fontSize: \".9em\" }}>Total de registros: {options.totalRecords}</p>\r\n                );\r\n            },\r\n            RowsPerPageDropdown: options => {\r\n                return (\r\n                    <select className=\"form-select form-select-sm mx-2\"\r\n                            style={{ maxWidth: \"60px\" }}\r\n                            value={options.value}\r\n                            onChange={(e) => {\r\n                                const event = {} as PaginatorChangeEvent;\r\n                                // @ts-ignore\r\n                                event.value = Number(e.target.value);\r\n                                options.onChange(event);\r\n                            }}>\r\n                        {options.options.map(obj => <option key={obj.value}\r\n                                                            value={obj.value}>{obj.label}</option>)}\r\n                    </select>\r\n                );\r\n            }\r\n        },\r\n        paginatorRight: props.templatePaginationRight,\r\n        paginatorLeft: props.templatePaginationLeft,\r\n        onPage: props.lazy !== undefined ? onPage : undefined,\r\n    };\r\n}","import { TableProps } from \"./types\";\r\nimport { classNames } from \"primereact/utils\";\r\nimport { ColumnPassThroughOptions } from \"primereact/column\";\r\nimport { DataTablePassThroughOptions } from \"primereact/datatable\";\r\n\r\n/**\r\n * Realiza a personalização na TABLE\r\n */\r\nexport function bootstrapTableStyle(props: TableProps<any>): DataTablePassThroughOptions {\r\n    return {\r\n        root: {\r\n            className: \"table-responsive\"\r\n        },\r\n        table: {\r\n            className: classNames([\r\n                \"table\",\r\n                props.styleHover ? \"table-hover\" : \"\",\r\n                props.styleStriped ? \"table-striped\" : \"\",\r\n                props.styleSize === \"small\" ? \"table-sm\" : \"\",\r\n                props.styleType === \"bordered\" ? \"table-bordered\" : props.styleType === \"borderless\" ? \"table-borderless\" : \"\",\r\n            ]),\r\n        },\r\n        header: {\r\n            className: \"table-header\",\r\n        },\r\n        footer: {\r\n            className: \"table-footer\"\r\n        },\r\n        paginator: {\r\n            root: {\r\n                className: classNames([\r\n                    \"p-0 d-flex mb-1 mt-2\",\r\n                    `justify-content-${props.paginatorAlign ?? \"center\"}`\r\n                ]),\r\n                style: { borderTop: \"none\" }\r\n            },\r\n            firstPageButton: {\r\n                style: { borderTopLeftRadius: \"3px\", borderBottomLeftRadius: \"3px\" }\r\n            },\r\n            lastPageButton: {\r\n                style: { borderTopRightRadius: \"3px\", borderBottomRightRadius: \"3px\" }\r\n            }\r\n        }\r\n    };\r\n}\r\n\r\n/**\r\n * Realiza a personalização na COLUNA da tabela\r\n */\r\nexport function bootstrapColumnStyle(): ColumnPassThroughOptions {\r\n\r\n    return {\r\n        sort: {\r\n            className: \"table-sort\"\r\n        },\r\n        headerCell: (options) => {\r\n            return {\r\n                className: classNames([\r\n                    options?.context.sorted ? \"table-sort-active\" : \"\",\r\n                ])\r\n            };\r\n        },\r\n        bodyCell: {\r\n            className: \"table-resizable\"\r\n        },\r\n    };\r\n}","import { Box } from \"../box\";\r\nimport { TableProps } from \"./types\";\r\nimport React, { useState } from \"react\";\r\nimport { tableCore } from \"./core/core\";\r\nimport { tableSort } from \"./core/sort\";\r\nimport { tableGroup } from \"./core/group\";\r\nimport { Column } from \"primereact/column\";\r\nimport { DataTable } from \"primereact/datatable\";\r\nimport { tableSelection } from \"./core/selection\";\r\nimport { tablePagination } from \"./core/pagination\";\r\nimport { bootstrapColumnStyle, bootstrapTableStyle } from \"./styled\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Um componente versátil que pode ser utilizado para criar tabela de dados.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport function Table<T = any>(props: TableProps<T>) {\r\n    const [expandedRows, setExpandedRows] = useState([]);\r\n\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <Box className=\"p-0\"\r\n             size={props.size ?? \"100\"}>\r\n            {/*@ts-ignore*/}\r\n            <DataTable<any>\r\n                pt={{ ...bootstrapTableStyle(props) }}\r\n                tableClassName={props.className}\r\n                {...tableCore(props)}\r\n                {...tableSort(props)}\r\n                {...tableSelection(props)}\r\n                {...tablePagination(props)}\r\n                {...tableGroup(props, expandedRows, setExpandedRows)}>\r\n                {props.selectionMode === \"checkbox\"\r\n                    && <Column align=\"center\"\r\n                               headerStyle={{ width: \"2.5rem\" }}\r\n                               pt={{ ...bootstrapColumnStyle() }}\r\n                               selectionMode=\"multiple\"/>}\r\n                {props.column.map(obj => {\r\n                    return (\r\n                        <Column\r\n                            unstyled\r\n                            align={obj.align}\r\n                            alignFrozen={obj.frozen ? \"right\" : undefined}\r\n                            alignHeader={obj.alignHeader}\r\n                            body={obj.body}\r\n                            field={obj.id}\r\n                            frozen={obj.frozen !== undefined}\r\n                            header={obj.header}\r\n                            key={obj.id}\r\n                            pt={{ ...bootstrapColumnStyle() }}\r\n                            sortable={obj.sort ?? false}\r\n                            style={obj.style}/>\r\n                    );\r\n                })}\r\n            </DataTable>\r\n        </Box>\r\n    );\r\n}"],"names":["Box","children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","id","React","createElement","tableCore","value","data","dataKey","lazy","resizableColumns","styleResizable","columnResizeMode","emptyMessage","header","templeteHeader","footer","templateFooter","tableSort","sortField","sortOrder","onSort","event","tableGroup","expandedRows","setExpandedRows","groupRowsBy","rowGroup","rowGroupMode","rowGroupHeaderTemplate","rowGroupFooterTemplate","expandableRowGroups","rowExpandable","onRowToggle","tableSelection","metaKeySelection","onSelection","selection","selectionMode","onSelectionChange","e","tablePagination","paginator","paginatorClassName","totalRecords","paginationTotal","first","paginationPage","paginatorRow","rows","rowsPerPageOptions","paginatorTemplate","layout","CurrentPageReport","options","fontSize","RowsPerPageDropdown","maxWidth","onChange","Number","target","map","obj","key","label","paginatorRight","templatePaginationRight","paginatorLeft","templatePaginationLeft","onPage","onPaginator","bootstrapTableStyle","root","table","styleHover","styleStriped","styleSize","styleType","paginatorAlign","borderTop","firstPageButton","borderTopLeftRadius","borderBottomLeftRadius","lastPageButton","borderTopRightRadius","borderBottomRightRadius","bootstrapColumnStyle","sort","headerCell","context","sorted","bodyCell","useState","DataTable","pt","tableClassName","Column","headerStyle","width","column","unstyled","alignFrozen","frozen","alignHeader","body","field","sortable"],"mappings":"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"}
+{"version":3,"file":"index.cjs.js","sources":["../../src/box/box.tsx","../../src/table/core/core.tsx","../../src/table/core/sort.tsx","../../src/table/core/group.tsx","../../src/table/styled.ts","../../src/table/core/selection.tsx","../../src/table/core/pagination.tsx","../../src/table/table.tsx"],"sourcesContent":["import { BoxProps } from \"./types\";\r\nimport React, { HTMLAttributes } from \"react\";\r\nimport { classNames } from \"primereact/utils\";\r\n\r\n/**\r\n * Componente - `Box`\r\n *\r\n * Um componente versátil que pode ser utilizado para criar seções ou caixas em uma página.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n *\r\n * Exemplo de uso:\r\n * ```tsx\r\n * <Box align=\"align-items-center\"\r\n *      justify=\"justify-content-end\"\r\n *      size=\"25\">\r\n *   ...conteúdo HTML\r\n * </Box>\r\n * ```\r\n */\r\nexport const Box = ({ children, ...props }: BoxProps) => {\r\n    const css = {\r\n        size: `box-size-${(props.size ?? \"100\")}`,\r\n        direction: `box-direction-${props.direction ?? \"row\"}`,\r\n        justify: props.justify === undefined ? \"\" : Array.isArray(props.justify) ? props.justify?.join(\" \") : props.justify,\r\n        align: props.align === undefined ? \"\" : Array.isArray(props.align) ? props.align?.join(\" \") : props.align\r\n    };\r\n\r\n    const attr: HTMLAttributes<\"div\"> & Omit<BoxProps, \"children\"> = {\r\n        className: classNames([\r\n            \"box\",\r\n            props.className ?? \"\",\r\n            css.size,\r\n            css.direction,\r\n            css.justify,\r\n            css.align\r\n        ]),\r\n        style: props.css,\r\n        id: props.id\r\n    };\r\n\r\n    return (\r\n        <div {...attr as any}>{children}</div>\r\n    );\r\n};","import { TableProps } from \"../types\";\r\nimport { DataTableBaseProps } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo principal da tabela.\r\n */\r\nexport function tableCore(\r\n    props: TableProps<any>\r\n): Partial<DataTableBaseProps<any>> {\r\n    return {\r\n        value: props.data as any,\r\n        dataKey: \"id\",\r\n        lazy: props.lazy !== undefined,\r\n        resizableColumns: props.styleResizable ?? false,\r\n        columnResizeMode: \"expand\",\r\n        emptyMessage: props.emptyMessage ?? \"Não há informações disponíveis no momento.\",\r\n        header: props.templeteHeader,\r\n        footer: props.templateFooter,\r\n        stripedRows: props.styleStriped,\r\n        size: props.styleSize,\r\n        showGridlines: props.styleType === \"bordered\"\r\n    };\r\n}","import { TableProps } from \"../types\";\r\nimport { DataTableProps, DataTableStateEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo de ordenação de resultado.\r\n */\r\nexport function tableSort(\r\n    props: TableProps<any>\r\n): Partial<DataTableProps<any>> {\r\n\r\n    function onSort(event: DataTableStateEvent) {\r\n        if (props.onSort) {\r\n            props.onSort(event.sortField, event.sortOrder);\r\n        }\r\n    }\r\n\r\n    return {\r\n        sortField: props.lazy?.sortField,\r\n        sortOrder: props.lazy?.sortOrder ?? null,\r\n        onSort: props.lazy !== undefined ? onSort : undefined\r\n    };\r\n}","import React from \"react\";\r\nimport { TableProps } from \"../types\";\r\nimport { DataTableBaseProps, DataTableRowToggleEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações de agrupamento da tabela.\r\n */\r\nexport function tableGroup(\r\n    props: TableProps<any>,\r\n    expandedRows: any,\r\n    setExpandedRows: React.Dispatch<any>\r\n): Partial<DataTableBaseProps<any>> {\r\n    return {\r\n        groupRowsBy: props.rowGroup,\r\n        rowGroupMode: props.rowGroupMode,\r\n        rowGroupHeaderTemplate: props.rowGroupHeaderTemplate,\r\n        rowGroupFooterTemplate: props.rowGroupFooterTemplate,\r\n        expandableRowGroups: props.rowExpandable ?? false,\r\n        expandedRows: expandedRows,\r\n        onRowToggle(event: DataTableRowToggleEvent) {\r\n            setExpandedRows(event.data);\r\n        }\r\n    };\r\n}","import { TableProps } from \"./types\";\r\nimport { classNames } from \"primereact/utils\";\r\nimport { DataTablePassThroughOptions } from \"primereact/datatable\";\r\n\r\n/**\r\n * Realiza a personalização na TABLE\r\n */\r\nexport function bootstrapTableStyle(props: TableProps<any>): DataTablePassThroughOptions {\r\n    return {\r\n        paginator: {\r\n            root: {\r\n                className: classNames([\r\n                    `justify-content-${props.paginatorAlign ?? \"center\"}`\r\n                ]),\r\n            }\r\n        }\r\n    };\r\n}","import { TableProps } from \"../types\";\r\nimport { DataTableProps, DataTableSelectionSingleChangeEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo de seleção de dados.\r\n */\r\nexport function tableSelection(\r\n    props: TableProps<any>\r\n): Partial<DataTableProps<any>> {\r\n\r\n    function onSelect(e: DataTableSelectionSingleChangeEvent<any>) {\r\n        if (props.onSelection) {\r\n            props.onSelection(e.value);\r\n        }\r\n    }\r\n\r\n    return {\r\n        metaKeySelection: props.onSelection !== undefined,\r\n        selection: props.selection,\r\n        selectionMode: props.onSelection !== undefined ? (props.selectionMode as any ?? \"single\") : undefined,\r\n        onSelectionChange: onSelect,\r\n    };\r\n}","import React from \"react\";\r\nimport { TableProps } from \"../types\";\r\nimport { DataTableBaseProps, DataTableStateEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo de paginação de resultado.\r\n */\r\nexport function tablePagination(\r\n    props: TableProps<any>\r\n): Partial<DataTableBaseProps<any>> {\r\n\r\n    function onPage(event: DataTableStateEvent) {\r\n        let paginationPage = event.first / (props.paginatorRow ?? 10);\r\n        if (props.onPaginator) {\r\n            props.onPaginator(paginationPage + 1, event.rows);\r\n        }\r\n    }\r\n\r\n    return {\r\n        paginator: props.paginator ?? false,\r\n        totalRecords: props?.lazy?.paginationTotal ?? undefined,\r\n        first: props?.lazy?.paginationPage === undefined ? 0 : ((props?.lazy?.paginationPage ?? 0) - 1) * (props.paginatorRow ?? 10),\r\n        rows: props.paginator ? (props.paginatorRow ?? 10) : undefined,\r\n        rowsPerPageOptions: [5, 10, 15, 20, 50, 100],\r\n        paginatorTemplate: {\r\n            layout: \"RowsPerPageDropdown FirstPageLink PageLinks LastPageLink CurrentPageReport\",\r\n            CurrentPageReport: options => {\r\n                return (\r\n                    <span className=\"ms-2\">Total de registros: {options.totalRecords}</span>\r\n                );\r\n            },\r\n        },\r\n        paginatorRight: props.templatePaginationRight,\r\n        paginatorLeft: props.templatePaginationLeft,\r\n        onPage: props.lazy !== undefined ? onPage : undefined,\r\n    };\r\n}","import { Box } from \"../box\";\r\nimport { TableProps } from \"./types\";\r\nimport React, { useState } from \"react\";\r\nimport { tableCore } from \"./core/core\";\r\nimport { tableSort } from \"./core/sort\";\r\nimport { tableGroup } from \"./core/group\";\r\nimport { Column } from \"primereact/column\";\r\nimport { bootstrapTableStyle } from \"./styled\";\r\nimport { DataTable } from \"primereact/datatable\";\r\nimport { tableSelection } from \"./core/selection\";\r\nimport { tablePagination } from \"./core/pagination\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Um componente versátil que pode ser utilizado para criar tabela de dados.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport function Table<T = any>(props: TableProps<T>) {\r\n    const [expandedRows, setExpandedRows] = useState([]);\r\n\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <Box className=\"p-0\"\r\n             size={props.size ?? \"100\"}>\r\n            {/*@ts-ignore*/}\r\n            <DataTable<any>\r\n                pt={{ ...bootstrapTableStyle(props) }}\r\n                tableClassName={props.className}\r\n                {...tableCore(props)}\r\n                {...tableSort(props)}\r\n                {...tableSelection(props)}\r\n                {...tablePagination(props)}\r\n                {...tableGroup(props, expandedRows, setExpandedRows)}>\r\n                {props.selectionMode === \"checkbox\"\r\n                    && <Column align=\"center\"\r\n                               headerStyle={{ width: \"2.5rem\" }}\r\n                               selectionMode=\"multiple\"/>}\r\n                {props.column.map(obj => {\r\n                    return (\r\n                        <Column align={obj.align}\r\n                                alignFrozen={obj.frozen ? \"right\" : undefined}\r\n                                alignHeader={obj.alignHeader}\r\n                                body={obj.body}\r\n                                field={obj.id}\r\n                                frozen={obj.frozen !== undefined}\r\n                                header={obj.header}\r\n                                key={obj.id}\r\n                                sortable={obj.sort ?? false}\r\n                                style={obj.style}/>\r\n                    );\r\n                })}\r\n            </DataTable>\r\n        </Box>\r\n    );\r\n}"],"names":["Box","children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","id","React","createElement","tableCore","value","data","dataKey","lazy","resizableColumns","styleResizable","columnResizeMode","emptyMessage","header","templeteHeader","footer","templateFooter","stripedRows","styleStriped","styleSize","showGridlines","styleType","tableSort","sortField","sortOrder","onSort","event","tableGroup","expandedRows","setExpandedRows","groupRowsBy","rowGroup","rowGroupMode","rowGroupHeaderTemplate","rowGroupFooterTemplate","expandableRowGroups","rowExpandable","onRowToggle","bootstrapTableStyle","paginator","root","paginatorAlign","tableSelection","metaKeySelection","onSelection","selection","selectionMode","onSelectionChange","e","tablePagination","totalRecords","paginationTotal","first","paginationPage","paginatorRow","rows","rowsPerPageOptions","paginatorTemplate","layout","CurrentPageReport","options","paginatorRight","templatePaginationRight","paginatorLeft","templatePaginationLeft","onPage","onPaginator","useState","DataTable","pt","tableClassName","Column","headerStyle","width","column","map","obj","alignFrozen","frozen","alignHeader","body","field","key","sortable","sort"],"mappings":"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"}

package/table/index.d.ts

@@ -69,11 +69,6 @@ interface TableStyleProps {
      */
     styleStriped?: boolean
 
-    /**
-     * Define estilo da tabela quando passa mouse sobre a linha da tabela
-     */
-    styleHover?: boolean
-
     /**
      * Define se as coluna das tabela por ser redimensionadas
      */
@@ -82,12 +77,12 @@ interface TableStyleProps {
     /**
      * Define estilo da tabela com bordar ou sem borda
      */
-    styleType?: "bordered" | "borderless"
+    styleType?: "bordered"
 
     /**
      * Define o tamanho da tabela.
      */
-    styleSize?: "small"
+    styleSize?: "small" | "normal" | "large"
 }
 
 interface TableColumnProps {
@@ -221,7 +216,7 @@ type TableLazyProps = {
      * Define o número total de registro da tabela
      */
     paginationTotal?: number
-}
+};
 
 interface TableProps<T> extends TableStyleProps, TableSelectionProps, TableTemplateProps, TableSortProps, TablePaginationProps, TableGroupProps, ApiComponentProps {
 

package/table/index.esm.js

@@ -1,2 +1,2 @@
-import e,{useState as t}from"react";import{classNames as o}from"primereact/utils";import{Column as a}from"primereact/column";import{DataTable as r}from"primereact/datatable";const n=({children:t,...a})=>{const r={size:`box-size-${a.size??"100"}`,direction:`box-direction-${a.direction??"row"}`,justify:void 0===a.justify?"":Array.isArray(a.justify)?a.justify?.join(" "):a.justify,align:void 0===a.align?"":Array.isArray(a.align)?a.align?.join(" "):a.align},n={className:o(["box",a.className??"",r.size,r.direction,r.justify,r.align]),style:a.css,id:a.id};return e.createElement("div",{...n},t)};function i(e){return{value:e.data,dataKey:"id",lazy:void 0!==e.lazy,resizableColumns:e.styleResizable??!1,columnResizeMode:"expand",emptyMessage:e.emptyMessage??"Não há informações disponíveis no momento.",header:e.templeteHeader,footer:e.templateFooter}}function l(e){return{sortField:e.lazy?.sortField,sortOrder:e.lazy?.sortOrder??null,onSort:void 0!==e.lazy?function(t){e.onSort&&e.onSort(t.sortField,t.sortOrder)}:void 0}}function s(e,t,o){return{groupRowsBy:e.rowGroup,rowGroupMode:e.rowGroupMode,rowGroupHeaderTemplate:e.rowGroupHeaderTemplate,rowGroupFooterTemplate:e.rowGroupFooterTemplate,expandableRowGroups:e.rowExpandable??!1,expandedRows:t,onRowToggle(e){o(e.data)}}}function d(e){return{metaKeySelection:void 0!==e.onSelection,selection:e.selection,selectionMode:void 0!==e.onSelection?e.selectionMode??"single":void 0,onSelectionChange:function(t){e.onSelection&&e.onSelection(t.value)}}}function p(t){return{paginator:t.paginator??!1,paginatorClassName:"pagination",totalRecords:t?.lazy?.paginationTotal??void 0,first:void 0===t?.lazy?.paginationPage?0:((t?.lazy?.paginationPage??0)-1)*(t.paginatorRow??10),rows:t.paginator?t.paginatorRow??10:void 0,rowsPerPageOptions:[5,10,15,20,50,100],paginatorTemplate:{layout:"RowsPerPageDropdown FirstPageLink PageLinks LastPageLink CurrentPageReport",CurrentPageReport:t=>e.createElement("p",{className:"text-secondary mx-2",style:{fontSize:".9em"}},"Total de registros: ",t.totalRecords),RowsPerPageDropdown:t=>e.createElement("select",{className:"form-select form-select-sm mx-2",style:{maxWidth:"60px"},value:t.value,onChange:e=>{const o={};o.value=Number(e.target.value),t.onChange(o)}},t.options.map((t=>e.createElement("option",{key:t.value,value:t.value},t.label))))},paginatorRight:t.templatePaginationRight,paginatorLeft:t.templatePaginationLeft,onPage:void 0!==t.lazy?function(e){let o=e.first/(t.paginatorRow??10);t.onPaginator&&t.onPaginator(o+1,e.rows)}:void 0}}function c(e){return{root:{className:"table-responsive"},table:{className:o(["table",e.styleHover?"table-hover":"",e.styleStriped?"table-striped":"","small"===e.styleSize?"table-sm":"","bordered"===e.styleType?"table-bordered":"borderless"===e.styleType?"table-borderless":""])},header:{className:"table-header"},footer:{className:"table-footer"},paginator:{root:{className:o(["p-0 d-flex mb-1 mt-2",`justify-content-${e.paginatorAlign??"center"}`]),style:{borderTop:"none"}},firstPageButton:{style:{borderTopLeftRadius:"3px",borderBottomLeftRadius:"3px"}},lastPageButton:{style:{borderTopRightRadius:"3px",borderBottomRightRadius:"3px"}}}}}function m(){return{sort:{className:"table-sort"},headerCell:e=>({className:o([e?.context.sorted?"table-sort-active":""])}),bodyCell:{className:"table-resizable"}}}function u(o){const[u,g]=t([]);return e.createElement(n,{className:"p-0",size:o.size??"100"},e.createElement(r,{pt:{...c(o)},tableClassName:o.className,...i(o),...l(o),...d(o),...p(o),...s(o,u,g)},"checkbox"===o.selectionMode&&e.createElement(a,{align:"center",headerStyle:{width:"2.5rem"},pt:{...m()},selectionMode:"multiple"}),o.column.map((t=>e.createElement(a,{unstyled:!0,align:t.align,alignFrozen:t.frozen?"right":void 0,alignHeader:t.alignHeader,body:t.body,field:t.id,frozen:void 0!==t.frozen,header:t.header,key:t.id,pt:{...m()},sortable:t.sort??!1,style:t.style})))))}export{u as Table};
+import e,{useState as o}from"react";import{classNames as t}from"primereact/utils";import{Column as r}from"primereact/column";import{DataTable as a}from"primereact/datatable";const i=({children:o,...r})=>{const a={size:`box-size-${r.size??"100"}`,direction:`box-direction-${r.direction??"row"}`,justify:void 0===r.justify?"":Array.isArray(r.justify)?r.justify?.join(" "):r.justify,align:void 0===r.align?"":Array.isArray(r.align)?r.align?.join(" "):r.align},i={className:t(["box",r.className??"",a.size,a.direction,a.justify,a.align]),style:r.css,id:r.id};return e.createElement("div",{...i},o)};function n(e){return{value:e.data,dataKey:"id",lazy:void 0!==e.lazy,resizableColumns:e.styleResizable??!1,columnResizeMode:"expand",emptyMessage:e.emptyMessage??"Não há informações disponíveis no momento.",header:e.templeteHeader,footer:e.templateFooter,stripedRows:e.styleStriped,size:e.styleSize,showGridlines:"bordered"===e.styleType}}function l(e){return{sortField:e.lazy?.sortField,sortOrder:e.lazy?.sortOrder??null,onSort:void 0!==e.lazy?function(o){e.onSort&&e.onSort(o.sortField,o.sortOrder)}:void 0}}function s(e,o,t){return{groupRowsBy:e.rowGroup,rowGroupMode:e.rowGroupMode,rowGroupHeaderTemplate:e.rowGroupHeaderTemplate,rowGroupFooterTemplate:e.rowGroupFooterTemplate,expandableRowGroups:e.rowExpandable??!1,expandedRows:o,onRowToggle(e){t(e.data)}}}function d(e){return{paginator:{root:{className:t([`justify-content-${e.paginatorAlign??"center"}`])}}}}function p(e){return{metaKeySelection:void 0!==e.onSelection,selection:e.selection,selectionMode:void 0!==e.onSelection?e.selectionMode??"single":void 0,onSelectionChange:function(o){e.onSelection&&e.onSelection(o.value)}}}function c(o){return{paginator:o.paginator??!1,totalRecords:o?.lazy?.paginationTotal??void 0,first:void 0===o?.lazy?.paginationPage?0:((o?.lazy?.paginationPage??0)-1)*(o.paginatorRow??10),rows:o.paginator?o.paginatorRow??10:void 0,rowsPerPageOptions:[5,10,15,20,50,100],paginatorTemplate:{layout:"RowsPerPageDropdown FirstPageLink PageLinks LastPageLink CurrentPageReport",CurrentPageReport:o=>e.createElement("span",{className:"ms-2"},"Total de registros: ",o.totalRecords)},paginatorRight:o.templatePaginationRight,paginatorLeft:o.templatePaginationLeft,onPage:void 0!==o.lazy?function(e){let t=e.first/(o.paginatorRow??10);o.onPaginator&&o.onPaginator(t+1,e.rows)}:void 0}}function g(t){const[g,m]=o([]);return e.createElement(i,{className:"p-0",size:t.size??"100"},e.createElement(a,{pt:{...d(t)},tableClassName:t.className,...n(t),...l(t),...p(t),...c(t),...s(t,g,m)},"checkbox"===t.selectionMode&&e.createElement(r,{align:"center",headerStyle:{width:"2.5rem"},selectionMode:"multiple"}),t.column.map((o=>e.createElement(r,{align:o.align,alignFrozen:o.frozen?"right":void 0,alignHeader:o.alignHeader,body:o.body,field:o.id,frozen:void 0!==o.frozen,header:o.header,key:o.id,sortable:o.sort??!1,style:o.style})))))}export{g as Table};
 //# sourceMappingURL=index.esm.js.map

package/table/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../src/box/box.tsx","../../src/table/core/core.tsx","../../src/table/core/sort.tsx","../../src/table/core/group.tsx","../../src/table/core/selection.tsx","../../src/table/core/pagination.tsx","../../src/table/styled.ts","../../src/table/table.tsx"],"sourcesContent":["import { BoxProps } from \"./types\";\r\nimport React, { HTMLAttributes } from \"react\";\r\nimport { classNames } from \"primereact/utils\";\r\n\r\n/**\r\n * Componente - `Box`\r\n *\r\n * Um componente versátil que pode ser utilizado para criar seções ou caixas em uma página.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n *\r\n * Exemplo de uso:\r\n * ```tsx\r\n * <Box align=\"align-items-center\"\r\n *      justify=\"justify-content-end\"\r\n *      size=\"25\">\r\n *   ...conteúdo HTML\r\n * </Box>\r\n * ```\r\n */\r\nexport const Box = ({ children, ...props }: BoxProps) => {\r\n    const css = {\r\n        size: `box-size-${(props.size ?? \"100\")}`,\r\n        direction: `box-direction-${props.direction ?? \"row\"}`,\r\n        justify: props.justify === undefined ? \"\" : Array.isArray(props.justify) ? props.justify?.join(\" \") : props.justify,\r\n        align: props.align === undefined ? \"\" : Array.isArray(props.align) ? props.align?.join(\" \") : props.align\r\n    };\r\n\r\n    const attr: HTMLAttributes<\"div\"> & Omit<BoxProps, \"children\"> = {\r\n        className: classNames([\r\n            \"box\",\r\n            props.className ?? \"\",\r\n            css.size,\r\n            css.direction,\r\n            css.justify,\r\n            css.align\r\n        ]),\r\n        style: props.css,\r\n        id: props.id\r\n    };\r\n\r\n    return (\r\n        <div {...attr as any}>{children}</div>\r\n    );\r\n};","import { TableProps } from \"../types\";\r\nimport { DataTableBaseProps } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo principal da tabela.\r\n */\r\nexport function tableCore(\r\n    props: TableProps<any>\r\n): Partial<DataTableBaseProps<any>> {\r\n    return {\r\n        value: props.data as any,\r\n        dataKey: \"id\",\r\n        lazy: props.lazy !== undefined,\r\n        resizableColumns: props.styleResizable ?? false,\r\n        columnResizeMode: \"expand\",\r\n        emptyMessage: props.emptyMessage ?? \"Não há informações disponíveis no momento.\",\r\n        header: props.templeteHeader,\r\n        footer: props.templateFooter\r\n    };\r\n}","import { TableProps } from \"../types\";\r\nimport { DataTableProps, DataTableStateEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo de ordenação de resultado.\r\n */\r\nexport function tableSort(\r\n    props: TableProps<any>\r\n): Partial<DataTableProps<any>> {\r\n\r\n    function onSort(event: DataTableStateEvent) {\r\n        if (props.onSort) {\r\n            props.onSort(event.sortField, event.sortOrder);\r\n        }\r\n    }\r\n\r\n    return {\r\n        sortField: props.lazy?.sortField,\r\n        sortOrder: props.lazy?.sortOrder ?? null,\r\n        onSort: props.lazy !== undefined ? onSort : undefined\r\n    };\r\n}","import React from \"react\";\r\nimport { TableProps } from \"../types\";\r\nimport { DataTableBaseProps, DataTableRowToggleEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações de agrupamento da tabela.\r\n */\r\nexport function tableGroup(\r\n    props: TableProps<any>,\r\n    expandedRows: any,\r\n    setExpandedRows: React.Dispatch<any>\r\n): Partial<DataTableBaseProps<any>> {\r\n    return {\r\n        groupRowsBy: props.rowGroup,\r\n        rowGroupMode: props.rowGroupMode,\r\n        rowGroupHeaderTemplate: props.rowGroupHeaderTemplate,\r\n        rowGroupFooterTemplate: props.rowGroupFooterTemplate,\r\n        expandableRowGroups: props.rowExpandable ?? false,\r\n        expandedRows: expandedRows,\r\n        onRowToggle(event: DataTableRowToggleEvent) {\r\n            setExpandedRows(event.data);\r\n        }\r\n    };\r\n}","import { TableProps } from \"../types\";\r\nimport { DataTableProps, DataTableSelectionSingleChangeEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo de seleção de dados.\r\n */\r\nexport function tableSelection(\r\n    props: TableProps<any>\r\n): Partial<DataTableProps<any>> {\r\n\r\n    function onSelect(e: DataTableSelectionSingleChangeEvent<any>) {\r\n        if (props.onSelection) {\r\n            props.onSelection(e.value);\r\n        }\r\n    }\r\n\r\n    return {\r\n        metaKeySelection: props.onSelection !== undefined,\r\n        selection: props.selection,\r\n        selectionMode: props.onSelection !== undefined ? (props.selectionMode as any ?? \"single\") : undefined,\r\n        onSelectionChange: onSelect,\r\n    };\r\n}","import React from \"react\";\r\nimport { TableProps } from \"../types\";\r\nimport { PaginatorChangeEvent } from \"primereact/paginator\";\r\nimport { DataTableBaseProps, DataTableStateEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo de paginação de resultado.\r\n */\r\nexport function tablePagination(\r\n    props: TableProps<any>\r\n): Partial<DataTableBaseProps<any>> {\r\n\r\n    function onPage(event: DataTableStateEvent) {\r\n        let paginationPage = event.first / (props.paginatorRow ?? 10);\r\n        if (props.onPaginator) {\r\n            props.onPaginator(paginationPage + 1, event.rows);\r\n        }\r\n    }\r\n\r\n    return {\r\n        paginator: props.paginator ?? false,\r\n        paginatorClassName: \"pagination\",\r\n        totalRecords: props?.lazy?.paginationTotal ?? undefined,\r\n        first: props?.lazy?.paginationPage === undefined ? 0 : ((props?.lazy?.paginationPage ?? 0) - 1) * (props.paginatorRow ?? 10),\r\n        rows: props.paginator ? (props.paginatorRow ?? 10) : undefined,\r\n        rowsPerPageOptions: [5, 10, 15, 20, 50, 100],\r\n        paginatorTemplate: {\r\n            layout: \"RowsPerPageDropdown FirstPageLink PageLinks LastPageLink CurrentPageReport\",\r\n            CurrentPageReport: options => {\r\n                return (\r\n                    <p className=\"text-secondary mx-2\"\r\n                       style={{ fontSize: \".9em\" }}>Total de registros: {options.totalRecords}</p>\r\n                );\r\n            },\r\n            RowsPerPageDropdown: options => {\r\n                return (\r\n                    <select className=\"form-select form-select-sm mx-2\"\r\n                            style={{ maxWidth: \"60px\" }}\r\n                            value={options.value}\r\n                            onChange={(e) => {\r\n                                const event = {} as PaginatorChangeEvent;\r\n                                // @ts-ignore\r\n                                event.value = Number(e.target.value);\r\n                                options.onChange(event);\r\n                            }}>\r\n                        {options.options.map(obj => <option key={obj.value}\r\n                                                            value={obj.value}>{obj.label}</option>)}\r\n                    </select>\r\n                );\r\n            }\r\n        },\r\n        paginatorRight: props.templatePaginationRight,\r\n        paginatorLeft: props.templatePaginationLeft,\r\n        onPage: props.lazy !== undefined ? onPage : undefined,\r\n    };\r\n}","import { TableProps } from \"./types\";\r\nimport { classNames } from \"primereact/utils\";\r\nimport { ColumnPassThroughOptions } from \"primereact/column\";\r\nimport { DataTablePassThroughOptions } from \"primereact/datatable\";\r\n\r\n/**\r\n * Realiza a personalização na TABLE\r\n */\r\nexport function bootstrapTableStyle(props: TableProps<any>): DataTablePassThroughOptions {\r\n    return {\r\n        root: {\r\n            className: \"table-responsive\"\r\n        },\r\n        table: {\r\n            className: classNames([\r\n                \"table\",\r\n                props.styleHover ? \"table-hover\" : \"\",\r\n                props.styleStriped ? \"table-striped\" : \"\",\r\n                props.styleSize === \"small\" ? \"table-sm\" : \"\",\r\n                props.styleType === \"bordered\" ? \"table-bordered\" : props.styleType === \"borderless\" ? \"table-borderless\" : \"\",\r\n            ]),\r\n        },\r\n        header: {\r\n            className: \"table-header\",\r\n        },\r\n        footer: {\r\n            className: \"table-footer\"\r\n        },\r\n        paginator: {\r\n            root: {\r\n                className: classNames([\r\n                    \"p-0 d-flex mb-1 mt-2\",\r\n                    `justify-content-${props.paginatorAlign ?? \"center\"}`\r\n                ]),\r\n                style: { borderTop: \"none\" }\r\n            },\r\n            firstPageButton: {\r\n                style: { borderTopLeftRadius: \"3px\", borderBottomLeftRadius: \"3px\" }\r\n            },\r\n            lastPageButton: {\r\n                style: { borderTopRightRadius: \"3px\", borderBottomRightRadius: \"3px\" }\r\n            }\r\n        }\r\n    };\r\n}\r\n\r\n/**\r\n * Realiza a personalização na COLUNA da tabela\r\n */\r\nexport function bootstrapColumnStyle(): ColumnPassThroughOptions {\r\n\r\n    return {\r\n        sort: {\r\n            className: \"table-sort\"\r\n        },\r\n        headerCell: (options) => {\r\n            return {\r\n                className: classNames([\r\n                    options?.context.sorted ? \"table-sort-active\" : \"\",\r\n                ])\r\n            };\r\n        },\r\n        bodyCell: {\r\n            className: \"table-resizable\"\r\n        },\r\n    };\r\n}","import { Box } from \"../box\";\r\nimport { TableProps } from \"./types\";\r\nimport React, { useState } from \"react\";\r\nimport { tableCore } from \"./core/core\";\r\nimport { tableSort } from \"./core/sort\";\r\nimport { tableGroup } from \"./core/group\";\r\nimport { Column } from \"primereact/column\";\r\nimport { DataTable } from \"primereact/datatable\";\r\nimport { tableSelection } from \"./core/selection\";\r\nimport { tablePagination } from \"./core/pagination\";\r\nimport { bootstrapColumnStyle, bootstrapTableStyle } from \"./styled\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Um componente versátil que pode ser utilizado para criar tabela de dados.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport function Table<T = any>(props: TableProps<T>) {\r\n    const [expandedRows, setExpandedRows] = useState([]);\r\n\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <Box className=\"p-0\"\r\n             size={props.size ?? \"100\"}>\r\n            {/*@ts-ignore*/}\r\n            <DataTable<any>\r\n                pt={{ ...bootstrapTableStyle(props) }}\r\n                tableClassName={props.className}\r\n                {...tableCore(props)}\r\n                {...tableSort(props)}\r\n                {...tableSelection(props)}\r\n                {...tablePagination(props)}\r\n                {...tableGroup(props, expandedRows, setExpandedRows)}>\r\n                {props.selectionMode === \"checkbox\"\r\n                    && <Column align=\"center\"\r\n                               headerStyle={{ width: \"2.5rem\" }}\r\n                               pt={{ ...bootstrapColumnStyle() }}\r\n                               selectionMode=\"multiple\"/>}\r\n                {props.column.map(obj => {\r\n                    return (\r\n                        <Column\r\n                            unstyled\r\n                            align={obj.align}\r\n                            alignFrozen={obj.frozen ? \"right\" : undefined}\r\n                            alignHeader={obj.alignHeader}\r\n                            body={obj.body}\r\n                            field={obj.id}\r\n                            frozen={obj.frozen !== undefined}\r\n                            header={obj.header}\r\n                            key={obj.id}\r\n                            pt={{ ...bootstrapColumnStyle() }}\r\n                            sortable={obj.sort ?? false}\r\n                            style={obj.style}/>\r\n                    );\r\n                })}\r\n            </DataTable>\r\n        </Box>\r\n    );\r\n}"],"names":["Box","children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","id","React","createElement","tableCore","value","data","dataKey","lazy","resizableColumns","styleResizable","columnResizeMode","emptyMessage","header","templeteHeader","footer","templateFooter","tableSort","sortField","sortOrder","onSort","event","tableGroup","expandedRows","setExpandedRows","groupRowsBy","rowGroup","rowGroupMode","rowGroupHeaderTemplate","rowGroupFooterTemplate","expandableRowGroups","rowExpandable","onRowToggle","tableSelection","metaKeySelection","onSelection","selection","selectionMode","onSelectionChange","e","tablePagination","paginator","paginatorClassName","totalRecords","paginationTotal","first","paginationPage","paginatorRow","rows","rowsPerPageOptions","paginatorTemplate","layout","CurrentPageReport","options","fontSize","RowsPerPageDropdown","maxWidth","onChange","Number","target","map","obj","key","label","paginatorRight","templatePaginationRight","paginatorLeft","templatePaginationLeft","onPage","onPaginator","bootstrapTableStyle","root","table","styleHover","styleStriped","styleSize","styleType","paginatorAlign","borderTop","firstPageButton","borderTopLeftRadius","borderBottomLeftRadius","lastPageButton","borderTopRightRadius","borderBottomRightRadius","bootstrapColumnStyle","sort","headerCell","context","sorted","bodyCell","Table","useState","DataTable","pt","tableClassName","Column","headerStyle","width","column","unstyled","alignFrozen","frozen","alignHeader","body","field","sortable"],"mappings":"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"}
+{"version":3,"file":"index.esm.js","sources":["../../src/box/box.tsx","../../src/table/core/core.tsx","../../src/table/core/sort.tsx","../../src/table/core/group.tsx","../../src/table/styled.ts","../../src/table/core/selection.tsx","../../src/table/core/pagination.tsx","../../src/table/table.tsx"],"sourcesContent":["import { BoxProps } from \"./types\";\r\nimport React, { HTMLAttributes } from \"react\";\r\nimport { classNames } from \"primereact/utils\";\r\n\r\n/**\r\n * Componente - `Box`\r\n *\r\n * Um componente versátil que pode ser utilizado para criar seções ou caixas em uma página.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n *\r\n * Exemplo de uso:\r\n * ```tsx\r\n * <Box align=\"align-items-center\"\r\n *      justify=\"justify-content-end\"\r\n *      size=\"25\">\r\n *   ...conteúdo HTML\r\n * </Box>\r\n * ```\r\n */\r\nexport const Box = ({ children, ...props }: BoxProps) => {\r\n    const css = {\r\n        size: `box-size-${(props.size ?? \"100\")}`,\r\n        direction: `box-direction-${props.direction ?? \"row\"}`,\r\n        justify: props.justify === undefined ? \"\" : Array.isArray(props.justify) ? props.justify?.join(\" \") : props.justify,\r\n        align: props.align === undefined ? \"\" : Array.isArray(props.align) ? props.align?.join(\" \") : props.align\r\n    };\r\n\r\n    const attr: HTMLAttributes<\"div\"> & Omit<BoxProps, \"children\"> = {\r\n        className: classNames([\r\n            \"box\",\r\n            props.className ?? \"\",\r\n            css.size,\r\n            css.direction,\r\n            css.justify,\r\n            css.align\r\n        ]),\r\n        style: props.css,\r\n        id: props.id\r\n    };\r\n\r\n    return (\r\n        <div {...attr as any}>{children}</div>\r\n    );\r\n};","import { TableProps } from \"../types\";\r\nimport { DataTableBaseProps } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo principal da tabela.\r\n */\r\nexport function tableCore(\r\n    props: TableProps<any>\r\n): Partial<DataTableBaseProps<any>> {\r\n    return {\r\n        value: props.data as any,\r\n        dataKey: \"id\",\r\n        lazy: props.lazy !== undefined,\r\n        resizableColumns: props.styleResizable ?? false,\r\n        columnResizeMode: \"expand\",\r\n        emptyMessage: props.emptyMessage ?? \"Não há informações disponíveis no momento.\",\r\n        header: props.templeteHeader,\r\n        footer: props.templateFooter,\r\n        stripedRows: props.styleStriped,\r\n        size: props.styleSize,\r\n        showGridlines: props.styleType === \"bordered\"\r\n    };\r\n}","import { TableProps } from \"../types\";\r\nimport { DataTableProps, DataTableStateEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo de ordenação de resultado.\r\n */\r\nexport function tableSort(\r\n    props: TableProps<any>\r\n): Partial<DataTableProps<any>> {\r\n\r\n    function onSort(event: DataTableStateEvent) {\r\n        if (props.onSort) {\r\n            props.onSort(event.sortField, event.sortOrder);\r\n        }\r\n    }\r\n\r\n    return {\r\n        sortField: props.lazy?.sortField,\r\n        sortOrder: props.lazy?.sortOrder ?? null,\r\n        onSort: props.lazy !== undefined ? onSort : undefined\r\n    };\r\n}","import React from \"react\";\r\nimport { TableProps } from \"../types\";\r\nimport { DataTableBaseProps, DataTableRowToggleEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações de agrupamento da tabela.\r\n */\r\nexport function tableGroup(\r\n    props: TableProps<any>,\r\n    expandedRows: any,\r\n    setExpandedRows: React.Dispatch<any>\r\n): Partial<DataTableBaseProps<any>> {\r\n    return {\r\n        groupRowsBy: props.rowGroup,\r\n        rowGroupMode: props.rowGroupMode,\r\n        rowGroupHeaderTemplate: props.rowGroupHeaderTemplate,\r\n        rowGroupFooterTemplate: props.rowGroupFooterTemplate,\r\n        expandableRowGroups: props.rowExpandable ?? false,\r\n        expandedRows: expandedRows,\r\n        onRowToggle(event: DataTableRowToggleEvent) {\r\n            setExpandedRows(event.data);\r\n        }\r\n    };\r\n}","import { TableProps } from \"./types\";\r\nimport { classNames } from \"primereact/utils\";\r\nimport { DataTablePassThroughOptions } from \"primereact/datatable\";\r\n\r\n/**\r\n * Realiza a personalização na TABLE\r\n */\r\nexport function bootstrapTableStyle(props: TableProps<any>): DataTablePassThroughOptions {\r\n    return {\r\n        paginator: {\r\n            root: {\r\n                className: classNames([\r\n                    `justify-content-${props.paginatorAlign ?? \"center\"}`\r\n                ]),\r\n            }\r\n        }\r\n    };\r\n}","import { TableProps } from \"../types\";\r\nimport { DataTableProps, DataTableSelectionSingleChangeEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo de seleção de dados.\r\n */\r\nexport function tableSelection(\r\n    props: TableProps<any>\r\n): Partial<DataTableProps<any>> {\r\n\r\n    function onSelect(e: DataTableSelectionSingleChangeEvent<any>) {\r\n        if (props.onSelection) {\r\n            props.onSelection(e.value);\r\n        }\r\n    }\r\n\r\n    return {\r\n        metaKeySelection: props.onSelection !== undefined,\r\n        selection: props.selection,\r\n        selectionMode: props.onSelection !== undefined ? (props.selectionMode as any ?? \"single\") : undefined,\r\n        onSelectionChange: onSelect,\r\n    };\r\n}","import React from \"react\";\r\nimport { TableProps } from \"../types\";\r\nimport { DataTableBaseProps, DataTableStateEvent } from \"primereact/datatable\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Define as configurações do modo de paginação de resultado.\r\n */\r\nexport function tablePagination(\r\n    props: TableProps<any>\r\n): Partial<DataTableBaseProps<any>> {\r\n\r\n    function onPage(event: DataTableStateEvent) {\r\n        let paginationPage = event.first / (props.paginatorRow ?? 10);\r\n        if (props.onPaginator) {\r\n            props.onPaginator(paginationPage + 1, event.rows);\r\n        }\r\n    }\r\n\r\n    return {\r\n        paginator: props.paginator ?? false,\r\n        totalRecords: props?.lazy?.paginationTotal ?? undefined,\r\n        first: props?.lazy?.paginationPage === undefined ? 0 : ((props?.lazy?.paginationPage ?? 0) - 1) * (props.paginatorRow ?? 10),\r\n        rows: props.paginator ? (props.paginatorRow ?? 10) : undefined,\r\n        rowsPerPageOptions: [5, 10, 15, 20, 50, 100],\r\n        paginatorTemplate: {\r\n            layout: \"RowsPerPageDropdown FirstPageLink PageLinks LastPageLink CurrentPageReport\",\r\n            CurrentPageReport: options => {\r\n                return (\r\n                    <span className=\"ms-2\">Total de registros: {options.totalRecords}</span>\r\n                );\r\n            },\r\n        },\r\n        paginatorRight: props.templatePaginationRight,\r\n        paginatorLeft: props.templatePaginationLeft,\r\n        onPage: props.lazy !== undefined ? onPage : undefined,\r\n    };\r\n}","import { Box } from \"../box\";\r\nimport { TableProps } from \"./types\";\r\nimport React, { useState } from \"react\";\r\nimport { tableCore } from \"./core/core\";\r\nimport { tableSort } from \"./core/sort\";\r\nimport { tableGroup } from \"./core/group\";\r\nimport { Column } from \"primereact/column\";\r\nimport { bootstrapTableStyle } from \"./styled\";\r\nimport { DataTable } from \"primereact/datatable\";\r\nimport { tableSelection } from \"./core/selection\";\r\nimport { tablePagination } from \"./core/pagination\";\r\n\r\n/**\r\n * Componente - `Table`\r\n *\r\n * Um componente versátil que pode ser utilizado para criar tabela de dados.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport function Table<T = any>(props: TableProps<T>) {\r\n    const [expandedRows, setExpandedRows] = useState([]);\r\n\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <Box className=\"p-0\"\r\n             size={props.size ?? \"100\"}>\r\n            {/*@ts-ignore*/}\r\n            <DataTable<any>\r\n                pt={{ ...bootstrapTableStyle(props) }}\r\n                tableClassName={props.className}\r\n                {...tableCore(props)}\r\n                {...tableSort(props)}\r\n                {...tableSelection(props)}\r\n                {...tablePagination(props)}\r\n                {...tableGroup(props, expandedRows, setExpandedRows)}>\r\n                {props.selectionMode === \"checkbox\"\r\n                    && <Column align=\"center\"\r\n                               headerStyle={{ width: \"2.5rem\" }}\r\n                               selectionMode=\"multiple\"/>}\r\n                {props.column.map(obj => {\r\n                    return (\r\n                        <Column align={obj.align}\r\n                                alignFrozen={obj.frozen ? \"right\" : undefined}\r\n                                alignHeader={obj.alignHeader}\r\n                                body={obj.body}\r\n                                field={obj.id}\r\n                                frozen={obj.frozen !== undefined}\r\n                                header={obj.header}\r\n                                key={obj.id}\r\n                                sortable={obj.sort ?? false}\r\n                                style={obj.style}/>\r\n                    );\r\n                })}\r\n            </DataTable>\r\n        </Box>\r\n    );\r\n}"],"names":["Box","children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","id","React","createElement","tableCore","value","data","dataKey","lazy","resizableColumns","styleResizable","columnResizeMode","emptyMessage","header","templeteHeader","footer","templateFooter","stripedRows","styleStriped","styleSize","showGridlines","styleType","tableSort","sortField","sortOrder","onSort","event","tableGroup","expandedRows","setExpandedRows","groupRowsBy","rowGroup","rowGroupMode","rowGroupHeaderTemplate","rowGroupFooterTemplate","expandableRowGroups","rowExpandable","onRowToggle","bootstrapTableStyle","paginator","root","paginatorAlign","tableSelection","metaKeySelection","onSelection","selection","selectionMode","onSelectionChange","e","tablePagination","totalRecords","paginationTotal","first","paginationPage","paginatorRow","rows","rowsPerPageOptions","paginatorTemplate","layout","CurrentPageReport","options","paginatorRight","templatePaginationRight","paginatorLeft","templatePaginationLeft","onPage","onPaginator","Table","useState","DataTable","pt","tableClassName","Column","headerStyle","width","column","map","obj","alignFrozen","frozen","alignHeader","body","field","key","sortable","sort"],"mappings":"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"}

package/tablepivot/_tablepivot.scss

@@ -1,31 +1,15 @@
-:root {
-  --table-pivot-toolbar-font-size: .9em;
-
-  --table-pivot-border-radius: 5px;
-  --table-pivot-border-color: var(--bs-gray-300, #e5e5e5);
-
-  --table-pivot-background: var(--bs-white, #fff);
-  --table-pivot-background-toolbar: transparent;
-  --table-pivot-background-header: #f2f2f2;
-  --table-pivot-background-filter: #e0e0e0;
-
-  --table-pivot-modal-padding: 1rem;
-  --table-pivot-modal-btn-font-size: .9em;
-  --table-pivot-modal-btn-padding: .375rem .5rem;
-}
-
 .pivot-table {
   position: relative;
-  border: 1px dashed var(--table-pivot-border-color);
-  border-radius: var(--table-pivot-border-radius);
+  border: 1px dashed #{$tablePivotBorderColor};
+  border-radius: $borderRadius;
 
   //Toolbar - Cabeçalho de opções
   #wdr-toolbar-wrapper #wdr-toolbar {
-    background: var(--table-pivot-background-toolbar) !important;
+    background: transparent !important;
 
     span {
-      font-size: var(--table-pivot-toolbar-font-size) !important;
-      font-family: var(--bs-body-font-family), serif !important;
+      font-size: $fontSize !important;
+      font-family: $fontFamily;
     }
   }
 
@@ -34,28 +18,28 @@
 
     //Cabeçalho
     .wdr-grid-layout div.wdr-header {
-      background: var(--table-pivot-background-header) !important;
+      background: $tablePivotViewBg !important;
     }
 
     //Filtro
     .wdr-grid-layout #wdr-cols-filter {
-      background: var(--table-pivot-background-filter);
+      background: $tablePivotViewFilterBg;
     }
 
     //Linhas e colunas
     .wdr-ui div {
-      font-family: var(--bs-body-font-family), serif !important;
+      font-family: $fontFamily !important;
 
       &.wdr-cell {
         //color: #abc502 !important;
-        background: var(--table-pivot-background);
-        border-color: var(--table-pivot-border-color);
+        background: $tablePivotBg;
+        border-color: $tablePivotBorderColor;
       }
     }
 
     //Modal
     div.wdr-ui-window {
-      padding: var(--table-pivot-modal-padding);
+      padding: $tablePivotModalPadding;
 
       //Titulo e subtitulo
       .wdr-popup-subtitle,
@@ -72,15 +56,15 @@
       .wdr-ui-btn {
         height: auto;
         margin: 0 .25rem;
-        padding: var(--table-pivot-modal-btn-padding);
-        font-size: var(--table-pivot-modal-btn-font-size);
+        padding: $tablePivotModalBtnPadding;
+        font-size: $tablePivotModalBtnFontSize;
       }
 
       .wdr-selected,
       .wdr-unchecked,
       .wdr-checked {
         span {
-          font-family: var(--bs-body-font-family), serif !important;
+          font-family: $fontFamily !important;
         }
       }
 
@@ -92,7 +76,7 @@
 
   //Opções de dados
   .wdr-ui {
-    font-family: var(--bs-body-font-family), serif !important;
+    font-family: $fontFamily !important;
   }
 
   .wdr-credits {