@ssplib/react-components 0.0.34 → 0.0.36

package/components/form/input/Input.d.ts

@@ -1,11 +1,13 @@
 import React from 'react';
-export declare function Input({ type, numberMask, xs, sm, md, ...props }: {
-    type: 'cnpj' | 'cpf' | 'input' | 'email' | 'cpf_cnpj' | 'phone' | 'input' | 'number' | 'rg';
+export declare function Input({ type, numberMask, xs, sm, inputMinLength, inputMaxLength, md, ...props }: {
+    type: 'cnpj' | 'cpf' | 'input' | 'email' | 'cpf_cnpj' | 'phone' | 'input' | 'number' | 'rg' | 'password';
     name: string;
     title?: string;
     required?: boolean;
     numberMask?: string;
     customPlaceholder?: string;
+    inputMinLength?: number;
+    inputMaxLength?: number;
     xs?: number;
     sm?: number;
     md?: number;

package/components/form/input/Input.js

@@ -44,7 +44,7 @@ const react_1 = __importStar(require("react"));
 const MaskInput_1 = __importDefault(require("./MaskInput"));
 const form_1 = require("../../../context/form");
 function Input(_a) {
-    var { type = 'input', numberMask = '000000000000000', xs = 12, sm, md } = _a, props = __rest(_a, ["type", "numberMask", "xs", "sm", "md"]);
+    var { type = 'input', numberMask = '000000000000000', xs = 12, sm, inputMinLength = 3, inputMaxLength = 255, md } = _a, props = __rest(_a, ["type", "numberMask", "xs", "sm", "inputMinLength", "inputMaxLength", "md"]);
     const context = (0, react_1.useContext)(form_1.FormContext);
     const chooseInput = (0, react_1.useCallback)(() => {
         const inputConfig = {
@@ -70,14 +70,14 @@ function Input(_a) {
                         return 'O CPF precisa ter no mínimo 11 dígitos';
                 }
                 //
-                else if (type === 'input') {
-                    if (v.length > 255)
-                        return 'Limite máximo de 255 caracteres';
-                    if (v.length < 3 && props.required)
-                        return 'Limite mínimo de 3 caracteres';
+                else if (type === 'input' || type === 'password') {
+                    if (v.length > inputMaxLength)
+                        return `Limite máximo de ${inputMaxLength} caracteres`;
+                    if (v.length < inputMinLength && props.required)
+                        return `Limite mínimo de ${inputMinLength} caracteres`;
                 }
                 //
-                else if (type === 'email' && props.required) {
+                else if (type === 'email') {
                     if (v.length > 50)
                         return 'Limite máximo de 50 caracteres';
                     if (!/^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$/g.test(v) && props.required)
@@ -100,6 +100,8 @@ function Input(_a) {
             case 'input':
             case 'email':
                 return react_1.default.createElement(material_1.TextField, Object.assign({}, formConfig));
+            case 'password':
+                return react_1.default.createElement(material_1.TextField, Object.assign({}, formConfig, { type: 'password' }));
             case 'number':
                 return (react_1.default.createElement(MaskInput_1.default, { formConfig: formConfig, maskProps: {
                         mask: numberMask,

package/components/form/input/MultInput.d.ts

@@ -1,9 +1,11 @@
 /// <reference types="react" />
-export default function MultInput({ name, required, title, customPlaceholder, xs, sm, md, ...props }: {
+export default function MultInput({ name, required, title, customPlaceholder, xs, sm, inputMinLength, inputMaxLength, md, ...props }: {
     name: string;
     title?: string;
     customPlaceholder?: string;
     required?: boolean;
+    inputMinLength?: number;
+    inputMaxLength?: number;
     xs?: number;
     sm?: number;
     md?: number;

package/components/form/input/MultInput.js

@@ -44,7 +44,7 @@ const react_1 = __importStar(require("react"));
 const form_1 = require("../../../context/form");
 function MultInput(_a) {
     var _b;
-    var { name, required = false, title, customPlaceholder, xs = 12, sm, md } = _a, props = __rest(_a, ["name", "required", "title", "customPlaceholder", "xs", "sm", "md"]);
+    var { name, required = false, title, customPlaceholder, xs = 12, sm, inputMinLength = 3, inputMaxLength = 255, md } = _a, props = __rest(_a, ["name", "required", "title", "customPlaceholder", "xs", "sm", "inputMinLength", "inputMaxLength", "md"]);
     const context = (0, react_1.useContext)(form_1.FormContext);
     return (react_1.default.createElement(material_1.Grid, Object.assign({ item: true }, { xs, sm, md }),
         title && (react_1.default.createElement(InputLabel_1.default, { required: required, sx: { textTransform: 'capitalize' } }, title)),
@@ -52,6 +52,10 @@ function MultInput(_a) {
             validate: (v, f) => {
                 if (required && v.length <= 0)
                     return 'Este campo é obrigatório';
+                if (v.length > inputMaxLength)
+                    return `Limite máximo de ${inputMaxLength} caracteres`;
+                if (v.length < inputMinLength && required)
+                    return `Limite mínimo de ${inputMinLength} caracteres`;
             },
         }), { error: (0, lodash_get_1.default)(context.errors, name) ? true : false, helperText: (_b = (0, lodash_get_1.default)(context.errors, name)) === null || _b === void 0 ? void 0 : _b.message, placeholder: customPlaceholder ? customPlaceholder : title }))));
 }

package/components/form/stepper/Stepper.js

@@ -68,7 +68,6 @@ function Stepper(props) {
         const result = yield context.formTrigger(getKeys(context.formGetValues(), activeStep));
         if (!result) {
             setCanPass(true);
-            console.log('teste: ', context.formGetValues());
             return;
         }
         setActiveStep((prevActiveStep) => prevActiveStep + 1);
@@ -78,7 +77,6 @@ function Stepper(props) {
         if (!result) {
             e.preventDefault();
             setCanPass(true);
-            console.log('teste: ', context.formGetValues());
             return;
         }
     });

package/components/form/table/Table.js

@@ -254,10 +254,10 @@ function Table({ columns, fetchFunc, emptyMsg = {
                             react_1.default.createElement(Typography_1.default, { fontSize: 16, sx: { wordWrap: 'break-word', color: '#1E293B' }, fontFamily: 'Inter' }, c.keyName === 'stEventoExterno' ? getStatusMsg((0, lodash_get_1.default)(x, c.keyName)) : (0, lodash_get_1.default)(x, c.keyName)))))),
                     react_1.default.createElement(Grid_1.default, { item: true, xs: 12, md: 12 / columnSize },
                         react_1.default.createElement(material_1.Stack, { direction: 'row', alignItems: 'center', justifyContent: isSmall ? 'start' : 'flex-end', sx: { height: '100%', paddingBottom: isSmall ? 2 : 0 } }, action(x))))))))),
-            getMaxItems().length > 0 && csv && (react_1.default.createElement(react_1.default.Fragment, null,
-                react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'flex-end', marginTop: 2 },
-                    react_1.default.createElement(material_1.Button, { startIcon: react_1.default.createElement(FileDownload_1.default, null), variant: 'contained', size: 'small', onClick: downloadCSV, sx: { backgroundColor: '#22C55E', marginRight: { xs: 2, md: 0 } } }, "Salvar .CSV")),
-                react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'center', paddingBottom: 4 },
+            getMaxItems().length > 0 && (react_1.default.createElement(react_1.default.Fragment, null,
+                csv && (react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'flex-end', marginTop: 2 },
+                    react_1.default.createElement(material_1.Button, { startIcon: react_1.default.createElement(FileDownload_1.default, null), variant: 'contained', size: 'small', onClick: downloadCSV, sx: { backgroundColor: '#22C55E', marginRight: { xs: 2, md: 0 } } }, "Salvar .CSV"))),
+                react_1.default.createElement(material_1.Stack, { direction: 'row', justifyContent: 'center', paddingY: 4 },
                     react_1.default.createElement(Pagination_1.default, { count: paginationCount, siblingCount: isSmall ? 0 : 1, size: 'large', onChange: onPaginationChange, page: listPage })))))));
 }
 exports.Table = Table;

package/components/navbar/NavBar.d.ts

@@ -6,8 +6,8 @@ export default function NavBar({ links, title, img, pos, next, el, menuItems, }:
     }[];
     title: string;
     img: string;
-    next?: boolean;
     menuItems: JSX.Element | JSX.Element[];
+    next?: boolean;
     el?: JSX.Element;
     pos?: 'fixed' | 'inherit';
 }): JSX.Element;

package/components/navbar/NavBar.js

@@ -41,7 +41,7 @@ function NavBar({ links, title, img, pos = 'fixed', next = true, el, menuItems,
     let router = undefined;
     if (next)
         router = (0, router_1.useRouter)();
-    const { user, login, logout, userLoaded } = (0, react_1.useContext)(auth_1.AuthContext);
+    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);
@@ -115,8 +115,9 @@ function NavBar({ links, title, img, pos = 'fixed', next = true, el, menuItems,
                                 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.name),
-                                    react_1.default.createElement(KeyboardArrowDown_1.default, null)))) : (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(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 }, "Login"))))))),
             loading && react_1.default.createElement(LinearProgress_1.default, null)),
         react_1.default.createElement(material_1.Box, { paddingBottom: 9 })));
 }

package/components/providers/OAuthProvider.js

@@ -131,6 +131,6 @@ function OAuthProvider({ children, AUTH_URL, oidcConfig, redirectURL, validateTo
         localStorage.removeItem(userImgName);
         router.replace(redirectURL).finally(() => setUserLoaded(true));
     }
-    return react_1.default.createElement(auth_1.AuthContext.Provider, { value: { user, isAuth, userLoaded, login, logout, saveUserData } }, children);
+    return react_1.default.createElement(auth_1.AuthContext.Provider, { value: { user, isAuth, userLoaded, login, logout, saveUserData, type: 'govbr' } }, children);
 }
 exports.OAuthProvider = OAuthProvider;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@ssplib/react-components",
-    "version": "0.0.34",
+    "version": "0.0.36",
     "description": "SSP React Components",
     "main": "index.js",
     "author": "Pedro Henrique <sr.hudrick@gmail.com>",

package/types/auth.d.ts

@@ -62,6 +62,7 @@ export interface AuthSspToken {
 }
 export interface AuthReturnData {
     isAuth: boolean;
+    type: 'govbr' | 'ad';
     user: User | null | undefined;
     userLoaded: boolean;
     login: () => void;