@arquimedes.co/eureka-forms 0.1.2 → 0.2.5

package/dist/FormComponents/Step/FileUploadStep/MaterialFileUploadStep/FileComponent/FileComponent.js

@@ -1,110 +1,110 @@
-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 __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
-import { postFile } from '../../../../../controllers/FileService';
-import styles from './FileComponent.module.css';
-import ClearRoundedIcon from '@material-ui/icons/ClearRounded';
-import DescriptionRoundedIcon from '@material-ui/icons/DescriptionRounded';
-import Loader from '../../../../../shared/Loader/Loader';
-var timeout = function (ms) {
-    return new Promise(function (resolve) { return setTimeout(resolve, ms); });
-};
-function FileUploadComponent(_a) {
-    var _this = this;
-    var fileInfo = _a.fileInfo, formStyle = _a.formStyle, handleUploaded = _a.handleUploaded, handleRemoveUploaded = _a.handleRemoveUploaded;
-    var _b = useState(undefined), file = _b[0], setFile = _b[1];
-    var uploadFile = function (file) { return __awaiter(_this, void 0, void 0, function () {
-        var resp, error_1;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    _a.trys.push([0, 2, , 3]);
-                    setFile(__assign(__assign({}, file), { loading: 'UPLOADING' }));
-                    return [4 /*yield*/, Promise.all([
-                            postFile(file.file, file.postInfo),
-                            timeout(1000),
-                        ])];
-                case 1:
-                    resp = _a.sent();
-                    setFile(__assign(__assign({}, file), { loading: 'DONE', postInfo: resp[0] }));
-                    handleUploaded(resp[0]);
-                    return [3 /*break*/, 3];
-                case 2:
-                    error_1 = _a.sent();
-                    console.error(error_1);
-                    return [3 /*break*/, 3];
-                case 3: return [2 /*return*/];
-            }
-        });
-    }); };
-    useEffect(function () {
-        if (fileInfo.loading === 'TRY_UPLOADING' && !file) {
-            uploadFile(fileInfo);
-        }
-    }, [fileInfo]);
-    var calcIcon = function () {
-        switch (file ? file.loading : fileInfo.loading) {
-            case 'STARTING':
-            case 'TRY_UPLOADING':
-                return _jsx("div", { className: styles.waitingForUpload }, void 0);
-            case 'UPLOADING':
-                return (_jsx("div", __assign({ className: styles.loaderContainer }, { children: _jsx(Loader, { size: 26, color: formStyle.primaryColor }, void 0) }), void 0));
-            case 'DONE':
-                return (_jsx("div", __assign({ className: styles.documentIcon, style: { color: formStyle.primaryColor } }, { children: _jsx(DescriptionRoundedIcon, {}, void 0) }), void 0));
-            default:
-                return _jsx("div", {}, void 0);
-        }
-    };
-    return (_jsxs("div", __assign({ className: styles.container }, { children: [_jsx("div", __assign({ className: styles.iconContainer }, { children: calcIcon() }), void 0), _jsx("div", __assign({ className: styles.label }, { children: file ? file.file.name : fileInfo.file.name }), void 0), _jsx("div", __assign({ className: styles.deletBtn, onClick: function () {
-                    if (file && file.loading === 'DONE') {
-                        handleRemoveUploaded(fileInfo.postInfo);
-                    }
-                } }, { children: file && file.loading === 'DONE' && (_jsx(ClearRoundedIcon, { fontSize: "inherit" }, void 0)) }), void 0)] }), void 0));
-}
-export default FileUploadComponent;
+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 __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { postFile } from '../../../../../controllers/FileService';
+import styles from './FileComponent.module.css';
+import ClearRoundedIcon from '@material-ui/icons/ClearRounded';
+import DescriptionRoundedIcon from '@material-ui/icons/DescriptionRounded';
+import Loader from '../../../../../shared/Loader/Loader';
+var timeout = function (ms) {
+    return new Promise(function (resolve) { return setTimeout(resolve, ms); });
+};
+function FileUploadComponent(_a) {
+    var _this = this;
+    var fileInfo = _a.fileInfo, formStyle = _a.formStyle, handleUploaded = _a.handleUploaded, handleRemoveUploaded = _a.handleRemoveUploaded;
+    var _b = useState(undefined), file = _b[0], setFile = _b[1];
+    var uploadFile = function (file) { return __awaiter(_this, void 0, void 0, function () {
+        var resp, error_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    _a.trys.push([0, 2, , 3]);
+                    setFile(__assign(__assign({}, file), { loading: 'UPLOADING' }));
+                    return [4 /*yield*/, Promise.all([
+                            postFile(file.file, file.postInfo),
+                            timeout(1000),
+                        ])];
+                case 1:
+                    resp = _a.sent();
+                    setFile(__assign(__assign({}, file), { loading: 'DONE', postInfo: resp[0] }));
+                    handleUploaded(resp[0]);
+                    return [3 /*break*/, 3];
+                case 2:
+                    error_1 = _a.sent();
+                    console.error(error_1);
+                    return [3 /*break*/, 3];
+                case 3: return [2 /*return*/];
+            }
+        });
+    }); };
+    useEffect(function () {
+        if (fileInfo.loading === 'TRY_UPLOADING' && !file) {
+            uploadFile(fileInfo);
+        }
+    }, [fileInfo]);
+    var calcIcon = function () {
+        switch (file ? file.loading : fileInfo.loading) {
+            case 'STARTING':
+            case 'TRY_UPLOADING':
+                return _jsx("div", { className: styles.waitingForUpload }, void 0);
+            case 'UPLOADING':
+                return (_jsx("div", __assign({ className: styles.loaderContainer }, { children: _jsx(Loader, { size: 26, color: formStyle.primaryColor }, void 0) }), void 0));
+            case 'DONE':
+                return (_jsx("div", __assign({ className: styles.documentIcon, style: { color: formStyle.primaryColor } }, { children: _jsx(DescriptionRoundedIcon, {}, void 0) }), void 0));
+            default:
+                return _jsx("div", {}, void 0);
+        }
+    };
+    return (_jsxs("div", __assign({ className: styles.container }, { children: [_jsx("div", __assign({ className: styles.iconContainer }, { children: calcIcon() }), void 0), _jsx("div", __assign({ className: styles.label }, { children: file ? file.file.name : fileInfo.file.name }), void 0), _jsx("div", __assign({ className: styles.deletBtn, onClick: function () {
+                    if (file && file.loading === 'DONE') {
+                        handleRemoveUploaded(fileInfo.postInfo);
+                    }
+                } }, { children: file && file.loading === 'DONE' && (_jsx(ClearRoundedIcon, { fontSize: "inherit" }, void 0)) }), void 0)] }), void 0));
+}
+export default FileUploadComponent;

package/dist/FormComponents/Step/FileUploadStep/MaterialFileUploadStep/FileComponent/FileComponent.module.css

@@ -0,0 +1,52 @@
+.container {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    margin-left: 4px;
+}
+
+.documentIcon {
+    font-size: 26px;
+    width: 30px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 30px;
+}
+
+.label {
+    font-size: 1rem;
+    margin-left: 2px;
+    cursor: default;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-width: calc(100% - 70px);
+}
+.deletBtn {
+    font-size: 26px;
+    height: 26px;
+    margin-left: 5px;
+    color: '#787878';
+    cursor: pointer;
+}
+.loaderContainer {
+    position: relative;
+    height: 26px;
+    width: 26px;
+}
+.waitingForUpload {
+    height: 22px;
+    width: 22px;
+    border: 2px solid #787878;
+    border-radius: 20px;
+    margin-left: 0px;
+}
+
+.iconContainer {
+    height: 30px;
+    width: 30px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}

package/dist/FormComponents/Step/FileUploadStep/MaterialFileUploadStep/MaterialFileUploadStep.d.ts

@@ -1,13 +1,13 @@
-/// <reference types="react" />
-import { FileUploadStepProps } from '../FileUploadStep';
-export interface FileObj {
-    loading: 'STARTING' | 'TRY_UPLOADING' | 'UPLOADING' | 'DONE';
-    file: File;
-    postInfo?: any;
-}
-export interface UploadedFileObj {
-    lblFile: string;
-    name: string;
-}
-declare function UploadStepComponent(props: FileUploadStepProps): JSX.Element;
-export default UploadStepComponent;
+/// <reference types="react" />
+import { FileUploadStepProps } from '../FileUploadStep';
+export interface FileObj {
+    loading: 'STARTING' | 'TRY_UPLOADING' | 'UPLOADING' | 'DONE';
+    file: File;
+    postInfo?: any;
+}
+export interface UploadedFileObj {
+    lblFile: string;
+    name: string;
+}
+declare function UploadStepComponent(props: FileUploadStepProps): JSX.Element;
+export default UploadStepComponent;

package/dist/FormComponents/Step/FileUploadStep/MaterialFileUploadStep/MaterialFileUploadStep.js

@@ -1,165 +1,165 @@
-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 __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import styles from './MaterialFileUploadStep.module.css';
-import { Controller } from 'react-hook-form';
-import RoundedButton from '../../../../shared/RoundedButton/RoundedButton';
-import { useEffect, useRef, useState } from 'react';
-import { getAcceptedExtensions } from '../../../../constants/Files/FileExtensions';
-import maxFileSize from '../../../../constants/Files/FileMaxSize';
-import { getUploadUrls } from '../../../../controllers/FileService';
-import FileComponent from './FileComponent/FileComponent';
-function FileUploadStep(_a) {
-    var _b;
-    var step = _a.step, errors = _a.errors, postview = _a.postview, onChange = _a.onChange, formStyle = _a.formStyle, clearErrors = _a.clearErrors, originalValues = _a.originalValues;
-    var _c = useState(((_b = originalValues[step.id]) !== null && _b !== void 0 ? _b : []).map(function (file) {
-        var _a;
-        return ((_a = {
-            file: new File([], file.lblFile),
-            loading: 'DONE',
-        }) !== null && _a !== void 0 ? _a : []);
-    })), files = _c[0], setFiles = _c[1];
-    var _d = useState(undefined), fileUploaded = _d[0], setFileUploaded = _d[1];
-    var _e = useState([]), uploadedFiles = _e[0], setUploadedFiles = _e[1];
-    var inputRef = useRef();
-    useEffect(function () {
-        if (fileUploaded) {
-            var tempArray = __spreadArray(__spreadArray([], uploadedFiles, true), [fileUploaded], false);
-            onChange(tempArray);
-            clearErrors(step.id);
-            setUploadedFiles(tempArray);
-        }
-    }, [fileUploaded]);
-    function getUploadUrlsAsync(pFiles) {
-        return __awaiter(this, void 0, void 0, function () {
-            var largeFile, currentFiles, fileLinks_1, error_1;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        largeFile = pFiles.find(function (file) { return file.size > maxFileSize; });
-                        if (!largeFile) return [3 /*break*/, 1];
-                        console.error('FILE IS TOO LARGE', largeFile);
-                        return [3 /*break*/, 5];
-                    case 1:
-                        currentFiles = __spreadArray([], files, true);
-                        setFiles(__spreadArray(__spreadArray([], files, true), pFiles.map(function (file) {
-                            return ({
-                                loading: 'STARTING',
-                                file: file,
-                                postInfo: null,
-                            });
-                        }), true));
-                        _a.label = 2;
-                    case 2:
-                        _a.trys.push([2, 4, , 5]);
-                        return [4 /*yield*/, getUploadUrls(pFiles)];
-                    case 3:
-                        fileLinks_1 = _a.sent();
-                        setFiles(__spreadArray(__spreadArray([], currentFiles, true), pFiles.map(function (file, index) {
-                            return ({
-                                postInfo: fileLinks_1[index],
-                                loading: 'TRY_UPLOADING',
-                                file: file,
-                            });
-                        }), true));
-                        return [3 /*break*/, 5];
-                    case 4:
-                        error_1 = _a.sent();
-                        console.error('ERROR');
-                        return [3 /*break*/, 5];
-                    case 5: return [2 /*return*/];
-                }
-            });
-        });
-    }
-    return (_jsxs("div", __assign({ className: styles.container }, { children: [_jsx("div", __assign({ className: styles.labelLabel }, { children: step.label }), void 0), step.description && (_jsx("div", __assign({ className: styles.stepDescriptionLabel }, { children: step.description }), void 0)), _jsx("input", { type: "file", ref: inputRef, className: styles.filesInput, onChange: function (e) {
-                    var files = e.target.files;
-                    if (files) {
-                        var filesArray = Array.from(files);
-                        getUploadUrlsAsync(filesArray);
-                    }
-                }, multiple: true, accept: getAcceptedExtensions() }, void 0), _jsx("div", __assign({ className: styles.btnContainer }, { children: _jsx(RoundedButton, { disabled: postview, text: 'Examinar' + (step.required ? ' *' : ''), color: formStyle.primaryContrastColor, backgroundColor: formStyle.primaryColor, fontSize: '1rem', padding: '5px 15px 5px 15px', onClick: function () {
-                        if (!postview) {
-                            var input = inputRef.current;
-                            if (input !== null) {
-                                clearErrors(step.id);
-                                input.click();
-                            }
-                        }
-                    } }, void 0) }), void 0), !!errors[step.id] && (_jsx("div", __assign({ className: styles.errorMsg, style: { color: formStyle.errorColor } }, { children: "Este campo es obligatorio" }), void 0)), _jsx("div", __assign({ className: styles.filesContainer }, { children: files.map(function (file, index) { return (_jsx(FileComponent, { formStyle: formStyle, fileInfo: file, handleRemoveUploaded: function (fileToDelete) {
-                        var tempArray = uploadedFiles.filter(function (file) { return file.name !== fileToDelete.name; });
-                        var tempFiles = files.filter(function (file) {
-                            return file.postInfo.name !== fileToDelete.name;
-                        });
-                        setFiles(tempFiles);
-                        onChange(tempArray);
-                        setUploadedFiles(tempArray);
-                    }, handleUploaded: function (info) {
-                        setFileUploaded(info);
-                    } }, index)); }) }), void 0)] }), void 0));
-}
-function UploadStepComponent(props) {
-    return (_jsx(Controller, { name: props.step.id, control: props.control, defaultValue: [], rules: props.step.required
-            ? {
-                validate: function (array) { return array.length > 0; },
-            }
-            : {}, shouldUnregister: true, render: function (_a) {
-            var field = _a.field;
-            return (_jsx(FileUploadStep, __assign({}, props, { onChange: field.onChange }), void 0));
-        } }, void 0));
-}
-export default UploadStepComponent;
+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 __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styles from './MaterialFileUploadStep.module.css';
+import { Controller } from 'react-hook-form';
+import RoundedButton from '../../../../shared/RoundedButton/RoundedButton';
+import { useEffect, useRef, useState } from 'react';
+import { getAcceptedExtensions } from '../../../../constants/Files/FileExtensions';
+import maxFileSize from '../../../../constants/Files/FileMaxSize';
+import { getUploadUrls } from '../../../../controllers/FileService';
+import FileComponent from './FileComponent/FileComponent';
+function FileUploadStep(_a) {
+    var _b;
+    var step = _a.step, errors = _a.errors, postview = _a.postview, onChange = _a.onChange, formStyle = _a.formStyle, clearErrors = _a.clearErrors, originalValues = _a.originalValues;
+    var _c = useState(((_b = originalValues[step.id]) !== null && _b !== void 0 ? _b : []).map(function (file) {
+        var _a;
+        return ((_a = {
+            file: new File([], file.lblFile),
+            loading: 'DONE',
+        }) !== null && _a !== void 0 ? _a : []);
+    })), files = _c[0], setFiles = _c[1];
+    var _d = useState(undefined), fileUploaded = _d[0], setFileUploaded = _d[1];
+    var _e = useState([]), uploadedFiles = _e[0], setUploadedFiles = _e[1];
+    var inputRef = useRef();
+    useEffect(function () {
+        if (fileUploaded) {
+            var tempArray = __spreadArray(__spreadArray([], uploadedFiles, true), [fileUploaded], false);
+            onChange(tempArray);
+            clearErrors(step.id);
+            setUploadedFiles(tempArray);
+        }
+    }, [fileUploaded]);
+    function getUploadUrlsAsync(pFiles) {
+        return __awaiter(this, void 0, void 0, function () {
+            var largeFile, currentFiles, fileLinks_1, error_1;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        largeFile = pFiles.find(function (file) { return file.size > maxFileSize; });
+                        if (!largeFile) return [3 /*break*/, 1];
+                        console.error('FILE IS TOO LARGE', largeFile);
+                        return [3 /*break*/, 5];
+                    case 1:
+                        currentFiles = __spreadArray([], files, true);
+                        setFiles(__spreadArray(__spreadArray([], files, true), pFiles.map(function (file) {
+                            return ({
+                                loading: 'STARTING',
+                                file: file,
+                                postInfo: null,
+                            });
+                        }), true));
+                        _a.label = 2;
+                    case 2:
+                        _a.trys.push([2, 4, , 5]);
+                        return [4 /*yield*/, getUploadUrls(pFiles)];
+                    case 3:
+                        fileLinks_1 = _a.sent();
+                        setFiles(__spreadArray(__spreadArray([], currentFiles, true), pFiles.map(function (file, index) {
+                            return ({
+                                postInfo: fileLinks_1[index],
+                                loading: 'TRY_UPLOADING',
+                                file: file,
+                            });
+                        }), true));
+                        return [3 /*break*/, 5];
+                    case 4:
+                        error_1 = _a.sent();
+                        console.error('ERROR');
+                        return [3 /*break*/, 5];
+                    case 5: return [2 /*return*/];
+                }
+            });
+        });
+    }
+    return (_jsxs("div", __assign({ className: styles.container }, { children: [_jsx("div", __assign({ className: styles.labelLabel }, { children: step.label }), void 0), step.description && (_jsx("div", __assign({ className: styles.stepDescriptionLabel }, { children: step.description }), void 0)), _jsx("input", { type: "file", ref: inputRef, className: styles.filesInput, onChange: function (e) {
+                    var files = e.target.files;
+                    if (files) {
+                        var filesArray = Array.from(files);
+                        getUploadUrlsAsync(filesArray);
+                    }
+                }, multiple: true, accept: getAcceptedExtensions() }, void 0), _jsx("div", __assign({ className: styles.btnContainer }, { children: _jsx(RoundedButton, { disabled: postview, text: 'Examinar' + (step.required ? ' *' : ''), color: formStyle.primaryContrastColor, backgroundColor: formStyle.primaryColor, fontSize: '1rem', padding: '5px 15px 5px 15px', onClick: function () {
+                        if (!postview) {
+                            var input = inputRef.current;
+                            if (input !== null) {
+                                clearErrors(step.id);
+                                input.click();
+                            }
+                        }
+                    } }, void 0) }), void 0), !!errors[step.id] && (_jsx("div", __assign({ className: styles.errorMsg, style: { color: formStyle.errorColor } }, { children: "Este campo es obligatorio" }), void 0)), _jsx("div", __assign({ className: styles.filesContainer }, { children: files.map(function (file, index) { return (_jsx(FileComponent, { formStyle: formStyle, fileInfo: file, handleRemoveUploaded: function (fileToDelete) {
+                        var tempArray = uploadedFiles.filter(function (file) { return file.name !== fileToDelete.name; });
+                        var tempFiles = files.filter(function (file) {
+                            return file.postInfo.name !== fileToDelete.name;
+                        });
+                        setFiles(tempFiles);
+                        onChange(tempArray);
+                        setUploadedFiles(tempArray);
+                    }, handleUploaded: function (info) {
+                        setFileUploaded(info);
+                    } }, index)); }) }), void 0)] }), void 0));
+}
+function UploadStepComponent(props) {
+    return (_jsx(Controller, { name: props.step.id, control: props.control, defaultValue: [], rules: props.step.required
+            ? {
+                validate: function (array) { return array.length > 0; },
+            }
+            : {}, shouldUnregister: true, render: function (_a) {
+            var field = _a.field;
+            return (_jsx(FileUploadStep, __assign({}, props, { onChange: field.onChange }), void 0));
+        } }, void 0));
+}
+export default UploadStepComponent;