@ballistix.digital/react-components 0.8.3 → 0.10.0

package/dist/index.js

@@ -4726,34 +4726,40 @@ function reducer(state, action) {
 function noop() {}
 
 var FileInputGroupForm = function (props) {
-    var _a = props.name, name = _a === void 0 ? 'multiple-file-input' : _a, label = props.label, description = props.description, required = props.required, value = props.value, max = props.max, error = props.error, isDisabled = props.isDisabled, _b = props.isRequired, isRequired = _b === void 0 ? false : _b, _c = props.isTouched, isTouched = _c === void 0 ? false : _c, children = props.children, onChange = props.onChange, onBlur = props.onBlur, stylesOverrides = props.styles;
+    var _a = props.name, name = _a === void 0 ? 'multiple-file-input' : _a, label = props.label, description = props.description, required = props.required, value = props.value, max = props.max, error = props.error, isDisabled = props.isDisabled, _b = props.isRequired, isRequired = _b === void 0 ? false : _b, _c = props.isTouched, isTouched = _c === void 0 ? false : _c, _d = props.isMulti, isMulti = _d === void 0 ? false : _d, children = props.children, onChange = props.onChange, onBlur = props.onBlur, stylesOverrides = props.styles;
     var isValid = error === undefined;
-    var _d = React.useState(false), isDragging = _d[0], setIsDragging = _d[1];
-    var handleChangeInput = React.useCallback(function (file) {
-        var reader = new FileReader();
-        reader === null || reader === void 0 ? void 0 : reader.readAsDataURL(file);
-        reader.onload = function () {
-            var result = {
-                name: file.name,
-                size: file.size,
-                type: file.type,
-                blob: reader === null || reader === void 0 ? void 0 : reader.result,
-                file: file,
+    var _e = React.useState(false), isDragging = _e[0], setIsDragging = _e[1];
+    var handleChangeInput = React.useCallback(function (files) {
+        var results = [];
+        lodash.forEach(files, function (file, index, files) {
+            var reader = new FileReader();
+            reader === null || reader === void 0 ? void 0 : reader.readAsDataURL(file);
+            reader.onload = function () {
+                var result = {
+                    name: file.name,
+                    size: file.size,
+                    type: file.type,
+                    blob: reader === null || reader === void 0 ? void 0 : reader.result,
+                    file: file,
+                };
+                // eg. 10 * 1024 * 1024
+                if (max && max * 1024 * 1024 < result.size) {
+                    return;
+                }
+                results.push(result);
+                if (index === files.length - 1) {
+                    onChange(results);
+                }
             };
-            // eg. 10 * 1024 * 1024
-            if (max && max * 1024 * 1024 < result.size) {
-                return;
-            }
-            onChange(result);
-        };
+        });
     }, [max, onChange]);
     var onDrop = React.useCallback(function (files) {
         setIsDragging(false);
-        handleChangeInput(files[0]);
+        handleChangeInput(files);
     }, [handleChangeInput]);
-    var _e = useDropzone({
+    var _f = useDropzone({
         onDrop: onDrop,
-        multiple: false,
+        multiple: isMulti,
         onError: function () {
             // console.log('error');
             // setFieldError('file', t('component.form.error.multipleFiles') as string);
@@ -4764,7 +4770,7 @@ var FileInputGroupForm = function (props) {
         onDragLeave: function () {
             setIsDragging(false);
         },
-    }), getRootProps = _e.getRootProps, getInputProps = _e.getInputProps;
+    }), getRootProps = _f.getRootProps, getInputProps = _f.getInputProps;
     var handleGenerateStyle = function () {
         var result = deepCopyObject(styles$3.base);
         var keys = calculateNestedKeys(styles$3.base);