@producteca/producteca-ui-kit 1.20.0 → 1.21.1-beta.0

package/dist/components/alert/alert.js

@@ -0,0 +1,37 @@
+import _defineProperty from "babel-runtime/helpers/defineProperty";
+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;
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import styles from './alert.module.scss';
+import clsx from 'clsx';
+import { CheckCircle, Error, Info, Cancel } from '@mui/icons-material';
+import { CustomIcon } from '../icons';
+import { getColor } from '../../styles/colors';
+import _ from 'lodash';
+export var Alert = function Alert(_a) {
+    var message = _a.message,
+        _a$variant = _a.variant,
+        variant = _a$variant === undefined ? 'success' : _a$variant,
+        className = _a.className,
+        icon = _a.icon,
+        _a$fullWidth = _a.fullWidth,
+        fullWidth = _a$fullWidth === undefined ? false : _a$fullWidth,
+        link = _a.link,
+        props = __rest(_a, ["message", "variant", "className", "icon", "fullWidth", "link"]);
+
+    var defaultIcons = {
+        success: _jsx(CustomIcon, { size: "12", color: getColor('success', '500'), children: _jsx(CheckCircle, {}) }),
+        error: _jsx(CustomIcon, { size: "12", color: getColor('error', '700'), children: _jsx(Cancel, {}) }),
+        warning: _jsx(CustomIcon, { size: "12", color: getColor('secondary', '500'), children: _jsx(Error, {}) }),
+        info: _jsx(CustomIcon, { size: "12", color: getColor('primary', '500'), children: _jsx(Info, {}) })
+    };
+    return _jsxs("div", Object.assign({ className: clsx(styles['alert'], styles[variant], _defineProperty({}, styles['full-width'], fullWidth), className) }, props, { children: [_jsx("div", { className: styles['icon'], children: icon || defaultIcons[variant] }), _jsxs("div", { className: styles['message'], children: [_.isString(message) ? _jsx("span", { dangerouslySetInnerHTML: { __html: message } }) : _jsxs("span", { children: [" ", message] }), link && _jsxs(_Fragment, { children: [' ', _jsx("a", { href: link === null || link === void 0 ? void 0 : link.href, className: styles['link'], onClick: link === null || link === void 0 ? void 0 : link.onClick, children: link.text })] })] })] }));
+};
+export default Alert;

package/dist/components/breadcrumb/breadcrumb.js

@@ -0,0 +1,33 @@
+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;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styles from './breadcrumb.module.scss';
+import clsx from 'clsx';
+import { Button } from '../button/button';
+import { map, size } from 'lodash';
+var BreadcrumbItemComponent = function BreadcrumbItemComponent(_ref) {
+    var item = _ref.item,
+        index = _ref.index,
+        items = _ref.items;
+
+    var isLast = index === size(items) - 1;
+    var text = item.text + " >";
+    return item.isActive || isLast ? _jsx(Button, { variant: "link", size: "sm", label: text, onClick: item.onClick }) : _jsxs("div", { className: styles['breadcrumb-item'], children: [" ", text, " "] });
+};
+export var Breadcrumb = function Breadcrumb(_a) {
+    var items = _a.items,
+        className = _a.className,
+        otherProps = __rest(_a, ["items", "className"]);
+
+    return _jsx("nav", Object.assign({ className: clsx(styles['breadcrumb'], className), "aria-label": "Breadcrumb" }, otherProps, { children: map(items, function (item, index) {
+            return _jsx(BreadcrumbItemComponent, { item: item, index: index, items: items }, index);
+        }) }));
+};
+export default Breadcrumb;

package/dist/components/breadcrumb/index.js

@@ -0,0 +1,2 @@
+export { Breadcrumb } from './breadcrumb';
+export { Breadcrumb as default } from './breadcrumb';

package/dist/components/button/button.js

@@ -0,0 +1,34 @@
+import _defineProperty from "babel-runtime/helpers/defineProperty";
+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;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styles from './button.module.scss';
+import clsx from 'clsx';
+export var Button = function Button(_a) {
+    var _clsx;
+
+    var _a$type = _a.type,
+        type = _a$type === undefined ? 'button' : _a$type,
+        _a$variant = _a.variant,
+        variant = _a$variant === undefined ? 'primary' : _a$variant,
+        _a$size = _a.size,
+        size = _a$size === undefined ? 'lg' : _a$size,
+        label = _a.label,
+        outline = _a.outline,
+        leftAdornment = _a.leftAdornment,
+        rightAdornment = _a.rightAdornment,
+        _a$className = _a.className,
+        className = _a$className === undefined ? '' : _a$className,
+        props = __rest(_a, ["type", "variant", "size", "label", "outline", "leftAdornment", "rightAdornment", "className"]);
+
+    var adornmentStyle = !!leftAdornment || !!rightAdornment ? 'with-adornment' : '';
+    return _jsxs("button", Object.assign({}, props, { type: type, className: clsx(styles['btn'], styles[size], styles[adornmentStyle], styles[variant], (_clsx = {}, _defineProperty(_clsx, styles['outline'], outline), _defineProperty(_clsx, className, className), _clsx)), children: [!!leftAdornment && _jsx("span", { className: "" + styles['left-adornment'], children: leftAdornment }), label, !!rightAdornment && _jsx("span", { className: "" + styles['right-adornment'], children: rightAdornment })] }));
+};
+export default Button;

package/dist/components/chip/chip.js

@@ -0,0 +1,27 @@
+import _defineProperty from "babel-runtime/helpers/defineProperty";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { CustomIcon } from "../icons/customIcon/customIcon";
+import CloseRoundedIcon from "@mui/icons-material/CloseRounded";
+import { Grow } from "@mui/material";
+import { getColor } from "../../styles/colors";
+import styles from "./chip.module.scss";
+import clsx from "clsx";
+export var Chip = function Chip(_ref) {
+    var _clsx;
+
+    var isActive = _ref.isActive,
+        title = _ref.title,
+        text = _ref.text,
+        _ref$onRemove = _ref.onRemove,
+        onRemove = _ref$onRemove === undefined ? undefined : _ref$onRemove,
+        _ref$disabled = _ref.disabled,
+        disabled = _ref$disabled === undefined ? false : _ref$disabled,
+        _ref$variant = _ref.variant,
+        variant = _ref$variant === undefined ? 'primary' : _ref$variant,
+        _ref$size = _ref.size,
+        size = _ref$size === undefined ? "lg" : _ref$size;
+
+    var canRemove = onRemove && !disabled;
+    return _jsx(Grow, { in: !!text || !!title, unmountOnExit: true, children: _jsxs("span", { className: clsx(styles.chip, styles[variant], styles[size], (_clsx = {}, _defineProperty(_clsx, styles.disabled, disabled), _defineProperty(_clsx, styles.active, isActive), _clsx)), children: [_jsxs("span", { children: [!!title && _jsxs("span", { className: styles.title, children: [title, " ", text && ': '] }), !!text && _jsx("span", { className: styles.text, children: text })] }), canRemove && _jsx(CustomIcon, { className: styles.action, size: "8", onClick: canRemove ? onRemove : undefined, color: getColor("grey", "700"), children: _jsx(CloseRoundedIcon, {}) })] }) });
+};
+export default Chip;

package/dist/components/chip/index.js

@@ -0,0 +1 @@
+export { Chip } from './chip';

package/dist/components/icons/customIcon/customIcon.js

@@ -0,0 +1,41 @@
+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;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { SvgIcon } from '@mui/material';
+import { getColor } from '../../../styles/colors';
+export var CustomIcon = function CustomIcon(_a) {
+    var _a$color = _a.color,
+        color = _a$color === undefined ? getColor('grey', '500') : _a$color,
+        _a$size = _a.size,
+        size = _a$size === undefined ? '16' : _a$size,
+        sx = _a.sx,
+        children = _a.children,
+        _a$disabled = _a.disabled,
+        disabled = _a$disabled === undefined ? false : _a$disabled,
+        className = _a.className,
+        props = __rest(_a, ["color", "size", "sx", "children", "disabled", "className"]);
+
+    var fontSize = _translateSizeToFontSize(size);
+    return _jsx(SvgIcon, Object.assign({ className: className }, props, { sx: Object.assign(Object.assign({ color: color, fontSize: fontSize + "px", cursor: disabled ? 'default' : 'pointer', opacity: disabled ? 0.5 : 1, pointerEvents: disabled ? 'none' : 'auto' }, sx), { '& path': {
+                fill: color
+            } }), children: children }));
+};
+var _translateSizeToFontSize = function _translateSizeToFontSize(size) {
+    var transform = {
+        '32': '38',
+        '24': '31',
+        '20': '27',
+        '16': '23',
+        '12': '19',
+        '8': '15'
+    };
+    return transform[size] || transform['16'];
+};
+export default CustomIcon;

package/dist/components/icons/fileIcon/fileIcon.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import '../icons.module.scss';
+import { getColor, isValidColor } from '../../../styles/colors';
+var defaultColor = getColor('primary', '500');
+export var FileIcon = function FileIcon(_ref) {
+    var _ref$size = _ref.size,
+        size = _ref$size === undefined ? 24 : _ref$size,
+        _ref$color = _ref.color,
+        color = _ref$color === undefined ? defaultColor : _ref$color;
+
+    var resolvedColor = isValidColor(color) ? color : defaultColor;
+    return _jsxs("svg", { width: size, height: "100%", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M13 2H6C5.46957 2 4.96086 2.21071 4.58579 2.58579C4.21071 2.96086 4 3.46957 4 4V20C4 20.5304 4.21071 21.0391 4.58579 21.4142C4.96086 21.7893 5.46957 22 6 22H18C18.5304 22 19.0391 21.7893 19.4142 21.4142C19.7893 21.0391 20 20.5304 20 20V9L13 2Z", stroke: resolvedColor, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M13 2V9H20", stroke: resolvedColor, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })] });
+};
+export default FileIcon;

package/dist/components/icons/{index.d.ts → index.js}

@@ -3,4 +3,4 @@ export * from './mailIcon/mailIcon';
 export * from './fileIcon/fileIcon';
 export * from './priceDownIcon/priceDownIcon';
 export * from './priceCloseIcon/priceCloseIcon';
-export * from './customIcon/customIcon';
+export * from './customIcon/customIcon';

package/dist/components/icons/mailIcon/mailIcon.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import '../icons.module.scss';
+import { getColor, isValidColor } from '../../../styles/colors';
+var defaultColor = getColor('primary', '500');
+export var MailIcon = function MailIcon(_ref) {
+    var _ref$size = _ref.size,
+        size = _ref$size === undefined ? 24 : _ref$size,
+        _ref$color = _ref.color,
+        color = _ref$color === undefined ? defaultColor : _ref$color;
+
+    var resolvedColor = isValidColor(color) ? color : defaultColor;
+    return _jsxs("svg", { width: size, height: "100%", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M4 4H20C21.1 4 22 4.9 22 6V18C22 19.1 21.1 20 20 20H4C2.9 20 2 19.1 2 18V6C2 4.9 2.9 4 4 4Z", stroke: resolvedColor, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M22 6L12 13L2 6", stroke: resolvedColor, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })] });
+};
+export default MailIcon;

package/dist/components/icons/parameters.js

@@ -0,0 +1,26 @@
+import { allColors } from '../../styles/colors';
+export var argTypes = {
+    color: {
+        control: {
+            type: 'color',
+            presetColors: allColors
+        },
+        description: 'Color principal del icono'
+    },
+    size: {
+        control: { type: 'number' },
+        description: 'Tamaño del ícono en píxeles'
+    }
+};
+export var parameters = {
+    layout: 'centered',
+    design: {
+        type: 'figma',
+        url: 'https://www.figma.com/file/zjl0Sf62goTCLeLHx01EJg/UI-Kit-Producteca?node-id=202-167&t=cJ2EZ4eFqgQJN6Zf-4'
+    }
+};
+export var defaultParameters = {
+    parameters: parameters,
+    argTypes: argTypes
+};
+export default defaultParameters;

package/dist/components/icons/priceCloseIcon/priceCloseIcon.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import '../icons.module.scss';
+import { getColor, isValidColor } from '../../../styles/colors';
+var defaultColor = getColor('grey', '500');
+export var PriceCloseIcon = function PriceCloseIcon(_ref) {
+    var _ref$size = _ref.size,
+        size = _ref$size === undefined ? 24 : _ref$size,
+        _ref$color = _ref.color,
+        color = _ref$color === undefined ? defaultColor : _ref$color;
+
+    var resolvedColor = isValidColor(color) ? color : defaultColor;
+    return _jsxs("svg", { width: size, height: "100%", viewBox: "0 0 24 25", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M22.6371 18.2207H22.1451V17.2905C22.1505 16.9818 22.0908 16.675 21.9697 16.3883C21.8485 16.1015 21.6681 15.8404 21.4392 15.6203C21.2103 15.4001 20.9373 15.2252 20.6362 15.1059C20.3351 14.9865 20.0119 14.925 19.6854 14.925C19.3589 14.925 19.0357 14.9865 18.7346 15.1059C18.4335 15.2252 18.1605 15.4001 17.9316 15.6203C17.7026 15.8404 17.5223 16.1015 17.4011 16.3883C17.2799 16.675 17.2203 16.9818 17.2257 17.2905V18.2207H16.7337C16.4724 18.2214 16.2221 18.3201 16.0377 18.495C15.8532 18.67 15.7496 18.907 15.7496 19.1541V23.8077C15.7503 24.0543 15.8542 24.2907 16.0386 24.4651C16.223 24.6395 16.4729 24.7378 16.7337 24.7385H22.6405C22.9012 24.7378 23.1511 24.6395 23.3355 24.4651C23.5199 24.2907 23.6238 24.0543 23.6245 23.8077V19.1541C23.6245 19.0315 23.5989 18.9101 23.5493 18.7968C23.4997 18.6835 23.4269 18.5806 23.3352 18.4939C23.2435 18.4072 23.1347 18.3385 23.0149 18.2916C22.8951 18.2447 22.7667 18.2207 22.6371 18.2207ZM19.6837 22.4114C19.4891 22.4114 19.2988 22.3568 19.137 22.2545C18.9752 22.1523 18.8491 22.0069 18.7746 21.8368C18.7001 21.6667 18.6806 21.4795 18.7186 21.299C18.7566 21.1184 18.8503 20.9526 18.9879 20.8224C19.1255 20.6922 19.3008 20.6035 19.4917 20.5676C19.6826 20.5317 19.8805 20.5501 20.0603 20.6206C20.2401 20.691 20.3938 20.8104 20.5019 20.9634C20.61 21.1165 20.6677 21.2965 20.6677 21.4806C20.6665 21.7267 20.5625 21.9624 20.3785 22.1364C20.1945 22.3103 19.9452 22.4085 19.685 22.4095L19.6837 22.4114ZM21.2087 18.2207H18.16V17.2905C18.16 16.9079 18.3207 16.541 18.6067 16.2705C18.8927 15.9999 19.2806 15.8479 19.685 15.8479C20.0895 15.8479 20.4774 15.9999 20.7634 16.2705C21.0494 16.541 21.2101 16.9079 21.2101 17.2905L21.2087 18.2207Z", fill: resolvedColor }), _jsx("mask", { id: "path-2-inside-1_1_970", fill: "white", children: _jsx("path", { d: "M21.4995 11.6539C22.0518 11.6539 22.5044 11.2052 22.4523 10.6553C22.2811 8.8512 21.6481 7.11114 20.6036 5.596C19.3675 3.80287 17.6105 2.4053 15.5549 1.58001C13.4992 0.75472 11.2373 0.538787 9.05505 0.959515C6.87281 1.38024 4.86829 2.41874 3.29498 3.94367C1.72167 5.4686 0.650236 7.41148 0.216161 9.52663C-0.217914 11.6418 0.00486931 13.8342 0.856338 15.8266C1.70781 17.819 3.14972 19.522 4.99973 20.7201C6.57173 21.7382 8.3784 22.3529 10.251 22.5147C10.8012 22.5622 11.2498 22.11 11.2498 21.5577V21.1638C11.2498 20.6115 10.8007 20.1695 10.2518 20.1087C8.86847 19.9553 7.53753 19.4845 6.37192 18.7296C4.92807 17.7945 3.80272 16.4655 3.13819 14.9105C2.47366 13.3555 2.29979 11.6444 2.63856 9.99366C2.97734 8.34289 3.81354 6.82656 5.04144 5.63642C6.26933 4.44628 7.83376 3.63579 9.5369 3.30743C11.24 2.97907 13.0054 3.1476 14.6097 3.7917C16.214 4.4358 17.5853 5.52654 18.55 6.92599C19.323 8.04726 19.8072 9.32637 19.9692 10.6563C20.0359 11.2045 20.4774 11.6539 21.0297 11.6539H21.4995Z" }) }), _jsx("path", { d: "M21.4995 11.6539C22.0518 11.6539 22.5044 11.2052 22.4523 10.6553C22.2811 8.8512 21.6481 7.11114 20.6036 5.596C19.3675 3.80287 17.6105 2.4053 15.5549 1.58001C13.4992 0.75472 11.2373 0.538787 9.05505 0.959515C6.87281 1.38024 4.86829 2.41874 3.29498 3.94367C1.72167 5.4686 0.650236 7.41148 0.216161 9.52663C-0.217914 11.6418 0.00486931 13.8342 0.856338 15.8266C1.70781 17.819 3.14972 19.522 4.99973 20.7201C6.57173 21.7382 8.3784 22.3529 10.251 22.5147C10.8012 22.5622 11.2498 22.11 11.2498 21.5577V21.1638C11.2498 20.6115 10.8007 20.1695 10.2518 20.1087C8.86847 19.9553 7.53753 19.4845 6.37192 18.7296C4.92807 17.7945 3.80272 16.4655 3.13819 14.9105C2.47366 13.3555 2.29979 11.6444 2.63856 9.99366C2.97734 8.34289 3.81354 6.82656 5.04144 5.63642C6.26933 4.44628 7.83376 3.63579 9.5369 3.30743C11.24 2.97907 13.0054 3.1476 14.6097 3.7917C16.214 4.4358 17.5853 5.52654 18.55 6.92599C19.323 8.04726 19.8072 9.32637 19.9692 10.6563C20.0359 11.2045 20.4774 11.6539 21.0297 11.6539H21.4995Z", fill: "white", stroke: resolvedColor, strokeWidth: "4", mask: "url(#path-2-inside-1_1_970)" }), _jsx("path", { d: "M10.9086 18.2035V5.47624H11.7239V18.2035H10.9086ZM13.0712 9.67723C13.0315 9.27619 12.8608 8.96464 12.5592 8.74258C12.2575 8.52051 11.8482 8.40948 11.3312 8.40948C10.9798 8.40948 10.6832 8.45919 10.4413 8.55863C10.1993 8.65474 10.0137 8.78898 9.88444 8.96133C9.7585 9.13367 9.69552 9.32922 9.69552 9.54797C9.68889 9.73027 9.72701 9.88936 9.80987 10.0252C9.89604 10.1611 10.0137 10.2788 10.1629 10.3782C10.312 10.4743 10.4843 10.5589 10.6799 10.6318C10.8754 10.7014 11.0843 10.761 11.3063 10.8108L12.2211 11.0295C12.6652 11.1289 13.0729 11.2615 13.4441 11.4272C13.8153 11.593 14.1368 11.7968 14.4086 12.0387C14.6804 12.2807 14.8908 12.5657 15.04 12.8939C15.1924 13.222 15.2703 13.5982 15.2736 14.0224C15.2703 14.6455 15.1112 15.1858 14.7964 15.6431C14.4848 16.0972 14.0341 16.4502 13.4441 16.7021C12.8575 16.9507 12.1498 17.075 11.3212 17.075C10.4993 17.075 9.78335 16.949 9.1735 16.6971C8.56697 16.4452 8.09301 16.0724 7.75163 15.5785C7.41356 15.0814 7.23624 14.4665 7.21967 13.7341H9.30277C9.32597 14.0754 9.42374 14.3605 9.59609 14.5892C9.77175 14.8145 10.0054 14.9852 10.2971 15.1012C10.5921 15.2139 10.9252 15.2703 11.2964 15.2703C11.661 15.2703 11.9775 15.2172 12.2459 15.1112C12.5177 15.0051 12.7282 14.8576 12.8773 14.6687C13.0265 14.4798 13.1011 14.2627 13.1011 14.0174C13.1011 13.7887 13.0331 13.5965 12.8972 13.4407C12.7647 13.285 12.5691 13.1524 12.3106 13.043C12.0554 12.9336 11.7422 12.8342 11.3709 12.7447L10.2623 12.4663C9.40386 12.2575 8.72606 11.931 8.2289 11.4869C7.73174 11.0428 7.48482 10.4445 7.48814 9.69215C7.48482 9.07567 7.64888 8.53708 7.98032 8.07638C8.31508 7.61568 8.77412 7.25607 9.35745 6.99755C9.94079 6.73902 10.6037 6.60976 11.3461 6.60976C12.1018 6.60976 12.7613 6.73902 13.3248 6.99755C13.8915 7.25607 14.3324 7.61568 14.6472 8.07638C14.9621 8.53708 15.1245 9.0707 15.1344 9.67723H13.0712Z", fill: resolvedColor })] });
+};
+export default PriceCloseIcon;

package/dist/components/icons/priceDownIcon/priceDownIcon.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import '../icons.module.scss';
+import { getColor, isValidColor } from '../../../styles/colors';
+var defaultColor = getColor('primary', '500');
+export var PriceDownIcon = function PriceDownIcon(_ref) {
+    var _ref$size = _ref.size,
+        size = _ref$size === undefined ? 24 : _ref$size,
+        _ref$color = _ref.color,
+        color = _ref$color === undefined ? defaultColor : _ref$color;
+
+    var resolvedColor = isValidColor(color) ? color : defaultColor;
+    return _jsxs("svg", { width: size, height: "100%", viewBox: "0 0 25 25", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M19.012 23.8615C19.2082 24.0664 19.5353 24.0672 19.7325 23.8633L23.2885 20.1866C23.595 19.8697 23.3712 19.3401 22.9303 19.339L15.8363 19.3217C15.3955 19.3206 15.1691 19.8492 15.474 20.1676L19.012 23.8615Z", fill: resolvedColor }), _jsx("mask", { id: "path-2-inside-1_1_1191", fill: "white", children: _jsx("path", { d: "M21.651 11.1531C22.2033 11.1531 22.6557 10.7044 22.6051 10.1544C22.4392 8.35049 21.8256 6.61063 20.8131 5.09564C19.6148 3.30264 17.9116 1.90517 15.9188 1.07995C13.9261 0.254719 11.7334 0.0388023 9.61795 0.459499C7.50249 0.880196 5.55932 1.91861 4.03417 3.44343C2.50901 4.96825 1.47036 6.91099 1.04957 9.02598C0.628782 11.141 0.844747 13.3332 1.67016 15.3255C2.49557 17.3177 3.89335 19.0206 5.68674 20.2186C7.20212 21.2309 8.94246 21.8444 10.7469 22.0103C11.2969 22.0609 11.7455 21.6084 11.7455 21.0561V20.6624C11.7455 20.1101 11.2962 19.6684 10.7478 19.6037C9.41766 19.4467 8.13837 18.9775 7.01693 18.2283C5.61727 17.2933 4.52637 15.9643 3.88217 14.4094C3.23798 12.8546 3.06943 11.1436 3.39784 9.49297C3.72624 7.84233 4.53686 6.32611 5.72717 5.13606C6.91748 3.94601 8.43404 3.13558 10.085 2.80724C11.7361 2.47891 13.4474 2.64742 15.0026 3.29147C16.5578 3.93552 17.8871 5.02618 18.8223 6.42553C19.5716 7.54666 20.041 8.82559 20.198 10.1553C20.2628 10.7038 20.7044 11.1531 21.2567 11.1531H21.651Z" }) }), _jsx("path", { d: "M21.651 11.1531C22.2033 11.1531 22.6557 10.7044 22.6051 10.1544C22.4392 8.35049 21.8256 6.61063 20.8131 5.09564C19.6148 3.30264 17.9116 1.90517 15.9188 1.07995C13.9261 0.254719 11.7334 0.0388023 9.61795 0.459499C7.50249 0.880196 5.55932 1.91861 4.03417 3.44343C2.50901 4.96825 1.47036 6.91099 1.04957 9.02598C0.628782 11.141 0.844747 13.3332 1.67016 15.3255C2.49557 17.3177 3.89335 19.0206 5.68674 20.2186C7.20212 21.2309 8.94246 21.8444 10.7469 22.0103C11.2969 22.0609 11.7455 21.6084 11.7455 21.0561V20.6624C11.7455 20.1101 11.2962 19.6684 10.7478 19.6037C9.41766 19.4467 8.13837 18.9775 7.01693 18.2283C5.61727 17.2933 4.52637 15.9643 3.88217 14.4094C3.23798 12.8546 3.06943 11.1436 3.39784 9.49297C3.72624 7.84233 4.53686 6.32611 5.72717 5.13606C6.91748 3.94601 8.43404 3.13558 10.085 2.80724C11.7361 2.47891 13.4474 2.64742 15.0026 3.29147C16.5578 3.93552 17.8871 5.02618 18.8223 6.42553C19.5716 7.54666 20.041 8.82559 20.198 10.1553C20.2628 10.7038 20.7044 11.1531 21.2567 11.1531H21.651Z", fill: "white", stroke: resolvedColor, strokeWidth: "4", mask: "url(#path-2-inside-1_1_1191)" }), _jsx("path", { d: "M19.3793 14.424V23.1464", stroke: resolvedColor, strokeWidth: "2" }), _jsx("path", { d: "M11.4043 17.7033V4.97607H12.2197V17.7033H11.4043ZM13.567 9.17707C13.5272 8.77603 13.3565 8.46447 13.0549 8.24241C12.7533 8.02034 12.344 7.90931 11.8269 7.90931C11.4756 7.90931 11.179 7.95903 10.937 8.05846C10.6951 8.15458 10.5095 8.28881 10.3802 8.46116C10.2543 8.63351 10.1913 8.82906 10.1913 9.04781C10.1847 9.2301 10.2228 9.38919 10.3056 9.52508C10.3918 9.66097 10.5095 9.77863 10.6586 9.87806C10.8078 9.97418 10.9801 10.0587 11.1757 10.1316C11.3712 10.2012 11.58 10.2609 11.8021 10.3106L12.7168 10.5293C13.161 10.6288 13.5686 10.7613 13.9399 10.9271C14.3111 11.0928 14.6326 11.2966 14.9043 11.5386C15.1761 11.7805 15.3866 12.0656 15.5357 12.3937C15.6882 12.7218 15.7661 13.098 15.7694 13.5222C15.7661 14.1453 15.607 14.6856 15.2921 15.143C14.9806 15.597 14.5298 15.95 13.9399 16.2019C13.3532 16.4505 12.6456 16.5748 11.817 16.5748C10.995 16.5748 10.2791 16.4488 9.66926 16.197C9.06273 15.9451 8.58877 15.5722 8.24739 15.0783C7.90932 14.5812 7.732 13.9664 7.71543 13.2339H9.79852C9.82172 13.5753 9.9195 13.8603 10.0918 14.089C10.2675 14.3144 10.5012 14.4851 10.7928 14.6011C11.0878 14.7138 11.4209 14.7701 11.7921 14.7701C12.1567 14.7701 12.4732 14.7171 12.7417 14.611C13.0135 14.505 13.2239 14.3575 13.3731 14.1685C13.5222 13.9796 13.5968 13.7625 13.5968 13.5173C13.5968 13.2886 13.5289 13.0963 13.393 12.9406C13.2604 12.7848 13.0649 12.6522 12.8063 12.5428C12.5511 12.4335 12.2379 12.334 11.8667 12.2445L10.758 11.9661C9.89961 11.7573 9.22182 11.4309 8.72466 10.9867C8.2275 10.5426 7.98058 9.94435 7.98389 9.19198C7.98058 8.5755 8.14464 8.03692 8.47608 7.57622C8.81083 7.11551 9.26988 6.7559 9.85321 6.49738C10.4365 6.23886 11.0994 6.1096 11.8418 6.1096C12.5975 6.1096 13.2571 6.23886 13.8205 6.49738C14.3873 6.7559 14.8281 7.11551 15.143 7.57622C15.4579 8.03692 15.6203 8.57053 15.6302 9.17707H13.567Z", fill: resolvedColor })] });
+};
+export default PriceDownIcon;

package/dist/components/icons/searchPublication/searchPublication.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import '../icons.module.scss';
+import { getColor, isValidColor } from '../../../styles/colors';
+var defaultColor = getColor('grey', '500');
+export var SearchPublication = function SearchPublication(_ref) {
+    var _ref$size = _ref.size,
+        size = _ref$size === undefined ? 100 : _ref$size,
+        _ref$color = _ref.color,
+        color = _ref$color === undefined ? defaultColor : _ref$color;
+
+    var resolvedColor = isValidColor(color) ? color : defaultColor;
+    return _jsx("svg", { id: "Capa_1", "data-name": "Capa 1", xmlns: "http://www.w3.org/2000/svg", width: size, height: "100%", viewBox: "0 0 95 95", children: _jsxs("g", { id: "Grupo_1315", "data-name": "Grupo 1315", children: [_jsx("path", { id: "Trazado_2280", "data-name": "Trazado 2280", style: { fill: resolvedColor }, d: "M0,13.62c.09-.37.16-.76.26-1.14a7.22,7.22,0,0,1,7-5.28H24.3c.23,0,.3,0,.29-.29a7,7,0,0,1,.58-3.25A6.37,6.37,0,0,1,33.63.6a6.47,6.47,0,0,1,1.75,1.22,6.2,6.2,0,0,1,1.89,4.53c0,.22,0,.43,0,.65s0,.2.21.2H54.63a7.21,7.21,0,0,1,7.24,7.18V34.23a1.45,1.45,0,0,1-1.33,1.55h-.16A1.44,1.44,0,0,1,59,34.5c0-.12,0-.25,0-.37V14.55a4.33,4.33,0,0,0-4.2-4.46H7.4A4.34,4.34,0,0,0,3,13.44a4.07,4.07,0,0,0-.12,1V79.22a4.33,4.33,0,0,0,4.32,4.32H54.44a1.5,1.5,0,0,1,1.49.83,1.45,1.45,0,0,1-.68,1.93,1.39,1.39,0,0,1-.53.14,2.62,2.62,0,0,1-.28,0H7.29A7.25,7.25,0,0,1,.06,80.26c0-.1,0-.21-.06-.3ZM30.91,7.2h3.23c.17,0,.23,0,.22-.22s0-.47,0-.7A3.43,3.43,0,0,0,28,4.62a4.27,4.27,0,0,0-.45,2.3c0,.22,0,.29.27.29,1,0,2.09,0,3.14,0Z" }), _jsx("path", { id: "Trazado_2281", "data-name": "Trazado 2281", style: { fill: resolvedColor }, d: "M54.79,38.4c8.35-.94,15.22,1.7,20.36,8.46A19.94,19.94,0,0,1,79.1,57a20.86,20.86,0,0,1-2,11.63.24.24,0,0,0,.05.34h0L92.23,82.66a5.82,5.82,0,1,1-7.83,8.62l-.07-.06Q76.76,84.37,69.2,77.47c-.15-.13-.23-.09-.37,0a21.24,21.24,0,0,1-7,2.6,21.08,21.08,0,0,1-21-8.55,20.4,20.4,0,0,1-3.79-10A21.15,21.15,0,0,1,51.26,39.31,23.75,23.75,0,0,1,54.79,38.4Zm21.72,18A18.62,18.62,0,1,0,61,77.68h0A18.64,18.64,0,0,0,76.51,56.39Zm15.08,30a3.31,3.31,0,0,0-1.12-2L75.89,71.17c-.16-.14-.23-.14-.36,0a20.4,20.4,0,0,1-4.16,4.49c-.2.15-.19.23,0,.39,1.78,1.6,3.56,3.22,5.34,4.84l9.39,8.52a3.32,3.32,0,0,0,5.5-3Z" }), _jsx("path", { id: "Trazado_2282", "data-name": "Trazado 2282", style: { fill: resolvedColor }, d: "M31,19.9H20.38A5.76,5.76,0,0,1,14.57,15a3.12,3.12,0,0,1,0-1.1,1.45,1.45,0,0,1,2.88.22,2.85,2.85,0,0,0,1.74,2.68A2.54,2.54,0,0,0,20.3,17H42a2.9,2.9,0,0,0,2.89-2.85,1.46,1.46,0,0,1,2.91-.07v.1a5.8,5.8,0,0,1-5.72,5.72Z" }), _jsx("path", { id: "Trazado_2283", "data-name": "Trazado 2283", style: { fill: resolvedColor }, d: "M13.22,68V66.07A1.86,1.86,0,0,1,15,64.15c1.36,0,2.73,0,4.09,0A1.86,1.86,0,0,1,20.88,66q0,2,0,3.93A1.91,1.91,0,0,1,19,71.83c-1.28,0-2.57,0-3.85,0a1.91,1.91,0,0,1-1.91-1.9V68Zm2.24,0v.76a.77.77,0,0,0,.71.85.28.28,0,0,0,.13,0c.5,0,1,0,1.49,0a.78.78,0,0,0,.85-.73v-.09c0-.51,0-1,0-1.54a.76.76,0,0,0-.72-.8h0a12.2,12.2,0,0,0-1.71,0,.76.76,0,0,0-.72.79h0V68Z" }), _jsx("path", { id: "Trazado_2284", "data-name": "Trazado 2284", style: { fill: resolvedColor }, d: "M13.22,52.67V50.75a1.87,1.87,0,0,1,1.83-1.9q2,0,4,0a1.88,1.88,0,0,1,1.84,1.81c0,1.35,0,2.71,0,4.06a1.84,1.84,0,0,1-1.77,1.79,39.85,39.85,0,0,1-4.09,0,1.85,1.85,0,0,1-1.81-1.89.19.19,0,0,1,0-.08ZM17,54.27h.76a.79.79,0,0,0,.84-.73v-.07c0-.52,0-1,0-1.57a.76.76,0,0,0-.71-.79c-.6,0-1.2,0-1.79,0a.74.74,0,0,0-.68.75q0,.83,0,1.65a.77.77,0,0,0,.77.75Z" }), _jsx("path", { id: "Trazado_2285", "data-name": "Trazado 2285", style: { fill: resolvedColor }, d: "M13.22,37.38v-2a1.88,1.88,0,0,1,1.86-1.87q2,0,3.93,0a1.85,1.85,0,0,1,1.86,1.78c0,1.37,0,2.74,0,4.12A1.85,1.85,0,0,1,19,41.23q-2,0-4,0a1.88,1.88,0,0,1-1.85-1.9ZM17.05,39h.75a.8.8,0,0,0,.84-.74v-.06c0-.53,0-1,0-1.57a.77.77,0,0,0-.75-.8H16.2a.77.77,0,0,0-.74.76c0,.55,0,1.1,0,1.66a.77.77,0,0,0,.77.75c.27,0,.54,0,.81,0Z" }), _jsx("path", { id: "Trazado_2286", "data-name": "Trazado 2286", style: { fill: resolvedColor }, d: "M30.54,38.84h-5a1.45,1.45,0,0,1-1.47-1.43A1.48,1.48,0,0,1,25.26,36a2,2,0,0,1,.35,0h9.87a1.45,1.45,0,0,1,.11,2.9H30.54Z" }), _jsx("path", { id: "Trazado_2287", "data-name": "Trazado 2287", style: { fill: resolvedColor }, d: "M28.44,54.14H25.59a1.44,1.44,0,0,1-1.49-1.39s0,0,0-.06a1.48,1.48,0,0,1,1.47-1.46h5.73a1.45,1.45,0,0,1,1.52,1.38,1.44,1.44,0,0,1-1.37,1.52h-3Z" }), _jsx("path", { id: "Trazado_2288", "data-name": "Trazado 2288", style: { fill: resolvedColor }, d: "M27.36,66.54c.63,0,1.26,0,1.9,0a1.44,1.44,0,0,1,1.36,1.27,1.47,1.47,0,0,1-1,1.56,1.6,1.6,0,0,1-.54.07H25.64a1.46,1.46,0,0,1-.17-2.91.43.43,0,0,1,.16,0h1.73Z" }), _jsx("path", { id: "Trazado_2289", "data-name": "Trazado 2289", style: { fill: resolvedColor }, d: "M54.49,47.45a13.8,13.8,0,0,1,8.82,1.95,12.64,12.64,0,0,1,4.62,5.36,18.36,18.36,0,0,1,1.44,4.33,1.24,1.24,0,0,1-1,1.45h0A1.22,1.22,0,0,1,67,59.63a16.4,16.4,0,0,0-1.56-4.37A9.91,9.91,0,0,0,57,49.91a11.82,11.82,0,0,0-2.59.08,1.23,1.23,0,0,1-1.47-.94v0a1.23,1.23,0,0,1,1-1.47H54Z" })] }) });
+};
+export default SearchPublication;

package/dist/components/image/image.js

@@ -0,0 +1,26 @@
+import _slicedToArray from 'babel-runtime/helpers/slicedToArray';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from 'react';
+import clsx from 'clsx';
+import InsertPhotoRoundedIcon from '@mui/icons-material/InsertPhotoRounded';
+import styles from './image.module.scss';
+export var Image = function Image(_ref) {
+    var src = _ref.src,
+        className = _ref.className,
+        sx = _ref.sx,
+        alt = _ref.alt;
+
+    var _useState = useState(false),
+        _useState2 = _slicedToArray(_useState, 2),
+        hasError = _useState2[0],
+        setHasError = _useState2[1];
+
+    var handleImageError = function handleImageError() {
+        setHasError(true);
+    };
+    if (hasError) {
+        return _jsx("div", { className: clsx(styles['image-container'], className), style: sx, children: _jsx(InsertPhotoRoundedIcon, { className: styles.error }) });
+    }
+    return _jsx("div", { className: clsx(styles['image-container'], className), style: Object.assign({}, sx), children: _jsx("img", { src: src, alt: alt || src, className: styles.image, onError: handleImageError }) });
+};
+export default Image;

package/dist/components/image/index.js

@@ -0,0 +1 @@
+export { Image } from './image';

package/dist/components/{index.d.ts → index.js}

@@ -10,3 +10,4 @@ export * from './image';
 export * from './breadcrumb';
 export * from './menuAction';
 export * from './modals';
+export * from './tabs';

package/dist/components/inputs/checkboxInput/checkboxInput.js

@@ -0,0 +1,35 @@
+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;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import CheckboxInputGroup from './checkboxInputGroup';
+export var CheckboxInput = function CheckboxInput(_a) {
+    var name = _a.name,
+        checked = _a.checked,
+        onChange = _a.onChange,
+        label = _a.label,
+        title = _a.title,
+        _a$disabled = _a.disabled,
+        disabled = _a$disabled === undefined ? false : _a$disabled,
+        _a$size = _a.size,
+        size = _a$size === undefined ? 'lg' : _a$size,
+        input = _a.input,
+        _a$type = _a.type,
+        type = _a$type === undefined ? 'checkbox' : _a$type,
+        props = __rest(_a, ["name", "checked", "onChange", "label", "title", "disabled", "size", "input", "type"]);
+
+    var item = {
+        id: name + "-single",
+        label: label,
+        checked: checked,
+        disabled: disabled
+    };
+    return _jsx(CheckboxInputGroup, Object.assign({}, props, { name: name, items: [item], onChange: onChange, title: title, type: type, size: size, input: input }));
+};
+export default CheckboxInput;

package/dist/components/inputs/checkboxInput/checkboxInputGroup.js

@@ -0,0 +1,58 @@
+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;
+};
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import styles from './checkboxInput.module.scss';
+import _ from 'lodash';
+import { useReduxFormField } from '../../../hooks/useReduxFormField';
+export var CheckboxInputGroup = function CheckboxInputGroup(_a) {
+    var title = _a.title,
+        name = _a.name,
+        _a$type = _a.type,
+        type = _a$type === undefined ? 'checkbox' : _a$type,
+        items = _a.items,
+        onChange = _a.onChange,
+        _a$size = _a.size,
+        size = _a$size === undefined ? 'lg' : _a$size,
+        input = _a.input,
+        props = __rest(_a, ["title", "name", "type", "items", "onChange", "size", "input"]);
+
+    var _useReduxFormField = useReduxFormField({
+        input: input,
+        onChange: onChange,
+        transformValue: function transformValue(event) {
+            var _event$target = event.target,
+                checked = _event$target.checked,
+                inputName = _event$target.name;
+
+            if (input) {
+                var newValue = Object.assign({}, input.value);
+                newValue[inputName] = checked;
+                return newValue;
+            }
+            return event;
+        }
+    }),
+        handleChange = _useReduxFormField.handleChange,
+        handleBlur = _useReduxFormField.handleBlur;
+
+    return _jsxs("div", { className: styles['checkbox-input-container'], children: [title && _jsxs("label", { className: styles['title'], children: [" ", title, " "] }), _jsx("div", { className: styles['checkbox-input-items'] + " " + styles[size], children: _.map(items, function (_a) {
+                var id = _a.id,
+                    itemName = _a.name,
+                    label = _a.label,
+                    disabled = _a.disabled,
+                    checked = _a.checked,
+                    value = _a.value,
+                    itemProps = __rest(_a, ["id", "name", "label", "disabled", "checked", "value"]);
+
+                var inputId = id || itemName || name;
+                return _jsxs("label", { htmlFor: inputId, className: "" + (disabled ? styles['disabled'] : ''), children: [_jsx("input", Object.assign({}, props, itemProps, { id: inputId, type: type, name: itemName || name, checked: input && itemName ? _.get(input.value, itemName) : checked, disabled: disabled, onChange: handleChange, onBlur: handleBlur })), _jsxs("span", { children: [" ", label, " "] })] }, inputId);
+            }) })] });
+};
+export default CheckboxInputGroup;

package/dist/components/inputs/checkboxInput/{index.d.ts → index.js}

@@ -1,4 +1,3 @@
 import { CheckboxInput } from './checkboxInput';
 import { CheckboxInputGroup } from './checkboxInputGroup';
-
-export { CheckboxInput, CheckboxInput as Checkbox, CheckboxInputGroup, CheckboxInputGroup as CheckboxGroup };
+export { CheckboxInput, CheckboxInput as Checkbox, CheckboxInputGroup, CheckboxInputGroup as CheckboxGroup };

package/dist/components/inputs/datePicker/datePicker.js

@@ -0,0 +1,143 @@
+import _slicedToArray from "babel-runtime/helpers/slicedToArray";
+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;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from 'react';
+import { DatePicker as MUIDatePicker } from '@mui/x-date-pickers/DatePicker';
+import { DateTimePicker as MUIDateTimePicker } from '@mui/x-date-pickers/DateTimePicker';
+import { TimePicker as MUITimePicker } from '@mui/x-date-pickers/TimePicker';
+import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
+import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
+import { ErrorMessage, formValidation } from '../../../validators';
+import errorStyles from '../../../validators/errorMessage.module.scss';
+import { useReduxFormField } from '../../../hooks/useReduxFormField';
+import { FormField } from '../formField/formField';
+import { getPickerProps, getFinalFormat, getPickerTypeFromFormat } from './datePickerUtils';
+import styles from './datePicker.module.scss';
+import clsx from 'clsx';
+import dayjs from 'dayjs';
+import { includes } from 'lodash';
+import 'dayjs/locale/es';
+export var DatePickerInput = function DatePickerInput(props) {
+    var _a;
+
+    var meta = props.meta,
+        name = props.name,
+        _props$value = props.value,
+        value = _props$value === undefined ? null : _props$value,
+        _props$disabled = props.disabled,
+        disabled = _props$disabled === undefined ? false : _props$disabled,
+        _props$required = props.required,
+        required = _props$required === undefined ? false : _props$required,
+        placeholder = props.placeholder,
+        _props$size = props.size,
+        size = _props$size === undefined ? 'md' : _props$size,
+        _props$noErrors = props.noErrors,
+        noErrors = _props$noErrors === undefined ? false : _props$noErrors,
+        label = props.label,
+        minDate = props.minDate,
+        maxDate = props.maxDate,
+        format = props.format,
+        isValid = props.isValid,
+        onChange = props.onChange,
+        input = props.input,
+        otherProps = __rest(props, ["meta", "name", "value", "disabled", "required", "placeholder", "size", "noErrors", "label", "minDate", "maxDate", "format", "isValid", "onChange", "input"]);
+
+    var finalFormat = getFinalFormat(format);
+    var pickerType = getPickerTypeFromFormat(format);
+    var inputValue = (_a = input === null || input === void 0 ? void 0 : input.value) !== null && _a !== void 0 ? _a : value;
+
+    var _useState = useState(inputValue),
+        _useState2 = _slicedToArray(_useState, 2),
+        currentValue = _useState2[0],
+        setCurrentValue = _useState2[1];
+
+    var _useState3 = useState(false),
+        _useState4 = _slicedToArray(_useState3, 2),
+        isOpen = _useState4[0],
+        setIsOpen = _useState4[1];
+
+    var validationProps = { meta: meta, value: inputValue, isValid: isValid, required: props.required };
+    var validated = formValidation(validationProps);
+    useEffect(function () {
+        setCurrentValue(inputValue);
+    }, [inputValue]);
+
+    var _useReduxFormField = useReduxFormField({
+        input: input,
+        onChange: onChange ? function (date) {
+            var syntheticEvent = {
+                target: {
+                    value: date ? date.format(finalFormat) : '',
+                    name: name
+                }
+            };
+            onChange(syntheticEvent);
+        } : undefined,
+        transformValue: function transformValue(date) {
+            setCurrentValue(date);
+            return date ? date.toDate() : null;
+        }
+    }),
+        fieldHandleChange = _useReduxFormField.handleChange;
+
+    var _handleChange = function _handleChange(date) {
+        setCurrentValue(date ? date.format(finalFormat) : null);
+        fieldHandleChange(date);
+    };
+    var _handleClear = function _handleClear() {
+        setCurrentValue(null);
+        fieldHandleChange(null);
+        setIsOpen(false);
+    };
+    var _handleOpen = function _handleOpen() {
+        setIsOpen(!isOpen);
+    };
+    var _handleClose = function _handleClose() {
+        setIsOpen(false);
+    };
+    dayjs.locale('es');
+    var Picker = function Picker() {
+        var commonProps = getPickerProps({
+            currentValue: currentValue,
+            finalFormat: finalFormat,
+            disabled: disabled,
+            minDate: minDate,
+            maxDate: maxDate,
+            placeholder: placeholder,
+            name: name,
+            onChange: _handleChange,
+            onClear: _handleClear,
+            onOpen: _handleOpen,
+            onClose: _handleClose,
+            open: isOpen,
+            otherProps: otherProps
+        });
+        switch (pickerType) {
+            case 'year':
+                return _jsx(MUIDatePicker, Object.assign({}, commonProps, { views: ['year'] }));
+            case 'time':
+                return _jsx(MUITimePicker, Object.assign({}, commonProps, { views: includes(finalFormat, 's') ? ['hours', 'minutes', 'seconds'] : ['hours', 'minutes'] }));
+            case 'dateTime':
+                return _jsx(MUIDateTimePicker, Object.assign({}, commonProps));
+            case 'date':
+            default:
+                return _jsx(MUIDatePicker, Object.assign({}, commonProps));
+        }
+    };
+    return _jsx(LocalizationProvider, { dateAdapter: AdapterDayjs, adapterLocale: "es", children: _jsxs("div", { className: clsx(styles[size], validated ? errorStyles[validated] : '', styles['date-picker']), children: [_jsx(Picker, {}), !noErrors && _jsx(ErrorMessage, { validationProps: validationProps })] }) });
+};
+export var DatePicker = function DatePicker(_a) {
+    var label = _a.label,
+        rightAdornment = _a.rightAdornment,
+        props = __rest(_a, ["label", "rightAdornment"]);
+
+    return _jsx(FormField, Object.assign({ type: "date", label: label, rightAdornment: rightAdornment }, props));
+};