@digigov/form 1.0.0-8ae63a77 → 1.0.0-8b33e4c8

package/cjs/inputs/Checkboxes/index.js

@@ -0,0 +1,127 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Checkboxes = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _ = require("../..");
+
+var _reactCore = require("@digigov/react-core");
+
+var _Checkbox = _interopRequireDefault(require("@digigov/react-core/Checkbox"));
+
+var _CheckboxItem = _interopRequireDefault(require("@digigov/react-core/CheckboxItem"));
+
+var _Hint = _interopRequireDefault(require("@digigov/react-core/Hint"));
+
+var _i18n = require("@digigov/ui/i18n");
+
+var _excluded = ["name", "onChange", "value", "extra", "disabled"],
+    _excluded2 = ["label", "value", "show", "disabled", "selected"];
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(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 = {}; 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; }
+
+var Checkboxes = function Checkboxes(_ref) {
+  var name = _ref.name,
+      onChange = _ref.onChange,
+      value = _ref.value,
+      _ref$extra = _ref.extra,
+      options = _ref$extra.options,
+      className = _ref$extra.className,
+      disabled = _ref.disabled,
+      props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  if (!value) value = [];
+
+  var handleChange = function handleChange(optionValue, idx, show) {
+    return function (evt) {
+      var newValue;
+
+      if (evt.currentTarget.checked) {
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        newValue = value.concat([optionValue]);
+      } else {
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        newValue = value.filter(function (val) {
+          return val !== optionValue;
+        });
+      }
+
+      if (show && show.length > 0) {
+        setChecked(function (items) {
+          return items.map(function (item, index) {
+            return index === idx ? !item : item;
+          });
+        });
+      } // reset value to undefined instead of an empty array
+      // so the error state mechanism can throw validation errors
+
+
+      if (newValue.length === 0) newValue = undefined;
+      onChange(newValue);
+    };
+  };
+
+  var _useTranslation = (0, _i18n.useTranslation)(),
+      t = _useTranslation.t;
+
+  var _useState = (0, _react.useState)(Array(options.length).fill(false)),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+      checked = _useState2[0],
+      setChecked = _useState2[1];
+
+  return /*#__PURE__*/_react["default"].createElement(_Checkbox["default"], {
+    className: className
+  }, options.map(function (_ref2, index) {
+    var _value;
+
+    var label = _ref2.label,
+        v = _ref2.value,
+        show = _ref2.show,
+        optionDisabled = _ref2.disabled,
+        selected = _ref2.selected,
+        option = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
+    return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, {
+      key: index
+    }, /*#__PURE__*/_react["default"].createElement(_CheckboxItem["default"], (0, _extends2["default"])({
+      key: "".concat(name, ".").concat(index),
+      name: name,
+      value: v,
+      disabled: disabled || optionDisabled,
+      checked: (_value = value) === null || _value === void 0 ? void 0 : _value.includes(v),
+      onChange: handleChange(v, index, show)
+    }, option, (0, _extends2["default"])({}, props, {
+      reset: undefined,
+      defaultValue: undefined,
+      onBlur: undefined,
+      required: undefined,
+      'aria-describedby': undefined,
+      type: 'checkbox'
+    })), label && label.primary && t(label.primary) || value, label && label.secondary && /*#__PURE__*/_react["default"].createElement(_Hint["default"], null, t(label.secondary))), !!checked[index] && show && /*#__PURE__*/_react["default"].createElement(_reactCore.CheckboxConditional, null, show.map(function (fieldName) {
+      return /*#__PURE__*/_react["default"].createElement(_.Field, {
+        name: fieldName,
+        key: fieldName
+      });
+    })), selected && selected());
+  }));
+};
+
+exports.Checkboxes = Checkboxes;
+var _default = Checkboxes;
+exports["default"] = _default;

package/cjs/inputs/DateInput/DateInput.stories.js

@@ -0,0 +1,31 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+exports["default"] = void 0;
+
+var _ = _interopRequireDefault(require("./"));
+
+var _Default = require("./__stories__/Default");
+
+Object.keys(_Default).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Default[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Default[key];
+    }
+  });
+});
+var _default = {
+  title: 'Digigov Form/inputs/DateInput',
+  component: _["default"],
+  displayName: 'DateInput'
+};
+exports["default"] = _default;

package/cjs/inputs/DateInput/__stories__/Default.js

@@ -0,0 +1,45 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ = _interopRequireWildcard(require("../../.."));
+
+var _Button = require("@digigov/ui/form/Button");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(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 = {}; 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; }
+
+var _ref = /*#__PURE__*/_react["default"].createElement(_Button.Button, {
+  type: "submit"
+}, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1");
+
+var Default = function Default() {
+  return /*#__PURE__*/_react["default"].createElement(_["default"], {
+    onSubmit: function onSubmit(data) {
+      console.log(data);
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_.Field, {
+    key: 'string',
+    name: "string",
+    type: "date",
+    required: true,
+    label: {
+      primary: 'Πότε εκδόθηκε το διαβατήριο σας;',
+      secondary: 'Για παράδειγμα, 05 11 2020'
+    }
+  }), _ref);
+};
+
+exports.Default = Default;
+var _default = Default;
+exports["default"] = _default;

package/cjs/inputs/DateInput/index.js

@@ -0,0 +1,181 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.DateInput = void 0;
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _dayjs = _interopRequireDefault(require("dayjs"));
+
+var _customParseFormat = _interopRequireDefault(require("dayjs/plugin/customParseFormat"));
+
+var _DateInputContainer = _interopRequireDefault(require("@digigov/react-core/DateInputContainer"));
+
+var _DateInputItem = _interopRequireDefault(require("@digigov/react-core/DateInputItem"));
+
+var _i18n = require("@digigov/ui/i18n");
+
+var _excluded = ["label"],
+    _excluded2 = ["name", "type"];
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(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 = {}; 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; }
+
+_dayjs["default"].extend(_customParseFormat["default"]);
+
+function useDate(value, onChange) {
+  var _useMemo = (0, _react.useMemo)(function () {
+    if (!value || value.length === 0) {
+      onChange('');
+      return ['', '', ''];
+    }
+
+    var _value$split = value.split('/'),
+        _value$split2 = (0, _slicedToArray2["default"])(_value$split, 3),
+        day = _value$split2[0],
+        month = _value$split2[1],
+        year = _value$split2[2];
+
+    return [year, month, day];
+  }, [value]),
+      _useMemo2 = (0, _slicedToArray2["default"])(_useMemo, 3),
+      year = _useMemo2[0],
+      month = _useMemo2[1],
+      day = _useMemo2[2];
+
+  function set(year, month, day) {
+    var value = "".concat(day || '', "/").concat(month || '', "/").concat(year || '');
+
+    if (!year && !month && !day) {
+      onChange(null);
+    } else {
+      onChange(value);
+    }
+  }
+
+  function setYear(evt) {
+    var val = evt.target.value;
+    set(val, month, day);
+  }
+
+  function setMonth(evt, cast) {
+    var val = evt.target.value;
+
+    if (cast && val && val.length === 1) {
+      val = '0' + val;
+    }
+
+    set(year, val, day);
+  }
+
+  function setDay(evt, cast) {
+    var val = evt.target.value;
+
+    if (cast && val && val.length === 1) {
+      val = '0' + val;
+    }
+
+    set(year, month, val);
+  }
+
+  return {
+    day: day,
+    month: month,
+    year: year,
+    setYear: setYear,
+    setMonth: setMonth,
+    setDay: setDay
+  };
+}
+
+var VALID_FORMATS = ['DD/MM/YYYY'];
+
+var makeDate = function makeDate(val) {
+  var date = (0, _dayjs["default"])(val, VALID_FORMATS, true);
+
+  if (date.isValid()) {
+    return date.format('DD/MM/YYYY');
+  }
+
+  return '';
+};
+
+var DatePart = function DatePart(_ref) {
+  var label = _ref.label,
+      props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  return /*#__PURE__*/_react["default"].createElement(_DateInputItem["default"], props, label);
+};
+
+var DateInput = function DateInput(_ref2) {
+  var name = _ref2.name,
+      type = _ref2.type,
+      props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
+
+  var _useTranslation = (0, _i18n.useTranslation)(),
+      t = _useTranslation.t;
+
+  var _useState = (0, _react.useState)(props.value),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 1),
+      initial = _useState2[0];
+
+  var value = (0, _react.useMemo)(function () {
+    if (initial === props.value) {
+      return makeDate(props.value);
+    }
+
+    return props.value;
+  }, [props.value, initial]);
+  var date = useDate(value || makeDate(props.defaultValue), props.onChange);
+  return /*#__PURE__*/_react["default"].createElement(_DateInputContainer["default"], null, /*#__PURE__*/_react["default"].createElement(DatePart, {
+    label: t('form.label.day'),
+    onChange: date.setDay,
+    onBlur: function onBlur(e) {
+      return date.setDay(e, true);
+    },
+    value: date.day,
+    width: 2,
+    name: "".concat(name, "-day"),
+    maxLength: "2",
+    disabled: props.disabled,
+    "aria-required": props['aria-required'],
+    error: !date.day ? props.error : false
+  }), /*#__PURE__*/_react["default"].createElement(DatePart, {
+    label: t('form.label.month'),
+    onChange: date.setMonth,
+    onBlur: function onBlur(e) {
+      return date.setMonth(e, true);
+    },
+    value: date.month,
+    width: 2,
+    name: "".concat(props.name, "-month"),
+    maxLength: "2",
+    disabled: props.disabled,
+    "aria-required": props['aria-required'],
+    error: !date.month ? props.error : false
+  }), /*#__PURE__*/_react["default"].createElement(DatePart, {
+    label: t('form.label.year'),
+    onChange: date.setYear,
+    value: date.year,
+    width: 4,
+    name: "".concat(props.name, "-year"),
+    maxLength: "4",
+    disabled: props.disabled,
+    "aria-required": props['aria-required'],
+    error: !date.year ? props.error : false
+  }));
+};
+
+exports.DateInput = DateInput;
+var _default = DateInput;
+exports["default"] = _default;

package/cjs/inputs/FileInput/FileInput.stories.js

@@ -0,0 +1,31 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+exports["default"] = void 0;
+
+var _ = _interopRequireDefault(require("./"));
+
+var _Default = require("./__stories__/Default");
+
+Object.keys(_Default).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Default[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Default[key];
+    }
+  });
+});
+var _default = {
+  title: 'Digigov Form/inputs/FileInput',
+  component: _["default"],
+  displayName: 'FileInput'
+};
+exports["default"] = _default;

package/cjs/inputs/FileInput/__stories__/Default.js

@@ -0,0 +1,42 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ = _interopRequireWildcard(require("../../.."));
+
+var _Button = require("@digigov/ui/form/Button");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(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 = {}; 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; }
+
+var _ref = /*#__PURE__*/_react["default"].createElement(_Button.Button, null, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1");
+
+var Default = function Default() {
+  return /*#__PURE__*/_react["default"].createElement(_["default"], {
+    onSubmit: function onSubmit(data) {
+      console.log(data);
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_.Field, {
+    key: 'string',
+    name: "file",
+    type: "file",
+    required: true,
+    label: {
+      primary: 'Βιογραφικό σημείωμα'
+    }
+  }), _ref);
+};
+
+exports.Default = Default;
+var _default = Default;
+exports["default"] = _default;

package/cjs/inputs/FileInput/index.js

@@ -0,0 +1,92 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.FileInput = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _FileUpload = _interopRequireDefault(require("@digigov/react-core/FileUpload"));
+
+var _FileUploadContainer = _interopRequireDefault(require("@digigov/react-core/FileUploadContainer"));
+
+var _Hint = _interopRequireDefault(require("@digigov/react-core/Hint"));
+
+var _Button = _interopRequireDefault(require("@digigov/ui/form/Button"));
+
+var _i18n = require("@digigov/ui/i18n");
+
+var _Paragraph = _interopRequireDefault(require("@digigov/ui/typography/Paragraph"));
+
+var _excluded = ["name", "extra", "disabled", "reset", "onChange"];
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(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 = {}; 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; }
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+var FileInput = /*#__PURE__*/_react["default"].forwardRef(function FileInput(_ref, ref) {
+  var name = _ref.name,
+      _ref$extra = _ref.extra,
+      extra = _ref$extra === void 0 ? {} : _ref$extra,
+      disabled = _ref.disabled,
+      reset = _ref.reset,
+      onChange = _ref.onChange,
+      props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+
+  var _useTranslation = (0, _i18n.useTranslation)(),
+      t = _useTranslation.t;
+
+  var _useState = (0, _react.useState)([]),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+      files = _useState2[0],
+      setFiles = _useState2[1];
+
+  var handleChange = function handleChange(e) {
+    var target = e.target;
+    var selectedFiles = Array.from(target.files).map(function (_ref2) {
+      var name = _ref2.name;
+      return name;
+    });
+    setFiles(selectedFiles); // proceed calling the onChange provided
+    // by react-hook-form
+
+    onChange(e);
+  };
+
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_FileUploadContainer["default"], {
+    hasFiles: files && files.length > 0
+  }, files !== null && files !== void 0 && files.length ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_Paragraph["default"], null, /*#__PURE__*/_react["default"].createElement("b", null, t('upload.file'), ":"), " ", "".concat(files.join(', ')))) : /*#__PURE__*/_react["default"].createElement(_Hint["default"], null, t('upload.no_file')), /*#__PURE__*/_react["default"].createElement(_FileUpload["default"], (0, _extends2["default"])({
+    ref: ref,
+    hasFiles: !!(files !== null && files !== void 0 && files.length),
+    name: name,
+    disabled: disabled,
+    onChange: handleChange
+  }, (0, _extends2["default"])({}, props, {
+    required: undefined
+  })), files !== null && files !== void 0 && files.length ? t('upload.change_file') : t('upload.choose_file')), files !== undefined && files.length > 0 && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
+    variant: "link",
+    onClick: function onClick(event) {
+      event.preventDefault();
+      reset((0, _defineProperty2["default"])({}, name, ''));
+      setFiles(undefined);
+    }
+  }, t('upload.reset_file')))));
+});
+
+exports.FileInput = FileInput;
+var _default = FileInput;
+exports["default"] = _default;