@mariliz/ui-kit 0.0.0-stage → 0.6.1

package/dist/components/UI/organisms/DataTable/DataTable.component.js

@@ -0,0 +1,62 @@
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { Stack } from '@mui/material';
+import { useState, useMemo } from 'react';
+import { MainBox, StyledDataGrid } from './DataTable.styled.js';
+import '../../atoms/TextField/TextField.styled.js';
+import '../../atoms/Autocomplete/Autocomplete.styled.js';
+import Typography from '../../atoms/Typography/Typography.component.js';
+import '../../atoms/Checkbox/Checkbox.styled.js';
+import '../../atoms/MenuItem/MenuItem.component.js';
+import '../../atoms/SelectField/SelectField.styled.js';
+import '../../atoms/TabItem/TabItem.styled.js';
+import { DataTableSkeleton } from './DataTable.skeleton.js';
+
+const OverlayMessage = (message) => {
+    return (jsx(Stack, { sx: { height: 'auto', alignItems: 'center', justifyContent: 'center' }, children: jsx(Typography, { variant: "body2", sx: { color: 'neutral.darkest', lineHeight: '29px' }, children: message }) }));
+};
+const emptyRowSelectionModel = { type: 'include', ids: new Set() };
+const generatedRowIds = new WeakMap();
+let generatedRowIdCounter = 0;
+const defaultGetRowId = (row) => {
+    if (row?.id !== undefined && row?.id !== null)
+        return row.id;
+    let id = generatedRowIds.get(row);
+    if (!id) {
+        id = `mariliz-row-${++generatedRowIdCounter}`;
+        generatedRowIds.set(row, id);
+    }
+    return id;
+};
+const DataTable = ({ NoRowsOverlayNew = 'Nenhum resultado encontrado', NoResultsOverlayNew = 'Nenhum resultado encontrado', rows, setPage, setRowsPerPage, hideFooterSelectedRowCount = false, onSelectionModelChange, keepNonExistentRowsSelected, page, rowsPerPage, columns, rowCount, loading = false, checkboxSelection = false, rowSelectionModel = emptyRowSelectionModel, isRowSelectable, isCellEditable = () => false, paginationMode = 'client', getRowId = defaultGetRowId, skeleton = false, enableJumpToPage = false, labelRowsPerPage, ...props }) => {
+    const [filterModel, setFilterModel] = useState(undefined);
+    const handleFilterModelChange = (model) => {
+        setFilterModel(model);
+    };
+    const paginationModel = { page, pageSize: rowsPerPage };
+    const handleChangePaginationModel = (newModel) => {
+        setPage(newModel.page);
+        setRowsPerPage(newModel.pageSize);
+    };
+    const centeredColumns = useMemo(() => columns.map((column) => ({ align: 'center', headerAlign: 'center', ...column })), [columns]);
+    const pageSizeOptions = [5, 10, 15, 20];
+    const hasRows = rows?.length > 0;
+    return (jsx(DataTableSkeleton, { skeleton: skeleton, rowsPerPage: rowsPerPage, children: jsx(MainBox, { children: jsx(StyledDataGrid, { rows: rows, columns: centeredColumns, rowCount: rowCount, rowHeight: 40, columnHeaderHeight: 48, autoHeight: true, pageSizeOptions: pageSizeOptions, pagination: true, paginationMode: paginationMode, paginationModel: paginationModel, onPaginationModelChange: handleChangePaginationModel, disableColumnMenu: true, isCellEditable: isCellEditable, isRowSelectable: isRowSelectable, rowSelection: checkboxSelection || !!onSelectionModelChange, getRowId: getRowId, disableColumnFilter: true, disableRowSelectionOnClick: true, disableColumnSelector: true, checkboxSelection: checkboxSelection, onRowSelectionModelChange: onSelectionModelChange, rowSelectionModel: rowSelectionModel, keepNonExistentRowsSelected: keepNonExistentRowsSelected, hideFooterPagination: !hasRows, hideFooterSelectedRowCount: hideFooterSelectedRowCount || !hasRows, filterModel: filterModel, onFilterModelChange: handleFilterModelChange, loading: loading, initialState: {
+                    pagination: {
+                        paginationModel: { page: page, pageSize: rowsPerPage }
+                    }
+                }, localeText: labelRowsPerPage ? { paginationRowsPerPage: labelRowsPerPage } : undefined, slotProps: {
+                    basePagination: {
+                        material: {
+                            showFirstButton: enableJumpToPage,
+                            showLastButton: enableJumpToPage
+                        }
+                    }
+                }, slots: {
+                    noRowsOverlay: () => OverlayMessage(NoRowsOverlayNew),
+                    noResultsOverlay: () => OverlayMessage(NoResultsOverlayNew)
+                }, ...props }) }) }));
+};
+
+export { DataTable as default };
+//# sourceMappingURL=DataTable.component.js.map

package/dist/components/UI/organisms/DataTable/DataTable.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.component.js","sources":["../../../../../src/components/UI/organisms/DataTable/DataTable.component.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;;;;;AAWA;AACE;AAOF;AAEA;AAEA;AACA;AACA;;;;;AAII;AACA;;AAEF;AACF;AAEA;;AA2BE;;AAEA;;AAIA;AACE;AACA;AACF;AAEA;;AAMA;AAEA;AAiCU;;AAEC;AACF;AAGC;AACE;AACE;AACA;AACD;AACF;AACF;AAEC;AACA;AACD;AAMX;;"}

package/dist/components/UI/organisms/DataTable/DataTable.skeleton.js

@@ -0,0 +1,25 @@
+"use client";
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { Stack, Skeleton } from '@mui/material';
+
+const DataTableSkeleton = ({ skeleton, children, rowsPerPage }) => {
+    const height = {
+        1: 50,
+        5: 400,
+        10: 600,
+        15: 800,
+        20: 1000
+    };
+    const borderSx = {
+        borderRadius: '8px'
+    };
+    return (jsx(Fragment, { children: skeleton ? (jsxs(Stack, { children: [jsxs(Stack, { sx: {
+                        display: 'grid',
+                        gridTemplateColumns: 'auto auto',
+                        gap: 1,
+                        mb: 1
+                    }, children: [jsx(Skeleton, { variant: "rectangular", width: "100%", height: height[1], animation: "wave", sx: borderSx }), jsx(Skeleton, { variant: "rectangular", height: height[1], width: "100%", animation: "wave", sx: borderSx })] }), jsx(Skeleton, { variant: "rectangular", height: height[rowsPerPage], width: "100%", animation: "wave", sx: borderSx })] })) : (jsx(Fragment, { children: children })) }));
+};
+
+export { DataTableSkeleton };
+//# sourceMappingURL=DataTable.skeleton.js.map

package/dist/components/UI/organisms/DataTable/DataTable.skeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.skeleton.js","sources":["../../../../../src/components/UI/organisms/DataTable/DataTable.skeleton.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;AASO;AAKL;AACE;AACA;AACA;AACA;AACA;;AAGF;AACE;;AAGF;AAMY;AACA;AACA;AACA;;AA+Bd;;"}

package/dist/components/UI/organisms/DataTable/DataTable.styled.js

@@ -0,0 +1,67 @@
+"use client";
+import { Box } from '@mui/material';
+import { styled, alpha } from '@mui/material/styles';
+import { DataGrid } from '@mui/x-data-grid';
+
+const MainBox = styled(Box)(({ theme }) => ({
+    width: '100%',
+    background: theme.palette.background.paper,
+    borderRadius: '8px',
+    position: 'relative'
+}));
+const StyledDataGrid = styled(DataGrid)(({ theme }) => {
+    const color = theme.palette?.primary?.dark;
+    const { fontSize } = theme.typography.caption;
+    return {
+        '& .MuiDataGrid-row': {
+            backgroundColor: theme.palette.background.paper
+        },
+        '& .MuiDataGrid-row .Mui-selected, & .MuiDataGrid-row:nth-child(2n).Mui-selected': {
+            backgroundColor: theme.palette.action.selected
+        },
+        '& .MuiDataGrid-cell': {
+            fontSize,
+            fontWeight: 400
+        },
+        '& .MuiDataGrid-columnHeader, & .MuiDataGrid-cell': {
+            borderRight: `1px solid ${alpha(theme.palette.neutral.light, 0.35)}`
+        },
+        '& .MuiDataGrid-columnHeaderTitle': {
+            fontSize,
+            fontWeight: 700
+        },
+        '& .MuiDataGrid-columnHeaderTitleContainer .MuiDataGrid-sortIcon': {
+            color
+        },
+        '& .MuiDataGrid-columnHeaderCheckbox .MuiSvgIcon-root, & .MuiDataGrid-cellCheckbox, & .MuiSvgIcon-root': {
+            fontSize: '22px'
+        },
+        '& .MuiTablePagination-selectLabel,&  .MuiTablePagination-displayedRows': {
+            fontSize,
+            color: theme.palette?.neutral?.medium
+        },
+        '& .MuiTablePagination-displayedRows': {
+            marginRight: 23
+        },
+        '& .MuiTablePagination-select': {
+            fontSize,
+            marginTop: '5px'
+        },
+        '& .MuiSelect-icon': {
+            color: theme.palette?.neutral?.medium,
+            height: '24px',
+            width: '24px',
+            paddingBottom: '2px'
+        },
+        '& .MuiTablePagination-toolbar': {
+            paddingRight: '2.5rem'
+        },
+        '& .Mui-disabled': {
+            color: theme.palette.text.disabled,
+            backgroundColor: 'transparent'
+        }
+    };
+});
+
+export { MainBox, StyledDataGrid };
+//# sourceMappingURL=DataTable.styled.js.map

package/dist/components/UI/organisms/DataTable/DataTable.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.styled.js","sources":["../../../../../src/components/UI/organisms/DataTable/DataTable.styled.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;AAKO;AACL;AACA;AACA;AACA;AACD;AAEM;;;;AAKH;AACE;AACD;AACD;AACE;AACD;AACD;;AAEE;AACD;AACD;AACE;AACD;AACD;;AAEE;AACD;AACD;;AAEC;AACD;AAEI;AACD;AACH;;AAEE;AACD;AACD;AACE;AACD;AACD;;AAEE;AACD;AACD;AACE;AACA;AACA;AACA;AACD;AACD;AACE;AACD;AACD;AACE;AACA;AACD;;AAEL;;"}

package/dist/components/UI/organisms/Drawer/Drawer.component.js

@@ -0,0 +1,43 @@
+"use client";
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useId } from 'react';
+import { Drawer as Drawer$1, Stack } from '@mui/material';
+import { DrawerContent, DrawerHeader, CloseButton } from './Drawer.styled.js';
+import { CloseIcon } from '../../icons/CloseIcon.js';
+import '../../atoms/TextField/TextField.styled.js';
+import '../../atoms/Autocomplete/Autocomplete.styled.js';
+import Typography from '../../atoms/Typography/Typography.component.js';
+import '../../atoms/Checkbox/Checkbox.styled.js';
+import '../../atoms/MenuItem/MenuItem.component.js';
+import '../../atoms/SelectField/SelectField.styled.js';
+import '../../atoms/TabItem/TabItem.styled.js';
+
+const Drawer = ({ title, description, children, open, onClose, anchor, toggleDrawer, closeLabel = 'Fechar' }) => {
+    const titleId = useId();
+    const descriptionId = useId();
+    return (jsx(Drawer$1, { open: open, onClose: onClose, anchor: anchor, slotProps: {
+            paper: {
+                'aria-labelledby': title ? titleId : undefined,
+                'aria-describedby': description ? descriptionId : undefined,
+                sx: {
+                    width: toggleDrawer ? 500 : 612,
+                    maxWidth: '100%'
+                }
+            }
+        }, children: jsxs(DrawerContent, { children: [jsxs(DrawerHeader, { children: [jsxs(Stack, { children: [title && (jsx(Typography, { id: titleId, component: "h2", variant: "h1", sx: {
+                                        color: 'neutral.dark',
+                                        lineHeight: '2rem',
+                                        fontSize: '1.5rem',
+                                        mb: 1,
+                                        fontWeight: 700
+                                    }, children: title })), description && (jsx(Typography, { id: descriptionId, component: "p", variant: "h2", sx: {
+                                        fontSize: '1rem',
+                                        color: 'neutral.medium',
+                                        lineHeight: '1.5rem',
+                                        fontWeight: 400,
+                                        mb: 3
+                                    }, children: description }))] }), onClose && (jsx(CloseButton, { onClick: onClose, "aria-label": closeLabel, children: jsx(CloseIcon, {}) }))] }), children] }) }));
+};
+
+export { Drawer as default };
+//# sourceMappingURL=Drawer.component.js.map

package/dist/components/UI/organisms/Drawer/Drawer.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.component.js","sources":["../../../../../src/components/UI/organisms/Drawer/Drawer.component.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;;;;;AASA;AAUE;AACA;AAEA;AAMM;;;AAGE;;AAEE;AACD;AACF;AACF;AAWW;AACA;AACA;AACA;AACA;;AAYA;AACA;AACA;AACA;AACA;AACD;AAgBjB;;"}

package/dist/components/UI/organisms/Drawer/Drawer.styled.js

@@ -0,0 +1,24 @@
+"use client";
+import { styled } from '@mui/material/styles';
+import { Stack, IconButton } from '@mui/material';
+
+const DrawerContent = styled(Stack)(() => ({
+    padding: '32px 24px'
+}));
+const DrawerHeader = styled(Stack)(() => ({
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'flex-start',
+    gap: '16px'
+}));
+const CloseButton = styled(IconButton)(({ theme }) => ({
+    marginRight: '-8px',
+    marginTop: '-8px',
+    '& svg': {
+        fontSize: '24px',
+        color: theme.palette.neutral.dark
+    }
+}));
+
+export { CloseButton, DrawerContent, DrawerHeader };
+//# sourceMappingURL=Drawer.styled.js.map

package/dist/components/UI/organisms/Drawer/Drawer.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.styled.js","sources":["../../../../../src/components/UI/organisms/Drawer/Drawer.styled.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;AAIO;AACL;AACD;AAEM;AACL;AACA;AACA;AACA;AACD;AAEM;AACL;AACA;AACA;AACE;AACA;AACD;AACF;;"}

package/dist/components/UI/organisms/Menu/CustomMenu.js

@@ -0,0 +1,56 @@
+"use client";
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useId } from 'react';
+import { StyledList, StyledListItem, StyledAccordion, StyledListItemButton, StyledListItemIcon, StyledListItemText, StyledAccordionDetails, StyledStack, StyledLink } from './Menu.styled.js';
+import { AccordionSummary, Stack } from '@mui/material';
+import { DownIcon } from '../../icons/DownIcon.js';
+import clsx from 'clsx';
+import { SubMenu } from './SubMenu.js';
+
+const CustomMenu = ({ itemsList, activeIndex, open, setActiveIndex, setOpen }) => {
+    const baseId = useId();
+    return (jsx(StyledList, { children: itemsList?.map((item, index) => {
+            const isActive = !!item.active;
+            const isHighlighted = open && isActive;
+            const key = item.href ?? item.title ?? index;
+            if (item.submenu) {
+                const headerId = `${baseId}-menu-${index}-header`;
+                const panelId = `${baseId}-menu-${index}-panel`;
+                return (jsx(StyledListItem, { disablePadding: true, className: clsx(isActive && 'active'), openMenu: open, children: jsxs(StyledAccordion, { expanded: activeIndex === index, onChange: () => {
+                            setActiveIndex(activeIndex === index ? -1 : index);
+                            if (!open)
+                                setOpen(true);
+                        }, slotProps: { region: { id: panelId, 'aria-labelledby': headerId } }, children: [jsx(AccordionSummary, { expandIcon: jsx(DownIcon, {}), "aria-controls": panelId, id: headerId, "aria-label": open ? undefined : item.title, sx: {
+                                    '& .MuiAccordionSummary-expandIconWrapper': {
+                                        display: open ? 'block' : 'none'
+                                    }
+                                }, children: jsxs(StyledListItemButton, { component: "div", tabIndex: -1, disableRipple: true, sx: {
+                                        minHeight: 48,
+                                        justifyContent: open ? 'initial' : 'center',
+                                        px: 2.5,
+                                        marginBottom: '.60rem',
+                                        width: '100%'
+                                    }, children: [jsx(StyledListItemIcon, { sx: { mr: open ? 2 : 0 }, children: item.icon }), jsx(StyledListItemText, { primary: item.title, sx: { display: open ? 'block' : 'none' }, className: "title" })] }) }), jsx(StyledAccordionDetails, { sx: { display: open ? 'block' : 'none' }, children: jsx(StyledStack, { component: "ul", children: item.submenu.map((link) => {
+                                        if (!!link?.subSubmenu && link?.subSubmenu?.length > 0) {
+                                            return (jsxs("li", { className: clsx(link.active && 'active'), style: { listStyle: 'none' }, children: [jsx(StyledLink, { href: link.href, "aria-current": link.active ? 'page' : undefined, sx: {
+                                                            fontStyle: 'italic',
+                                                            display: 'block',
+                                                            marginLeft: '-16px',
+                                                            marginBottom: '1px'
+                                                        }, children: link.title }), jsx(Stack, { component: "ul", sx: { display: 'block', marginLeft: '10px', padding: '10px 0 3px 0' }, children: link.subSubmenu.map((subItem) => (jsx(SubMenu, { link: subItem }, subItem.href ?? subItem.title))) })] }, link.href ?? link.title));
+                                        }
+                                        return (jsx("li", { className: clsx(link.active && 'active'), children: jsx(StyledLink, { href: link.href, className: clsx(link.active && 'active'), "aria-current": link.active ? 'page' : undefined, children: link.title }) }, link.href ?? link.title));
+                                    }) }) })] }) }, key));
+            }
+            return (jsx(StyledListItem, { disablePadding: true, className: clsx(isActive && 'active'), openMenu: open, children: jsxs(StyledListItemButton, { href: item.href, "aria-current": isActive ? 'page' : undefined, "aria-label": open ? undefined : item.title, sx: {
+                        minHeight: 48,
+                        justifyContent: open ? 'initial' : 'center',
+                        px: 2.5,
+                        marginBottom: '.60rem',
+                        backgroundColor: isHighlighted ? 'primary.main' : 'transparent'
+                    }, children: [jsx(StyledListItemIcon, { sx: { mr: open ? 2 : 0 }, children: item.icon }), jsx(StyledListItemText, { primary: item.title, sx: { display: open ? 'block' : 'none' }, className: "title" })] }) }, key));
+        }) }));
+};
+
+export { CustomMenu };
+//# sourceMappingURL=CustomMenu.js.map

package/dist/components/UI/organisms/Menu/CustomMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomMenu.js","sources":["../../../../../src/components/UI/organisms/Menu/CustomMenu.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;AA2BO;AAOL;AAEA;AAGM;AACA;;AAGA;AACE;AACA;AAEA;AAUQ;AACA;;;AAUE;;AAEC;AACF;AAOG;;AAEA;AACA;AACA;AACD;AAeC;AACE;AAUQ;AACA;AACA;AACA;AACD;;;;;;AA+Cf;;AAEA;AACA;;;;AAiBhB;;"}

package/dist/components/UI/organisms/Menu/Menu.component.js

@@ -0,0 +1,87 @@
+"use client";
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useState, useRef, useEffect } from 'react';
+import Box from '@mui/material/Box';
+import { styled, IconButton, Skeleton, Stack, Typography } from '@mui/material';
+import { Drawer, LogoBox, StyledDivider, StyledListItem, StyledListItemButton, StyledListItemIcon, StyledListItemText } from './Menu.styled.js';
+import { useOnClickOutside } from '../../../../utils/helpers/methods/use-onClick-outside.js';
+import { CustomMenu } from './CustomMenu.js';
+import { LeftIcon } from '../../icons/LeftIcon.js';
+import { RightIcon } from '../../icons/RightIcon.js';
+import { SignInIcon } from '../../icons/SignInIcon.js';
+import '../../atoms/TextField/TextField.styled.js';
+import '../../atoms/Autocomplete/Autocomplete.styled.js';
+import Avatar from '../../atoms/Avatar/Avatar.component.js';
+import '../../atoms/Checkbox/Checkbox.styled.js';
+import '../../atoms/MenuItem/MenuItem.component.js';
+import '../../atoms/SelectField/SelectField.styled.js';
+import '../../atoms/TabItem/TabItem.styled.js';
+
+const defaultLabels = {
+    menu: 'Menu',
+    account: 'Conta',
+    logout: 'Sair',
+    expand: 'Expandir menu',
+    collapse: 'Recolher menu'
+};
+const TitleMenu = ({ title, open }) => {
+    return (jsx(Typography, { variant: "body2", sx: {
+            color: 'neutral.medium',
+            fontWeight: 500,
+            fontSize: '0.85rem',
+            my: 2,
+            textAlign: open ? 'left' : 'center'
+        }, children: title }));
+};
+const CustomIconButton = styled(IconButton)(({ theme }) => ({
+    position: 'absolute',
+    right: 0,
+    padding: 0,
+    color: theme.palette.neutral.medium,
+    '&:hover': {
+        backgroundColor: 'transparent'
+    },
+    '&:active': {
+        backgroundColor: 'transparent'
+    }
+}));
+const iconSx = {
+    width: '20px',
+    height: '20px'
+};
+const Menu = ({ items, logoIcon, drawerWidthMain, onClickLogout, closeDelay = 200, activateAutoOutsideMenu = false, skeleton = false, avatarTitle, avatarSubtitle, open: openProp, defaultOpen = false, onOpenChange, labels: labelsProp }) => {
+    const labels = { ...defaultLabels, ...labelsProp };
+    const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);
+    const isControlled = openProp !== undefined;
+    const open = isControlled ? openProp : uncontrolledOpen;
+    const setOpen = (next) => {
+        if (!isControlled)
+            setUncontrolledOpen(next);
+        onOpenChange?.(next);
+    };
+    const wrapperRef = useRef(null);
+    useOnClickOutside(wrapperRef, () => {
+        if (!activateAutoOutsideMenu || !open)
+            return;
+        setOpen(false);
+    }, closeDelay);
+    const [activeIndex, setActiveIndex] = useState(-1);
+    useEffect(() => {
+        drawerWidthMain?.(open ? 270 : 105);
+    }, [drawerWidthMain, open]);
+    return (jsx(Box, { ref: wrapperRef, sx: { display: 'flex', position: 'relative' }, children: jsxs(Drawer, { variant: "permanent", open: open, children: [jsxs(LogoBox, { children: [logoIcon, jsx(CustomIconButton, { size: "small", onClick: () => setOpen(!open), "aria-label": open ? labels.collapse : labels.expand, "aria-expanded": open, children: open ? jsx(LeftIcon, { sx: iconSx }) : jsx(RightIcon, { sx: iconSx }) })] }), jsx(StyledDivider, {}), jsx(TitleMenu, { title: labels.menu, open: open }), !skeleton ? (jsx(CustomMenu, { activeIndex: activeIndex, itemsList: items ?? [], open: open, setActiveIndex: setActiveIndex, setOpen: setOpen })) : (jsx(Fragment, { children: [1, 2, 3, 4, 5, 6, 7].map((_, index) => {
+                        return (jsx(Skeleton, { variant: "rectangular", animation: "pulse", width: "85%", height: 50, sx: {
+                                borderRadius: '5px',
+                                margin: '10px 5px'
+                            } }, index));
+                    }) })), jsx(StyledDivider, {}), jsx(TitleMenu, { title: labels.account, open: open }), jsxs(StyledListItem, { disablePadding: true, openMenu: open, children: [onClickLogout && (jsxs(StyledListItemButton, { sx: {
+                                minHeight: 48,
+                                justifyContent: open ? 'initial' : 'center',
+                                px: 2.5
+                            }, onClick: onClickLogout, "aria-label": open ? undefined : labels.logout, children: [jsx(StyledListItemIcon, { sx: {
+                                        mr: open ? 2 : 0
+                                    }, children: jsx(SignInIcon, {}) }), jsx(StyledListItemText, { primary: labels.logout, sx: { display: open ? 'block' : 'none' }, className: "title" })] })), avatarTitle && (jsx(Stack, { sx: { alignItems: open ? 'flex-start' : 'center', mt: 2 }, children: jsx(Avatar, { title: avatarTitle, subtitle: avatarSubtitle, showText: open }) }))] })] }) }));
+};
+
+export { Menu as default };
+//# sourceMappingURL=Menu.component.js.map

package/dist/components/UI/organisms/Menu/Menu.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu.component.js","sources":["../../../../../src/components/UI/organisms/Menu/Menu.component.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAoBA;AACE;AACA;AACA;AACA;AACA;;AAQF;;AAKQ;AACA;AACA;AACA;;;AAOR;AAEA;AACE;AACA;AACA;AACA;AACA;AACE;AACD;AACD;AACE;AACD;AACF;AAED;AACE;AACA;;AAGF;;;AAiBE;;AAGA;AACE;;AACA;AACF;AAEA;AAEA;AAGI;;;;;;AASF;AACF;AAEA;;AAsCkB;AACA;;AAIR;AAUI;;AAEA;;;AAQC;AAoBjB;;"}

package/dist/components/UI/organisms/Menu/Menu.styled.js

@@ -0,0 +1,169 @@
+"use client";
+import { ListItem, ListItemButton, ListItemText, Divider, Box, Accordion, AccordionDetails, Link, Stack, Drawer as Drawer$1, List } from '@mui/material';
+import ListItemIcon from '@mui/material/ListItemIcon';
+import { styled, alpha } from '@mui/material/styles';
+
+const StyledListItemIcon = styled(ListItemIcon)(() => ({
+    minWidth: 0,
+    justifyContent: 'center'
+}));
+const StyledListItem = styled(ListItem, {
+    shouldForwardProp: (prop) => prop !== 'openMenu'
+})(({ theme, openMenu }) => ({
+    display: 'block',
+    '& svg': {
+        color: theme.palette?.neutral?.medium
+    },
+    '&.active': {
+        '.MuiTouchRipple-root': {
+            background: theme.palette.action.hover
+        },
+        '& svg': {
+            color: openMenu ? theme.palette?.common?.white : theme.palette.primary.main,
+            '& path': {
+                stroke: openMenu ? theme.palette?.common?.white : theme.palette.primary.main
+            }
+        },
+        '& .title > .MuiTypography-root': {
+            color: theme.palette?.common?.white,
+            fontWeight: 700
+        }
+    },
+    '&:hover': {
+        '.MuiTouchRipple-root': {
+            background: theme.palette.action.hover
+        },
+        '& svg': {
+            color: theme.palette.primary.main,
+            '& path': {
+                stroke: theme.palette.primary.main
+            }
+        },
+        '& .title > .MuiTypography-root': {
+            color: theme.palette.primary.main,
+            fontWeight: 700
+        }
+    }
+}));
+const StyledListItemButton = styled(ListItemButton)(() => ({
+    padding: '10px',
+    borderRadius: '10px',
+    position: 'relative',
+    '& > div > svg': {
+        width: '22px',
+        height: '24px'
+    }
+}));
+const StyledListItemText = styled(ListItemText)(({ theme, color }) => ({
+    '& .MuiTypography-root': {
+        ...theme.typography.body1,
+        color: color ?? theme.palette?.neutral?.medium,
+        lineHeight: '19px',
+        minWidth: '159px'
+    }
+}));
+const StyledDivider = styled(Divider)(({ theme }) => ({
+    borderColor: theme.palette?.neutral?.light,
+    borderRadius: '4px',
+    marginTop: '15px'
+}));
+const LogoBox = styled(Box)(() => ({
+    display: 'flex',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    marginBottom: '15px',
+    '& svg': {
+        width: '60px',
+        height: '32px'
+    }
+}));
+const StyledAccordion = styled(Accordion)(() => ({
+    border: 'none',
+    boxShadow: 'none',
+    '& .MuiAccordionSummary-root': {
+        padding: 0
+    },
+    '&:not(:last-child)': {
+        borderBottom: 0
+    },
+    '&:before': {
+        display: 'none'
+    },
+    '& .MuiAccordionSummary-content': {
+        margin: 0
+    },
+    '& .MuiAccordionSummary-expandIconWrapper': {
+        position: 'absolute',
+        right: '12px'
+    },
+    '& .MuiAccordionSummary-content.Mui-expanded, &:not(:last-of-type)': {
+        margin: 0
+    },
+    '& .Mui-expanded': {
+        minHeight: '10px!important'
+    }
+}));
+const StyledAccordionDetails = styled(AccordionDetails)(() => ({
+    padding: '0 0 12px 60px',
+    maxWidth: '100%'
+}));
+const StyledLink = styled(Link)(({ theme }) => ({
+    ...theme.typography.body2,
+    color: theme.palette?.neutral?.medium,
+    lineHeight: '19px',
+    '&.active': {
+        color: theme.palette?.primary?.main
+    },
+    '&:hover': {
+        color: theme.palette?.primary?.main
+    },
+    textDecoration: 'none'
+}));
+const StyledStack = styled(Stack)(({ theme }) => ({
+    marginTop: '8px',
+    paddingLeft: 0,
+    listStyle: 'none',
+    '& li': {
+        listStyle: 'outside',
+        marginBottom: '16px',
+        marginLeft: '0px',
+        '&.active': {
+            '&::marker': {
+                color: theme.palette.primary.main
+            }
+        },
+        '&:last-of-type': {
+            marginBottom: 0
+        }
+    }
+}));
+const Drawer = styled(Drawer$1, { shouldForwardProp: (prop) => prop !== 'open' })(({ theme, open }) => ({
+    width: 'auto',
+    flexShrink: 0,
+    whiteSpace: 'nowrap',
+    boxSizing: 'border-box',
+    minHeight: '650px',
+    '& .MuiDrawer-paper': {
+        borderRadius: '0 10px 10px 0',
+        border: `0.5px solid ${alpha(theme.palette.neutral.light, 0.5)}`,
+        padding: '35px 11px',
+        width: open ? 240 : 90,
+        transition: 'width 0.1s ease-in-out',
+        overflowX: 'hidden'
+    }
+}));
+const StyledList = styled(List)(({ theme }) => ({
+    overflow: 'auto',
+    overflowX: 'hidden',
+    padding: '0 10px',
+    '&::-webkit-scrollbar': {
+        width: '0.4em'
+    },
+    '&::-webkit-scrollbar-thumb': {
+        backgroundColor: theme.palette.action.disabledBackground
+    },
+    flexGrow: 1
+}));
+
+export { Drawer, LogoBox, StyledAccordion, StyledAccordionDetails, StyledDivider, StyledLink, StyledList, StyledListItem, StyledListItemButton, StyledListItemIcon, StyledListItemText, StyledStack };
+//# sourceMappingURL=Menu.styled.js.map

package/dist/components/UI/organisms/Menu/Menu.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu.styled.js","sources":["../../../../../src/components/UI/organisms/Menu/Menu.styled.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;AAiBO;AACL;AACA;AACD;AAMM;;;AAGL;AACA;AACE;AACD;AACD;AACE;AACE;AACD;AACD;;AAEE;;AAEC;AACF;AACD;AACE;AACA;AACD;AACF;AACD;AACE;AACE;AACD;AACD;AACE;AACA;AACE;AACD;AACF;AACD;AACE;AACA;AACD;AACF;AACF;AAEM;AACL;AACA;AACA;AACA;AACE;AACA;AACD;AACF;AAEM;AACL;AACE;;AAEA;AACA;AACD;AACF;AAEM;AACL;AACA;AACA;AACD;AAEM;AACL;AACA;AACA;AACA;AACA;AACE;AACA;AACD;AACF;AAEM;AACL;AACA;AACA;AACE;AACD;AACD;AACE;AACD;AACD;AACE;AACD;AACD;AACE;AACD;AACD;AACE;AACA;AACD;AACD;AACE;AACD;AACD;AACE;AACD;AACF;AAEM;AACL;AACA;AACD;AAEM;AACL;AACA;AACA;AACA;AACE;AACD;AACD;AACE;AACD;AACD;AACD;AAEM;AACL;AACA;AACA;AACA;AACE;AACA;AACA;AACA;AACE;AACE;AACD;AACF;AACD;AACE;AACD;AACF;AACF;AAEM;AAEH;AACA;AACA;AACA;AACA;AACA;AACE;AACA;AACA;;AAEA;AACA;AACD;AACF;AAGI;AACL;AACA;AACA;AACA;AACE;AACD;AACD;AACE;AACD;AACD;AACD;;"}

package/dist/components/UI/organisms/Menu/SubMenu.js

@@ -0,0 +1,10 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Stack } from '@mui/material';
+import { StyledLink } from './Menu.styled.js';
+import clsx from 'clsx';
+
+const SubMenu = ({ link }) => (jsxs("li", { className: clsx(link.active && 'active'), children: [jsx(StyledLink, { href: link.href, "aria-current": link.active ? 'page' : undefined, children: link.title }), link.subSubmenu && link.subSubmenu.length > 0 && (jsx(Stack, { component: "ul", sx: { pl: 2 }, children: link.subSubmenu.map((subItem) => (jsx("li", { children: jsx(StyledLink, { href: subItem.href, children: subItem.title }) }, subItem.href ?? subItem.title))) }))] }));
+
+export { SubMenu };
+//# sourceMappingURL=SubMenu.js.map

package/dist/components/UI/organisms/Menu/SubMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SubMenu.js","sources":["../../../../../src/components/UI/organisms/Menu/SubMenu.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;AAOO;;"}

package/dist/components/UI/organisms/Modal/Modal.component.js

@@ -0,0 +1,19 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useId } from 'react';
+import { Stack, Typography } from '@mui/material';
+import { StyledDialog, StyledIconButton, StyledDialogContent, BoxIcon, StyledDialogTitle } from './Modal.styled.js';
+import { CloseIcon } from '../../icons/CloseIcon.js';
+
+const modalWidths = { small: 460, medium: 646, large: 900 };
+const Modal = ({ title, description, icon, size = 'small', direction, children, align, open, sizeModal = 'small', onClose, closeLabel = 'Fechar' }) => {
+    const descriptionId = useId();
+    return (jsxs(StyledDialog, { open: open, onClose: onClose, maxWidth: "lg", "aria-describedby": description ? descriptionId : undefined, slotProps: {
+            paper: {
+                sx: { width: '100%', maxWidth: modalWidths[sizeModal] }
+            }
+        }, children: [onClose && (jsx(StyledIconButton, { "aria-label": closeLabel, "data-testid": "close-button", onClick: onClose, children: jsx(CloseIcon, {}) })), jsx(StyledDialogContent, { children: jsxs(Stack, { children: [jsxs(Stack, { direction: direction, sx: { mb: 2 }, children: [icon && (jsx(BoxIcon, { className: size, sx: { display: { xs: 'none', sm: 'flex' } }, children: icon })), jsxs(Stack, { direction: "column", sx: { width: '100%' }, children: [title && jsx(StyledDialogTitle, { sx: { textAlign: align }, children: title }), description && (jsx(Typography, { id: descriptionId, variant: "body2", sx: { textAlign: align }, children: description }))] })] }), children] }) })] }));
+};
+
+export { Modal as default };
+//# sourceMappingURL=Modal.component.js.map

package/dist/components/UI/organisms/Modal/Modal.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.component.js","sources":["../../../../../src/components/UI/organisms/Modal/Modal.component.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;AAcA;AAEA;AAaE;;AASM;AACE;AACD;AACF;AAgCP;;"}