@arquimedes.co/eureka-forms 3.0.31-test → 3.0.32

package/dist/Shared/Rating/Rating.js

@@ -1,16 +1,39 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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 { RatingTypes } from '../../constants/FormStepTypes';
 import LikeRating from './Ratings/LikeRating';
 import SatisfactionRating from './Ratings/SatisfactionRating';
 import ScaleRating from './Ratings/ScaleRating';
-function Rating({ type, ...others }) {
+function Rating(_a) {
+    var type = _a.type, others = __rest(_a, ["type"]);
     switch (type) {
         case RatingTypes.LIKE:
-            return _jsx(LikeRating, { ...others });
+            return _jsx(LikeRating, __assign({}, others));
         case RatingTypes.SATISFACTION:
-            return _jsx(SatisfactionRating, { ...others });
+            return _jsx(SatisfactionRating, __assign({}, others));
         case RatingTypes.SCALE:
-            return _jsx(ScaleRating, { ...others });
+            return _jsx(ScaleRating, __assign({}, others));
         default:
             return _jsx("div", {});
     }

package/dist/Shared/Rating/Rating.stories.d.ts

@@ -1,4 +1,4 @@
-import type { StoryObj } from '@storybook/react-vite';
+import type { StoryObj } from '@storybook/react';
 import Rating from './Rating';
 declare const meta: {
     component: typeof Rating;

package/dist/Shared/Rating/Rating.stories.js

@@ -1,47 +1,53 @@
 import Rating from './Rating';
 import { RatingTypes } from '../../constants/FormStepTypes';
-const meta = {
+var meta = {
     component: Rating,
     tags: ['autodocs'],
     args: {},
 };
 export default meta;
-export const ScaleRating = {
+export var ScaleRating = {
     args: {
         type: RatingTypes.SCALE,
-        onChange: () => { },
+        focusColor: '#3d5a7f',
+        unSelectedColor: '#d8d8d8',
     },
 };
-export const ScaleRatingWidthValue = {
+export var ScaleRatingWidthValue = {
     args: {
         type: RatingTypes.SCALE,
-        onChange: () => { },
+        focusColor: '#3d5a7f',
+        unSelectedColor: '#d8d8d8',
         value: 4,
     },
 };
-export const LikeRating = {
+export var LikeRating = {
     args: {
         type: RatingTypes.LIKE,
-        onChange: () => { },
+        focusColor: '#3d5a7f',
+        unSelectedColor: '#d8d8d8',
     },
 };
-export const LikeRatingWithValue = {
+export var LikeRatingWithValue = {
     args: {
         type: RatingTypes.LIKE,
-        onChange: () => { },
+        focusColor: '#3d5a7f',
+        unSelectedColor: '#d8d8d8',
         value: 1,
     },
 };
-export const SatisfactionRating = {
+export var SatisfactionRating = {
     args: {
         type: RatingTypes.SATISFACTION,
-        onChange: () => { },
+        focusColor: '#3d5a7f',
+        unSelectedColor: '#d8d8d8',
     },
 };
-export const SatisfactionRatingWidthValue = {
+export var SatisfactionRatingWidthValue = {
     args: {
         type: RatingTypes.SATISFACTION,
-        onChange: () => { },
+        focusColor: '#3d5a7f',
+        unSelectedColor: '#d8d8d8',
         value: 3,
     },
 };

package/dist/Shared/Rating/Ratings/LikeRating.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { RatingProps } from '../Rating';
-declare function LikeRating({ disabled, inputRef, value, onChange }: RatingProps): JSX.Element;
+declare function LikeRating({ disabled, inputRef, value, onChange, focusColor, unSelectedColor, }: RatingProps): JSX.Element;
 export default LikeRating;

package/dist/Shared/Rating/Ratings/LikeRating.js

@@ -1,29 +1,43 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useTheme } from '@mui/material';
-import DislikeIcon from '../../../Icons/Ratings/DislikeIcon';
-import LikeIcon from '../../../Icons/Ratings/LikeIcon';
+import ThumbDownRoundedIcon from '@material-ui/icons/ThumbDownRounded';
+import ThumbUpRoundedIcon from '@material-ui/icons/ThumbUpRounded';
 import styles from '../Rating.module.css';
-function LikeRating({ disabled, inputRef, value, onChange }) {
-    const { palette } = useTheme();
-    const focusColor = palette.primary.main;
-    const unSelectedColor = palette.outline.main;
-    return (_jsxs("div", { className: styles.ratingContainer, style: {
+function LikeRating(_a) {
+    var disabled = _a.disabled, inputRef = _a.inputRef, value = _a.value, onChange = _a.onChange, focusColor = _a.focusColor, unSelectedColor = _a.unSelectedColor;
+    return (_jsxs("div", __assign({ className: styles.ratingContainer, style: {
             '--eureka-primary': focusColor,
             '--eureka-outline': unSelectedColor,
-        }, children: [_jsx("input", { ref: inputRef, className: 'hidden-input' }), _jsx("div", { className: disabled ? styles.disabledIconContainer : styles.iconContainer, style: { height: 70 }, onClick: () => {
+        } }, { children: [_jsx("input", { ref: inputRef, className: 'hidden-input' }), _jsx("div", __assign({ className: disabled
+                    ? styles.disabledIconContainer
+                    : styles.iconContainer, style: { height: 70 }, onClick: function () {
                     if (!disabled)
                         onChange(value === 1 ? null : 1);
-                }, children: _jsx(LikeIcon, { style: {
-                        fontSize: 'inherit',
-                        color: value === 1 ? focusColor : undefined,
-                    } }) }), _jsx("div", { className: disabled ? styles.disabledIconContainer : styles.iconContainer, style: { height: 70 }, onClick: () => {
+                } }, { children: _jsx(ThumbUpRoundedIcon, { fontSize: "inherit", style: value === 1
+                        ? {
+                            color: focusColor,
+                        }
+                        : {} }) })), _jsx("div", __assign({ className: disabled
+                    ? styles.disabledIconContainer
+                    : styles.iconContainer, style: { height: 70 }, onClick: function () {
                     if (!disabled)
                         onChange(value === 0 ? null : 0);
-                }, children: _jsx(DislikeIcon, { style: {
-                        color: value === 0 ? focusColor : undefined,
-                        fontSize: 'inherit',
-                        marginTop: 14,
-                        marginLeft: 15,
-                    } }) })] }));
+                } }, { children: _jsx(ThumbDownRoundedIcon, { fontSize: "inherit", style: value === 0
+                        ? {
+                            color: focusColor,
+                            marginTop: 14,
+                            marginLeft: 15,
+                        }
+                        : { marginTop: 14, marginLeft: 15 } }) }))] })));
 }
 export default LikeRating;

package/dist/Shared/Rating/Ratings/SatisfactionRating.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { RatingProps } from '../Rating';
-declare function SatisfactionRating({ value, inputRef, disabled, onChange }: RatingProps): JSX.Element;
+declare function SatisfactionRating({ value, inputRef, disabled, onChange, focusColor, unSelectedColor, }: RatingProps): JSX.Element;
 export default SatisfactionRating;

package/dist/Shared/Rating/Ratings/SatisfactionRating.js

@@ -1,41 +1,61 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import styles from '../Rating.module.css';
-import VeryDissatisfiedIcon from '../../../Icons/Ratings/VeryDissatisfiedIcon';
-import DissatisfiedIcon from '../../../Icons/Ratings/DissatisfiedIcon';
-import SatisfiedIcon from '../../../Icons/Ratings/SatisfiedIcon';
-import VerySatisfiedIcon from '../../../Icons/Ratings/VerySatisfiedIcon';
-import { useTheme } from '@mui/material';
-function SatisfactionRating({ value, inputRef, disabled, onChange }) {
-    const { palette } = useTheme();
-    const focusColor = palette.primary.main;
-    const unSelectedColor = palette.outline.main;
-    return (_jsxs("div", { className: styles.ratingContainer, style: {
+import SentimentVeryDissatisfiedIcon from '@material-ui/icons/SentimentVeryDissatisfied';
+import SentimentDissatisfiedIcon from '@material-ui/icons/SentimentDissatisfied';
+import SentimentSatisfiedAltIcon from '@material-ui/icons/SentimentSatisfiedAltOutlined';
+import SentimentVerySatisfiedIcon from '@material-ui/icons/SentimentVerySatisfied';
+function SatisfactionRating(_a) {
+    var value = _a.value, inputRef = _a.inputRef, disabled = _a.disabled, onChange = _a.onChange, focusColor = _a.focusColor, unSelectedColor = _a.unSelectedColor;
+    return (_jsxs("div", __assign({ className: styles.ratingContainer, style: {
             '--eureka-primary': focusColor,
             '--eureka-outline': unSelectedColor,
-        }, children: [_jsx("input", { ref: inputRef, className: 'hidden-input' }), _jsx("div", { className: disabled ? styles.disabledIconContainer : styles.iconContainer, onClick: () => {
+        } }, { children: [_jsx("input", { ref: inputRef, className: 'hidden-input' }), _jsx("div", __assign({ className: disabled
+                    ? styles.disabledIconContainer
+                    : styles.iconContainer, onClick: function () {
                     if (!disabled)
                         onChange(value === 1 ? null : 1);
-                }, children: _jsx(VeryDissatisfiedIcon, { style: {
-                        fontSize: 'inherit',
-                        color: value === 1 ? focusColor : undefined,
-                    } }) }), _jsx("div", { className: disabled ? styles.disabledIconContainer : styles.iconContainer, onClick: () => {
+                } }, { children: _jsx(SentimentVeryDissatisfiedIcon, { fontSize: "inherit", style: value === 1
+                        ? {
+                            color: focusColor,
+                        }
+                        : {} }) })), _jsx("div", __assign({ className: disabled
+                    ? styles.disabledIconContainer
+                    : styles.iconContainer, onClick: function () {
                     if (!disabled)
                         onChange(value === 2 ? null : 2);
-                }, children: _jsx(DissatisfiedIcon, { style: {
-                        fontSize: 'inherit',
-                        color: value === 2 ? focusColor : undefined,
-                    } }) }), _jsx("div", { className: disabled ? styles.disabledIconContainer : styles.iconContainer, onClick: () => {
+                } }, { children: _jsx(SentimentDissatisfiedIcon, { fontSize: "inherit", style: value === 2
+                        ? {
+                            color: focusColor,
+                        }
+                        : {} }) })), _jsx("div", __assign({ className: disabled
+                    ? styles.disabledIconContainer
+                    : styles.iconContainer, onClick: function () {
                     if (!disabled)
                         onChange(value === 3 ? null : 3);
-                }, children: _jsx(SatisfiedIcon, { style: {
-                        fontSize: 'inherit',
-                        color: value === 3 ? focusColor : undefined,
-                    } }) }), _jsx("div", { className: disabled ? styles.disabledIconContainer : styles.iconContainer, onClick: () => {
+                } }, { children: _jsx(SentimentSatisfiedAltIcon, { fontSize: "inherit", style: value === 3
+                        ? {
+                            color: focusColor,
+                        }
+                        : {} }) })), _jsx("div", __assign({ className: disabled
+                    ? styles.disabledIconContainer
+                    : styles.iconContainer, onClick: function () {
                     if (!disabled)
                         onChange(value === 4 ? null : 4);
-                }, children: _jsx(VerySatisfiedIcon, { style: {
-                        fontSize: 'inherit',
-                        color: value === 4 ? focusColor : undefined,
-                    } }) })] }));
+                } }, { children: _jsx(SentimentVerySatisfiedIcon, { fontSize: "inherit", style: value === 4
+                        ? {
+                            color: focusColor,
+                        }
+                        : {} }) }))] })));
 }
 export default SatisfactionRating;

package/dist/Shared/Rating/Ratings/ScaleRating.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { RatingProps } from '../Rating';
-declare function ScaleRating({ value, inputRef, disabled, onChange, isMobile }: RatingProps): JSX.Element;
+declare function ScaleRating({ value, inputRef, disabled, onChange, isMobile, focusColor, unSelectedColor, }: RatingProps): JSX.Element;
 export default ScaleRating;

package/dist/Shared/Rating/Ratings/ScaleRating.js

@@ -1,31 +1,62 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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 { Rating } from '@material-ui/lab';
+import GradeRoundedIcon from '@material-ui/icons/GradeRounded';
+import { makeStyles } from '@material-ui/core';
 import React from 'react';
-import StarIcon from '../../../Icons/Ratings/StarIcon';
-import { Rating as MuiRating, styled } from '@mui/material';
-const StyledRating = styled(MuiRating)(({ theme }) => ({
-    '&.Mui-disabled': {
-        opacity: 1,
-    },
-    '& .Erk-MuiRating-iconFilled': {
-        color: theme.palette.primary.main,
-    },
-    '& .Erk-MuiRating-iconEmpty': {
-        color: theme.palette.outline.main,
-    },
-    '& .Erk-MuiRating-visuallyHidden': {
-        display: 'none',
-    },
-}));
-function ScaleRating({ value, inputRef, disabled, onChange, isMobile }) {
-    return (_jsxs(React.Fragment, { children: [_jsx("input", { ref: inputRef, className: 'hidden-input' }), _jsx(StyledRating, { value: value, onChange: (_event, newValue) => {
+var useRatingStyles = function (props) {
+    return makeStyles({
+        root: {
+            '&.Mui-disabled': {
+                opacity: 1,
+            },
+            '& .EF-MuiRating-iconFilled': {
+                color: props.focusColor,
+            },
+            '& .EF-MuiRating-iconEmpty': {
+                color: props.unSelectedColor,
+            },
+        },
+    });
+};
+function ScaleRating(_a) {
+    var value = _a.value, inputRef = _a.inputRef, disabled = _a.disabled, onChange = _a.onChange, isMobile = _a.isMobile, focusColor = _a.focusColor, unSelectedColor = _a.unSelectedColor;
+    var ratingClasses = useRatingStyles({
+        unSelectedColor: unSelectedColor,
+        focusColor: focusColor,
+    })();
+    return (_jsxs(React.Fragment, { children: [_jsx("input", { ref: inputRef, className: 'hidden-input' }), _jsx(Rating, { value: value, onChange: function (_event, newValue) {
                     if (!disabled)
                         onChange(newValue);
-                }, disabled: disabled, size: "large", defaultValue: 0, getLabelText: (value) => value + '/5', max: 5, IconContainerComponent: isMobile ? SmallIconContainer : IconContainer })] }));
+                }, disabled: disabled, classes: ratingClasses, size: "large", defaultValue: 0, getLabelText: function (value) { return value + '/5'; }, max: 5, IconContainerComponent: isMobile ? SmallIconContainer : IconContainer })] }));
 }
-function IconContainer({ value, ...other }) {
-    return (_jsx("span", { className: 'icon' + value, ...other, children: _jsx(StarIcon, { style: { fontSize: 60 } }) }));
+function IconContainer(_a) {
+    var value = _a.value, other = __rest(_a, ["value"]);
+    return (_jsx("span", __assign({ className: 'icon' + value }, other, { children: _jsx(GradeRoundedIcon, { style: { fontSize: 60 } }) })));
 }
-function SmallIconContainer({ value, ...other }) {
-    return (_jsx("span", { className: 'icon' + value, ...other, children: _jsx(StarIcon, { style: { fontSize: 50 } }) }));
+function SmallIconContainer(_a) {
+    var value = _a.value, other = __rest(_a, ["value"]);
+    return (_jsx("span", __assign({ className: 'icon' + value }, other, { children: _jsx(GradeRoundedIcon, { style: { fontSize: 50 } }) })));
 }
 export default ScaleRating;

package/dist/Shared/RoundedButton/RoundedButton.d.ts

@@ -0,0 +1,30 @@
+import React from 'react';
+interface ComponentProps {
+    /** Button text */
+    text: string;
+    /** Background Color */
+    backgroundColor?: string;
+    /** Font Color */
+    color?: string;
+    /** Button Click Handle */
+    onClick: React.MouseEventHandler<HTMLButtonElement>;
+    /** If button is disabled */
+    disabled?: boolean;
+    /** Text font size */
+    fontSize?: number | string;
+    /** Button padding '0 13px 0 13px' format */
+    padding?: string;
+    /** border radius */
+    borderRadius?: number;
+    /** Component height */
+    height?: number;
+    /** If text is bold */
+    bold?: boolean;
+    /** The width of the button */
+    width?: string;
+}
+/**
+ * Generic rounded button
+ */
+declare function RoundedButton({ text, backgroundColor, color, onClick, disabled, fontSize, padding, borderRadius, height, bold, width, }: ComponentProps): JSX.Element;
+export default RoundedButton;

package/dist/Shared/RoundedButton/RoundedButton.js

@@ -0,0 +1,45 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button, withStyles } from '@material-ui/core';
+/**
+ * Generic rounded button
+ */
+function RoundedButton(_a) {
+    var text = _a.text, _b = _a.backgroundColor, backgroundColor = _b === void 0 ? '#3d5a7f' : _b, _c = _a.color, color = _c === void 0 ? '#ffffff' : _c, onClick = _a.onClick, disabled = _a.disabled, _d = _a.fontSize, fontSize = _d === void 0 ? '1rem' : _d, _e = _a.padding, padding = _e === void 0 ? '0 13px 0 13px' : _e, _f = _a.borderRadius, borderRadius = _f === void 0 ? 10 : _f, _g = _a.height, height = _g === void 0 ? 28 : _g, _h = _a.bold, bold = _h === void 0 ? false : _h, _j = _a.width, width = _j === void 0 ? 'fit-content' : _j;
+    var CustomButton = withStyles({
+        root: {
+            width: width,
+            textTransform: 'none',
+            fontFamily: 'inherit',
+            fontSize: fontSize,
+            borderRadius: borderRadius,
+            padding: padding,
+            height: height,
+            boxShadow: 'none',
+            backgroundColor: backgroundColor,
+            color: color,
+            '&:hover': {
+                boxShadow: 'none',
+                backgroundColor: backgroundColor,
+            },
+            '&:disabled': {
+                backgroundColor: backgroundColor,
+                color: color,
+                opacity: 0.5,
+            },
+            fontWeight: bold ? 'bold' : 'normal',
+        },
+    })(Button);
+    return (_jsx(CustomButton, __assign({ variant: "contained", onMouseDown: onClick, disabled: disabled }, { children: text })));
+}
+export default RoundedButton;

package/dist/Shared/RoundedButton/RoundedButton.stories.d.ts

@@ -0,0 +1,23 @@
+import type { StoryObj } from '@storybook/react';
+import RoundedButton from './RoundedButton';
+declare const meta: {
+    component: typeof RoundedButton;
+    tags: string[];
+    args: {
+        text: string;
+        backgroundColor: string;
+        color: string;
+        disabled: false;
+        fontSize: string;
+        padding: string;
+        borderRadius: number;
+        height: number;
+        bold: false;
+        width: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Disabled: Story;
+export declare const DifferentColors: Story;

package/dist/Shared/RoundedButton/RoundedButton.stories.js

@@ -0,0 +1,36 @@
+import RoundedButton from './RoundedButton';
+var meta = {
+    component: RoundedButton,
+    tags: ['autodocs'],
+    args: {
+        text: 'Label',
+        backgroundColor: '#3d5a7f',
+        color: '#ffffff',
+        disabled: false,
+        fontSize: '1rem',
+        padding: '0 13px 0 13px',
+        borderRadius: 10,
+        height: 28,
+        bold: false,
+        width: 'fit-content',
+    },
+};
+export default meta;
+export var Default = {
+    args: {
+        text: 'Label',
+    },
+};
+export var Disabled = {
+    args: {
+        text: 'Label',
+        disabled: true,
+    },
+};
+export var DifferentColors = {
+    args: {
+        text: 'Label',
+        backgroundColor: 'red',
+        color: 'blue',
+    },
+};

package/dist/Shared/RoundedCheckBox/RoundedCheckBox.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import { CheckboxProps } from '@material-ui/core';
+interface StyleProps {
+    error?: boolean;
+    padding?: string;
+    uncheckedColor?: string;
+    checkedColor?: string;
+    checkedHoverColor?: string;
+    errorColor?: string;
+    disabledColor?: string;
+    size?: number | string;
+    cantEdit?: boolean;
+}
+interface ComponentProps extends StyleProps, Omit<CheckboxProps, 'size' | 'onChange'> {
+    onChange?: (checked: boolean) => void;
+    checked: boolean;
+}
+/**
+ * Generic datepicker with apps designs. Is class due to the use in the react-hook-forms library
+ */
+declare class RoundedCheckBox extends React.Component<ComponentProps> {
+    render(): JSX.Element;
+}
+export default RoundedCheckBox;

package/dist/Shared/RoundedCheckBox/RoundedCheckBox.js

@@ -0,0 +1,101 @@
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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 React from 'react';
+import { Checkbox, makeStyles } from '@material-ui/core';
+import CheckBoxRoundedIcon from '@material-ui/icons/CheckBoxRounded';
+import CheckBoxOutlineBlankRoundedIcon from '@material-ui/icons/CheckBoxOutlineBlankRounded';
+var useCheckBoxStyles = function (props) {
+    return makeStyles(function () { return ({
+        root: {
+            padding: props.padding,
+            fontSize: props.size,
+            color: props.error ? props.errorColor : props.uncheckedColor,
+            '&.Mui-checked': {
+                color: props.checkedColor,
+            },
+            '&.Mui-checked:hover': {
+                backgroundColor: props.checkedHoverColor,
+            },
+            '&.Mui-disabled': {
+                cursor: 'default',
+                pointerEvents: 'all !important',
+                color: props.cantEdit
+                    ? props.disabledColor
+                    : props.checkedColor,
+            },
+            '&:hover': {
+                backgroundColor: props.cantEdit
+                    ? 'transparent'
+                    : props.checkedHoverColor,
+            },
+        },
+    }); });
+};
+/**
+ * Generic rounded checkbox
+ */
+function CustomCheckBox(_a) {
+    var _b = _a.padding, padding = _b === void 0 ? '9px' : _b, onChange = _a.onChange, _c = _a.error, error = _c === void 0 ? false : _c, _d = _a.size, size = _d === void 0 ? '1.5rem' : _d, _e = _a.checkedColor, checkedColor = _e === void 0 ? '#3d5a7f' : _e, _f = _a.uncheckedColor, uncheckedColor = _f === void 0 ? '#787878' : _f, _g = _a.disabledColor, disabledColor = _g === void 0 ? '#A0A0A0' : _g, _h = _a.errorColor, errorColor = _h === void 0 ? '#cc2936' : _h, _j = _a.cantEdit, cantEdit = _j === void 0 ? false : _j, checked = _a.checked, others = __rest(_a, ["padding", "onChange", "error", "size", "checkedColor", "uncheckedColor", "disabledColor", "errorColor", "cantEdit", "checked"]);
+    var classes = useCheckBoxStyles({
+        size: size,
+        error: error,
+        padding: padding,
+        cantEdit: cantEdit,
+        errorColor: errorColor,
+        checkedColor: checkedColor,
+        disabledColor: disabledColor,
+        uncheckedColor: uncheckedColor,
+        checkedHoverColor: checkedColor + '0a',
+    })();
+    return (_jsx(Checkbox, __assign({}, others, { disabled: cantEdit, classes: classes, checked: checked, onChange: function (event) { return onChange === null || onChange === void 0 ? void 0 : onChange(event.target.checked); }, required: true, icon: _jsx(CheckBoxOutlineBlankRoundedIcon, { fontSize: "inherit" }), checkedIcon: _jsx(CheckBoxRoundedIcon, { fontSize: "inherit" }) })));
+}
+/**
+ * Generic datepicker with apps designs. Is class due to the use in the react-hook-forms library
+ */
+var RoundedCheckBox = /** @class */ (function (_super) {
+    __extends(RoundedCheckBox, _super);
+    function RoundedCheckBox() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    RoundedCheckBox.prototype.render = function () {
+        return _jsx(CustomCheckBox, __assign({}, this.props));
+    };
+    return RoundedCheckBox;
+}(React.Component));
+export default RoundedCheckBox;