intelicoreact 1.5.41 → 1.6.0

package/dist/Atomic/FormElements/FileLoaderDescription/FileLoaderDescription.stories.js

@@ -0,0 +1,327 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    FileLoaderDescriptionTemplate: function() {
+        return FileLoaderDescriptionTemplate;
+    },
+    default: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _FileLoaderDescription = /*#__PURE__*/ _interop_require_default(require("./FileLoaderDescription"));
+require("../../../../../scss/main.scss");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+global.lng = 'en';
+const _default = {
+    title: 'Form Elements/FileLoaderDescription',
+    component: _FileLoaderDescription.default,
+    argTypes: {
+        accordionListContent: {
+            control: {
+                type: 'object'
+            },
+            description: 'The content of the accordion list'
+        },
+        accordionTitle: {
+            control: {
+                type: 'text'
+            },
+            description: 'The title of the accordion'
+        },
+        filesDescription: {
+            control: {
+                type: 'text'
+            },
+            description: 'Description of the accepted file formats and size limits'
+        },
+        documentName: {
+            control: {
+                type: 'text'
+            },
+            description: 'The name of the document'
+        },
+        onChange: {
+            action: 'onChange',
+            description: 'Callback function triggered on file change'
+        },
+        testId: {
+            control: {
+                type: 'text'
+            },
+            description: 'Test ID for the component'
+        },
+        className: {
+            control: {
+                type: 'text'
+            },
+            description: 'CSS class for custom styling'
+        },
+        files: {
+            control: {
+                type: 'object'
+            },
+            description: 'The files to be uploaded'
+        },
+        maxFilesCount: {
+            control: {
+                type: 'number'
+            },
+            description: 'Files quantity for upload'
+        },
+        isWithoutAccordion: {
+            control: {
+                type: 'boolean'
+            },
+            description: 'If true accordion doesn\'t rendered'
+        }
+    }
+};
+const MAX_FILE_SIZE = 10 * 1024 * 1024;
+const ACCEPT_EXTENSIONS_DEFAULT = ".jpg, .jpeg, .png, .pdf, .JPG, .JPEG, .PNG, .PDF";
+const mock = [
+    {
+        id: '1',
+        value: "image1.png",
+        base64: "cscdcscsdc",
+        maxItemSizeBytes: MAX_FILE_SIZE,
+        error: "",
+        isRequired: false,
+        accept: ACCEPT_EXTENSIONS_DEFAULT
+    },
+    {
+        id: '2',
+        value: "image2.png",
+        base64: "cscdcscsdc",
+        maxItemSizeBytes: MAX_FILE_SIZE,
+        error: "",
+        isRequired: false,
+        accept: ACCEPT_EXTENSIONS_DEFAULT
+    },
+    {
+        id: '3',
+        value: "image3.png",
+        base64: "cscdcscsdc",
+        maxItemSizeBytes: MAX_FILE_SIZE,
+        error: "",
+        isRequired: false,
+        accept: ACCEPT_EXTENSIONS_DEFAULT
+    },
+    {
+        id: '4',
+        value: "image4.png",
+        base64: "cscdcscsdc",
+        maxItemSizeBytes: MAX_FILE_SIZE,
+        error: "",
+        isRequired: false,
+        accept: ACCEPT_EXTENSIONS_DEFAULT
+    },
+    {
+        id: '5',
+        value: "image5.png",
+        base64: "cscdcscsdc",
+        maxItemSizeBytes: MAX_FILE_SIZE,
+        error: "",
+        isRequired: false,
+        accept: ACCEPT_EXTENSIONS_DEFAULT
+    },
+    {
+        id: '6',
+        value: "image6.png",
+        base64: "cscdcscsdc",
+        maxItemSizeBytes: MAX_FILE_SIZE,
+        error: "",
+        isRequired: false,
+        accept: ACCEPT_EXTENSIONS_DEFAULT
+    },
+    {
+        id: '7',
+        value: "image7.png",
+        base64: "cscdcscsdc",
+        maxItemSizeBytes: MAX_FILE_SIZE,
+        error: "",
+        isRequired: false,
+        accept: ACCEPT_EXTENSIONS_DEFAULT
+    },
+    {
+        id: '8',
+        value: "image8.png",
+        base64: "cscdcscsdc",
+        maxItemSizeBytes: MAX_FILE_SIZE,
+        error: "",
+        isRequired: false,
+        accept: ACCEPT_EXTENSIONS_DEFAULT
+    },
+    {
+        id: '9',
+        value: "image9.png",
+        base64: "cscdcscsdc",
+        maxItemSizeBytes: MAX_FILE_SIZE,
+        error: "",
+        isRequired: false,
+        accept: ACCEPT_EXTENSIONS_DEFAULT
+    },
+    {
+        id: '10',
+        value: "image10.png",
+        base64: "cscdcscsdc",
+        maxItemSizeBytes: MAX_FILE_SIZE,
+        error: "",
+        isRequired: false,
+        accept: ACCEPT_EXTENSIONS_DEFAULT
+    },
+    {
+        id: '11',
+        value: "image11.png",
+        base64: "cscdcscsdc",
+        maxItemSizeBytes: MAX_FILE_SIZE,
+        error: "",
+        isRequired: false,
+        accept: ACCEPT_EXTENSIONS_DEFAULT
+    }
+];
+const Template = (args)=>{
+    const [files, setFiles] = (0, _react.useState)(mock);
+    const [error, setError] = (0, _react.useState)(null);
+    const handleChange = (newFiles)=>{
+        setFiles(newFiles);
+    };
+    const setOuterError = ()=>{
+        const errorValue = true;
+        // const errorValue = 'Error !!!';
+        setError(errorValue);
+    };
+    const changeInitFields = ()=>{
+        const deductible = (Array.isArray(files) ? files : []).length > 2 ? 2 : 1;
+        if (files.length) {
+            setFiles((state)=>state.slice(0, state.length - deductible));
+        }
+    };
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+        children: [
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_FileLoaderDescription.default, {
+                ...args,
+                files: files,
+                onChange: handleChange,
+                error: error
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("br", {}),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("br", {}),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("br", {}),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("button", {
+                style: {
+                    padding: '8px',
+                    border: '1px solid black'
+                },
+                onClick: setOuterError,
+                children: "Set outer error"
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("br", {}),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("br", {}),
+            !!files.length && /*#__PURE__*/ (0, _jsxruntime.jsx)("button", {
+                style: {
+                    padding: '8px',
+                    border: '1px solid black'
+                },
+                onClick: changeInitFields,
+                children: "Change init fields"
+            })
+        ]
+    });
+};
+const FileLoaderDescriptionTemplate = Template.bind({});
+FileLoaderDescriptionTemplate.args = {
+    accordionListContent: [
+        {
+            title: 'W2 Income',
+            description: 'Most recent paystub(s) covering 30 days OR most recent bank statement reflecting employer deposit(s)'
+        },
+        {
+            title: 'Self-Employment/Contract Income',
+            description: 'Most recent 1099(s) OR most recent tax returns'
+        },
+        {
+            title: 'Retirement income',
+            description: 'Most recent Award letter OR 1099(s) OR W2(s)'
+        },
+        {
+            title: 'Social Security/Disability income',
+            description: 'Most recent award Letter OR most recent bank statement'
+        },
+        {
+            title: 'Rental Income',
+            description: 'Executed Lease Agreement OR most recent tax returns'
+        },
+        {
+            title: 'Alimony /Child Support/Separate Maintenance',
+            description: '6 bank statements reflecting deposits'
+        },
+        {
+            title: 'Investment income',
+            description: 'Most Recent 1099(s) OR Tax Returns'
+        }
+    ],
+    accordionTitle: 'There is a list of documents that we accept:',
+    filesDescription: 'Documents must be less than 10MB and must be in PDF, JPG, JPEG or PNG format.',
+    documentName: 'Document name',
+    testId: 'file-loader-description',
+    className: '',
+    maxFilesCount: undefined,
+    // maxFilesCount: 5,
+    // maxFilesCount: null,
+    isWithoutAccordion: false
+};

package/dist/Atomic/FormElements/FileLoaderLocal/FileLoaderLocal.js

@@ -1,146 +1,162 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
-exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _react = _interopRequireDefault(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _reactFeather = require("react-feather");
-var _utils = require("../../../Functions/utils");
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+const _reactfeather = require("react-feather");
+const _utils = require("../../../Functions/utils");
 require("./FileLoaderLocal.scss");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
 const MAX_FILE_SIZE = 10 * 1024 * 1024;
-const FileLoaderLocal = _ref => {
-  let {
-    groupId,
-    id,
-    fieldId,
-    fieldKey,
-    label,
-    error,
-    outerError,
-    isRequired,
-    accept,
-    onChange,
-    className,
-    value,
-    isNoTrashIcon = false,
-    maxItemSizeBytes,
-    testId = "file-loader-local",
-    attributesOfNativeInput = {}
-  } = _ref;
-  const getFileName = value => {
-    const result = value.match(/[^\\]+$/);
-    return result?.[0];
-  };
-  const renderRequiredLabel = () => {
-    if (!value) {
-      if (isRequired) return /*#__PURE__*/_react.default.createElement("div", {
-        className: "file-loader-local--required"
-      }, "Required");else return /*#__PURE__*/_react.default.createElement("div", {
-        className: "file-loader-local--optional"
-      }, "Optional");
-    }
-  };
-  const isFileSizeOutOfLimit = file => {
-    return file.size > maxItemSizeBytes ?? MAX_FILE_SIZE;
-  };
-  const checkExtension = valueExtension => {
-    return accept.includes(valueExtension);
-  };
-  const handle = {
-    change: e => {
-      const name = getFileName(e.target.value);
-      const valueExtension = name?.match(/[^\.]+$/)?.[0];
-      const fileName = name.split(".")?.[0];
-      const latinRegex = /^[A-Za-z\u00C0-\u00FF0-9!@#\$%\^\&*\)\(+=._-\s]+$/;
-      const file = e.target?.files?.[0];
-      if (isFileSizeOutOfLimit(e.target?.files?.[0])) {
-        onChange({
-          id,
-          name,
-          valueExtension,
-          e,
-          file,
-          groupId,
-          error: `Max file size is ${(0, _utils.renderFileSize)(maxItemSizeBytes)}`
-        });
-      } else if (!checkExtension(valueExtension)) {
-        const allowedExtensions = accept?.replace(/\./g, "")?.toUpperCase() || "JPG, PNG, PDF";
-        const uniqExts = (0, _utils.getUniqueFileExtensions)(allowedExtensions);
-        onChange({
-          id,
-          groupId,
-          name,
-          valueExtension,
-          e,
-          file,
-          error: `Only ${uniqExts} are allowed`
-        });
-      } else if (!latinRegex.test(fileName)) {
-        onChange({
-          id,
-          groupId,
-          name,
-          valueExtension,
-          e,
-          file,
-          error: `File name must be Latin characters only.`
-        });
-      } else onChange({
-        id,
-        groupId,
-        name,
-        valueExtension,
-        e,
-        file
-      });
-    }
-  };
-  return /*#__PURE__*/_react.default.createElement("div", {
-    "data-testid": testId,
-    className: (0, _classnames.default)("file-loader-local", className, {
-      ["file-loader-local_outer-error"]: Boolean(outerError)
-    })
-  }, (fieldId === "uploadTrigger" || !value) && /*#__PURE__*/_react.default.createElement("input", (0, _extends2.default)({
-    key: id,
-    onChange: handle.change,
-    className: "file-loader-local__file-input",
-    id: fieldKey || `file-input-${id}${groupId ? `-${groupId}` : ""}`,
-    type: "file",
-    name: fieldKey || id,
-    required: isRequired,
-    accept: accept
-  }, attributesOfNativeInput)), /*#__PURE__*/_react.default.createElement("label", {
-    className: (0, _classnames.default)("file-loader-local__label-box", {
-      "file-loader-local__label-box--upload-trigger": fieldId === "uploadTrigger" || !value
-    }),
-    htmlFor: fieldKey || `file-input-${id}${groupId ? `-${groupId}` : ""}`
-  }, !value && /*#__PURE__*/_react.default.createElement(_reactFeather.Download, {
-    className: "file-loader-local__upload-icon"
-  }), value && /*#__PURE__*/_react.default.createElement(_reactFeather.Paperclip, {
-    className: "file-loader-local__upload-icon"
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    title: value || label,
-    className: "file-loader-local__label-wrapper"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)("file-loader-local__label", {
-      "file-loader-local__label-filled": value
-    })
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    className: "file-loader-local__label-text"
-  }, value || label), error && /*#__PURE__*/_react.default.createElement("span", {
-    className: "file-loader-local__error"
-  }, error), typeof outerError === "string" && /*#__PURE__*/_react.default.createElement("span", {
-    className: "file-loader-local__error"
-  }, outerError))), value && !isNoTrashIcon && /*#__PURE__*/_react.default.createElement(_reactFeather.Trash2, {
-    className: "file-loader-local__trash-icon",
-    onClick: () => onChange({
-      id: fieldId,
-      groupId
-    })
-  }), renderRequiredLabel()));
+const FileLoaderLocal = ({ groupId, id, fieldId, fieldKey, label, error, outerError, isRequired, accept, onChange, className, value, isNoTrashIcon = false, maxItemSizeBytes, testId = "file-loader-local", attributesOfNativeInput = {} })=>{
+    const getFileName = (value)=>{
+        const result = value.match(/[^\\]+$/);
+        return result === null || result === void 0 ? void 0 : result[0];
+    };
+    const renderRequiredLabel = ()=>{
+        if (!value) {
+            if (isRequired) return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                className: "file-loader-local--required",
+                children: "Required"
+            });
+            else return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                className: "file-loader-local--optional",
+                children: "Optional"
+            });
+        }
+    };
+    const isFileSizeOutOfLimit = (file)=>{
+        var _ref;
+        return (_ref = file.size > maxItemSizeBytes) !== null && _ref !== void 0 ? _ref : MAX_FILE_SIZE;
+    };
+    const checkExtension = (valueExtension)=>{
+        return accept.includes(valueExtension);
+    };
+    const handle = {
+        change: (e)=>{
+            var _name_match, _name_split, _e_target_files, _e_target, _e_target_files1, _e_target1;
+            const name = getFileName(e.target.value);
+            const valueExtension = name === null || name === void 0 ? void 0 : (_name_match = name.match(/[^\.]+$/)) === null || _name_match === void 0 ? void 0 : _name_match[0];
+            const fileName = (_name_split = name.split(".")) === null || _name_split === void 0 ? void 0 : _name_split[0];
+            const latinRegex = /^[A-Za-z\u00C0-\u00FF0-9!@#\$%\^\&*\)\(+=._-\s]+$/;
+            const file = (_e_target = e.target) === null || _e_target === void 0 ? void 0 : (_e_target_files = _e_target.files) === null || _e_target_files === void 0 ? void 0 : _e_target_files[0];
+            if (isFileSizeOutOfLimit((_e_target1 = e.target) === null || _e_target1 === void 0 ? void 0 : (_e_target_files1 = _e_target1.files) === null || _e_target_files1 === void 0 ? void 0 : _e_target_files1[0])) {
+                onChange({
+                    id,
+                    name,
+                    valueExtension,
+                    e,
+                    file,
+                    groupId,
+                    error: `Max file size is ${(0, _utils.renderFileSize)(maxItemSizeBytes)}`
+                });
+            } else if (!checkExtension(valueExtension)) {
+                var _accept_replace;
+                const allowedExtensions = (accept === null || accept === void 0 ? void 0 : (_accept_replace = accept.replace(/\./g, "")) === null || _accept_replace === void 0 ? void 0 : _accept_replace.toUpperCase()) || "JPG, PNG, PDF";
+                const uniqExts = (0, _utils.getUniqueFileExtensions)(allowedExtensions);
+                onChange({
+                    id,
+                    groupId,
+                    name,
+                    valueExtension,
+                    e,
+                    file,
+                    error: `Only ${uniqExts} are allowed`
+                });
+            } else if (!latinRegex.test(fileName)) {
+                onChange({
+                    id,
+                    groupId,
+                    name,
+                    valueExtension,
+                    e,
+                    file,
+                    error: `File name must be Latin characters only.`
+                });
+            } else onChange({
+                id,
+                groupId,
+                name,
+                valueExtension,
+                e,
+                file
+            });
+        }
+    };
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+        "data-testid": testId,
+        className: (0, _classnames.default)("file-loader-local", className, {
+            ["file-loader-local_outer-error"]: Boolean(outerError)
+        }),
+        children: [
+            (fieldId === "uploadTrigger" || !value) && /*#__PURE__*/ (0, _jsxruntime.jsx)("input", {
+                onChange: handle.change,
+                className: "file-loader-local__file-input",
+                id: fieldKey || `file-input-${id}${groupId ? `-${groupId}` : ""}`,
+                type: "file",
+                name: fieldKey || id,
+                required: isRequired,
+                accept: accept,
+                ...attributesOfNativeInput
+            }, id),
+            /*#__PURE__*/ (0, _jsxruntime.jsxs)("label", {
+                className: (0, _classnames.default)("file-loader-local__label-box", {
+                    "file-loader-local__label-box--upload-trigger": fieldId === "uploadTrigger" || !value
+                }),
+                htmlFor: fieldKey || `file-input-${id}${groupId ? `-${groupId}` : ""}`,
+                children: [
+                    !value && /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.Download, {
+                        className: "file-loader-local__upload-icon"
+                    }),
+                    value && /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.Paperclip, {
+                        className: "file-loader-local__upload-icon"
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        title: value || label,
+                        className: "file-loader-local__label-wrapper",
+                        children: /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+                            className: (0, _classnames.default)("file-loader-local__label", {
+                                "file-loader-local__label-filled": value
+                            }),
+                            children: [
+                                /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                                    className: "file-loader-local__label-text",
+                                    children: value || label
+                                }),
+                                error && /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                                    className: "file-loader-local__error",
+                                    children: error
+                                }),
+                                typeof outerError === "string" && /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                                    className: "file-loader-local__error",
+                                    children: outerError
+                                })
+                            ]
+                        })
+                    }),
+                    value && !isNoTrashIcon && /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.Trash2, {
+                        className: "file-loader-local__trash-icon",
+                        onClick: ()=>onChange({
+                                id: fieldId,
+                                groupId
+                            })
+                    }),
+                    renderRequiredLabel()
+                ]
+            })
+        ]
+    });
 };
-var _default = exports.default = FileLoaderLocal;
+const _default = FileLoaderLocal;

package/dist/Atomic/FormElements/FileLoaderLocal/FileLoaderLocal.scss

@@ -79,21 +79,25 @@
     min-height: 16px;
     max-height: 16px;
 
-    color: #f06d8d;
     cursor: pointer;
+
+    color: #f06d8d;
   }
 
   &__label-wrapper {
     overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    margin-right: 8px;
     flex-grow: 1;
+
+    margin-right: 8px;
+
+    white-space: nowrap;
+    text-overflow: ellipsis;
   }
 
   &__label {
     display: flex;
     flex-direction: column;
+
     width: 100%;
   }