@arquimedes.co/eureka-forms 0.1.2 → 0.2.5

package/dist/FormComponents/Step/TextAreaStep/TextAreaStep.js

@@ -1,25 +1,25 @@
-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 { FormStyleTypes } from '../../../constants/FormStepTypes';
-import MaterialTextAreaStep from './MaterialTextAreaStep/MaterialTextAreaStep';
-function TextAreaStep(props) {
-    switch (props.formStyle.type) {
-        case FormStyleTypes.MATERIAL: {
-            return _jsx(MaterialTextAreaStep, __assign({}, props), void 0);
-        }
-        default: {
-            return _jsx(MaterialTextAreaStep, __assign({}, props), void 0);
-        }
-    }
-}
-export default TextAreaStep;
+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 { FormStyleTypes } from '../../../constants/FormStepTypes';
+import MaterialTextAreaStep from './MaterialTextAreaStep/MaterialTextAreaStep';
+function TextAreaStep(props) {
+    switch (props.formStyle.type) {
+        case FormStyleTypes.MATERIAL: {
+            return _jsx(MaterialTextAreaStep, __assign({}, props), void 0);
+        }
+        default: {
+            return _jsx(MaterialTextAreaStep, __assign({}, props), void 0);
+        }
+    }
+}
+export default TextAreaStep;

package/dist/FormComponents/Step/TextInputStep/MaterialTextInputStep/MaterialTextInputStep.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
-import { TextInputStepProps } from '../TextInputStep';
-declare function TextInputStep({ step, form, postview, formStyle, widthStats, control, errors, }: TextInputStepProps): JSX.Element;
-export default TextInputStep;
+/// <reference types="react" />
+import { TextInputStepProps } from '../TextInputStep';
+declare function TextInputStep({ step, form, postview, formStyle, widthStats, control, errors, }: TextInputStepProps): JSX.Element;
+export default TextInputStep;

package/dist/FormComponents/Step/TextInputStep/MaterialTextInputStep/MaterialTextInputStep.js

@@ -1,43 +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 } from "react/jsx-runtime";
-import RoundedTextField from '../../../../shared/RoundedTextField/RoundedTextField';
-import styles from './MaterialTextInputStep.module.css';
-import { Controller } from 'react-hook-form';
-import { calcStepWidth } from '../../StepFunctions';
-function TextInputStep(_a) {
-    var step = _a.step, form = _a.form, postview = _a.postview, formStyle = _a.formStyle, widthStats = _a.widthStats, control = _a.control, errors = _a.errors;
-    return (_jsx("div", __assign({ className: styles.container, style: {
-            width: widthStats.currentBreakPoint <= step.size
-                ? '100%'
-                : calcStepWidth(step.size, form),
-            minHeight: step.description || step.required || step.validation
-                ? '55px'
-                : '43px',
-        } }, { children: _jsx(Controller, { name: step.id, control: control, defaultValue: "", rules: {
-                required: step.required
-                    ? 'Este campo es obligatorio'
-                    : undefined,
-                pattern: step.validation
-                    ? {
-                        value: new RegExp(step.validation.value),
-                        message: step.validation.message,
-                    }
-                    : undefined,
-            }, shouldUnregister: true, render: function (_a) {
-                var field = _a.field;
-                return (_jsx(RoundedTextField, __assign({}, field, { label: step.label, cantEdit: postview, required: step.required, fontWeight: 400, focusColor: formStyle.primaryColor, outlineColor: formStyle.outlineColor, textColor: formStyle.textColor, errorColor: formStyle.errorColor, backgroundColor: formStyle.backgroundColor, innerBackgroundColor: formStyle.stepBackgroundColor, helperText: errors[step.id]
-                        ? errors[step.id].message
-                        : step.description, error: !!errors[step.id] }), void 0));
-            } }, void 0) }), void 0));
-}
-export default TextInputStep;
+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 RoundedTextField from '../../../../shared/RoundedTextField/RoundedTextField';
+import styles from './MaterialTextInputStep.module.css';
+import { Controller } from 'react-hook-form';
+import { calcStepWidth } from '../../StepFunctions';
+function TextInputStep(_a) {
+    var step = _a.step, form = _a.form, postview = _a.postview, formStyle = _a.formStyle, widthStats = _a.widthStats, control = _a.control, errors = _a.errors;
+    return (_jsx("div", __assign({ className: styles.container, style: {
+            width: widthStats.currentBreakPoint <= step.size
+                ? '100%'
+                : calcStepWidth(step.size, form),
+            minHeight: step.description || step.required || step.validation
+                ? '55px'
+                : '43px',
+        } }, { children: _jsx(Controller, { name: step.id, control: control, defaultValue: "", rules: {
+                required: step.required
+                    ? 'Este campo es obligatorio'
+                    : undefined,
+                pattern: step.validation
+                    ? {
+                        value: new RegExp(step.validation.value),
+                        message: step.validation.message,
+                    }
+                    : undefined,
+            }, shouldUnregister: true, render: function (_a) {
+                var field = _a.field;
+                return (_jsx(RoundedTextField, __assign({}, field, { label: step.label, cantEdit: postview, required: step.required, fontWeight: 400, focusColor: formStyle.primaryColor, outlineColor: formStyle.outlineColor, textColor: formStyle.textColor, errorColor: formStyle.errorColor, backgroundColor: formStyle.backgroundColor, innerBackgroundColor: formStyle.stepBackgroundColor, helperText: errors[step.id]
+                        ? errors[step.id].message
+                        : step.description, error: !!errors[step.id] }), void 0));
+            } }, void 0) }), void 0));
+}
+export default TextInputStep;

package/dist/FormComponents/Step/TextInputStep/MaterialTextInputStep/MaterialTextInputStep.module.css

@@ -0,0 +1,9 @@
+.container {
+    width: fit-content;
+    max-width: 100%;
+    display: flex;
+    padding: 10px;
+    padding-bottom: 0px;
+    padding-top: 5px;
+    margin-bottom: 0px;
+}

package/dist/FormComponents/Step/TextInputStep/TextInputStep.d.ts

@@ -1,9 +1,9 @@
-/// <reference types="react" />
-import { TextInput } from '../../../@Types/FormStep';
-import { StepProps } from '../Step';
-export interface TextInputStepProps extends StepProps {
-    /** The TextInputStep to display */
-    step: TextInput;
-}
-declare function TextInputStep(props: TextInputStepProps): JSX.Element;
-export default TextInputStep;
+/// <reference types="react" />
+import { TextInput } from '../../../@Types/FormStep';
+import { StepProps } from '../Step';
+export interface TextInputStepProps extends StepProps {
+    /** The TextInputStep to display */
+    step: TextInput;
+}
+declare function TextInputStep(props: TextInputStepProps): JSX.Element;
+export default TextInputStep;

package/dist/FormComponents/Step/TextInputStep/TextInputStep.js

@@ -1,25 +1,25 @@
-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 { FormStyleTypes } from '../../../constants/FormStepTypes';
-import MaterialTextInputStep from './MaterialTextInputStep/MaterialTextInputStep';
-function TextInputStep(props) {
-    switch (props.formStyle.type) {
-        case FormStyleTypes.MATERIAL: {
-            return _jsx(MaterialTextInputStep, __assign({}, props), void 0);
-        }
-        default: {
-            return _jsx(MaterialTextInputStep, __assign({}, props), void 0);
-        }
-    }
-}
-export default TextInputStep;
+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 { FormStyleTypes } from '../../../constants/FormStepTypes';
+import MaterialTextInputStep from './MaterialTextInputStep/MaterialTextInputStep';
+function TextInputStep(props) {
+    switch (props.formStyle.type) {
+        case FormStyleTypes.MATERIAL: {
+            return _jsx(MaterialTextInputStep, __assign({}, props), void 0);
+        }
+        default: {
+            return _jsx(MaterialTextInputStep, __assign({}, props), void 0);
+        }
+    }
+}
+export default TextInputStep;

package/dist/FormComponents/Step/TitleStep/MaterialTitleStep/MaterialTitleStep.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
-import { TitleStepProps } from '../TitleStep';
-declare function TitleStep({ step, formStyle }: TitleStepProps): JSX.Element;
-export default TitleStep;
+/// <reference types="react" />
+import { TitleStepProps } from '../TitleStep';
+declare function TitleStep({ step, formStyle }: TitleStepProps): JSX.Element;
+export default TitleStep;

package/dist/FormComponents/Step/TitleStep/MaterialTitleStep/MaterialTitleStep.js

@@ -1,18 +1,18 @@
-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 './MaterialTitleStep.module.css';
-function TitleStep(_a) {
-    var step = _a.step, formStyle = _a.formStyle;
-    return (_jsxs("div", __assign({ className: styles.container, style: { color: formStyle.textColor } }, { children: [_jsx("div", __assign({ className: styles.titleLbl }, { children: step.title }), void 0), step.description && (_jsx("p", __assign({ className: styles.descriptionPar }, { children: step.description }), void 0))] }), void 0));
-}
-export default TitleStep;
+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 './MaterialTitleStep.module.css';
+function TitleStep(_a) {
+    var step = _a.step, formStyle = _a.formStyle;
+    return (_jsxs("div", __assign({ className: styles.container, style: { color: formStyle.textColor } }, { children: [_jsx("div", __assign({ className: styles.titleLbl }, { children: step.title }), void 0), step.description && (_jsx("p", __assign({ className: styles.descriptionPar }, { children: step.description }), void 0))] }), void 0));
+}
+export default TitleStep;

package/dist/FormComponents/Step/TitleStep/MaterialTitleStep/MaterialTitleStep.module.css

@@ -0,0 +1,35 @@
+.container {
+    display: flex;
+    flex-direction: column;
+    width: 900px;
+    margin-bottom: 10px;
+    padding: 10px;
+    padding-bottom: 0px;
+    padding-top: 5px;
+    margin-bottom: 5px;
+}
+
+.titleLbl {
+    font-size: 24px;
+    font-weight: 600;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    -moz-user-select: none;
+    -khtml-user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+
+.descriptionPar {
+    font-size: 16px;
+    margin: 0px;
+    white-space: pre-wrap;
+    margin-top: 15px;
+    -moz-user-select: none;
+    -khtml-user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}

package/dist/FormComponents/Step/TitleStep/TitleStep.d.ts

@@ -1,9 +1,9 @@
-/// <reference types="react" />
-import { Title } from '../../../@Types/FormStep';
-import { StepProps } from '../Step';
-export interface TitleStepProps extends StepProps {
-    /** The TitleStep to display */
-    step: Title;
-}
-declare function TitleStep({ step, formStyle, ...others }: TitleStepProps): JSX.Element;
-export default TitleStep;
+/// <reference types="react" />
+import { Title } from '../../../@Types/FormStep';
+import { StepProps } from '../Step';
+export interface TitleStepProps extends StepProps {
+    /** The TitleStep to display */
+    step: Title;
+}
+declare function TitleStep({ step, formStyle, ...others }: TitleStepProps): JSX.Element;
+export default TitleStep;

package/dist/FormComponents/Step/TitleStep/TitleStep.js

@@ -1,37 +1,37 @@
-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 { FormStyleTypes } from '../../../constants/FormStepTypes';
-import MaterialTitleStep from './MaterialTitleStep/MaterialTitleStep';
-function TitleStep(_a) {
-    var step = _a.step, formStyle = _a.formStyle, others = __rest(_a, ["step", "formStyle"]);
-    switch (formStyle.type) {
-        case FormStyleTypes.MATERIAL: {
-            return (_jsx(MaterialTitleStep, __assign({ step: step, formStyle: formStyle }, others), void 0));
-        }
-        default: {
-            return (_jsx(MaterialTitleStep, __assign({ step: step, formStyle: formStyle }, others), void 0));
-        }
-    }
-}
-export default TitleStep;
+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 { FormStyleTypes } from '../../../constants/FormStepTypes';
+import MaterialTitleStep from './MaterialTitleStep/MaterialTitleStep';
+function TitleStep(_a) {
+    var step = _a.step, formStyle = _a.formStyle, others = __rest(_a, ["step", "formStyle"]);
+    switch (formStyle.type) {
+        case FormStyleTypes.MATERIAL: {
+            return (_jsx(MaterialTitleStep, __assign({ step: step, formStyle: formStyle }, others), void 0));
+        }
+        default: {
+            return (_jsx(MaterialTitleStep, __assign({ step: step, formStyle: formStyle }, others), void 0));
+        }
+    }
+}
+export default TitleStep;

package/dist/FormComponents/Term/MaterialTerm/MaterialTerm.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
-import { TermComponentProps } from '../Term';
-declare function TermComponent({ term, errors, control, postview, setValue, formStyle, tempError, }: TermComponentProps): JSX.Element;
-export default TermComponent;
+/// <reference types="react" />
+import { TermComponentProps } from '../Term';
+declare function TermComponent({ term, errors, control, postview, setValue, formStyle, tempError, }: TermComponentProps): JSX.Element;
+export default TermComponent;

package/dist/FormComponents/Term/MaterialTerm/MaterialTerm.js

@@ -1,77 +1,77 @@
-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 { Dialog } from '@material-ui/core';
-import React from 'react';
-import { useState } from 'react';
-import { Controller } from 'react-hook-form';
-import RoundedButton from '../../../shared/RoundedButton/RoundedButton';
-import RoundedCheckBox from '../../../shared/RoundedCheckBox/RoundedCheckBox';
-import CloseRoundedIcon from '@material-ui/icons/CloseRounded';
-import styles from './MaterialTerm.module.css';
-function TermComponent(_a) {
-    var _b;
-    var term = _a.term, errors = _a.errors, control = _a.control, postview = _a.postview, setValue = _a.setValue, formStyle = _a.formStyle, tempError = _a.tempError;
-    var _c = useState(false), showDialog = _c[0], setShowDialog = _c[1];
-    /**
-     * Function that renders the highlighted text
-     * @returns a string with span highlighted
-     */
-    var renderText = function (text) {
-        if (text) {
-            var parts = text.split(/{{(.*?)}}/gi);
-            for (var i = 1; i < parts.length; i += 2) {
-                parts[i] = (_jsx("span", __assign({ className: styles.highlight, style: {
-                        color: !!errors[term.id] && tempError
-                            ? formStyle.errorColor
-                            : formStyle.primaryColor,
-                    }, onClick: function () {
-                        var _a, _b, _c, _d, _e;
-                        if (((_a = term.clickEffect) === null || _a === void 0 ? void 0 : _a.type) === 'LINK') {
-                            (_d = (_c = (_b = window
-                                .open) === null || _b === void 0 ? void 0 : _b.call(window, term.clickEffect.url, '_blank')) === null || _c === void 0 ? void 0 : _c.focus) === null || _d === void 0 ? void 0 : _d.call(_c);
-                        }
-                        else if (((_e = term.clickEffect) === null || _e === void 0 ? void 0 : _e.type) === 'DIALOG') {
-                            setShowDialog(true);
-                        }
-                    } }, { children: parts[i] }), i));
-            }
-            return parts;
-        }
-    };
-    return (_jsxs(React.Fragment, { children: [_jsx(Dialog, __assign({ PaperProps: {
-                    style: {
-                        borderRadius: '20px',
-                    },
-                }, onClose: function () {
-                    setShowDialog(false);
-                }, open: showDialog }, { children: ((_b = term.clickEffect) === null || _b === void 0 ? void 0 : _b.type) === 'DIALOG' && (_jsxs("div", __assign({ className: styles.dialogContainer, style: { color: formStyle.textColor } }, { children: [_jsx("div", __assign({ className: styles.closeIcon, onClick: function () {
-                                setShowDialog(false);
-                            } }, { children: _jsx(CloseRoundedIcon, { fontSize: "inherit" }, void 0) }), void 0), _jsx("div", __assign({ className: styles.dialogTitle, style: {
-                                borderBottom: '1px solid ' + formStyle.primaryColor,
-                            } }, { children: term.clickEffect.title }), void 0), _jsx("div", __assign({ className: styles.dialogContentContainer }, { children: term.clickEffect.text }), void 0), _jsx(RoundedButton, { text: 'Aceptar', padding: "20px 15px", backgroundColor: formStyle.primaryColor, color: formStyle.primaryContrastColor, fontSize: 20, onClick: function () {
-                                setShowDialog(false);
-                                if (!postview) {
-                                    setValue(term.id, true);
-                                }
-                            } }, void 0)] }), void 0)) }), void 0), _jsxs("div", __assign({ className: styles.container + ' noselect' }, { children: [_jsx("div", __assign({ className: styles.checkboxContainer }, { children: _jsx(Controller, { name: term.id, control: control, rules: {
-                                required: true,
-                            }, defaultValue: false, shouldUnregister: true, render: function (_a) {
-                                var field = _a.field;
-                                return (_jsx(RoundedCheckBox, { checked: field.value, onChange: field.onChange, cantEdit: postview, padding: "5px", checkedColor: formStyle.primaryColor, errorColor: formStyle.errorColor, size: "1.5rem", error: !!errors[term.id] }, void 0));
-                            } }, void 0) }), void 0), _jsx("div", __assign({ className: styles.messageContainer, style: {
-                            color: !!errors[term.id] && tempError
-                                ? formStyle.errorColor
-                                : 'inherit',
-                        } }, { children: renderText(term.message) }), void 0)] }), void 0)] }, void 0));
-}
-export default TermComponent;
+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 { Dialog } from '@material-ui/core';
+import React from 'react';
+import { useState } from 'react';
+import { Controller } from 'react-hook-form';
+import RoundedButton from '../../../shared/RoundedButton/RoundedButton';
+import RoundedCheckBox from '../../../shared/RoundedCheckBox/RoundedCheckBox';
+import CloseRoundedIcon from '@material-ui/icons/CloseRounded';
+import styles from './MaterialTerm.module.css';
+function TermComponent(_a) {
+    var _b;
+    var term = _a.term, errors = _a.errors, control = _a.control, postview = _a.postview, setValue = _a.setValue, formStyle = _a.formStyle, tempError = _a.tempError;
+    var _c = useState(false), showDialog = _c[0], setShowDialog = _c[1];
+    /**
+     * Function that renders the highlighted text
+     * @returns a string with span highlighted
+     */
+    var renderText = function (text) {
+        if (text) {
+            var parts = text.split(/{{(.*?)}}/gi);
+            for (var i = 1; i < parts.length; i += 2) {
+                parts[i] = (_jsx("span", __assign({ className: styles.highlight, style: {
+                        color: !!errors[term.id] && tempError
+                            ? formStyle.errorColor
+                            : formStyle.primaryColor,
+                    }, onClick: function () {
+                        var _a, _b, _c, _d, _e;
+                        if (((_a = term.clickEffect) === null || _a === void 0 ? void 0 : _a.type) === 'LINK') {
+                            (_d = (_c = (_b = window
+                                .open) === null || _b === void 0 ? void 0 : _b.call(window, term.clickEffect.url, '_blank')) === null || _c === void 0 ? void 0 : _c.focus) === null || _d === void 0 ? void 0 : _d.call(_c);
+                        }
+                        else if (((_e = term.clickEffect) === null || _e === void 0 ? void 0 : _e.type) === 'DIALOG') {
+                            setShowDialog(true);
+                        }
+                    } }, { children: parts[i] }), i));
+            }
+            return parts;
+        }
+    };
+    return (_jsxs(React.Fragment, { children: [_jsx(Dialog, __assign({ PaperProps: {
+                    style: {
+                        borderRadius: '20px',
+                    },
+                }, onClose: function () {
+                    setShowDialog(false);
+                }, open: showDialog }, { children: ((_b = term.clickEffect) === null || _b === void 0 ? void 0 : _b.type) === 'DIALOG' && (_jsxs("div", __assign({ className: styles.dialogContainer, style: { color: formStyle.textColor } }, { children: [_jsx("div", __assign({ className: styles.closeIcon, onClick: function () {
+                                setShowDialog(false);
+                            } }, { children: _jsx(CloseRoundedIcon, { fontSize: "inherit" }, void 0) }), void 0), _jsx("div", __assign({ className: styles.dialogTitle, style: {
+                                borderBottom: '1px solid ' + formStyle.primaryColor,
+                            } }, { children: term.clickEffect.title }), void 0), _jsx("div", __assign({ className: styles.dialogContentContainer }, { children: term.clickEffect.text }), void 0), _jsx(RoundedButton, { text: 'Aceptar', padding: "20px 15px", backgroundColor: formStyle.primaryColor, color: formStyle.primaryContrastColor, fontSize: 20, onClick: function () {
+                                setShowDialog(false);
+                                if (!postview) {
+                                    setValue(term.id, true);
+                                }
+                            } }, void 0)] }), void 0)) }), void 0), _jsxs("div", __assign({ className: styles.container + ' noselect' }, { children: [_jsx("div", __assign({ className: styles.checkboxContainer }, { children: _jsx(Controller, { name: term.id, control: control, rules: {
+                                required: true,
+                            }, defaultValue: false, shouldUnregister: true, render: function (_a) {
+                                var field = _a.field;
+                                return (_jsx(RoundedCheckBox, { checked: field.value, onChange: field.onChange, cantEdit: postview, padding: "5px", checkedColor: formStyle.primaryColor, errorColor: formStyle.errorColor, size: "1.5rem", error: !!errors[term.id] }, void 0));
+                            } }, void 0) }), void 0), _jsx("div", __assign({ className: styles.messageContainer, style: {
+                            color: !!errors[term.id] && tempError
+                                ? formStyle.errorColor
+                                : 'inherit',
+                        } }, { children: renderText(term.message) }), void 0)] }), void 0)] }, void 0));
+}
+export default TermComponent;