@arquimedes.co/eureka-forms 2.0.32-test → 2.0.34-test

package/dist/mjs/Form/Terms/Terms.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare function Terms(): JSX.Element;
+export default Terms;

package/dist/mjs/Form/Terms/Terms.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { useContext, useEffect, useState } from 'react';
+import styles from './Terms.module.css';
+import TermComponent from './Term/Term';
+import { useFormContext } from 'react-hook-form';
+import FormContext from '../../Contexts/FormContext';
+import { useAppSelector } from '../../hooks';
+function Terms() {
+    const { postview, internal } = useAppSelector((state) => state.global);
+    const isInteralAgent = useAppSelector((state) => state.site.values.global['INTERNAL_CREATING_AGENT'] !== undefined);
+    const form = useContext(FormContext);
+    const { formState: { isSubmitting }, } = useFormContext();
+    const [tempError, setTempError] = useState(false);
+    useEffect(() => {
+        if (!isSubmitting)
+            return;
+        setTempError(true);
+        setTimeout(() => {
+            setTempError(false);
+        }, 500);
+    }, [isSubmitting]);
+    if (form.terms &&
+        (!internal || (internal && postview)) &&
+        !isInteralAgent) {
+        return (_jsx("div", { className: styles.termsContainer, style: {
+                width: (form.size.blockSize + form.size.spacingSize) *
+                    form.size.blockNum,
+            }, children: form.terms.map((term) => (_jsx(TermComponent, { term: term, tempError: tempError }, term.id))) }));
+    }
+    return _jsx(_Fragment, {});
+}
+export default Terms;

package/dist/mjs/Form/Terms/Terms.module.css

@@ -0,0 +1,3 @@
+.termsContainer {
+    max-width: 100%;
+}

package/dist/mjs/FormSteps/@Construction/CBRElementStep/CBRElementStep.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { StepProps } from '../../Step';
+import { CBRElementStep } from '../../../@Types/CBRFormStep';
+export interface ElementStepProps extends Omit<StepProps, 'step'> {
+    step: CBRElementStep;
+}
+declare function CBRElementStepComponent(props: ElementStepProps): JSX.Element;
+export default CBRElementStepComponent;

package/dist/mjs/FormSteps/@Construction/CBRElementStep/CBRElementStep.js

@@ -0,0 +1,67 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import SmartSelectStep from '../../SmartSelectStep/SmartSelectStep';
+import CBRFormStepTypes from '../../../constants/CBRFormStepTypes';
+import axios from 'axios';
+import InputIcon from '../../../Shared/InputIcon/InputIcon';
+import FormContext from '../../../Contexts/FormContext';
+import { useContext } from 'react';
+function CBRElementStepComponent(props) {
+    return (_jsx(SmartSelectStep, { ...props, step: props.step, icon: _jsx(InputIcon, { icon: 'LEAK' }), getOptions: getElementOptions, getOptionSelected: (option, value) => option.id === value.id, getValueString: (value) => value?.id, calcDepError: calcDepError, valueOverwrite: (value) => {
+            if (value) {
+                return { ...value, subStep: props.step.subStep };
+            }
+            else {
+                return null;
+            }
+        }, renderNestedSteps: (value) => (_jsx(ElementSubStepRenderer, { value: value, ...props })) }));
+}
+export default CBRElementStepComponent;
+function ElementSubStepRenderer({ value, ...stepProps }) {
+    const form = useContext(FormContext);
+    if (!value || stepProps === undefined) {
+        return _jsx("div", {});
+    }
+    const subStep = form.steps[stepProps.step.subStep ?? ''];
+    if (subStep?.type !== CBRFormStepTypes.CBR_LOCATIVAS) {
+        return _jsx("div", {});
+    }
+    return (_jsx(SmartSelectStep, { ...stepProps, step: subStep, icon: _jsx(InputIcon, { icon: 'LEAK' }), getOptions: getElementOptions, calcDepError: calcDepError, getOptionSelected: (option, value) => option.id === value.id, getValueString: (value) => value?.id, renderNestedSteps: (value) => (_jsx(ElementSubStepRenderer, { value: value, ...stepProps, step: subStep })) }));
+}
+const getElementOptions = async (idOrganization, step, dependencyStore) => {
+    if (step.dependencies && idOrganization) {
+        const idProyecto = dependencyStore[step.dependencies[0]]?.value?.id;
+        if (!idProyecto) {
+            return null; //null para indicar que falta la depedency
+        }
+        //Calc resp given dep, and depency Store
+        const response = (await axios.get(`https://integrations.${process.env.REACT_APP_DOMAIN}/sinco/cbr/Locativas?idOrganization=${idOrganization}`)).data;
+        const father = dependencyStore[step.dependencies[1]]?.value;
+        if (father !== undefined && father.id === undefined) {
+            return null;
+        }
+        return response.filter((locativa) => {
+            if (father?.id) {
+                return (locativa.id.startsWith(father.id) &&
+                    locativa.id !== father.id);
+            }
+            else {
+                return locativa.id.length === 2;
+            }
+        });
+    }
+    else {
+        return null;
+    }
+};
+const calcDepError = (steps) => {
+    for (const step of steps) {
+        const type = step.type;
+        if (type === CBRFormStepTypes.CBR_PROYECTO) {
+            return 'Selecciona un proyecto';
+        }
+        if (type === CBRFormStepTypes.CBR_LOCATIVAS) {
+            return 'Selecciona un padre';
+        }
+    }
+    return undefined;
+};

package/dist/mjs/FormSteps/@Construction/CBRIncidentsStep/CBRIncidentsStep.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { CBRIncidentsStep as CBRIncidentsStepType } from '../../../@Types/CBRFormStep';
+import { StepProps } from '../../Step';
+export interface CBRIncidentsStepProps extends Omit<StepProps, 'step'> {
+    /** The CBRIncidentsStep to display */
+    step: CBRIncidentsStepType;
+}
+declare function CBRIncidentsStep(props: CBRIncidentsStepProps): JSX.Element;
+export default CBRIncidentsStep;

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

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FormStyleTypes } from '../../../constants/FormStepTypes';
+import MaterialCBRIncidentsStep from './MaterialCBRIncidentsStep/MaterialCBRIncidentsStep';
+import { useAppSelector } from '../../../hooks';
+function CBRIncidentsStep(props) {
+    const { formStyle } = useAppSelector((state) => state.global);
+    switch (formStyle.type) {
+        case FormStyleTypes.MATERIAL:
+        default: {
+            return _jsx(MaterialCBRIncidentsStep, { ...props });
+        }
+    }
+}
+export default CBRIncidentsStep;

package/dist/mjs/FormSteps/@Construction/CBRIncidentsStep/MaterialCBRIncidentsStep/Incident/Incident.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { CBRIncidentsStepProps } from '../../CBRIncidentsStep';
+import { Incident } from '../MaterialCBRIncidentsStep';
+declare function IncidentComponent({ step, incident, handleDelete, ...others }: CBRIncidentsStepProps & {
+    incident: Incident;
+    handleDelete: () => void;
+}): JSX.Element;
+export default IncidentComponent;

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

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styles from './Incident.module.css';
+import StepComponent from '../../../../Step';
+import DeleteRoundedIcon from '@material-ui/icons/DeleteRounded';
+import TextAreaStep from '../../../../TextAreaStep/TextAreaStep';
+import FormContext from '../../../../../Contexts/FormContext';
+import { useAppSelector } from '../../../../../hooks';
+import { useContext } from 'react';
+function IncidentComponent({ step, incident, handleDelete, ...others }) {
+    const { formStyle, postview } = useAppSelector((state) => state.global);
+    const form = useContext(FormContext);
+    const widthStats = useAppSelector((state) => state.widthStats);
+    const spaceStep = form.steps[incident.idSpaceStep];
+    const elementStep = form.steps[incident.idElementStep];
+    const commentStep = form.steps[incident.idCommentStep];
+    if (incident.deleted) {
+        return _jsx("div", {});
+    }
+    return (_jsx("div", { className: widthStats.isMobile || form.size.blockNum < 3
+            ? styles.mobileContainer
+            : styles.container, children: _jsxs("div", { className: styles.contentContainer, style: {
+                width: (form.size.blockSize + form.size.spacingSize) *
+                    (form.size.blockNum - 1),
+            }, children: [_jsxs("div", { className: styles.titleLbl, style: { color: formStyle.textColor }, children: [step.unitLabel + ' ' + incident.num, ":"] }), _jsx("div", { className: !others.editable || postview
+                        ? styles.disabledDeleteBtn
+                        : styles.deleteBtn, style: { color: formStyle.textColor }, onClick: () => {
+                        if (others.editable && !postview) {
+                            handleDelete();
+                        }
+                    }, children: _jsx(DeleteRoundedIcon, { fontSize: "inherit" }) }), _jsx(StepComponent, { ...others, step: spaceStep }), _jsx(StepComponent, { ...others, step: elementStep }), _jsx(TextAreaStep, { ...others, step: commentStep, maxLength: 200 })] }) }));
+}
+export default IncidentComponent;

package/dist/mjs/FormSteps/@Construction/CBRIncidentsStep/MaterialCBRIncidentsStep/Incident/Incident.module.css

@@ -0,0 +1,60 @@
+.container,
+.mobileContainer {
+    background-color: #f0f0f0;
+    border: 1px solid #d6d6d6;
+    width: fit-content;
+    border-radius: 20px;
+    margin-bottom: 10px;
+    margin-top: 10px;
+    margin-left: auto;
+    margin-right: auto;
+    padding-top: 20px;
+    padding-bottom: 20px;
+    position: relative;
+}
+.container {
+    max-width: calc(100% - 112px);
+    padding-right: 55px;
+    padding-left: 55px;
+}
+
+.mobileContainer {
+    max-width: calc(100% - 42px);
+    padding-right: 20px;
+    padding-left: 20px;
+}
+
+.titleLbl {
+    width: 100%;
+    font-size: 20px;
+    font-weight: 600;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    cursor: default;
+    margin-left: 10px;
+    margin-bottom: 10px;
+}
+
+.contentContainer {
+    margin-left: auto;
+    margin-right: auto;
+    display: flex;
+    flex-flow: row wrap;
+    height: fit-content;
+    max-width: 100%;
+    overflow-x: hidden;
+    overflow-y: hidden;
+}
+
+.deleteBtn,
+.disabledDeleteBtn {
+    font-size: 24px;
+    position: absolute;
+    right: 15px;
+    top: 15px;
+}
+
+.deleteBtn {
+    cursor: pointer;
+}

package/dist/mjs/FormSteps/@Construction/CBRIncidentsStep/MaterialCBRIncidentsStep/MaterialCBRIncidentsStep.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { CBRIncidentsStepProps } from '../CBRIncidentsStep';
+export interface Incident {
+    idSpaceStep: string;
+    idElementStep: string;
+    idCommentStep: string;
+    deleted?: boolean;
+    num: number;
+}
+declare function CBRIncidentsStep({ step, editable, ...others }: CBRIncidentsStepProps): JSX.Element;
+export default CBRIncidentsStep;

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

@@ -0,0 +1,113 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/* eslint-disable no-console */
+import { useContext, useEffect, useState } from 'react';
+import CBRFormStepTypes from '../../../../constants/CBRFormStepTypes';
+import IncidentComponent from './Incident/Incident';
+import styles from './MaterialCBRIncidentsStep.module.css';
+import { nanoid } from 'nanoid';
+import RoundedButton from '../../../../Shared/RoundedButton/RoundedButton';
+import FormContext from '../../../../Contexts/FormContext';
+import { addStepsDependencies } from '../../../../States/SiteSlice';
+import { useAppDispatch, useAppSelector } from '../../../../hooks';
+import CustomContext from '../../../../Contexts/CustomContext';
+import { useFormStep } from '../../../StepHooks';
+function CBRIncidentsStep({ step, editable, ...others }) {
+    const { ref, value, onChange, error } = useFormStep(step, {
+        defaultValue: [],
+        rules: {
+            validate: (array) => !step.required ||
+                (step.required &&
+                    array.filter((elem) => !elem.deleted).length > 0),
+        },
+    });
+    const { customSteps } = useContext(CustomContext);
+    const { formStyle, postview } = useAppSelector((state) => state.global);
+    const dispatch = useAppDispatch();
+    const form = useContext(FormContext);
+    /** Form to pass down with aditional steps */
+    const [localForm, setLocalForm] = useState({
+        ...form,
+        steps: { ...form.steps },
+    });
+    const [firstRender, setFirstRender] = useState(false);
+    useEffect(() => {
+        setFirstRender(true);
+    }, []);
+    useEffect(() => {
+        if (firstRender && value.length === 0 && !postview && editable) {
+            handleAddIncident();
+        }
+    }, [firstRender]);
+    const handleAddIncident = () => {
+        const current = value.filter((incident) => !incident.deleted);
+        const newIncident = {
+            idSpaceStep: CBRFormStepTypes.CBR_TIPO_ESPACIO + '-' + nanoid(),
+            idCommentStep: CBRFormStepTypes.CBR_COMENTARIO + '-' + nanoid(),
+            idElementStep: CBRFormStepTypes.CBR_LOCATIVAS + '-' + nanoid(),
+            num: current.length + 1,
+        };
+        const newSteps = {
+            ...localForm.steps,
+        };
+        newSteps[newIncident.idSpaceStep] = {
+            ...step.spaceStep,
+            id: newIncident.idSpaceStep,
+            type: CBRFormStepTypes.CBR_TIPO_ESPACIO,
+            dependencies: step.dependencies,
+        };
+        newSteps[newIncident.idCommentStep] = {
+            ...step.commentStep,
+            id: newIncident.idCommentStep,
+            type: CBRFormStepTypes.CBR_COMENTARIO,
+        };
+        addRecursiveElementStep(newIncident.idElementStep, step.elementStep, null, newSteps, step.dependencies?.[0] ?? '');
+        onChange([...value, newIncident]);
+        setLocalForm({ ...localForm, steps: newSteps });
+        dispatch(addStepsDependencies({
+            steps: newSteps,
+            customSteps,
+            allSteps: { ...form.steps, ...localForm.steps, ...newSteps },
+        }));
+    };
+    const addRecursiveElementStep = (idStep, step, idParent, steps, idProjectDep) => {
+        const idSubStep = CBRFormStepTypes.CBR_LOCATIVAS + '-' + nanoid();
+        const newSubStep = step.subStep ? { ...step.subStep } : undefined;
+        const newStep = {
+            ...step,
+            id: idStep,
+            type: CBRFormStepTypes.CBR_LOCATIVAS,
+            dependencies: [idProjectDep],
+            subStep: null,
+        };
+        if (idParent)
+            newStep.dependencies.push(idParent);
+        if (newSubStep) {
+            newStep.subStep = idSubStep;
+        }
+        steps[idStep] = newStep;
+        if (newSubStep) {
+            addRecursiveElementStep(idSubStep, newSubStep, idStep, steps, idProjectDep);
+        }
+    };
+    return (_jsxs("div", { className: styles.container, style: { color: formStyle.textColor }, children: [_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 })), _jsx(FormContext.Provider, { value: localForm, children: value.map((incident, index) => (_jsx(IncidentComponent, { incident: incident, step: step, editable: editable, handleDelete: () => {
+                        const tempIncidents = [...value];
+                        tempIncidents[index].deleted = true;
+                        let n = 1;
+                        for (const inc of tempIncidents) {
+                            if (!inc.deleted) {
+                                inc.num = n;
+                                n++;
+                            }
+                        }
+                        onChange(tempIncidents);
+                    }, ...others }, index))) }), _jsxs("div", { className: styles.btnContainer, children: [_jsx("input", { ref: ref, className: 'hidden-input' }), _jsx(RoundedButton, { disabled: !editable || postview, text: step.addBtnLabel + (step.required ? ' *' : ''), color: formStyle.primaryContrastColor, backgroundColor: formStyle.primaryColor, fontSize: '1rem', padding: '5px 15px 5px 15px', onClick: () => {
+                            if (editable && !postview) {
+                                handleAddIncident();
+                            }
+                        } })] }), !!error && value.filter((elem) => !elem.deleted).length === 0 && (_jsx("div", { className: styles.errorMsg, style: { color: formStyle.errorColor }, children: "Este campo es obligatorio" }))] }));
+}
+export default CBRIncidentsStep;

package/dist/mjs/FormSteps/@Construction/CBRIncidentsStep/MaterialCBRIncidentsStep/MaterialCBRIncidentsStep.module.css

@@ -0,0 +1,34 @@
+.container {
+    display: flex;
+    flex-direction: column;
+    width: calc(100% - 20px);
+    max-width: calc(100% - 20px);
+    padding: 5px 10px;
+}
+
+.titleLbl {
+    font-size: 24px;
+    font-weight: 600;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    cursor: default;
+}
+
+.descriptionPar {
+    font-size: 16px;
+    white-space: pre-wrap;
+    cursor: default;
+}
+.btnContainer {
+    margin-top: 15px;
+    margin-left: 15px;
+    margin-bottom: 3px;
+    width: fit-content;
+}
+
+.errorMsg {
+    font-size: 0.75rem;
+    margin-top: 5px;
+    margin-left: 15px;
+}

package/dist/mjs/FormSteps/@Construction/CBRPropertyStep/CBRPropertyStep.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { StepProps } from '../../Step';
+import { CBRPropertyStep } from '../../../@Types/CBRFormStep';
+export interface PropertyRendererProps extends Omit<StepProps, 'step'> {
+    step: CBRPropertyStep;
+}
+declare function CBRPropertyStepComponent(props: PropertyRendererProps): JSX.Element;
+export default CBRPropertyStepComponent;

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

@@ -0,0 +1,90 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styles from './CBRPropertyStep.module.css';
+import SmartSelectStep from '../../SmartSelectStep/SmartSelectStep';
+import CloseRoundedIcon from '@material-ui/icons/CloseRounded';
+import WarningRoundedIcon from '@material-ui/icons/WarningRounded';
+import axios from 'axios';
+import React, { useState } from 'react';
+import { Dialog } from '@material-ui/core';
+import RoundedButton from '../../../Shared/RoundedButton/RoundedButton';
+import InputIcon from '../../../Shared/InputIcon/InputIcon';
+import { useAppSelector } from '../../../hooks';
+import CBRFormStepTypes from '../../../constants/CBRFormStepTypes';
+const baseUrl = `https://integrations.${process.env.REACT_APP_DOMAIN}/sinco/cbr/`;
+function CBRPropertyStepComponent(props) {
+    const { formStyle } = useAppSelector((state) => state.global);
+    const [showWarning, setShowWarning] = useState(undefined);
+    const getInmueblesOptions = async (idOrganization, step, dependencyStore) => {
+        if (step.dependencies && idOrganization) {
+            const idProyecto = dependencyStore[step.dependencies[0]]?.value?.id;
+            const idMacroProyecto = dependencyStore[step.dependencies[0]]?.value?.idMacroProyecto;
+            if (!idProyecto) {
+                return null; //null para indicar que falta la depedency
+            }
+            return (await axios.get(baseUrl +
+                'Inmuebles?idMacro=' +
+                idMacroProyecto +
+                '&idProyecto=' +
+                idProyecto +
+                '&idOrganization=' +
+                idOrganization)).data;
+        }
+        else {
+            return null;
+        }
+    };
+    return (_jsxs(React.Fragment, { children: [_jsx(SmartSelectStep, { ...props, icon: _jsx(InputIcon, { icon: 'PROPERTY' }), getOptionSelected: (option, value) => option.id === value.id, calcDepError: (steps) => {
+                    for (const step of steps) {
+                        if (step.type === CBRFormStepTypes.CBR_PROYECTO) {
+                            return 'Selecciona un proyecto';
+                        }
+                    }
+                    return undefined;
+                }, getValueString: (value) => value?.id, getValueWarning: props.step.validation
+                    ? (value) => {
+                        if (value &&
+                            value.entrega !== undefined &&
+                            props.step.validation) {
+                            const date = new Date(value.entrega);
+                            const today = new Date();
+                            const time = today.getTime() - date.getTime();
+                            const days = time / (1000 * 3600 * 24);
+                            if (days > props.step.validation.maxDays) {
+                                return props.step.validation.message;
+                            }
+                        }
+                        return null;
+                    }
+                    : undefined, changeListener: props.step.validation
+                    ? (value) => {
+                        if (value &&
+                            value.entrega !== undefined &&
+                            props.step.validation) {
+                            const date = new Date(value.entrega);
+                            const today = new Date();
+                            const time = today.getTime() - date.getTime();
+                            const days = time / (1000 * 3600 * 24);
+                            if (days > props.step.validation.maxDays) {
+                                setShowWarning(new Date(date.getTime() +
+                                    (props.step.validation
+                                        .maxDays +
+                                        1) *
+                                        1000 *
+                                        3600 *
+                                        24));
+                            }
+                        }
+                    }
+                    : undefined, getOptions: getInmueblesOptions }), showWarning !== undefined && (_jsx(Dialog, { PaperProps: {
+                    style: {
+                        borderRadius: '20px',
+                        maxWidth: '100vw',
+                        boxSizing: 'content-box',
+                    },
+                }, open: true, children: _jsxs("div", { className: styles.confirmationContainer, style: { color: formStyle.textColor }, children: [_jsx("div", { className: styles.closeIcon, onClick: () => {
+                                setShowWarning(undefined);
+                            }, children: _jsx(CloseRoundedIcon, { fontSize: "inherit" }) }), _jsxs("div", { className: styles.container, children: [_jsx("div", { className: styles.warningContainer, style: { color: formStyle.primaryColor }, children: _jsx(WarningRoundedIcon, { fontSize: "inherit", 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(RoundedButton, { text: 'Continuar', color: formStyle.primaryContrastColor, backgroundColor: formStyle.primaryColor, fontSize: '1rem', padding: '5px 15px 5px 15px', onClick: () => {
+                                            setShowWarning(undefined);
+                                        } }) })] })] }) }))] }));
+}
+export default CBRPropertyStepComponent;

package/dist/mjs/FormSteps/@Construction/CBRPropertyStep/CBRPropertyStep.module.css

@@ -0,0 +1,54 @@
+.confirmationContainer {
+    display: flex;
+    flex-direction: column;
+    width: fit-content;
+    max-height: 80vh;
+    max-width: 80vw;
+    position: relative;
+}
+
+.container {
+    max-height: 100%;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    overflow-y: auto;
+}
+.confirmationContainer,
+.confirmationContainer *,
+.confirmationContainer *::after,
+.confirmationContainer *::before {
+    -webkit-box-sizing: content-box;
+    -moz-box-sizing: content-box;
+    box-sizing: content-box;
+}
+
+.warningContainer {
+    margin-left: auto;
+    margin-right: auto;
+    padding-top: 30px;
+    height: fit-content;
+    margin-bottom: 15px;
+}
+
+.messageContainer {
+    margin-top: 5px;
+    margin-left: 20px;
+    margin-right: 20px;
+    font-size: 1.2rem;
+    text-align: center;
+}
+
+.btnContainer {
+    margin-left: auto;
+    margin-right: auto;
+    margin-top: 30px;
+    margin-bottom: 20px;
+}
+.closeIcon {
+    right: 15px;
+    top: 10px;
+    font-size: 26px;
+    position: absolute;
+    cursor: pointer;
+}

package/dist/mjs/FormSteps/AYFStepMapper.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { AYFFormStep } from '../@Types/AYFFormStep';
+import { StepProps } from './Step';
+interface AYFStepProps extends Omit<StepProps, 'step'> {
+    step: AYFFormStep;
+}
+export interface StepOptions {
+    id: string | number;
+    label: string;
+}
+declare function AYFStepMapper(props: AYFStepProps): JSX.Element;
+export default AYFStepMapper;