@ssplib/react-components 0.0.251 → 0.0.253

package/components/detalhes/Category.js

@@ -0,0 +1,14 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Category = void 0;
+const material_1 = require("@mui/material");
+const react_1 = __importDefault(require("react"));
+function Category({ title }) {
+    return (react_1.default.createElement(material_1.Grid, { paddingY: 1, item: true, marginTop: 1, marginBottom: 3, xs: 12 },
+        react_1.default.createElement(material_1.Typography, { textTransform: 'uppercase', fontWeight: 600 }, title),
+        react_1.default.createElement(material_1.Box, { sx: { backgroundColor: '#94A3B8', height: 6, borderRadius: 1 } })));
+}
+exports.Category = Category;

package/components/detalhes/Field.js

@@ -0,0 +1,42 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Field = void 0;
+const material_1 = require("@mui/material");
+const react_1 = __importDefault(require("react"));
+function Field({ name, title, tag, xs = 12, md, lg }) {
+    let color = tag && tag === 'Distrital'
+        ? '#BFDBFE'
+        : tag === 'Estadual'
+            ? '#BBF7D0'
+            : tag === 'Federal'
+                ? '#FEF08A'
+                : tag === 'Internacional'
+                    ? '#FED7AA'
+                    : tag === 'Não'
+                        ? '#FECACA'
+                        : tag === 'Sim'
+                            ? '#BBF7D0'
+                            : '#BBF7D0';
+    return (react_1.default.createElement(material_1.Grid, Object.assign({ paddingBottom: 3, item: true }, { xs, md, lg }, { paddingRight: 2 }),
+        react_1.default.createElement(material_1.Stack, { spacing: 1 },
+            react_1.default.createElement(material_1.Stack, { spacing: 1, direction: 'row' },
+                react_1.default.createElement(material_1.Typography, { sx: {
+                        backgroundColor: '#E2E8F0',
+                        maxWidth: 'max-content',
+                        paddingX: 1,
+                        borderRadius: 2,
+                        color: '#1E293B',
+                    }, fontWeight: 600 }, title),
+                tag && (react_1.default.createElement(material_1.Typography, { sx: {
+                        backgroundColor: color,
+                        maxWidth: 'max-content',
+                        paddingX: 1,
+                        borderRadius: 2,
+                        color: '#1E293B',
+                    }, fontWeight: 600 }, tag))),
+            name && react_1.default.createElement(material_1.Box, null, String(name) === 'false' ? 'Não' : String(name) === 'true' ? 'Sim' : String(name) === '' ? '' : !name ? 'Não informado' : String(name)))));
+}
+exports.Field = Field;

package/components/detalhes/FieldLabel.js

@@ -0,0 +1,28 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FieldLabel = void 0;
+const material_1 = require("@mui/material");
+const react_1 = __importDefault(require("react"));
+function FieldLabel({ title, xs = 12, tag, md, lg, paddingBottom = 3 }) {
+    let color = tag && tag === 'Não' ? '#FECACA' : tag === 'Sim' ? '#BBF7D0' : '#E2E8F0';
+    return (react_1.default.createElement(material_1.Grid, Object.assign({ paddingBottom: paddingBottom, item: true }, { xs, md, lg }, { paddingRight: 2 }),
+        react_1.default.createElement(material_1.Stack, { spacing: 1, direction: 'row' },
+            react_1.default.createElement(material_1.Typography, { sx: {
+                    backgroundColor: '#E2E8F0',
+                    maxWidth: 'max-content',
+                    paddingX: 1,
+                    borderRadius: 2,
+                    color: '#1E293B',
+                }, fontWeight: 600, fontSize: 16 }, title),
+            tag && (react_1.default.createElement(material_1.Typography, { sx: {
+                    backgroundColor: color,
+                    maxWidth: 'max-content',
+                    paddingX: 1,
+                    borderRadius: 2,
+                    color: '#1E293B',
+                }, fontWeight: 600 }, tag)))));
+}
+exports.FieldLabel = FieldLabel;

package/components/detalhes/File.js

@@ -0,0 +1,62 @@
+"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 });
+exports.File = void 0;
+const material_1 = require("@mui/material");
+const icons_material_1 = require("@mui/icons-material");
+const react_1 = __importStar(require("react"));
+const auth_1 = require("../../context/auth");
+function File({ title, name, md, fileURL, fileExt = 'pdf' }) {
+    const { user } = (0, react_1.useContext)(auth_1.AuthContext);
+    return (react_1.default.createElement(material_1.Grid, Object.assign({ paddingBottom: 3, paddingRight: 3 }, { md }),
+        react_1.default.createElement(material_1.Stack, { spacing: 1, sx: {
+                backgroundColor: '#F8FAFC',
+                paddingY: 1,
+                paddingX: 3,
+                borderRadius: 2,
+                border: 1,
+                borderColor: '#CBD5E1',
+            } },
+            react_1.default.createElement(material_1.Typography, { fontWeight: 600, sx: { textAlign: 'center' } }, title),
+            react_1.default.createElement(material_1.Stack, { direction: 'row', spacing: 2, alignItems: 'center' },
+                react_1.default.createElement(icons_material_1.FileDownload, { sx: { fill: 'red' } }),
+                react_1.default.createElement(material_1.Typography, null, name)),
+            react_1.default.createElement(material_1.Stack, { alignItems: 'center' },
+                react_1.default.createElement(material_1.Button, { variant: 'outlined', color: 'error', size: 'small', endIcon: react_1.default.createElement(icons_material_1.FileDownload, null), onClick: () => fetch(fileURL, {
+                        method: 'GET',
+                        headers: {
+                            Authorization: `Bearer ${user === null || user === void 0 ? void 0 : user.token}`,
+                        },
+                    })
+                        .then((res) => res.blob())
+                        .then((blob) => {
+                        var file = window.URL.createObjectURL(blob);
+                        const a = document.createElement('a');
+                        a.href = file;
+                        a.download = name.split('.')[0] + `.${fileExt}`;
+                        a.click();
+                    }) }, "Baixar")))));
+}
+exports.File = File;

package/components/form/checkbox/CheckBox.js

@@ -0,0 +1,18 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const material_1 = require("@mui/material");
+const react_1 = require("react");
+const form_1 = require("../../../context/form");
+const react_2 = __importDefault(require("react"));
+function CheckBox({ name, title, defaultValue = false, xs = 12, sm, md, onChange, }) {
+    const context = (0, react_1.useContext)(form_1.FormContext);
+    const onClick = (0, react_1.useCallback)((e) => {
+        context === null || context === void 0 ? void 0 : context.formSetValue(name, !(context === null || context === void 0 ? void 0 : context.formGetValues(name)));
+    }, [context, name]);
+    return (react_2.default.createElement(material_1.Grid, Object.assign({ item: true }, { xs, sm, md }),
+        react_2.default.createElement(material_1.FormControlLabel, Object.assign({ control: react_2.default.createElement(material_1.Checkbox, { size: 'small', defaultChecked: defaultValue }), label: title }, context === null || context === void 0 ? void 0 : context.formRegister(name), { onChange: onChange, onClick: onClick }))));
+}
+exports.default = CheckBox;

package/{src/components → components}/form/checkbox/CheckBoxAdditional.js

@@ -1,3 +1,27 @@
+"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 __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)
@@ -9,9 +33,10 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React, { useContext, useState } from 'react';
-import { FormContext } from '../../../context/form';
-import { Grid } from '@mui/material';
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const form_1 = require("../../../context/form");
+const material_1 = require("@mui/material");
 function getChildrenNames(children) {
     let arr = [];
     children.forEach((x) => {
@@ -29,12 +54,12 @@ function getChildrenNames(children) {
     });
     return arr;
 }
-export default function RequiredCheckBoxAdditional(_a) {
+function RequiredCheckBoxAdditional(_a) {
     var { customText = 'Selecione pelo menos 1 opção' } = _a, props = __rest(_a, ["customText"]);
-    const [firstTime, setFirstTime] = useState(false);
-    const [showAfterFirst, setAfterFirst] = useState(true);
-    const context = useContext(FormContext);
-    const children = React.cloneElement(props.children, {
+    const [firstTime, setFirstTime] = (0, react_1.useState)(false);
+    const [showAfterFirst, setAfterFirst] = (0, react_1.useState)(true);
+    const context = (0, react_1.useContext)(form_1.FormContext);
+    const children = react_1.default.cloneElement(props.children, {
         onChange: () => {
             if (firstTime) {
                 const name = children.props.name;
@@ -44,8 +69,8 @@ export default function RequiredCheckBoxAdditional(_a) {
             }
         },
     });
-    return (React.createElement(Grid, { container: true, sx: { padding: 1, borderRadius: 2 } },
-        React.createElement("input", Object.assign({ type: 'text' }, context.formRegister(props.name, {
+    return (react_1.default.createElement(material_1.Grid, { container: true, sx: { padding: 1, borderRadius: 2 } },
+        react_1.default.createElement("input", Object.assign({ type: 'text' }, context.formRegister(props.name, {
             validate: (v, f) => {
                 if (firstTime && showAfterFirst)
                     return true;
@@ -65,5 +90,6 @@ export default function RequiredCheckBoxAdditional(_a) {
             },
         }), { hidden: true })),
         children,
-        React.createElement(Grid, { item: true, xs: 12 }, firstTime && showAfterFirst && props.content)));
+        react_1.default.createElement(material_1.Grid, { item: true, xs: 12 }, firstTime && showAfterFirst && props.content)));
 }
+exports.default = RequiredCheckBoxAdditional;

package/components/form/checkbox/CheckBoxWarning.js

@@ -0,0 +1,43 @@
+"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 });
+const material_1 = require("@mui/material");
+const Typography_1 = __importDefault(require("@mui/material/Typography"));
+const react_1 = __importStar(require("react"));
+const form_1 = require("../../../context/form");
+function CheckBoxWarning({ name, title, customWarning, defaultValue = false, xs = 12, sm, 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 }),
+        react_1.default.createElement(material_1.FormControlLabel, { control: react_1.default.createElement(material_1.Checkbox, Object.assign({ size: 'small' }, context.formRegister(name), { defaultChecked: defaultValue })), label: title }),
+        context.formWatch(name) && (react_1.default.createElement(material_1.Card, { sx: { bgcolor: '#FFFBF5', color: '#F59E0B', padding: 1, paddingLeft: 2 } }, customWarning ? (customWarning) : (react_1.default.createElement(Typography_1.default, null,
+            react_1.default.createElement("b", null, "Aten\u00E7\u00E3o"),
+            " ",
+            react_1.default.createElement("i", null, title),
+            " possui regras espec\u00EDficas."))))));
+}
+exports.default = CheckBoxWarning;

package/components/form/checkbox/RequiredCheckBoxValidator.js

@@ -0,0 +1,85 @@
+"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 __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 react_1 = __importStar(require("react"));
+const form_1 = require("../../../context/form");
+const material_1 = require("@mui/material");
+const lodash_get_1 = __importDefault(require("lodash.get"));
+function getChildrenNames(children) {
+    let arr = [];
+    children.forEach((x) => {
+        if (!x.props)
+            return;
+        if (x.props.children) {
+            const childrenArr = getChildrenNames(Array.isArray(x.props.children) ? x.props.children : [x.props.children]);
+            arr = arr.concat(childrenArr);
+            return;
+        }
+        if (x.props.name) {
+            arr.push(x.props.name);
+            return;
+        }
+    });
+    return arr;
+}
+function RequiredCheckBoxGroup(_a) {
+    var _b;
+    var { customText = 'Selecione pelo menos 1 opção' } = _a, props = __rest(_a, ["customText"]);
+    const context = (0, react_1.useContext)(form_1.FormContext);
+    return (react_1.default.createElement(material_1.Grid, { container: true, sx: { border: (0, lodash_get_1.default)(context.errors, props.name) ? '2px solid #a51c30' : '', padding: 1, borderRadius: 2 } },
+        react_1.default.createElement("input", Object.assign({ key: 1, type: 'text' }, context.formRegister(props.name, {
+            validate: (v, i) => {
+                const names = getChildrenNames(Array.isArray(props.children) ? props.children : [props.children]);
+                let canContinue = false;
+                names.forEach((x, i) => {
+                    const nameValue = context.formGetValues(x);
+                    if (nameValue) {
+                        canContinue = true;
+                    }
+                });
+                if (!canContinue)
+                    return customText;
+                return true;
+            },
+        }), { hidden: true })),
+        props.children,
+        react_1.default.createElement(material_1.Grid, { item: true, xs: 12 },
+            react_1.default.createElement(material_1.Typography, { sx: { color: '#a51c30', fontSize: 16, paddingLeft: 1 } }, (_b = (0, lodash_get_1.default)(context.errors, props.name)) === null || _b === void 0 ? void 0 : _b.message))));
+}
+exports.default = RequiredCheckBoxGroup;

package/components/form/date/DatePicker.js

@@ -0,0 +1,100 @@
+"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 __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 material_1 = require("@mui/material");
+const x_date_pickers_1 = require("@mui/x-date-pickers");
+const AdapterDayjs_1 = require("@mui/x-date-pickers/AdapterDayjs");
+const x_date_pickers_2 = require("@mui/x-date-pickers");
+const dayjs_1 = __importDefault(require("dayjs"));
+require("dayjs/locale/pt-br");
+const lodash_get_1 = __importDefault(require("lodash.get"));
+const lodash_hasin_1 = __importDefault(require("lodash.hasin"));
+const react_1 = __importStar(require("react"));
+const form_1 = require("../../../context/form");
+function DatePicker(_a) {
+    var _b;
+    var { name, required = false, title, xs = 12, sm, md, minDt, defaultValue = '', maxDt } = _a, props = __rest(_a, ["name", "required", "title", "xs", "sm", "md", "minDt", "defaultValue", "maxDt"]);
+    const context = (0, react_1.useContext)(form_1.FormContext);
+    const [value, setValue] = (0, react_1.useState)(defaultValue ? (0, dayjs_1.default)(defaultValue, 'DD/MM/YYYY') : null);
+    const handleChange = (newValue) => {
+        setValue(newValue);
+    };
+    (0, react_1.useEffect)(() => {
+        context.formSetValue(name, value ? value.format('DD/MM/YYYY') : value);
+    }, [value]);
+    (0, react_1.useEffect)(() => {
+        return () => {
+            context.formUnregister(name);
+        };
+    }, []);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(material_1.Grid, Object.assign({ item: true }, { xs, sm, md }),
+            title && react_1.default.createElement(material_1.InputLabel, { required: required }, title),
+            react_1.default.createElement(x_date_pickers_1.LocalizationProvider, { adapterLocale: 'pt-br', dateAdapter: AdapterDayjs_1.AdapterDayjs },
+                react_1.default.createElement(x_date_pickers_2.DatePicker, { minDate: (0, dayjs_1.default)(minDt, 'DD/MM/YYYY'), maxDate: (0, dayjs_1.default)(maxDt, 'DD/MM/YYYY'), format: 'DD/MM/YYYY', value: value, onChange: handleChange, disableHighlightToday: true, sx: {
+                        outline: (0, lodash_get_1.default)(context.errors, name) ? '1px solid #a51c30' : '',
+                        backgroundColor: 'white',
+                        width: '100%',
+                        div: {
+                            input: {
+                                paddingX: 2,
+                                paddingY: 1.05,
+                            },
+                        },
+                    }, inputRef: (params) => (react_1.default.createElement(material_1.TextField, Object.assign({ size: 'small' }, params, context === null || context === void 0 ? void 0 : context.formRegister(name, {
+                        validate: (v, f) => {
+                            if (!(0, lodash_hasin_1.default)(f, name)) {
+                                return true;
+                            }
+                            if (!v)
+                                v = '';
+                            if (v.length <= 0 && required)
+                                return 'Este campo é obrigatório';
+                            if (v.length < 10 && required)
+                                return 'A data precisa seguir o padrão DD/MM/AAAA';
+                            if (minDt && !((0, dayjs_1.default)(minDt, 'DD/MM/YYYY').isSame((0, dayjs_1.default)(v, 'DD/MM/YYYY')) || (0, dayjs_1.default)(minDt, 'DD/MM/YYYY').isBefore((0, dayjs_1.default)(v, 'DD/MM/YYYY'))))
+                                return `A data tem que ser depois de ${minDt} e antes de ${maxDt}`;
+                            if (maxDt && !((0, dayjs_1.default)(maxDt, 'DD/MM/YYYY').isSame((0, dayjs_1.default)(v, 'DD/MM/YYYY')) || (0, dayjs_1.default)(maxDt, 'DD/MM/YYYY').isAfter((0, dayjs_1.default)(v, 'DD/MM/YYYY'))))
+                                return 'A data escolhida não é válida';
+                        },
+                        shouldUnregister: true,
+                    }), { fullWidth: true }))) }),
+                react_1.default.createElement(material_1.Typography, { sx: { color: '#a51c30', fontSize: 14, paddingLeft: 1 } }, (_b = (0, lodash_get_1.default)(context.errors, name)) === null || _b === void 0 ? void 0 : _b.message)))));
+}
+exports.default = DatePicker;

package/components/form/date/TimePicker.js

@@ -0,0 +1,82 @@
+"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 });
+const material_1 = require("@mui/material");
+const x_date_pickers_1 = require("@mui/x-date-pickers");
+const AdapterDayjs_1 = require("@mui/x-date-pickers/AdapterDayjs");
+const dayjs_1 = __importDefault(require("dayjs"));
+const lodash_get_1 = __importDefault(require("lodash.get"));
+require("dayjs/locale/pt-br");
+const react_1 = __importStar(require("react"));
+const form_1 = require("../../../context/form");
+const lodash_hasin_1 = __importDefault(require("lodash.hasin"));
+function TimePicker({ name, required = false, title, defaultValue = '', xs = 12, sm, md, }) {
+    var _a;
+    const context = (0, react_1.useContext)(form_1.FormContext);
+    const [value, setValue] = (0, react_1.useState)(defaultValue ? (0, dayjs_1.default)(defaultValue, 'HH:mm') : null);
+    const handleChange = (newValue) => {
+        setValue(newValue);
+    };
+    (0, react_1.useEffect)(() => {
+        context.formSetValue(name, value ? value.format('HH:mm') : value);
+    }, [value]);
+    (0, react_1.useEffect)(() => {
+        return () => {
+            context.formUnregister(name);
+        };
+    }, []);
+    return (react_1.default.createElement(material_1.Grid, Object.assign({ item: true }, { xs, sm, md }),
+        title && react_1.default.createElement(material_1.InputLabel, { required: required }, title),
+        react_1.default.createElement(x_date_pickers_1.LocalizationProvider, { adapterLocale: 'pt-br', dateAdapter: AdapterDayjs_1.AdapterDayjs },
+            react_1.default.createElement(x_date_pickers_1.TimePicker, { value: value, ampm: false, onChange: handleChange, sx: {
+                    outline: (0, lodash_get_1.default)(context.errors, name) ? '1px solid #a51c30' : '',
+                    backgroundColor: 'white',
+                    width: '100%',
+                    div: {
+                        input: {
+                            paddingX: 2,
+                            paddingY: 1.05,
+                        },
+                    },
+                }, inputRef: (params) => (react_1.default.createElement(material_1.TextField, Object.assign({ size: 'small' }, params, context === null || context === void 0 ? void 0 : context.formRegister(name, {
+                    validate: (v, f) => {
+                        if (!(0, lodash_hasin_1.default)(f, name)) {
+                            return true;
+                        }
+                        if (!v)
+                            v = '';
+                        if (v.length <= 0 && required)
+                            return 'Este campo é obrigatório';
+                        if (v.length < 5 && required)
+                            return 'A hora precisa seguir o padrão HH:MM';
+                    },
+                    shouldUnregister: true,
+                }), { fullWidth: true }))) }),
+            react_1.default.createElement(material_1.Typography, { sx: { color: '#a51c30', fontSize: 15, paddingLeft: 1 } }, (_a = (0, lodash_get_1.default)(context.errors, name)) === null || _a === void 0 ? void 0 : _a.message))));
+}
+exports.default = TimePicker;