@react-fabric/form 1.0.0-beta.0

package/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2024 React Fabric, Adarsh Pastakia
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,10 @@
+# React-Fabric Form Module
+
+#### Install
+
+```bash
+# Using
+yarn add @react-fabric/form
+```
+
+#### Usage

package/dist/cjs/builder/FileField.js

@@ -0,0 +1,131 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _asyncToGenerator = require('@babel/runtime/helpers/asyncToGenerator');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var _regeneratorRuntime = require('@babel/runtime/regenerator');
+var core = require('@react-fabric/core');
+var utilities = require('@react-fabric/utilities');
+var react = require('react');
+var useFileUploader = require('../hooks/useFileUploader.js');
+var Field = require('../input/Field.js');
+var Hidden = require('../input/Hidden.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+var _excluded = ["uploadHandler", "inline", "label", "accept", "multiple", "value"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var FileField = function FileField(_ref) {
+  var uploadHandler = _ref.uploadHandler,
+    inline = _ref.inline,
+    label = _ref.label,
+    accept = _ref.accept,
+    _ref$multiple = _ref.multiple,
+    multiple = _ref$multiple === void 0 ? false : _ref$multiple,
+    value = _ref.value,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var _useFileUploader = useFileUploader.useFileUploader( /*#__PURE__*/function () {
+      var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(data, config) {
+        return _regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              _context.next = 2;
+              return uploadHandler === null || uploadHandler === void 0 ? void 0 : uploadHandler(data, config);
+            case 2:
+              return _context.abrupt("return", _context.sent);
+            case 3:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee);
+      }));
+      return function (_x, _x2) {
+        return _ref2.apply(this, arguments);
+      };
+    }(), value, multiple),
+    pending = _useFileUploader.pending,
+    files = _useFileUploader.files,
+    list = _useFileUploader.list,
+    upload = _useFileUploader.upload,
+    remove = _useFileUploader.remove;
+  return /*#__PURE__*/jsxRuntime.jsxs(react.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsxs(Field.Field, {
+      plain: true,
+      inline: inline,
+      label: label,
+      className: "inline-block",
+      children: [/*#__PURE__*/jsxRuntime.jsx(Hidden.HiddenInput, _objectSpread({
+        hiddenValue: multiple ? list : list === null || list === void 0 ? void 0 : list[0]
+      }, rest)), /*#__PURE__*/jsxRuntime.jsx("span", {
+        children: /*#__PURE__*/jsxRuntime.jsx(core.Button, {
+          badge: pending > 0 ? "".concat(pending) : undefined,
+          "data-ref": "filebtn",
+          children: /*#__PURE__*/jsxRuntime.jsxs(react.Fragment, {
+            children: [/*#__PURE__*/jsxRuntime.jsx("span", {
+              children: "Add file"
+            }), /*#__PURE__*/jsxRuntime.jsx("input", {
+              type: "file",
+              accept: accept,
+              multiple: multiple,
+              className: "absolute inset-0 opacity-0 z-5",
+              onChange: function onChange(e) {
+                return [upload(e.target.files), e.target.value = ""];
+              }
+            })]
+          })
+        })
+      })]
+    }), /*#__PURE__*/jsxRuntime.jsx("br", {}), /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "bg-alternate",
+      children: files.map(function (file, idx) {
+        return /*#__PURE__*/jsxRuntime.jsxs("div", {
+          className: "px-2 py-1",
+          children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+            className: "flex flex-nowrap gap-1 items-start",
+            children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+              className: "flex-1 truncate pe-2",
+              children: [file.filename, /*#__PURE__*/jsxRuntime.jsx("br", {}), /*#__PURE__*/jsxRuntime.jsx("span", {
+                className: "text-xs",
+                children: utilities.FileUtil.mime(file.mime)
+              }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                className: "text-xs px-1",
+                children: utilities.Format.bytes(file.size)
+              })]
+            }), /*#__PURE__*/jsxRuntime.jsx("div", {
+              className: "flex-initial truncate px-2",
+              children: file.error && /*#__PURE__*/jsxRuntime.jsx("span", {
+                className: "text-danger-600",
+                children: file.error
+              })
+            }), file.progress && /*#__PURE__*/jsxRuntime.jsx(core.Icon, {
+              icon: "mdi mdi-stop-circle",
+              bg: "danger",
+              color: "white",
+              size: "sm",
+              className: "p-[2px]",
+              "aria-label": "abort",
+              onClick: function onClick() {
+                var _file$abort;
+                return (_file$abort = file.abort) === null || _file$abort === void 0 ? void 0 : _file$abort.call(file);
+              }
+            }), !file.progress && /*#__PURE__*/jsxRuntime.jsx(core.Icon, {
+              icon: "mdi mdi-trash-can",
+              color: "danger",
+              size: "sm",
+              "aria-label": "remove",
+              onClick: function onClick() {
+                return remove(file.key);
+              }
+            })]
+          }), file.progress && /*#__PURE__*/jsxRuntime.jsx(core.ProgressBar, {
+            animate: true,
+            value: file.progress * 100,
+            size: "xxs"
+          })]
+        }, idx);
+      })
+    })]
+  });
+};
+
+exports.FileField = FileField;

package/dist/cjs/builder/FormField.js

@@ -0,0 +1,119 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var react = require('react');
+var reactI18next = require('react-i18next');
+var Controller = require('../form/Controller.js');
+var ArrayInput = require('../input/ArrayInput.js');
+var AvatarInput = require('../input/AvatarInput.js');
+var ColorInput = require('../input/ColorInput.js');
+var Input = require('../input/Input.js');
+var Number = require('../input/Number.js');
+var Range = require('../input/Range.js');
+var Switch = require('../input/Switch.js');
+var Textarea = require('../input/Textarea.js');
+var Select = require('../select/Select.js');
+var FileField = require('./FileField.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+var _excluded = ["id", "label", "required", "inline", "prefix", "autoFocus", "defaultValue", "fileUrl", "uploadHandler"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var FormField = function FormField(_ref) {
+  var id = _ref.id,
+    label = _ref.label,
+    required = _ref.required,
+    inline = _ref.inline,
+    prefix = _ref.prefix,
+    autoFocus = _ref.autoFocus;
+    _ref.defaultValue;
+    var fileUrl = _ref.fileUrl,
+    uploadHandler = _ref.uploadHandler,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var fieldName = react.useMemo(function () {
+    return [prefix, id].filter(Boolean).join(".");
+  }, [id, prefix]);
+  var E = react.useMemo(function () {
+    if (rest.datatype === "number" || rest.datatype === "decimal") return Number.Number;
+    if (rest.datatype === "range") return Range.Range;
+    if (rest.datatype === "boolean") return Switch.Switch;
+    if (rest.datatype === "text") return Textarea.Textarea;
+    if (rest.datatype === "color") return ColorInput.ColorInput;
+    if (rest.datatype === "string" && rest.options) return Select.Select;
+    return Input.Input;
+  }, [rest.datatype]);
+  var props = react.useMemo(function () {
+    var _rest$step, _rest$step2, _rest$min, _rest$max, _rest$step3;
+    if (rest.datatype === "number") return {
+      min: rest.min,
+      max: rest.max,
+      step: (_rest$step = rest.step) !== null && _rest$step !== void 0 ? _rest$step : 1
+    };
+    if (rest.datatype === "decimal") return {
+      min: rest.min,
+      max: rest.max,
+      step: (_rest$step2 = rest.step) !== null && _rest$step2 !== void 0 ? _rest$step2 : 0.1
+    };
+    if (rest.datatype === "range") return {
+      min: (_rest$min = rest.min) !== null && _rest$min !== void 0 ? _rest$min : 1,
+      max: (_rest$max = rest.max) !== null && _rest$max !== void 0 ? _rest$max : 99,
+      step: (_rest$step3 = rest.step) !== null && _rest$step3 !== void 0 ? _rest$step3 : 1,
+      showValue: true,
+      showLabels: true
+    };
+    if (rest.datatype === "text") return {
+      rows: 3
+    };
+    if (rest.datatype === "color") return {
+      showPicker: true
+    };
+    if (rest.datatype === "string" && rest.options) return {
+      options: rest.options,
+      multiple: rest.multiple,
+      searchable: true
+    };
+    return {};
+  }, [rest]);
+  if (rest.datatype === "avatar") return uploadHandler && /*#__PURE__*/jsxRuntime.jsx(Controller.Controller, {
+    name: fieldName,
+    children: /*#__PURE__*/jsxRuntime.jsx(AvatarInput.AvatarInput, {
+      uploadHandler: uploadHandler,
+      fileUrl: fileUrl,
+      name: fieldName
+    })
+  });
+  if (rest.datatype === "file") return uploadHandler && /*#__PURE__*/jsxRuntime.jsx(Controller.Controller, {
+    name: fieldName,
+    children: /*#__PURE__*/jsxRuntime.jsx(FileField.FileField, _objectSpread({
+      uploadHandler: uploadHandler,
+      inline: inline,
+      label: label,
+      id: id
+    }, rest))
+  });
+  return rest.multiple && !("options" in rest) ? /*#__PURE__*/jsxRuntime.jsx(ArrayInput.ArrayInput, {
+    name: fieldName,
+    label: t(label, label),
+    required: required,
+    onAdd: function onAdd() {
+      return "";
+    },
+    children: /*#__PURE__*/jsxRuntime.jsx(Controller.Controller, {
+      children: /*#__PURE__*/jsxRuntime.jsx(E, _objectSpread({}, props))
+    })
+  }) : /*#__PURE__*/jsxRuntime.jsx(Controller.Controller, {
+    name: fieldName,
+    children: /*#__PURE__*/jsxRuntime.jsx(E, _objectSpread(_objectSpread({}, props), {}, {
+      autoFocus: autoFocus,
+      label: t(label, label),
+      placeholder: t(label, label),
+      required: required,
+      inline: inline
+    }))
+  });
+};
+
+exports.FormField = FormField;

package/dist/cjs/form/Controller.js

@@ -0,0 +1,64 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var react = require('react');
+var reactHookForm = require('react-hook-form');
+var jsxRuntime = require('react/jsx-runtime');
+
+var _excluded = ["name", "children"],
+  _excluded2 = ["ref", "onChange"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var Controller = function Controller(_ref) {
+  var name = _ref.name,
+    children = _ref.children,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  if (!name) throw Error("Form Controller missing `name` prop");
+  return /*#__PURE__*/jsxRuntime.jsx(reactHookForm.Controller, {
+    name: name,
+    render: function render(_ref2) {
+      var _error$message;
+      var _ref2$field = _ref2.field,
+        _ref3 = _ref2$field.ref,
+        _onChange = _ref2$field.onChange,
+        field = _objectWithoutProperties(_ref2$field, _excluded2),
+        error = _ref2.fieldState.error,
+        isSubmitting = _ref2.formState.isSubmitting;
+      return /*#__PURE__*/react.isValidElement(children) ? /*#__PURE__*/react.cloneElement(react.Children.only(children), _objectSpread(_objectSpread(_objectSpread({}, field), rest), {}, {
+        ref: function ref(el) {
+          el && _ref3(el);
+          try {
+            var _children$props$ref;
+            if (children.props.ref && "current" in children.props.ref) children.props.ref.current = el;
+            if ((_children$props$ref = children.props.ref) !== null && _children$props$ref !== void 0 && _children$props$ref.prototype) children.props.ref(el);
+          } catch (_) {
+            //
+          }
+        },
+        checked: !!field.value,
+        readOnly: isSubmitting || children.props.readOnly,
+        invalid: !!(error !== null && error !== void 0 && error.message) || children.props.invalid,
+        error: (_error$message = error === null || error === void 0 ? void 0 : error.message) !== null && _error$message !== void 0 ? _error$message : children.props.error,
+        onChange: function onChange(v) {
+          var _children$props$onCha, _children$props;
+          _onChange(v);
+          (_children$props$onCha = (_children$props = children.props).onChange) === null || _children$props$onCha === void 0 || _children$props$onCha.call(_children$props, v);
+        }
+      })) : children(_objectSpread(_objectSpread(_objectSpread({}, field), rest), {}, {
+        inputRef: function inputRef(el) {
+          el && _ref3(el);
+        },
+        readOnly: isSubmitting,
+        invalid: !!(error !== null && error !== void 0 && error.message),
+        checked: !!field.value,
+        error: error === null || error === void 0 ? void 0 : error.message,
+        onChange: function onChange(v) {
+          _onChange(v);
+        }
+      }));
+    }
+  });
+};
+
+exports.Controller = Controller;

package/dist/cjs/form/Form.js

@@ -0,0 +1,128 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _asyncToGenerator = require('@babel/runtime/helpers/asyncToGenerator');
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var _regeneratorRuntime = require('@babel/runtime/regenerator');
+var yup = require('@hookform/resolvers/yup');
+var core = require('@react-fabric/core');
+var react = require('react');
+var reactHookForm = require('react-hook-form');
+var jsxRuntime = require('react/jsx-runtime');
+
+var _excluded = ["formRef", "schema", "children", "defaultValues", "onSubmit", "onChange"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var DEFAULT_SUBMIT = function DEFAULT_SUBMIT() {
+  return undefined;
+};
+var Form = function Form(_ref) {
+  var formRef = _ref.formRef,
+    schema = _ref.schema,
+    children = _ref.children,
+    defaultValues = _ref.defaultValues,
+    _ref$onSubmit = _ref.onSubmit,
+    onSubmit = _ref$onSubmit === void 0 ? DEFAULT_SUBMIT : _ref$onSubmit,
+    onChange = _ref.onChange,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var ref = react.useRef(null);
+  var form = reactHookForm.useForm({
+    shouldFocusError: true,
+    resolver: schema && yup.yupResolver(schema),
+    defaultValues: defaultValues
+  });
+  var _useTransition = react.useTransition(),
+    _useTransition2 = _slicedToArray(_useTransition, 2),
+    startTransition = _useTransition2[1];
+  var changeHandler = core.useDebounce(onChange, [onChange]);
+  react.useEffect(function () {
+    var subscription = form.watch(function (value) {
+      startTransition(function () {
+        return changeHandler === null || changeHandler === void 0 ? void 0 : changeHandler(value);
+      });
+    });
+    return function () {
+      return subscription.unsubscribe();
+    };
+  }, [form.watch, changeHandler]);
+  var handleReset = react.useCallback(function () {
+    var _ref$current;
+    var reset = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    form.reset(reset);
+    form.clearErrors();
+    (_ref$current = ref.current) === null || _ref$current === void 0 || (_ref$current = _ref$current.querySelector("[auto-focus], input, textarea")) === null || _ref$current === void 0 || _ref$current.focus();
+  }, [defaultValues]);
+  react.useImperativeHandle(formRef, function () {
+    return {
+      state: form.formState,
+      reset: function reset() {
+        return handleReset(defaultValues);
+      },
+      clear: function clear() {
+        return handleReset();
+      },
+      submit: function submit() {
+        return form.handleSubmit(onSubmit);
+      },
+      validate: function () {
+        var _validate = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+          return _regeneratorRuntime.wrap(function _callee$(_context) {
+            while (1) switch (_context.prev = _context.next) {
+              case 0:
+                _context.next = 2;
+                return form.trigger();
+              case 2:
+                return _context.abrupt("return", _context.sent);
+              case 3:
+              case "end":
+                return _context.stop();
+            }
+          }, _callee);
+        }));
+        function validate() {
+          return _validate.apply(this, arguments);
+        }
+        return validate;
+      }(),
+      getValues: function getValues() {
+        return form.getValues();
+      },
+      setValues: function setValues(v) {
+        return form.reset(v);
+      },
+      setValue: function setValue(k, v) {
+        return form.setValue(k, v, {
+          shouldDirty: false,
+          shouldTouch: false
+        });
+      }
+    };
+  }, [onSubmit, form, form.formState, defaultValues]);
+  var onInvalid = react.useCallback(function (_, e) {
+    var el = e.target;
+    setTimeout(function () {
+      var _el$querySelector;
+      return (_el$querySelector = el.querySelector("input[aria-invalid='true'],textarea[aria-invalid='true']")) === null || _el$querySelector === void 0 ? void 0 : _el$querySelector.focus();
+    }, 10);
+  }, []);
+  return /*#__PURE__*/jsxRuntime.jsx(reactHookForm.FormProvider, _objectSpread(_objectSpread({}, form), {}, {
+    children: /*#__PURE__*/jsxRuntime.jsxs("form", _objectSpread(_objectSpread({
+      ref: ref,
+      onReset: function onReset() {
+        return handleReset(defaultValues);
+      },
+      onSubmit: form.handleSubmit(onSubmit, onInvalid),
+      "data-loading": form.formState.isSubmitting,
+      className: "contents",
+      autoComplete: "off"
+    }, rest), {}, {
+      children: [children, /*#__PURE__*/jsxRuntime.jsx("input", {
+        type: "submit",
+        className: "absolute invisible"
+      })]
+    }))
+  }));
+};
+
+exports.Form = Form;

package/dist/cjs/hooks/useFileUploader.js

@@ -0,0 +1,204 @@
+'use strict';
+
+var _asyncToGenerator = require('@babel/runtime/helpers/asyncToGenerator');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var _regeneratorRuntime = require('@babel/runtime/regenerator');
+var utilities = require('@react-fabric/utilities');
+var react = require('react');
+
+var _excluded = ["progress", "abort"],
+  _excluded2 = ["file", "progress", "abort"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var useFileUploader = function useFileUploader(uploader, initialList) {
+  var multiple = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+  var _useReducer = react.useReducer(function (state, action) {
+      if (action.type === "start") {
+        if (!multiple) state.files.clear();
+        state.files.set(action.key, action.file);
+        state.count++;
+      }
+      if (action.type === "stop") {
+        var fileObject = state.files.get(action.key);
+        if (fileObject) {
+          fileObject.progress;
+            fileObject.abort;
+            var rest = _objectWithoutProperties(fileObject, _excluded);
+          state.files.set(action.key, _objectSpread(_objectSpread({}, rest), {}, {
+            path: action.path,
+            uploaded: true
+          }));
+        }
+        state.count--;
+      }
+      if (action.type === "error") {
+        var _fileObject = state.files.get(action.key);
+        if (_fileObject) {
+          _fileObject.file;
+            _fileObject.progress;
+            _fileObject.abort;
+            var _rest = _objectWithoutProperties(_fileObject, _excluded2);
+          state.files.set(action.key, _objectSpread(_objectSpread({}, _rest), {}, {
+            error: action.error
+          }));
+        }
+        state.count--;
+      }
+      if (action.type === "progress") {
+        var _fileObject2 = state.files.get(action.key);
+        if (_fileObject2) {
+          _fileObject2.progress = action.progress;
+          state.files.set(action.key, _fileObject2);
+        }
+        state.count--;
+      }
+      if (action.type === "abort") {
+        state.files["delete"](action.key);
+      }
+      if (action.type === "remove") {
+        state.files["delete"](action.key);
+      }
+      state.list = Array.from(state.files.values()).map(function (file) {
+        return !file.progress && !file.error && {
+          key: file.key,
+          path: file.path,
+          mime: file.mime,
+          size: file.size,
+          uploaded: file.uploaded,
+          filename: file.filename
+        };
+      }).filter(Boolean);
+      return _objectSpread({}, state);
+    }, {
+      files: new Map(),
+      count: 0
+    }, function (state) {
+      if (initialList) {
+        if (utilities.isString(initialList)) {
+          var key = utilities.uuid();
+          state.files.set(key, {
+            key: key,
+            path: initialList,
+            filename: "",
+            size: 0,
+            mime: ""
+          });
+        }
+        if (utilities.isObject(initialList)) {
+          var _key = utilities.uuid();
+          state.files.set(_key, _objectSpread(_objectSpread({}, initialList), {}, {
+            key: _key
+          }));
+        }
+        if (utilities.isArray(initialList)) {
+          initialList.forEach(function (file) {
+            var key = utilities.uuid();
+            state.files.set(key, _objectSpread(_objectSpread({}, file), {}, {
+              key: key
+            }));
+          });
+        }
+      }
+      state.list = Array.from(state.files.values());
+      return state;
+    }),
+    _useReducer2 = _slicedToArray(_useReducer, 2),
+    state = _useReducer2[0],
+    dispatch = _useReducer2[1];
+  var doUpload = react.useCallback( /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(key, file) {
+      var data, _abort2;
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            data = new FormData();
+            data.append("file", file);
+            _abort2 = new AbortController();
+            dispatch({
+              type: "start",
+              key: key,
+              file: {
+                key: key,
+                file: file,
+                progress: 0.001,
+                mime: file.type,
+                filename: file.name,
+                size: file.size,
+                abort: function abort() {
+                  return _abort2.abort();
+                }
+              }
+            });
+            _context.next = 6;
+            return uploader(data, {
+              signal: _abort2.signal,
+              onUploadProgress: function onUploadProgress(progressEvent) {
+                var _progressEvent$progre;
+                dispatch({
+                  type: "progress",
+                  key: key,
+                  progress: (_progressEvent$progre = progressEvent.progress) !== null && _progressEvent$progre !== void 0 ? _progressEvent$progre : 0
+                });
+              }
+            }).then(function (path) {
+              dispatch({
+                type: "stop",
+                key: key,
+                path: path
+              });
+            })["catch"](function (error) {
+              var _error$message;
+              if (error.code === "ERR_CANCELED" || error.name === "AbortError") {
+                return dispatch({
+                  type: "abort",
+                  key: key
+                });
+              }
+              dispatch({
+                type: "error",
+                key: key,
+                error: (_error$message = error === null || error === void 0 ? void 0 : error.message) !== null && _error$message !== void 0 ? _error$message : "form:fileUploadFailed"
+              });
+            });
+          case 6:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function (_x, _x2) {
+      return _ref.apply(this, arguments);
+    };
+  }(), []);
+  var upload = react.useCallback(function (files) {
+    if (!multiple) {
+      var _Array$from$, _Array$from$$abort;
+      (_Array$from$ = Array.from(state.files.values())[0]) === null || _Array$from$ === void 0 || (_Array$from$$abort = _Array$from$.abort) === null || _Array$from$$abort === void 0 || _Array$from$$abort.call(_Array$from$);
+    }
+    Array.from(files !== null && files !== void 0 ? files : []).slice(0, multiple ? undefined : 1).forEach(function (file) {
+      void doUpload(utilities.uuid(), file);
+    });
+  }, [multiple]);
+  var retry = react.useCallback(function (key) {
+    var fileObject = state.files.get(key);
+    void ((fileObject === null || fileObject === void 0 ? void 0 : fileObject.file) && doUpload(key, fileObject.file));
+  }, [state]);
+  var remove = react.useCallback(function (key) {
+    dispatch({
+      type: "remove",
+      key: key
+    });
+  }, [state]);
+  return {
+    upload: upload,
+    remove: remove,
+    retry: retry,
+    pending: state.count,
+    list: state.list,
+    files: Array.from(state.files.values())
+  };
+};
+
+exports.useFileUploader = useFileUploader;