@arquimedes.co/eureka-forms 3.0.10-refactor → 3.0.14-refactor

package/dist/Form/Terms/Term/MaterialTerm/MaterialTerm.js

@@ -54,7 +54,7 @@ function TermComponent({ term, tempError }) {
                                 setShowDialog(false);
                             }, children: _jsx(CloseIcon, { style: { fontSize: 'inherit' } }) }), _jsx("div", { className: styles.dialogTitle, style: {
                                 borderBottom: '1px solid ' + formStyle.primaryColor,
-                            }, children: term.clickEffect.title }), _jsx("div", { className: styles.dialogContentContainer, children: term.clickEffect.text }), _jsx(ErkButton, { text: 'Aceptar', padding: "20px 15px", backgroundColor: formStyle.primaryColor, color: formStyle.primaryContrastColor, fontSize: 20, onClick: () => {
+                            }, children: term.clickEffect.title }), _jsx("div", { className: styles.dialogContentContainer, children: term.clickEffect.text }), _jsx(ErkButton, { text: 'Aceptar', sx: { padding: '20px 15px', fontSize: '20px' }, onClick: () => {
                                 setShowDialog(false);
                                 if (!postview) {
                                     field.onChange(true);

package/dist/FormSteps/@Construction/CBRIncidentsStep/MaterialCBRIncidentsStep/MaterialCBRIncidentsStep.js

@@ -100,7 +100,7 @@ function CBRIncidentsStep({ step, editable, ...others }) {
                             }
                         }
                         onChange(tempIncidents);
-                    }, ...others }, index))) }), _jsxs("div", { className: styles.btnContainer, children: [_jsx("input", { ref: ref, className: 'hidden-input' }), _jsx(ErkButton, { disabled: !editable || postview, text: step.addBtnLabel + (step.required ? ' *' : ''), color: formStyle.primaryContrastColor, backgroundColor: formStyle.primaryColor, fontSize: '1rem', padding: '5px 15px 5px 15px', onClick: () => {
+                    }, ...others }, index))) }), _jsxs("div", { className: styles.btnContainer, children: [_jsx("input", { ref: ref, className: 'hidden-input' }), _jsx(ErkButton, { disabled: !editable || postview, text: step.addBtnLabel + (step.required ? ' *' : ''), sx: { padding: '5px 15px' }, onClick: () => {
                             if (editable && !postview) {
                                 handleAddIncident();
                             }

package/dist/FormSteps/@Construction/CBRPropertyStep/CBRPropertyStep.js

@@ -74,8 +74,6 @@ function CBRPropertyStepComponent(props) {
                     },
                 }, open: true, children: _jsxs("div", { className: styles.confirmationContainer, style: { color: formStyle.textColor }, children: [_jsx("div", { className: styles.closeIcon, onClick: () => {
                                 setShowWarning(undefined);
-                            }, children: _jsx(CloseIcon, { style: { fontSize: 'inherit' } }) }), _jsxs("div", { className: styles.container, children: [_jsx("div", { className: styles.warningContainer, style: { color: formStyle.primaryColor }, children: _jsx(WarningIcon, { style: { fontSize: '160px' } }) }), _jsxs("div", { className: styles.messageContainer, children: ["La garant\u00EDa de su inmueble expir\u00F3 el d\u00EDa ", showWarning.toLocaleDateString(), "."] }), _jsx("div", { className: styles.btnContainer, children: _jsx(ErkButton, { text: 'Continuar', color: formStyle.primaryContrastColor, backgroundColor: formStyle.primaryColor, fontSize: '1rem', padding: '5px 15px 5px 15px', onClick: () => {
-                                            setShowWarning(undefined);
-                                        } }) })] })] }) }))] }));
+                            }, children: _jsx(CloseIcon, { style: { fontSize: 'inherit' } }) }), _jsxs("div", { className: styles.container, children: [_jsx("div", { className: styles.warningContainer, style: { color: formStyle.primaryColor }, children: _jsx(WarningIcon, { style: { fontSize: '160px' } }) }), _jsxs("div", { className: styles.messageContainer, children: ["La garant\u00EDa de su inmueble expir\u00F3 el d\u00EDa ", showWarning.toLocaleDateString(), "."] }), _jsx("div", { className: styles.btnContainer, children: _jsx(ErkButton, { text: 'Continuar', sx: { padding: '5px 15px' }, onClick: () => setShowWarning(undefined) }) })] })] }) }))] }));
 }
 export default CBRPropertyStepComponent;

package/dist/FormSteps/CheckBoxStep/MaterialCheckBoxStep/MaterialCheckBoxStep.js

@@ -35,7 +35,7 @@ function CheckBoxStep({ step, editable }) {
                                 height: step.size < 4 ? 31 : undefined,
                                 minHeight: 31,
                                 alignItems: step.isList ? 'start' : 'center',
-                            }, children: [step.label && !step.isList && renderLabel(true), _jsx(ErkCheckBox, { ...field, padding: "0px", size: "1.6rem", inputRef: ref, error: !!error, checked: value, onChange: onChange, "data-testid": step.id, readOnly: !editable || postview }), step.label && step.isList && renderLabel()] }), (step.description ?? !!error) && (_jsx("div", { className: styles.descriptionPar, style: {
+                            }, children: [step.label && !step.isList && renderLabel(true), _jsx(ErkCheckBox, { ...field, padding: "0px", inputRef: ref, error: !!error, checked: value, onChange: onChange, "data-testid": step.id, readOnly: !editable || postview }), step.label && step.isList && renderLabel()] }), (step.description ?? !!error) && (_jsx("div", { className: styles.descriptionPar, style: {
                                 color: error ? formStyle.errorColor : formStyle.descriptionTextColor,
                             }, children: error ? 'Este campo es obligatorio' : step.description }))] }) }), renderNested()] }));
 }

package/dist/FormSteps/EntityValueStep/MaterialEntityValuePickerStep/MaterialEntityValueDialog/MaterialEntityValueDialog.js

@@ -26,6 +26,6 @@ function MaterialEntityValueDialog({ type, entity, message, entityValue, handleC
             },
         }, open: true, children: _jsxs("div", { className: styles.confirmationContainer, style: { color: formStyle.textColor }, children: [_jsx("div", { className: styles.closeIcon, onClick: () => handleClose(), children: _jsx(CloseIcon, { style: { fontSize: 'inherit' } }) }), _jsxs("div", { className: styles.container, children: [_jsxs("div", { className: styles.contentContainer, children: [_jsx("div", { className: styles.warningContainer, style: {
                                         color: type === 'INFO' ? formStyle.primaryColor : formStyle.errorColor,
-                                    }, children: type === 'INFO' ? (_jsx(InfoIcon, { style: { fontSize: '160px' } })) : (_jsx(WarningIcon, { style: { fontSize: '160px' } })) }), _jsx("div", { className: styles.messageContainer, children: _jsx(Editor, { editorClassName: 'Erk-Forms-Dialog', editorState: editorState, readOnly: true, toolbarHidden: true }) })] }), _jsx("div", { className: styles.btnContainer, children: _jsx(ErkButton, { text: 'Continuar', color: formStyle.primaryContrastColor, backgroundColor: type === 'INFO' ? formStyle.primaryColor : formStyle.errorColor, fontSize: '1.2rem', height: undefined, padding: '16px 20px', onClick: () => handleClose() }) })] })] }) }));
+                                    }, children: type === 'INFO' ? (_jsx(InfoIcon, { style: { fontSize: '160px' } })) : (_jsx(WarningIcon, { style: { fontSize: '160px' } })) }), _jsx("div", { className: styles.messageContainer, children: _jsx(Editor, { editorClassName: 'Erk-Forms-Dialog', editorState: editorState, readOnly: true, toolbarHidden: true }) })] }), _jsx("div", { className: styles.btnContainer, children: _jsx(ErkButton, { text: 'Continuar', onClick: () => handleClose(), sx: { padding: '16px 20px', fontSize: '1.2rem' } }) })] })] }) }));
 }
 export default MaterialEntityValueDialog;

package/dist/FormSteps/FileUploadStep/MaterialFileUploadStep/MaterialFileUploadStep.js

@@ -142,7 +142,7 @@ function FileUploadStep({ step, editable }) {
                         }
                         inputRef.current.value = '';
                     }
-                }, multiple: true, accept: getAcceptedExtensions() }), _jsxs("div", { className: styles.btnContainer, children: [_jsx("input", { ref: ref, className: 'hidden-input' }), _jsx(ErkButton, { disabled: !editable || postview, text: 'Examinar' + (step.required ? ' *' : ''), color: formStyle.primaryContrastColor, backgroundColor: formStyle.primaryColor, fontSize: '1rem', padding: '5px 15px 5px 15px', onClick: () => {
+                }, multiple: true, accept: getAcceptedExtensions() }), _jsxs("div", { className: styles.btnContainer, children: [_jsx("input", { ref: ref, className: 'hidden-input' }), _jsx(ErkButton, { disabled: !editable || postview, text: 'Examinar' + (step.required ? ' *' : ''), sx: { padding: '5px 15px' }, onClick: () => {
                             if (editable && !postview) {
                                 const input = inputRef.current;
                                 if (input !== null) {

package/dist/FormSteps/MapperStep/MaterialMapperStep/MaterialMapperStep.js

@@ -61,7 +61,7 @@ function MapperComponent({ form, step, error, value, loading, inputRef, editable
     return (_jsxs("div", { className: container, style: { color: formStyle.textColor }, "data-testid": step.id, id: step.id, children: [step.label && _jsx("div", { className: styles.titleLbl, children: step.label }), step.description && (_jsx("p", { className: styles.descriptionPar, style: {
                     margin: step.description ? '10px 0px' : '0px 0px 5px 0px',
                 }, children: step.description })), mapElements(), _jsx("input", { id: step.id + '-input', ref: inputRef, className: 'hidden-input', readOnly: true, value: inputValue }), step.creatable !== false &&
-                (!step.max || elements.filter((elem) => !elem.deleted).length < step.max) && (_jsxs("div", { className: styles.btnContainer, children: [!customAdd && (_jsx(ErkButton, { disabled: !editable || postview, text: step.addBtnLabel + (step.required ? ' *' : ''), color: formStyle.primaryContrastColor, backgroundColor: formStyle.primaryColor, fontSize: '1rem', padding: '5px 15px 5px 15px', onClick: () => {
+                (!step.max || elements.filter((elem) => !elem.deleted).length < step.max) && (_jsxs("div", { className: styles.btnContainer, children: [!customAdd && (_jsx(ErkButton, { disabled: !editable || postview, text: step.addBtnLabel + (step.required ? ' *' : ''), sx: { padding: '5px 15px' }, onClick: () => {
                             if (editable && !postview) {
                                 handleAddElement();
                             }

package/dist/FormSteps/TextAreaStep/MaterialTextAreaStep/MaterialTextAreaStep.js

@@ -14,7 +14,7 @@ function TextAreaStep({ step, editable, maxLength }) {
         },
     });
     return (_jsxs("div", { className: styles.container, style: {
-            paddingBottom: step.required || step.description || !!error ? '0px' : '5px',
+            paddingBottom: step.required || step.description || !!error ? '0px' : '12px',
         }, children: [_jsx("div", { className: styles.erkTextArea, children: _jsx(ErkTextField, { ...field, multiline: true, value: value, inputRef: ref, error: !!error, labelMargin: 0, label: step.label, onChange: onChange, "data-testid": step.id, maxLength: maxLength, required: step.required, disabled: !editable || postview, minRows: postview && partial ? undefined : 4, helperText: error?.message ?? step.description ?? (step.required ? ' ' : null) }) }), _jsxs("div", { className: styles.print, children: [value && (_jsxs(React.Fragment, { children: [_jsx("div", { className: styles.printLbl, style: {
                                     color: formStyle.descriptionTextColor,
                                 }, children: step.label }), _jsx("div", { className: styles.printLine, style: {

package/dist/Shared/ErkButton/ErkButton.d.ts

@@ -1,31 +1,25 @@
-import React from 'react';
 import { ButtonProps as MuiButtonProps } from '@mui/material';
-interface ButtonProps extends Omit<MuiButtonProps, 'color'> {
+declare module '@mui/material/Button' {
+    interface ButtonPropsColorOverrides {
+        inherit: false;
+    }
+}
+export interface ErkButtonProps extends Omit<MuiButtonProps, 'color' | 'onSubmit' | 'ref'> {
     /** Button text */
-    text: string;
-    /** Background Color */
-    backgroundColor?: string;
-    /** Font Color */
-    color?: string;
+    text?: string;
+    /** The color of the button */
+    color?: 'primary' | 'secondary' | 'error' | 'warning';
     /** 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;
+    /** If the button es loading */
+    loading?: boolean;
+    /** The href to redirect */
+    buttonRef?: React.Ref<HTMLButtonElement>;
 }
 /**
  * Generic capta button
  */
-declare function ErkButton({ text, color, ...props }: ButtonProps): JSX.Element;
+declare function ErkButton({ text, color, loading, children, disabled, buttonRef, ...props }: ErkButtonProps): JSX.Element;
 export default ErkButton;

package/dist/Shared/ErkButton/ErkButton.js

@@ -1,31 +1,31 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Button as MuiButton, styled } from '@mui/material';
-const StyledButton = styled(MuiButton)(({ height = 28, bold = false, fontColor = '#ffffff', fontSize = '1rem', borderRadius = 10, width = 'fit-content', padding = '0 13px 0 13px', backgroundColor = '#3d5a7f', }) => ({
-    width,
+import Loader from '../Loader/Loader';
+const StyledButton = styled(MuiButton)(({ theme, color }) => ({
+    width: 'fit-content',
     textTransform: 'none',
     fontFamily: 'inherit',
-    fontSize,
-    borderRadius,
-    padding,
-    height: height,
+    fontSize: '1rem',
+    borderRadius: 10,
+    padding: '0 13px 0 13px',
+    minHeight: 28,
     boxShadow: 'none',
-    backgroundColor,
-    color: fontColor,
-    '&:hover': {
-        boxShadow: 'none',
-        backgroundColor,
-    },
+    '&:hover': { boxShadow: 'none' },
     '&:disabled': {
-        backgroundColor,
-        color: fontColor,
+        backgroundColor: theme.palette[color ?? 'primary']?.main,
+        color: theme.palette[color ?? 'primary']?.contrastText,
         opacity: 0.5,
     },
-    fontWeight: bold ? 'bold' : 'normal',
+    fontWeight: 'normal',
 }));
 /**
  * Generic capta button
  */
-function ErkButton({ text, color, ...props }) {
-    return (_jsx(StyledButton, { text: '', fontColor: color, variant: "contained", ...props, children: text }));
+function ErkButton({ text, color = 'primary', loading, children, disabled, buttonRef, ...props }) {
+    return (_jsxs(StyledButton, { text: '', ref: buttonRef, variant: "contained", disabled: disabled ?? loading, color: color, ...props, children: [loading && _jsx(Loader, { size: 20, color: 'white' }), text && (_jsx("label", { style: {
+                    visibility: loading ? 'hidden' : 'visible',
+                    fontSize: 'inherit',
+                    cursor: 'inherit',
+                }, children: text })), _jsx("div", { style: { visibility: loading ? 'hidden' : 'visible' }, children: children })] }));
 }
 export default ErkButton;

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

@@ -5,15 +5,7 @@ declare const meta: {
     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;

package/dist/Shared/ErkButton/ErkButton.stories.js

@@ -4,15 +4,7 @@ const meta = {
     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;
@@ -30,7 +22,5 @@ export const Disabled = {
 export const DifferentColors = {
     args: {
         text: 'Label',
-        backgroundColor: 'red',
-        color: 'blue',
     },
 };

package/dist/Shared/ErkCheckbox/ErkCheckBox.d.ts

@@ -1,7 +1,7 @@
-import React, { CSSProperties } from 'react';
+import React from 'react';
 import { CheckboxProps as MuiCheckboxProps } from '@mui/material';
 interface StyleProps {
-    size?: CSSProperties['fontSize'];
+    size?: 'small' | 'medium';
     padding?: string;
     error?: number;
 }

package/dist/Shared/ErkCheckbox/ErkCheckBox.js

@@ -3,9 +3,10 @@ import React from 'react';
 import CheckboxUncheckedIcon from '../../Icons/CheckboxUncheckedIcon';
 import CheckboxCheckedIcon from '../../Icons/CheckboxCheckedIcon';
 import { FormControl, Checkbox as MuiCheckbox, styled } from '@mui/material';
-const StyledCheckbox = styled(MuiCheckbox)(({ theme, size = '1.5rem', padding = '9px', disabled, readOnly, error }) => ({
-    padding: padding,
-    fontSize: size,
+const StyledCheckbox = styled(MuiCheckbox, { shouldForwardProp: (prop) => prop !== 'size' })(({ theme, padding = '0px', size = 'small', disabled, readOnly, error }) => ({
+    padding,
+    width: size === 'small' ? 26 : 32,
+    height: size === 'small' ? 26 : 32,
     opacity: disabled ? 0.5 : 1,
     pointerEvents: readOnly ? 'none' : undefined,
     color: error ? theme.palette.error.main : '#787878',
@@ -17,7 +18,7 @@ const StyledCheckbox = styled(MuiCheckbox)(({ theme, size = '1.5rem', padding =
  * Generic capta checkbox
  */
 function CustomCheckBox({ onChange, error = false, readOnly = false, disabled = false, ...others }) {
-    return (_jsx(FormControl, { error: true, children: _jsx(StyledCheckbox, { ...others, error: +error, readOnly: readOnly, disabled: disabled, inputProps: { disabled: disabled || readOnly }, icon: _jsx(CheckboxUncheckedIcon, { style: { fontSize: 'inherit' } }), checkedIcon: _jsx(CheckboxCheckedIcon, { style: { fontSize: 'inherit' } }), onChange: (event) => onChange?.(typeof event === 'boolean' ? event : event.target.checked) }) }));
+    return (_jsx(FormControl, { error: true, children: _jsx(StyledCheckbox, { ...others, error: +error, readOnly: readOnly, disabled: disabled, inputProps: { disabled: disabled || readOnly }, icon: _jsx(CheckboxUncheckedIcon, {}), checkedIcon: _jsx(CheckboxCheckedIcon, {}), onChange: (event) => onChange?.(typeof event === 'boolean' ? event : event.target.checked) }) }));
 }
 /**
  * Generic datepicker with apps designs. Is class due to the use in the react-hook-forms library

package/dist/Shared/ErkCheckbox/ErkCheckBox.stories.d.ts

@@ -3,9 +3,6 @@ import ErkCheckBox from './ErkCheckBox';
 declare const meta: {
     component: typeof ErkCheckBox;
     tags: string[];
-    args: {
-        size: string;
-    };
 };
 export default meta;
 type Story = StoryObj<typeof meta>;

package/dist/Shared/ErkCheckbox/ErkCheckBox.stories.js

@@ -2,9 +2,6 @@ import ErkCheckBox from './ErkCheckBox';
 const meta = {
     component: ErkCheckBox,
     tags: ['autodocs'],
-    args: {
-        size: '1.5rem',
-    },
 };
 export default meta;
 export const Uncheked = {

package/dist/Shared/ErkPhoneInput/EkrPhoneInput.js

@@ -14,6 +14,9 @@ const StyledSelect = styled(Select)(() => ({
     input: {
         padding: 0,
     },
+    '& .Erk-MuiSelect-select': {
+        height: '20px',
+    },
     '& .Erk-MuiSelect-select.Erk-MuiInputBase-inputSizeSmall': {
         paddingBottom: 0,
         borderBottom: 'none',

package/dist/Shared/ErkSmartSelect/ErkSmartSelect.js

@@ -52,6 +52,6 @@ export default function ErkSmartSelect({ options, value = '', onChange, label, g
             }, renderInput: (params) => (_jsx(StyledTextField, { ...params, size: size, label: label, labelMargin: 0, name: others.name, readOnly: readOnly, disabled: disabled, inputRef: inputRef, error: others.error, onBlur: others.onBlur, required: others.required, helperText: others.helperText })) }));
     }
     else {
-        return (_jsxs(ErkSelect, { ...others, labelMargin: 0, inputRef: inputRef, onChange: (value) => onChange?.(options?.find((option) => getValueString(option) === value)), value: loading ? '' : getValueString(value), label: label, IconComponent: loading ? () => _jsx(CircularProgress, { size: 22 }) : IconComponent, children: [_jsx(ErkMenuItem, { value: '', "data-testid": 'smart-select-empty', children: _jsx("em", { children: options ? 'Sin Seleccionar' : 'Cargando...' }) }, 'EMPTY'), options?.map((option) => (_jsx(ErkMenuItem, { value: getValueString(option), "data-testid": 'smart-select-' + getValueString(option), children: option.label }, getValueString(option)))), options === undefined && value && !loading && (_jsx(ErkMenuItem, { value: getValueString(value), children: value.label ?? '' }, getValueString(value)))] }));
+        return (_jsxs(ErkSelect, { ...others, labelMargin: 0, inputRef: inputRef, onChange: (value) => onChange?.(options?.find((option) => getValueString(option) === value)), value: loading ? '' : getValueString(value), label: label, IconComponent: loading ? () => _jsx(CircularProgress, { size: 22 }) : IconComponent, children: [options?.map((option) => (_jsx(ErkMenuItem, { value: getValueString(option), "data-testid": 'smart-select-' + getValueString(option), children: option.label }, getValueString(option)))), options === undefined && value && !loading && (_jsx(ErkMenuItem, { value: getValueString(value), children: value.label ?? '' }, getValueString(value)))] }));
     }
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@arquimedes.co/eureka-forms",
   "repository": "git://github.com/Arquimede5/Eureka-Forms.git",
-  "version":"3.0.10-refactor",
+  "version":"3.0.14-refactor",
   "scripts": {
     "watch": "tsc --noEmit --watch --project tsconfig.app.json",
     "start": "vite",