@ssplib/react-components 0.0.295 → 0.0.296

package/components/modal/Modal.js

@@ -0,0 +1,105 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CustomModalProvider = exports.MODAL = void 0;
+const CloseRounded_1 = __importDefault(require("@mui/icons-material/CloseRounded"));
+const material_1 = require("@mui/material");
+const react_1 = __importStar(require("react"));
+exports.MODAL = {
+    open: () => { },
+    close: () => { },
+    openReparented: () => { },
+    reparent: () => react_1.default.createElement(react_1.default.Fragment, null),
+};
+function ReparentHelper() {
+    const ref = (0, react_1.useRef)(null);
+    return react_1.default.createElement("div", { ref: ref });
+}
+function CustomModalProvider() {
+    const [open, setOpen] = (0, react_1.useState)(false);
+    const [content, setContent] = (0, react_1.useState)(null);
+    // const contentRef = useRef<JSX.Element | JSX.Element[]>(<></>)
+    const handleClose = () => setOpen(false);
+    const containerRef = (0, react_1.useRef)(null);
+    const theme = (0, material_1.useTheme)();
+    const isDesktop = (0, material_1.useMediaQuery)(theme.breakpoints.up('sm'));
+    const [idRef, setIdRef] = (0, react_1.useState)({});
+    const [currentId, setCurrentId] = (0, react_1.useState)(-1321465654);
+    (0, react_1.useEffect)(() => {
+        exports.MODAL.open = (customCompoment) => {
+            if (customCompoment)
+                setContent(customCompoment);
+            setCurrentId(-1321465654);
+            setOpen(true);
+        };
+        exports.MODAL.reparent = (element, id) => {
+            setIdRef((obj) => (Object.assign(Object.assign({}, obj), { [id]: react_1.default.createElement(react_1.default.Fragment, null, element) })));
+            return react_1.default.createElement(react_1.default.Fragment, null);
+        };
+        exports.MODAL.openReparented = (id) => {
+            setCurrentId(id);
+            setContent(null);
+            setOpen(true);
+        };
+        exports.MODAL.close = handleClose;
+    }, [setOpen]);
+    return (react_1.default.createElement(react_1.default.Fragment, null, !isDesktop ? (react_1.default.createElement(material_1.SwipeableDrawer, { anchor: 'bottom', open: open, onClose: handleClose, onOpen: () => { }, PaperProps: {
+            sx: {
+                bgcolor: 'transparent',
+            },
+        } },
+        react_1.default.createElement(material_1.Stack, { direction: 'row', onClick: handleClose, maxHeight: '8vh', height: '8vh', justifyContent: 'center', alignItems: 'center' },
+            react_1.default.createElement(material_1.Typography, { fontWeight: 600, color: 'white' }, "Clique fora para fechar")),
+        react_1.default.createElement(material_1.Box, { p: 2, maxHeight: '92vh', bgcolor: 'white', overflow: 'auto' },
+            content,
+            idRef[currentId]))) : (react_1.default.createElement(material_1.Modal, { open: open, onClose: handleClose },
+        react_1.default.createElement(material_1.Box, { sx: {
+                position: 'absolute',
+                top: '50%',
+                left: '50%',
+                transform: 'translate(-50%, -50%)',
+                borderRadius: 2,
+                bgcolor: 'white',
+                border: '1px solid #454545',
+                boxShadow: 24,
+            } },
+            react_1.default.createElement(material_1.Box, { onClick: handleClose, width: 'fit-content', height: 'fit-content', position: 'absolute', right: 0, top: 0, margin: 0.6, sx: {
+                    ':hover': {
+                        transform: 'scale(1.03)',
+                        transition: 'all 500ms',
+                        cursor: 'pointer',
+                    },
+                } },
+                react_1.default.createElement(CloseRounded_1.default, { sx: {
+                        transform: 'scale(.9)',
+                    } })),
+            react_1.default.createElement(material_1.Box, { overflow: 'auto', maxHeight: '90vh', p: 2, marginTop: 4, borderTop: 'solid 1px gray', bgcolor: '#F9F9F9', borderRadius: 2 },
+                content,
+                idRef[currentId]))))));
+}
+exports.CustomModalProvider = CustomModalProvider;

package/components/navbar/NavBar.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export default function NavBar({ links, title, img, pos, next, el, menuItems, paddingBottom, logoutMsg, logoutFunc, ...props }: {
     links: {
         name: string;

package/components/navbar/NavBar.js

@@ -0,0 +1,171 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const KeyboardArrowDown_1 = __importDefault(require("@mui/icons-material/KeyboardArrowDown"));
+const LogoutOutlined_1 = __importDefault(require("@mui/icons-material/LogoutOutlined"));
+const Menu_1 = __importDefault(require("@mui/icons-material/Menu"));
+const Person_1 = __importDefault(require("@mui/icons-material/Person"));
+const material_1 = require("@mui/material");
+const LinearProgress_1 = __importDefault(require("@mui/material/LinearProgress"));
+const image_1 = __importDefault(require("next/image"));
+const link_1 = __importDefault(require("next/link"));
+const router_1 = require("next/router");
+const react_1 = __importStar(require("react"));
+const auth_1 = require("../../context/auth");
+function NavBar(_a) {
+    var { links, title, img, pos = 'fixed', next = true, el, menuItems, paddingBottom = 0, logoutMsg = 'Sair', logoutFunc } = _a, props = __rest(_a, ["links", "title", "img", "pos", "next", "el", "menuItems", "paddingBottom", "logoutMsg", "logoutFunc"]);
+    let router = undefined;
+    if (next)
+        router = (0, router_1.useRouter)();
+    const { user, login, logout, type } = (0, react_1.useContext)(auth_1.AuthContext);
+    const [anchor, setAnchor] = (0, react_1.useState)(null);
+    const [avatarAnchor, setAvatarAnchor] = (0, react_1.useState)(null);
+    const menuOpen = Boolean(anchor);
+    const avatarMenu = Boolean(avatarAnchor);
+    const [loading, setLoading] = (0, react_1.useState)(false);
+    const onMenuClick = (0, react_1.useCallback)((e) => {
+        setAnchor(e.currentTarget);
+    }, []);
+    const closeMenu = (0, react_1.useCallback)(() => {
+        setAnchor(null);
+    }, []);
+    const onMenuItemClick = (0, react_1.useCallback)((e, link) => {
+        setLoading(true);
+        setAnchor(null);
+        if (router)
+            router
+                .push({
+                pathname: link,
+            })
+                .finally(() => setLoading(false));
+        else {
+            setLoading(false);
+        }
+    }, [router]);
+    function changeRoute(e, path) {
+        setLoading(true);
+        if (router) {
+            router
+                .push({
+                pathname: path,
+            })
+                .finally(() => setLoading(false));
+        }
+        else {
+            setLoading(false);
+        }
+    }
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(material_1.Box, { position: pos, sx: { width: '100%', zIndex: 100 } },
+            react_1.default.createElement(material_1.AppBar, { position: 'relative', elevation: 0, sx: { backgroundColor: '#F1F5F9', color: 'black', paddingY: 1, paddingX: { xs: 1, md: 4 } } },
+                react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'space-between' },
+                    react_1.default.createElement(material_1.Stack, { direction: 'row', alignItems: 'center', spacing: 2, marginRight: 2, sx: { display: { xs: 'none', md: 'flex' }, width: '100%' } },
+                        react_1.default.createElement(link_1.default, { href: '/' }, next ? react_1.default.createElement(image_1.default, { src: img, alt: title, width: 40, height: 40 }) : react_1.default.createElement("img", { src: img, height: 35 })),
+                        react_1.default.createElement(material_1.Box, null,
+                            react_1.default.createElement(material_1.Typography, { variant: 'subtitle1', fontWeight: 600 }, title))),
+                    react_1.default.createElement(material_1.Box, { sx: {
+                            display: {
+                                xs: 'flex',
+                                md: 'none',
+                            },
+                        } }, links.length > 0 && (react_1.default.createElement(react_1.default.Fragment, null,
+                        react_1.default.createElement(material_1.IconButton, { onClick: onMenuClick },
+                            react_1.default.createElement(Menu_1.default, null)),
+                        react_1.default.createElement(material_1.Menu, { open: menuOpen, onClose: closeMenu, anchorEl: anchor }, links.map((x) => (react_1.default.createElement(material_1.MenuItem, { key: `navmenu${x}`, onClick: (e) => onMenuItemClick(e, x.path) },
+                            react_1.default.createElement(material_1.Typography, { textTransform: 'capitalize' }, x.name)))))))),
+                    react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'flex-end', alignItems: 'center', sx: { width: { md: '100%' } } },
+                        react_1.default.createElement(material_1.Stack, { direction: 'row', spacing: 2, sx: { display: { xs: 'none', md: 'flex' } } }, links.map((x) => (react_1.default.createElement(material_1.Box, { key: `navigation${x.path}`, sx: {
+                                a: {
+                                    color: '#2c7da0',
+                                    textDecoration: 'none',
+                                    textTransform: 'capitalize',
+                                    '&:hover': {
+                                        color: '#90e0ef',
+                                    },
+                                },
+                            } },
+                            react_1.default.createElement(material_1.Button, { onClick: (e) => changeRoute(e, x.path), sx: { textTransform: 'capitalize' } }, x.name))))),
+                        react_1.default.createElement(material_1.Stack, { direction: 'row', spacing: 2 },
+                            react_1.default.createElement(material_1.Box, null, el),
+                            user ? (react_1.default.createElement(material_1.Stack, { direction: 'row', spacing: 1, sx: {
+                                    '&:hover': {
+                                        backgroundColor: '#a9def9',
+                                        cursor: 'pointer',
+                                    },
+                                    padding: 0.5,
+                                    borderRadius: 60,
+                                } },
+                                react_1.default.createElement(material_1.Box, { sx: { display: 'flex', alignItems: 'center' } },
+                                    react_1.default.createElement(material_1.Avatar, { sx: { width: 30, height: 30 }, src: user.image }),
+                                    react_1.default.createElement(material_1.Menu, { open: avatarMenu, onClose: (e) => setAvatarAnchor(null), anchorEl: avatarAnchor, disableScrollLock: true, transformOrigin: { horizontal: 'right', vertical: 'top' }, anchorOrigin: { horizontal: 'right', vertical: 'bottom' }, sx: { '.MuiMenu-paper': { borderRadius: 4 } } },
+                                        menuItems,
+                                        react_1.default.createElement(material_1.MenuItem, { onClick: (e) => __awaiter(this, void 0, void 0, function* () {
+                                                setAvatarAnchor(null);
+                                                if (!!logoutFunc) {
+                                                    try {
+                                                        yield logoutFunc();
+                                                    }
+                                                    catch (error) {
+                                                        console.error(error);
+                                                    }
+                                                }
+                                                logout();
+                                            }) },
+                                            react_1.default.createElement(material_1.Stack, { direction: 'row', spacing: 1 },
+                                                react_1.default.createElement(LogoutOutlined_1.default, { sx: { fill: '#545454' } }),
+                                                react_1.default.createElement(material_1.Typography, { textTransform: 'capitalize' }, logoutMsg))))),
+                                react_1.default.createElement(material_1.Stack, { direction: 'row', spacing: 0.4, alignItems: 'center', onClick: (e) => setAvatarAnchor(e.currentTarget), sx: { userSelect: 'none' } },
+                                    react_1.default.createElement(material_1.Typography, null, "Ol\u00E1,"),
+                                    react_1.default.createElement(material_1.Typography, { fontWeight: 600 }, user === null || user === void 0 ? void 0 : user.given_name),
+                                    react_1.default.createElement(KeyboardArrowDown_1.default, null)))) : type === 'govbr' ? (react_1.default.createElement(material_1.Button, { variant: 'contained', size: 'small', startIcon: react_1.default.createElement(Person_1.default, null), onClick: login, sx: { color: 'white', textTransform: 'inherit', borderRadius: 50, paddingX: 2 } },
+                                react_1.default.createElement(material_1.Typography, { fontWeight: 600, fontSize: 15, padding: 0.4 }, "Entrar com o gov.br"))) : (react_1.default.createElement(material_1.Button, { variant: 'contained', size: 'small', startIcon: react_1.default.createElement(Person_1.default, null), onClick: login, sx: { color: 'white', textTransform: 'inherit', borderRadius: 50, paddingX: 2 } },
+                                react_1.default.createElement(material_1.Typography, { fontWeight: 600, fontSize: 15, padding: 0.4 }, "Entrar"))))))),
+            loading && react_1.default.createElement(LinearProgress_1.default, null)),
+        react_1.default.createElement(material_1.Box, { paddingBottom: paddingBottom })));
+}
+exports.default = NavBar;

package/components/navbar/TabNavBar.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export default function TabNavBar({ links, title, img, pos, next, el, menuItems, color, route, paddingBottom, logoutMsg, logoutFunc, ...props }: {
     links: {
         name: string;

package/components/navbar/TabNavBar.js

@@ -0,0 +1,179 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const KeyboardArrowDown_1 = __importDefault(require("@mui/icons-material/KeyboardArrowDown"));
+const LogoutOutlined_1 = __importDefault(require("@mui/icons-material/LogoutOutlined"));
+const Menu_1 = __importDefault(require("@mui/icons-material/Menu"));
+const Person_1 = __importDefault(require("@mui/icons-material/Person"));
+const material_1 = require("@mui/material");
+const LinearProgress_1 = __importDefault(require("@mui/material/LinearProgress"));
+const image_1 = __importDefault(require("next/image"));
+const link_1 = __importDefault(require("next/link"));
+const router_1 = require("next/router");
+const react_1 = __importStar(require("react"));
+const auth_1 = require("../../context/auth");
+function verificarRota(route, path) {
+    if (path === '/')
+        return route === path;
+    return route.startsWith(path);
+}
+function TabNavBar(_a) {
+    var { links, title, img, pos = 'fixed', next = true, el, menuItems, color = 'blue', route = '/teste/89', paddingBottom = 0, logoutMsg = 'Sair', logoutFunc } = _a, props = __rest(_a, ["links", "title", "img", "pos", "next", "el", "menuItems", "color", "route", "paddingBottom", "logoutMsg", "logoutFunc"]);
+    let router = undefined;
+    if (next)
+        router = (0, router_1.useRouter)();
+    const { user, login, logout, type } = (0, react_1.useContext)(auth_1.AuthContext);
+    const [anchor, setAnchor] = (0, react_1.useState)(null);
+    const [avatarAnchor, setAvatarAnchor] = (0, react_1.useState)(null);
+    const menuOpen = Boolean(anchor);
+    const avatarMenu = Boolean(avatarAnchor);
+    const [loading, setLoading] = (0, react_1.useState)(false);
+    const onMenuClick = (0, react_1.useCallback)((e) => {
+        setAnchor(e.currentTarget);
+    }, []);
+    const closeMenu = (0, react_1.useCallback)(() => {
+        setAnchor(null);
+    }, []);
+    const onMenuItemClick = (0, react_1.useCallback)((e, link) => {
+        setLoading(true);
+        setAnchor(null);
+        if (router)
+            router
+                .push({
+                pathname: link,
+            })
+                .finally(() => setLoading(false));
+        else {
+            setLoading(false);
+        }
+    }, [router]);
+    function changeRoute(e, path) {
+        setLoading(true);
+        if (router) {
+            router
+                .push({
+                pathname: path,
+            })
+                .finally(() => setLoading(false));
+        }
+        else {
+            setLoading(false);
+        }
+    }
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(material_1.Box, { position: pos, sx: { width: '100%', zIndex: 100 } },
+            react_1.default.createElement(material_1.AppBar, { position: 'relative', elevation: 0, sx: { backgroundColor: 'white', color: 'black', paddingX: { xs: 1, md: 4 } } },
+                react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'space-between' },
+                    react_1.default.createElement(material_1.Stack, { direction: 'row', alignItems: 'center', spacing: 2, marginRight: 2, sx: { display: { xs: 'none', md: 'flex' }, width: '100%' } },
+                        react_1.default.createElement(link_1.default, { href: '/' }, next ? react_1.default.createElement(image_1.default, { src: img, alt: title, width: 40, height: 40 }) : react_1.default.createElement("img", { src: img, height: 35 })),
+                        react_1.default.createElement(material_1.Box, null,
+                            react_1.default.createElement(material_1.Typography, { variant: 'subtitle1', fontWeight: 600 }, title))),
+                    react_1.default.createElement(material_1.Stack, { direction: 'row', width: '100%', justifyContent: 'center', alignItems: 'center', spacing: 2, sx: { display: { xs: 'none', md: 'flex' } } }, links.map((x, index) => {
+                        var _a;
+                        return (react_1.default.createElement(material_1.Box, { borderBottom: next ? (verificarRota((_a = router === null || router === void 0 ? void 0 : router.pathname) !== null && _a !== void 0 ? _a : '', x.path) ? `solid 4px ${color}` : '') : verificarRota(route, x.path) ? `solid 4px ${color}` : '', height: '100%', paddingX: 2, key: JSON.stringify({ x, index }), sx: {
+                                ':hover': {
+                                    backgroundColor: '#fcfcfc',
+                                    cursor: 'pointer',
+                                    userSelect: 'none',
+                                },
+                            }, onClick: (e) => {
+                                next && console.log('pathname:', router === null || router === void 0 ? void 0 : router.pathname, ':=', x.path);
+                                changeRoute(e, x.path);
+                            } },
+                            react_1.default.createElement(material_1.Stack, { height: '100%', justifyContent: 'center' }, x.name)));
+                    })),
+                    react_1.default.createElement(material_1.Box, { sx: {
+                            display: {
+                                xs: 'flex',
+                                md: 'none',
+                            },
+                        } }, links.length > 0 && (react_1.default.createElement(react_1.default.Fragment, null,
+                        react_1.default.createElement(material_1.IconButton, { onClick: onMenuClick },
+                            react_1.default.createElement(Menu_1.default, null)),
+                        react_1.default.createElement(material_1.Menu, { open: menuOpen, onClose: closeMenu, anchorEl: anchor }, links.map((x, index) => (react_1.default.createElement(material_1.MenuItem, { key: JSON.stringify({ x, index }), onClick: (e) => onMenuItemClick(e, x.path) },
+                            react_1.default.createElement(material_1.Typography, { textTransform: 'capitalize' }, x.name)))))))),
+                    react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'flex-end', alignItems: 'center', sx: { width: { md: '100%' } }, paddingY: 1 },
+                        react_1.default.createElement(material_1.Stack, { direction: 'row', spacing: 2 },
+                            react_1.default.createElement(material_1.Box, null, el),
+                            user ? (react_1.default.createElement(material_1.Stack, { direction: 'row', spacing: 1, sx: {
+                                    '&:hover': {
+                                        backgroundColor: '#a9def9',
+                                        cursor: 'pointer',
+                                    },
+                                    padding: 0.5,
+                                    borderRadius: 60,
+                                } },
+                                react_1.default.createElement(material_1.Box, { sx: { display: 'flex', alignItems: 'center' } },
+                                    react_1.default.createElement(material_1.Avatar, { sx: { width: 30, height: 30 }, src: user.image }),
+                                    react_1.default.createElement(material_1.Menu, { open: avatarMenu, onClose: (e) => setAvatarAnchor(null), anchorEl: avatarAnchor, disableScrollLock: true, transformOrigin: { horizontal: 'right', vertical: 'top' }, anchorOrigin: { horizontal: 'right', vertical: 'bottom' }, sx: { '.MuiMenu-paper': { borderRadius: 4 } } },
+                                        menuItems,
+                                        react_1.default.createElement(material_1.MenuItem, { onClick: (e) => __awaiter(this, void 0, void 0, function* () {
+                                                setAvatarAnchor(null);
+                                                if (!!logoutFunc) {
+                                                    try {
+                                                        yield logoutFunc();
+                                                    }
+                                                    catch (error) {
+                                                        console.error(error);
+                                                    }
+                                                }
+                                                logout();
+                                            }) },
+                                            react_1.default.createElement(material_1.Stack, { direction: 'row', spacing: 1 },
+                                                react_1.default.createElement(LogoutOutlined_1.default, { sx: { fill: '#545454' } }),
+                                                react_1.default.createElement(material_1.Typography, { textTransform: 'capitalize' }, logoutMsg))))),
+                                react_1.default.createElement(material_1.Stack, { direction: 'row', spacing: 0.4, alignItems: 'center', onClick: (e) => setAvatarAnchor(e.currentTarget), sx: { userSelect: 'none' } },
+                                    react_1.default.createElement(material_1.Typography, null, "Ol\u00E1,"),
+                                    react_1.default.createElement(material_1.Typography, { fontWeight: 600 }, user.given_name),
+                                    react_1.default.createElement(KeyboardArrowDown_1.default, null)))) : type === 'govbr' ? (react_1.default.createElement(material_1.Button, { variant: 'contained', size: 'small', startIcon: react_1.default.createElement(Person_1.default, null), onClick: login, sx: { color: 'white', textTransform: 'inherit', borderRadius: 50, paddingX: 2 } },
+                                react_1.default.createElement(material_1.Typography, { fontWeight: 600, fontSize: 15, padding: 0.4 }, "Entrar com o gov.br"))) : (react_1.default.createElement(material_1.Button, { variant: 'contained', size: 'small', startIcon: react_1.default.createElement(Person_1.default, null), onClick: login, sx: { color: 'white', textTransform: 'inherit', borderRadius: 50, paddingX: 2 } },
+                                react_1.default.createElement(material_1.Typography, { fontWeight: 600, fontSize: 15, padding: 0.4 }, "Entrar"))))))),
+            loading && react_1.default.createElement(LinearProgress_1.default, null)),
+        react_1.default.createElement(material_1.Box, { paddingBottom: paddingBottom })));
+}
+exports.default = TabNavBar;

package/components/providers/FormProvider.js

@@ -0,0 +1,54 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const react_hook_form_1 = require("react-hook-form");
+const form_1 = require("../../context/form");
+const react_toastify_1 = require("react-toastify");
+function FormProvider({ children, onSubmit, formMethod = 'GET', submiting = false }) {
+    const { register, handleSubmit, control, formState, reset, watch, trigger, setValue, unregister, getValues } = (0, react_hook_form_1.useForm)();
+    const [filesUid, setFilesUid] = (0, react_1.useState)([]);
+    return (react_1.default.createElement(form_1.FormContext.Provider, { value: {
+            formRegister: register,
+            formWatch: watch,
+            formReset: reset,
+            formControl: control,
+            formSetValue: setValue,
+            formTrigger: trigger,
+            formUnregister: unregister,
+            formGetValues: getValues,
+            formHandleSubmit: handleSubmit,
+            setFilesUid: setFilesUid,
+            formState: formState,
+            errors: formState === null || formState === void 0 ? void 0 : formState.errors,
+            submiting: submiting,
+        } },
+        react_1.default.createElement("form", { method: formMethod, onSubmit: handleSubmit((data) => onSubmit(data, filesUid), () => (0, react_toastify_1.toast)('Formulário incompleto! Verifique os campos marcados e tente novamente.', {
+                type: 'warning',
+                position: 'top-right',
+                theme: 'colored',
+            })) }, children)));
+}
+exports.default = FormProvider;

package/components/providers/KeycloakAuthProvider.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const cookieName = "nextauth.token";
 export declare function KeycloakAuthProvider({ url, realm, clientId, children, type, resource_name, redirectUri, }: {
     url: string;

package/components/providers/KeycloakAuthProvider.js

@@ -0,0 +1,118 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.KeycloakAuthProvider = exports.cookieName = void 0;
+const router_1 = require("next/router");
+const react_1 = __importStar(require("react"));
+const auth_1 = require("../../context/auth");
+const keycloak_js_1 = __importDefault(require("keycloak-js"));
+exports.cookieName = 'nextauth.token';
+const userImgName = 'user-data.img';
+function KeycloakAuthProvider({ url, realm, clientId, children, type = 'ad', resource_name = 'eventos-front', redirectUri = '', }) {
+    const [user, setUser] = (0, react_1.useState)();
+    const [userLoaded, setUserLoaded] = (0, react_1.useState)(false);
+    const [kc, setKc] = (0, react_1.useState)(null);
+    const router = (0, router_1.useRouter)();
+    const isAuth = !!user;
+    (0, react_1.useEffect)(() => {
+        const keycloak = new keycloak_js_1.default({
+            url: url,
+            realm: realm,
+            clientId: clientId,
+        });
+        setKc(keycloak);
+        keycloak.onTokenExpired = () => __awaiter(this, void 0, void 0, function* () {
+            console.log('token expired');
+            try {
+                const refreshed = yield keycloak.updateToken(5);
+                if (refreshed) {
+                    setUser((prevUser) => (Object.assign(Object.assign({}, prevUser), { token: keycloak.token })));
+                }
+                console.log(refreshed ? 'Token was refreshed' : 'Token is still valid');
+            }
+            catch (error) {
+                console.log('Failed to refresh token', error);
+            }
+        });
+        keycloak
+            .init({
+            onLoad: 'check-sso',
+            pkceMethod: 'S256',
+        })
+            .then((auth) => {
+            var _a, _b;
+            setUserLoaded(true);
+            if (!auth) {
+                console.log('NAO AUTENTICADO');
+                //window.location.reload();
+            }
+            else {
+                const tokenParsed = keycloak.tokenParsed;
+                console.log('TOKEN-> ', tokenParsed);
+                const userData = Object.assign(Object.assign({}, tokenParsed), { token: keycloak.token, roles: ((_b = ((_a = tokenParsed === null || tokenParsed === void 0 ? void 0 : tokenParsed.resource_access) !== null && _a !== void 0 ? _a : {})[resource_name]) !== null && _b !== void 0 ? _b : []).roles });
+                setUser(userData);
+                console.info('Authenticated!!!');
+            }
+        }, () => {
+            console.error('Authenticated Failed');
+        })
+            .catch((err) => console.log(err));
+        const s = router.query['status'];
+        if (!s)
+            return;
+        if (s === 'success') {
+            window.history.replaceState(null, '', '/');
+        }
+    }, []);
+    function login() {
+        console.log('Tentando logar...');
+        console.log('KC: ', {
+            instancia: kc,
+            logado: kc === null || kc === void 0 ? void 0 : kc.authenticated,
+            client_id: kc === null || kc === void 0 ? void 0 : kc.clientId,
+        });
+        kc === null || kc === void 0 ? void 0 : kc.login({ redirectUri });
+    }
+    function logout() {
+        setUserLoaded(false);
+        kc === null || kc === void 0 ? void 0 : kc.logout();
+        setUser(null);
+        localStorage.removeItem(userImgName);
+    }
+    return react_1.default.createElement(auth_1.AuthContext.Provider, { value: { user, isAuth, userLoaded, login, logout, saveUserData: () => { }, type } }, children);
+}
+exports.KeycloakAuthProvider = KeycloakAuthProvider;