@digigov/form 2.0.0-4be8f7cc → 2.0.0-85c27c19

package/inputs/ImageInput/__stories__/Default/index.js

@@ -1,28 +1,30 @@
-import React from 'react';
-import FormBuilder, { Field, Fieldset } from '@digigov/form';
-import { Button } from '@digigov/ui/form/Button';
-var FIELDS = [{
-  key: 'image',
-  type: 'image',
-  required: true,
-  label: {
-    primary: 'Ανέβασμα φωτογραφίας'
+import React from "react";
+import FormBuilder, { Field, Fieldset } from "@digigov/form";
+import { Button } from "@digigov/ui/form/Button";
+const FIELDS = [
+  {
+    key: "image",
+    type: "image",
+    required: true,
+    label: {
+      primary: "\u0391\u03BD\u03AD\u03B2\u03B1\u03C3\u03BC\u03B1 \u03C6\u03C9\u03C4\u03BF\u03B3\u03C1\u03B1\u03C6\u03AF\u03B1\u03C2"
+    }
   }
-}];
-var _ref = /*#__PURE__*/React.createElement(Button, {
-  type: "submit"
-}, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1");
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(FormBuilder, {
+];
+const Default = () => /* @__PURE__ */ React.createElement(
+  FormBuilder,
+  {
     fields: FIELDS,
-    onSubmit: function onSubmit(data) {
+    onSubmit: (data) => {
       console.log(data);
     }
-  }, /*#__PURE__*/React.createElement(Fieldset, null, FIELDS.map(function (field) {
-    return /*#__PURE__*/React.createElement(Field, {
-      key: field.key,
-      name: field.key
-    });
-  })), _ref);
+  },
+  /* @__PURE__ */ React.createElement(Fieldset, null, FIELDS.map((field) => /* @__PURE__ */ React.createElement(Field, { key: field.key, name: field.key }))),
+  /* @__PURE__ */ React.createElement(Button, { type: "submit" }, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1")
+);
+var Default_default = Default;
+export {
+  Default,
+  Default_default as default
 };
-export default Default;
+//# sourceMappingURL=Default.js.map

package/inputs/ImageInput/__stories__/Default.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-export declare const Default: () => JSX.Element;
+import React from 'react';
+export declare const Default: () => React.JSX.Element;
 export default Default;

package/inputs/ImageInput/__stories__/Default.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/inputs/ImageInput/__stories__/Default.tsx"],
+  "sourcesContent": ["import React from 'react';\nimport FormBuilder, { Field, Fieldset } from '@digigov/form';\nimport { FieldSpec } from '@digigov/form/types';\nimport { Button } from '@digigov/ui/form/Button';\nconst FIELDS: FieldSpec[] = [\n  {\n    key: 'image',\n    type: 'image',\n    required: true,\n    label: {\n      primary: '\u0391\u03BD\u03AD\u03B2\u03B1\u03C3\u03BC\u03B1 \u03C6\u03C9\u03C4\u03BF\u03B3\u03C1\u03B1\u03C6\u03AF\u03B1\u03C2',\n    },\n  },\n];\n\nexport const Default = () => (\n  <FormBuilder\n    fields={FIELDS}\n    onSubmit={(data) => {\n      console.log(data);\n    }}\n  >\n    <Fieldset>\n      {FIELDS.map((field) => (\n        <Field key={field.key} name={field.key} />\n      ))}\n    </Fieldset>\n    <Button type=\"submit\">\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1</Button>\n  </FormBuilder>\n);\nexport default Default;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAClB,OAAO,eAAe,OAAO,gBAAgB;AAE7C,SAAS,cAAc;AACvB,MAAM,SAAsB;AAAA,EAC1B;AAAA,IACE,KAAK;AAAA,IACL,MAAM;AAAA,IACN,UAAU;AAAA,IACV,OAAO;AAAA,MACL,SAAS;AAAA,IACX;AAAA,EACF;AACF;AAEO,MAAM,UAAU,MACrB;AAAA,EAAC;AAAA;AAAA,IACC,QAAQ;AAAA,IACR,UAAU,CAAC,SAAS;AAClB,cAAQ,IAAI,IAAI;AAAA,IAClB;AAAA;AAAA,EAEA,oCAAC,gBACE,OAAO,IAAI,CAAC,UACX,oCAAC,SAAM,KAAK,MAAM,KAAK,MAAM,MAAM,KAAK,CACzC,CACH;AAAA,EACA,oCAAC,UAAO,MAAK,YAAS,kDAAQ;AAChC;AAEF,IAAO,kBAAQ;",
+  "names": []
+}

package/inputs/ImageInput/__stories__/WithInvalidImageDimension/index.js

@@ -1,36 +1,38 @@
-import React from 'react';
-import FormBuilder, { Field, Fieldset } from '@digigov/form';
-import { Button } from '@digigov/ui/form/Button';
-var FIELDS = [{
-  key: 'image',
-  type: 'image',
-  required: true,
-  label: {
-    primary: 'Ανέβασμα φωτογραφίας'
-  },
-  extra: {
-    limit: {
-      maxHeight: 400,
-      maxWidth: 400,
-      minHeight: 100,
-      minWidth: 100
+import React from "react";
+import FormBuilder, { Field, Fieldset } from "@digigov/form";
+import { Button } from "@digigov/ui/form/Button";
+const FIELDS = [
+  {
+    key: "image",
+    type: "image",
+    required: true,
+    label: {
+      primary: "\u0391\u03BD\u03AD\u03B2\u03B1\u03C3\u03BC\u03B1 \u03C6\u03C9\u03C4\u03BF\u03B3\u03C1\u03B1\u03C6\u03AF\u03B1\u03C2"
+    },
+    extra: {
+      limit: {
+        maxHeight: 400,
+        maxWidth: 400,
+        minHeight: 100,
+        minWidth: 100
+      }
     }
   }
-}];
-var _ref = /*#__PURE__*/React.createElement(Button, {
-  type: "submit"
-}, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1");
-export var WithInvalidImageDimension = function WithInvalidImageDimension() {
-  return /*#__PURE__*/React.createElement(FormBuilder, {
+];
+const WithInvalidImageDimension = () => /* @__PURE__ */ React.createElement(
+  FormBuilder,
+  {
     fields: FIELDS,
-    onSubmit: function onSubmit(data) {
+    onSubmit: (data) => {
       console.log(data);
     }
-  }, /*#__PURE__*/React.createElement(Fieldset, null, FIELDS.map(function (field) {
-    return /*#__PURE__*/React.createElement(Field, {
-      key: field.key,
-      name: field.key
-    });
-  })), _ref);
+  },
+  /* @__PURE__ */ React.createElement(Fieldset, null, FIELDS.map((field) => /* @__PURE__ */ React.createElement(Field, { key: field.key, name: field.key }))),
+  /* @__PURE__ */ React.createElement(Button, { type: "submit" }, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1")
+);
+var WithInvalidImageDimension_default = WithInvalidImageDimension;
+export {
+  WithInvalidImageDimension,
+  WithInvalidImageDimension_default as default
 };
-export default WithInvalidImageDimension;
+//# sourceMappingURL=WithInvalidImageDimension.js.map

package/inputs/ImageInput/__stories__/WithInvalidImageDimension.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-export declare const WithInvalidImageDimension: () => JSX.Element;
+import React from 'react';
+export declare const WithInvalidImageDimension: () => React.JSX.Element;
 export default WithInvalidImageDimension;

package/inputs/ImageInput/__stories__/WithInvalidImageDimension.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/inputs/ImageInput/__stories__/WithInvalidImageDimension.tsx"],
+  "sourcesContent": ["import React from 'react';\nimport FormBuilder, { Field, Fieldset } from '@digigov/form';\nimport { FieldSpec } from '@digigov/form/types';\nimport { Button } from '@digigov/ui/form/Button';\nconst FIELDS: FieldSpec[] = [\n  {\n    key: 'image',\n    type: 'image',\n    required: true,\n    label: {\n      primary: '\u0391\u03BD\u03AD\u03B2\u03B1\u03C3\u03BC\u03B1 \u03C6\u03C9\u03C4\u03BF\u03B3\u03C1\u03B1\u03C6\u03AF\u03B1\u03C2',\n    },\n    extra: {\n      limit: {\n        maxHeight: 400,\n        maxWidth: 400,\n        minHeight: 100,\n        minWidth: 100,\n      },\n    },\n  },\n];\n\nexport const WithInvalidImageDimension = () => (\n  <FormBuilder\n    fields={FIELDS}\n    onSubmit={(data) => {\n      console.log(data);\n    }}\n  >\n    <Fieldset>\n      {FIELDS.map((field) => (\n        <Field key={field.key} name={field.key} />\n      ))}\n    </Fieldset>\n    <Button type=\"submit\">\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1</Button>\n  </FormBuilder>\n);\nexport default WithInvalidImageDimension;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAClB,OAAO,eAAe,OAAO,gBAAgB;AAE7C,SAAS,cAAc;AACvB,MAAM,SAAsB;AAAA,EAC1B;AAAA,IACE,KAAK;AAAA,IACL,MAAM;AAAA,IACN,UAAU;AAAA,IACV,OAAO;AAAA,MACL,SAAS;AAAA,IACX;AAAA,IACA,OAAO;AAAA,MACL,OAAO;AAAA,QACL,WAAW;AAAA,QACX,UAAU;AAAA,QACV,WAAW;AAAA,QACX,UAAU;AAAA,MACZ;AAAA,IACF;AAAA,EACF;AACF;AAEO,MAAM,4BAA4B,MACvC;AAAA,EAAC;AAAA;AAAA,IACC,QAAQ;AAAA,IACR,UAAU,CAAC,SAAS;AAClB,cAAQ,IAAI,IAAI;AAAA,IAClB;AAAA;AAAA,EAEA,oCAAC,gBACE,OAAO,IAAI,CAAC,UACX,oCAAC,SAAM,KAAK,MAAM,KAAK,MAAM,MAAM,KAAK,CACzC,CACH;AAAA,EACA,oCAAC,UAAO,MAAK,YAAS,kDAAQ;AAChC;AAEF,IAAO,oCAAQ;",
+  "names": []
+}

package/inputs/ImageInput/__stories__/WithInvalidImageSize/index.js

@@ -1,33 +1,35 @@
-import React from 'react';
-import FormBuilder, { Field, Fieldset } from '@digigov/form';
-import { Button } from '@digigov/ui/form/Button';
-var FIELDS = [{
-  key: 'image',
-  type: 'image',
-  required: true,
-  label: {
-    primary: 'Ανέβασμα φωτογραφίας'
-  },
-  extra: {
-    limit: {
-      maxSize: 300
+import React from "react";
+import FormBuilder, { Field, Fieldset } from "@digigov/form";
+import { Button } from "@digigov/ui/form/Button";
+const FIELDS = [
+  {
+    key: "image",
+    type: "image",
+    required: true,
+    label: {
+      primary: "\u0391\u03BD\u03AD\u03B2\u03B1\u03C3\u03BC\u03B1 \u03C6\u03C9\u03C4\u03BF\u03B3\u03C1\u03B1\u03C6\u03AF\u03B1\u03C2"
+    },
+    extra: {
+      limit: {
+        maxSize: 300
+      }
     }
   }
-}];
-var _ref = /*#__PURE__*/React.createElement(Button, {
-  type: "submit"
-}, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1");
-export var WithInvalidImageSize = function WithInvalidImageSize() {
-  return /*#__PURE__*/React.createElement(FormBuilder, {
+];
+const WithInvalidImageSize = () => /* @__PURE__ */ React.createElement(
+  FormBuilder,
+  {
     fields: FIELDS,
-    onSubmit: function onSubmit(data) {
+    onSubmit: (data) => {
       console.log(data);
     }
-  }, /*#__PURE__*/React.createElement(Fieldset, null, FIELDS.map(function (field) {
-    return /*#__PURE__*/React.createElement(Field, {
-      key: field.key,
-      name: field.key
-    });
-  })), _ref);
+  },
+  /* @__PURE__ */ React.createElement(Fieldset, null, FIELDS.map((field) => /* @__PURE__ */ React.createElement(Field, { key: field.key, name: field.key }))),
+  /* @__PURE__ */ React.createElement(Button, { type: "submit" }, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1")
+);
+var WithInvalidImageSize_default = WithInvalidImageSize;
+export {
+  WithInvalidImageSize,
+  WithInvalidImageSize_default as default
 };
-export default WithInvalidImageSize;
+//# sourceMappingURL=WithInvalidImageSize.js.map

package/inputs/ImageInput/__stories__/WithInvalidImageSize.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-export declare const WithInvalidImageSize: () => JSX.Element;
+import React from 'react';
+export declare const WithInvalidImageSize: () => React.JSX.Element;
 export default WithInvalidImageSize;

package/inputs/ImageInput/__stories__/WithInvalidImageSize.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/inputs/ImageInput/__stories__/WithInvalidImageSize.tsx"],
+  "sourcesContent": ["import React from 'react';\nimport FormBuilder, { Field, Fieldset } from '@digigov/form';\nimport { FieldSpec } from '@digigov/form/types';\nimport { Button } from '@digigov/ui/form/Button';\nconst FIELDS: FieldSpec[] = [\n  {\n    key: 'image',\n    type: 'image',\n    required: true,\n    label: {\n      primary: '\u0391\u03BD\u03AD\u03B2\u03B1\u03C3\u03BC\u03B1 \u03C6\u03C9\u03C4\u03BF\u03B3\u03C1\u03B1\u03C6\u03AF\u03B1\u03C2',\n    },\n    extra: {\n      limit: {\n        maxSize: 300,\n      },\n    },\n  },\n];\n\nexport const WithInvalidImageSize = () => (\n  <FormBuilder\n    fields={FIELDS}\n    onSubmit={(data) => {\n      console.log(data);\n    }}\n  >\n    <Fieldset>\n      {FIELDS.map((field) => (\n        <Field key={field.key} name={field.key} />\n      ))}\n    </Fieldset>\n    <Button type=\"submit\">\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1</Button>\n  </FormBuilder>\n);\nexport default WithInvalidImageSize;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAClB,OAAO,eAAe,OAAO,gBAAgB;AAE7C,SAAS,cAAc;AACvB,MAAM,SAAsB;AAAA,EAC1B;AAAA,IACE,KAAK;AAAA,IACL,MAAM;AAAA,IACN,UAAU;AAAA,IACV,OAAO;AAAA,MACL,SAAS;AAAA,IACX;AAAA,IACA,OAAO;AAAA,MACL,OAAO;AAAA,QACL,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AACF;AAEO,MAAM,uBAAuB,MAClC;AAAA,EAAC;AAAA;AAAA,IACC,QAAQ;AAAA,IACR,UAAU,CAAC,SAAS;AAClB,cAAQ,IAAI,IAAI;AAAA,IAClB;AAAA;AAAA,EAEA,oCAAC,gBACE,OAAO,IAAI,CAAC,UACX,oCAAC,SAAM,KAAK,MAAM,KAAK,MAAM,MAAM,KAAK,CACzC,CACH;AAAA,EACA,oCAAC,UAAO,MAAK,YAAS,kDAAQ;AAChC;AAEF,IAAO,+BAAQ;",
+  "names": []
+}

package/inputs/ImageInput/index.js

@@ -1,76 +1,59 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["name", "extra", "disabled", "onChange", "reset"];
-import React, { useState, useCallback } from 'react';
-import FileUpload from '@digigov/react-core/FileUpload';
-import FileUploadContainer from '@digigov/react-core/FileUploadContainer';
-import CoreHint from '@digigov/react-core/Hint';
-import Button, { ButtonGroup } from '@digigov/ui/form/Button';
-import { useTranslation } from '@digigov/ui/i18n';
-import Paragraph from '@digigov/ui/typography/Paragraph';
-export var Image = /*#__PURE__*/React.memo(function Image(_ref) {
-  var src = _ref.src;
-  return /*#__PURE__*/React.createElement("img", {
-    src: src,
-    className: "ds-image--ratio"
-  });
+import React, { useState, useCallback } from "react";
+import FileUpload from "@digigov/react-core/FileUpload";
+import FileUploadContainer from "@digigov/react-core/FileUploadContainer";
+import CoreHint from "@digigov/react-core/Hint";
+import Button, { ButtonGroup } from "@digigov/ui/form/Button";
+import { useTranslation } from "@digigov/ui/i18n";
+import Paragraph from "@digigov/ui/typography/Paragraph";
+const Image = React.memo(function Image2({ src }) {
+  return /* @__PURE__ */ React.createElement("img", { src, className: "ds-image--ratio" });
 });
-export var ImageInput = /*#__PURE__*/React.forwardRef(function ImageInput(_ref2, ref) {
-  var name = _ref2.name,
-    _ref2$extra = _ref2.extra,
-    extra = _ref2$extra === void 0 ? {} : _ref2$extra,
-    disabled = _ref2.disabled,
-    onChange = _ref2.onChange,
-    reset = _ref2.reset,
-    props = _objectWithoutProperties(_ref2, _excluded);
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    selectedImage = _useState2[0],
-    setSelectedImage = _useState2[1];
-  var _useState3 = useState(null),
-    _useState4 = _slicedToArray(_useState3, 2),
-    imageUrl = _useState4[0],
-    setImageUrl = _useState4[1];
-  var handleImageChange = useCallback(function (e) {
-    var _target$files;
-    e.preventDefault();
-    var target = e.target;
-    var selectedFile = (_target$files = target.files) === null || _target$files === void 0 ? void 0 : _target$files[0];
-    if (selectedFile) {
-      setSelectedImage(selectedFile);
-      setImageUrl(URL.createObjectURL(selectedFile));
-    }
-    onChange(e);
-  }, [selectedImage]);
-  var handleDeleteImage = useCallback(function (event) {
-    event.preventDefault();
-    reset(_defineProperty({}, name, ''));
-    setSelectedImage(null);
-    setImageUrl('');
-  }, [selectedImage]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FileUploadContainer, null, selectedImage !== null ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Paragraph, null, /*#__PURE__*/React.createElement("b", null, t('upload.image'), ":"), " ", "".concat(selectedImage === null || selectedImage === void 0 ? void 0 : selectedImage.name))) : /*#__PURE__*/React.createElement(CoreHint, {
-    className: "ds-dashed--border"
-  }, t('upload.no_image')), /*#__PURE__*/React.createElement(React.Fragment, null, selectedImage !== null && /*#__PURE__*/React.createElement(Image, {
-    src: imageUrl
-  }), /*#__PURE__*/React.createElement(ButtonGroup, {
-    marginTop: 2
-  }, selectedImage !== null && /*#__PURE__*/React.createElement(Button, {
-    variant: "link",
-    onClick: handleDeleteImage
-  }, t('upload.reset_file')), /*#__PURE__*/React.createElement(FileUpload, _extends({
-    ref: ref,
-    hasFiles: selectedImage !== null,
-    name: name,
-    disabled: disabled,
-    accept: "image/*",
-    onChange: handleImageChange
-  }, _extends({}, props, {
-    required: undefined,
-    type: 'file'
-  })), t('upload.choose_image'))))));
-});
-export default ImageInput;
+const ImageInput = React.forwardRef(
+  function ImageInput2({ name, extra = {}, disabled, onChange, reset, ...props }, ref) {
+    const { t } = useTranslation();
+    const [selectedImage, setSelectedImage] = useState(null);
+    const [imageUrl, setImageUrl] = useState(null);
+    const handleImageChange = useCallback(
+      (e) => {
+        e.preventDefault();
+        const target = e.target;
+        const selectedFile = target.files?.[0];
+        if (selectedFile) {
+          setSelectedImage(selectedFile);
+          setImageUrl(URL.createObjectURL(selectedFile));
+        }
+        onChange(e);
+      },
+      [selectedImage]
+    );
+    const handleDeleteImage = useCallback(
+      (event) => {
+        event.preventDefault();
+        reset({ [name]: "" });
+        setSelectedImage(null);
+        setImageUrl("");
+      },
+      [selectedImage]
+    );
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(FileUploadContainer, null, selectedImage !== null ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Paragraph, null, /* @__PURE__ */ React.createElement("b", null, t("upload.image"), ":"), " ", `${selectedImage?.name}`)) : /* @__PURE__ */ React.createElement(CoreHint, { className: "ds-dashed--border" }, t("upload.no_image")), /* @__PURE__ */ React.createElement(React.Fragment, null, selectedImage !== null && /* @__PURE__ */ React.createElement(Image, { src: imageUrl }), /* @__PURE__ */ React.createElement(ButtonGroup, { marginTop: 2 }, selectedImage !== null && /* @__PURE__ */ React.createElement(Button, { variant: "link", onClick: handleDeleteImage }, t("upload.reset_file")), /* @__PURE__ */ React.createElement(
+      FileUpload,
+      {
+        ref,
+        hasFiles: selectedImage !== null,
+        name,
+        disabled,
+        accept: "image/*",
+        onChange: handleImageChange,
+        ...{ ...props, required: void 0, type: "file" }
+      },
+      t("upload.choose_image")
+    )))));
+  }
+);
+var ImageInput_default = ImageInput;
+export {
+  Image,
+  ImageInput,
+  ImageInput_default as default
+};
+//# sourceMappingURL=index.js.map

package/inputs/ImageInput/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/inputs/ImageInput/index.tsx"],
+  "sourcesContent": ["import React, { useState, useCallback } from 'react';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport FileUpload from '@digigov/react-core/FileUpload';\nimport FileUploadContainer from '@digigov/react-core/FileUploadContainer';\nimport CoreHint from '@digigov/react-core/Hint';\nimport Button, { ButtonGroup } from '@digigov/ui/form/Button';\nimport { useTranslation } from '@digigov/ui/i18n';\nimport Paragraph from '@digigov/ui/typography/Paragraph';\n\nexport interface ImageProps {\n  src?: any;\n}\n\nexport interface Limit {\n  maxSize?: number;\n  maxWidth?: number;\n  maxHeight?: number;\n  minWidth?: number;\n  minHeight?: number;\n}\n\nexport const Image: React.FC<ImageProps> = React.memo(function Image({ src }) {\n  return <img src={src} className=\"ds-image--ratio\" />;\n});\nexport interface ImageInputProps extends Omit<UncontrolledFieldProps, 'extra'> {\n  extra?: {\n    className?: string;\n    multiple?: boolean;\n    accept?: string;\n    limit?: Limit;\n  };\n  reset: (values?: any) => void;\n  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n}\n\nexport const ImageInput: React.FC<ImageInputProps> = React.forwardRef(\n  function ImageInput(\n    { name, extra = {}, disabled, onChange, reset, ...props },\n    ref: any\n  ) {\n    const { t } = useTranslation();\n    const [selectedImage, setSelectedImage] = useState<File | null>(null);\n    const [imageUrl, setImageUrl] = useState<string | null>(null);\n    const handleImageChange = useCallback(\n      (e: React.ChangeEvent<HTMLInputElement>) => {\n        e.preventDefault();\n        const target = e.target as HTMLInputElement;\n        const selectedFile = target.files?.[0];\n\n        if (selectedFile) {\n          setSelectedImage(selectedFile);\n          setImageUrl(URL.createObjectURL(selectedFile));\n        }\n        onChange(e);\n      },\n      [selectedImage]\n    );\n\n    const handleDeleteImage = useCallback(\n      (event) => {\n        event.preventDefault();\n        reset({ [name]: '' });\n        setSelectedImage(null);\n        setImageUrl('');\n      },\n      [selectedImage]\n    );\n\n    return (\n      <>\n        <FileUploadContainer>\n          {selectedImage !== null ? (\n            <>\n              <Paragraph>\n                <b>{t('upload.image')}:</b> {`${selectedImage?.name}`}\n              </Paragraph>\n            </>\n          ) : (\n            <CoreHint className=\"ds-dashed--border\">\n              {t('upload.no_image')}\n            </CoreHint>\n          )}\n          <>\n            {selectedImage !== null && <Image src={imageUrl} />}\n            <ButtonGroup marginTop={2}>\n              {selectedImage !== null && (\n                <Button variant=\"link\" onClick={handleDeleteImage}>\n                  {t('upload.reset_file')}\n                </Button>\n              )}\n              <FileUpload\n                ref={ref}\n                hasFiles={selectedImage !== null}\n                name={name}\n                disabled={disabled}\n                accept=\"image/*\"\n                onChange={handleImageChange}\n                {...{ ...props, required: undefined, type: 'file' }}\n              >\n                {t('upload.choose_image')}\n              </FileUpload>\n            </ButtonGroup>\n          </>\n        </FileUploadContainer>\n      </>\n    );\n  }\n);\n\nexport default ImageInput;\n"],
+  "mappings": "AAAA,OAAO,SAAS,UAAU,mBAAmB;AAE7C,OAAO,gBAAgB;AACvB,OAAO,yBAAyB;AAChC,OAAO,cAAc;AACrB,OAAO,UAAU,mBAAmB;AACpC,SAAS,sBAAsB;AAC/B,OAAO,eAAe;AAcf,MAAM,QAA8B,MAAM,KAAK,SAASA,OAAM,EAAE,IAAI,GAAG;AAC5E,SAAO,oCAAC,SAAI,KAAU,WAAU,mBAAkB;AACpD,CAAC;AAYM,MAAM,aAAwC,MAAM;AAAA,EACzD,SAASC,YACP,EAAE,MAAM,QAAQ,CAAC,GAAG,UAAU,UAAU,OAAO,GAAG,MAAM,GACxD,KACA;AACA,UAAM,EAAE,EAAE,IAAI,eAAe;AAC7B,UAAM,CAAC,eAAe,gBAAgB,IAAI,SAAsB,IAAI;AACpE,UAAM,CAAC,UAAU,WAAW,IAAI,SAAwB,IAAI;AAC5D,UAAM,oBAAoB;AAAA,MACxB,CAAC,MAA2C;AAC1C,UAAE,eAAe;AACjB,cAAM,SAAS,EAAE;AACjB,cAAM,eAAe,OAAO,QAAQ,CAAC;AAErC,YAAI,cAAc;AAChB,2BAAiB,YAAY;AAC7B,sBAAY,IAAI,gBAAgB,YAAY,CAAC;AAAA,QAC/C;AACA,iBAAS,CAAC;AAAA,MACZ;AAAA,MACA,CAAC,aAAa;AAAA,IAChB;AAEA,UAAM,oBAAoB;AAAA,MACxB,CAAC,UAAU;AACT,cAAM,eAAe;AACrB,cAAM,EAAE,CAAC,IAAI,GAAG,GAAG,CAAC;AACpB,yBAAiB,IAAI;AACrB,oBAAY,EAAE;AAAA,MAChB;AAAA,MACA,CAAC,aAAa;AAAA,IAChB;AAEA,WACE,0DACE,oCAAC,2BACE,kBAAkB,OACjB,0DACE,oCAAC,iBACC,oCAAC,WAAG,EAAE,cAAc,GAAE,GAAC,GAAI,KAAE,GAAG,eAAe,IAAI,EACrD,CACF,IAEA,oCAAC,YAAS,WAAU,uBACjB,EAAE,iBAAiB,CACtB,GAEF,0DACG,kBAAkB,QAAQ,oCAAC,SAAM,KAAK,UAAU,GACjD,oCAAC,eAAY,WAAW,KACrB,kBAAkB,QACjB,oCAAC,UAAO,SAAQ,QAAO,SAAS,qBAC7B,EAAE,mBAAmB,CACxB,GAEF;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,UAAU,kBAAkB;AAAA,QAC5B;AAAA,QACA;AAAA,QACA,QAAO;AAAA,QACP,UAAU;AAAA,QACT,GAAG,EAAE,GAAG,OAAO,UAAU,QAAW,MAAM,OAAO;AAAA;AAAA,MAEjD,EAAE,qBAAqB;AAAA,IAC1B,CACF,CACF,CACF,CACF;AAAA,EAEJ;AACF;AAEA,IAAO,qBAAQ;",
+  "names": ["Image", "ImageInput"]
+}

package/inputs/ImageInput/index.test.d.ts

@@ -0,0 +1 @@
+export {};

package/inputs/Input/Input.stories/index.js

@@ -1,16 +1,30 @@
-import Input from '@digigov/form/inputs/Input';
-export default {
-  title: 'Digigov Form/inputs/Input',
+import Input from "@digigov/form/inputs/Input";
+var Input_stories_default = {
+  title: "Digigov Form/inputs/Input",
   component: Input,
-  displayName: 'Input'
+  displayName: "Input"
 };
-export * from '@digigov/form/inputs/Input/__stories__/Default';
-export * from '@digigov/form/inputs/Input/__stories__/Integer';
-export * from '@digigov/form/inputs/Input/__stories__/Boolean';
-export * from '@digigov/form/inputs/Input/__stories__/PhoneNumber';
-export * from '@digigov/form/inputs/Input/__stories__/LandlineNumber';
-export * from '@digigov/form/inputs/Input/__stories__/MobilePhone';
-export * from '@digigov/form/inputs/Input/__stories__/AFM';
-export * from '@digigov/form/inputs/Input/__stories__/IBAN';
-export * from '@digigov/form/inputs/Input/__stories__/PostalCode';
-export * from '@digigov/form/inputs/Input/__stories__/TextWithCharacterLimit';
+import { String } from "@digigov/form/inputs/Input/__stories__/String";
+import { Integer } from "@digigov/form/inputs/Input/__stories__/Integer";
+import { Boolean } from "@digigov/form/inputs/Input/__stories__/Boolean";
+import { PhoneNumber } from "@digigov/form/inputs/Input/__stories__/PhoneNumber";
+import { LandlineNumber } from "@digigov/form/inputs/Input/__stories__/LandlineNumber";
+import { MobilePhone } from "@digigov/form/inputs/Input/__stories__/MobilePhone";
+import { AFM } from "@digigov/form/inputs/Input/__stories__/AFM";
+import { IBAN } from "@digigov/form/inputs/Input/__stories__/IBAN";
+import { PostalCode } from "@digigov/form/inputs/Input/__stories__/PostalCode";
+import { TextWithLimit } from "@digigov/form/inputs/Input/__stories__/TextWithLimit";
+export {
+  AFM,
+  Boolean,
+  IBAN,
+  Integer,
+  LandlineNumber,
+  MobilePhone,
+  PhoneNumber,
+  PostalCode,
+  String,
+  TextWithLimit,
+  Input_stories_default as default
+};
+//# sourceMappingURL=Input.stories.js.map

package/inputs/Input/Input.stories.d.ts

@@ -4,14 +4,14 @@ declare namespace _default {
     export let displayName: string;
 }
 export default _default;
-export * from "@digigov/form/inputs/Input/__stories__/Default";
-export * from "@digigov/form/inputs/Input/__stories__/Integer";
-export * from "@digigov/form/inputs/Input/__stories__/Boolean";
-export * from "@digigov/form/inputs/Input/__stories__/PhoneNumber";
-export * from "@digigov/form/inputs/Input/__stories__/LandlineNumber";
-export * from "@digigov/form/inputs/Input/__stories__/MobilePhone";
-export * from "@digigov/form/inputs/Input/__stories__/AFM";
-export * from "@digigov/form/inputs/Input/__stories__/IBAN";
-export * from "@digigov/form/inputs/Input/__stories__/PostalCode";
-export * from "@digigov/form/inputs/Input/__stories__/TextWithCharacterLimit";
+export { String } from "@digigov/form/inputs/Input/__stories__/String";
+export { Integer } from "@digigov/form/inputs/Input/__stories__/Integer";
+export { Boolean } from "@digigov/form/inputs/Input/__stories__/Boolean";
+export { PhoneNumber } from "@digigov/form/inputs/Input/__stories__/PhoneNumber";
+export { LandlineNumber } from "@digigov/form/inputs/Input/__stories__/LandlineNumber";
+export { MobilePhone } from "@digigov/form/inputs/Input/__stories__/MobilePhone";
+export { AFM } from "@digigov/form/inputs/Input/__stories__/AFM";
+export { IBAN } from "@digigov/form/inputs/Input/__stories__/IBAN";
+export { PostalCode } from "@digigov/form/inputs/Input/__stories__/PostalCode";
+export { TextWithLimit } from "@digigov/form/inputs/Input/__stories__/TextWithLimit";
 import Input from '@digigov/form/inputs/Input';

package/inputs/Input/Input.stories.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/inputs/Input/Input.stories.js"],
+  "sourcesContent": ["import Input from '@digigov/form/inputs/Input';\nexport default {\n  title: 'Digigov Form/inputs/Input',\n  component: Input,\n  displayName: 'Input',\n};\nexport { String } from '@digigov/form/inputs/Input/__stories__/String';\nexport { Integer } from '@digigov/form/inputs/Input/__stories__/Integer';\nexport { Boolean } from '@digigov/form/inputs/Input/__stories__/Boolean';\nexport { PhoneNumber } from '@digigov/form/inputs/Input/__stories__/PhoneNumber';\nexport { LandlineNumber } from '@digigov/form/inputs/Input/__stories__/LandlineNumber';\nexport { MobilePhone } from '@digigov/form/inputs/Input/__stories__/MobilePhone';\nexport { AFM } from '@digigov/form/inputs/Input/__stories__/AFM';\nexport { IBAN } from '@digigov/form/inputs/Input/__stories__/IBAN';\nexport { PostalCode } from '@digigov/form/inputs/Input/__stories__/PostalCode';\nexport { TextWithLimit } from '@digigov/form/inputs/Input/__stories__/TextWithLimit';\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAClB,IAAO,wBAAQ;AAAA,EACb,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AACf;AACA,SAAS,cAAc;AACvB,SAAS,eAAe;AACxB,SAAS,eAAe;AACxB,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,mBAAmB;AAC5B,SAAS,WAAW;AACpB,SAAS,YAAY;AACrB,SAAS,kBAAkB;AAC3B,SAAS,qBAAqB;",
+  "names": []
+}

package/inputs/Input/__stories__/AFM/index.js

@@ -1,22 +1,30 @@
-import React from 'react';
-import FormBuilder, { Field } from '@digigov/form';
-import { Button } from '@digigov/ui/form/Button';
-var _ref = /*#__PURE__*/React.createElement(Button, {
-  type: "submit"
-}, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1");
-export var AFM = function AFM() {
-  return /*#__PURE__*/React.createElement(FormBuilder, {
-    onSubmit: function onSubmit(data) {
+import React from "react";
+import FormBuilder, { Field } from "@digigov/form";
+import { Button } from "@digigov/ui/form/Button";
+const AFM = () => /* @__PURE__ */ React.createElement(
+  FormBuilder,
+  {
+    onSubmit: (data) => {
       console.log(data);
     }
-  }, /*#__PURE__*/React.createElement(Field, {
-    key: "afm",
-    name: "afm",
-    type: "afm",
-    label: {
-      primary: 'Αριθμός φορολογικού μητρώου'
-    },
-    required: true
-  }), _ref);
+  },
+  /* @__PURE__ */ React.createElement(
+    Field,
+    {
+      key: "afm",
+      name: "afm",
+      type: "afm",
+      label: {
+        primary: "\u0391\u03C1\u03B9\u03B8\u03BC\u03CC\u03C2 \u03C6\u03BF\u03C1\u03BF\u03BB\u03BF\u03B3\u03B9\u03BA\u03BF\u03CD \u03BC\u03B7\u03C4\u03C1\u03CE\u03BF\u03C5"
+      },
+      required: true
+    }
+  ),
+  /* @__PURE__ */ React.createElement(Button, { type: "submit" }, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1")
+);
+var AFM_default = AFM;
+export {
+  AFM,
+  AFM_default as default
 };
-export default AFM;
+//# sourceMappingURL=AFM.js.map

package/inputs/Input/__stories__/AFM.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-export declare const AFM: () => JSX.Element;
+import React from 'react';
+export declare const AFM: () => React.JSX.Element;
 export default AFM;

package/inputs/Input/__stories__/AFM.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/inputs/Input/__stories__/AFM.tsx"],
+  "sourcesContent": ["import React from 'react';\nimport FormBuilder, { Field } from '@digigov/form';\nimport { Button } from '@digigov/ui/form/Button';\n\nexport const AFM = () => (\n  <FormBuilder\n    onSubmit={(data) => {\n      console.log(data);\n    }}\n  >\n    <Field\n      key=\"afm\"\n      name=\"afm\"\n      type=\"afm\"\n      label={{\n        primary: '\u0391\u03C1\u03B9\u03B8\u03BC\u03CC\u03C2 \u03C6\u03BF\u03C1\u03BF\u03BB\u03BF\u03B3\u03B9\u03BA\u03BF\u03CD \u03BC\u03B7\u03C4\u03C1\u03CE\u03BF\u03C5',\n      }}\n      required\n    />\n    <Button type=\"submit\">\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1</Button>\n  </FormBuilder>\n);\nexport default AFM;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAClB,OAAO,eAAe,aAAa;AACnC,SAAS,cAAc;AAEhB,MAAM,MAAM,MACjB;AAAA,EAAC;AAAA;AAAA,IACC,UAAU,CAAC,SAAS;AAClB,cAAQ,IAAI,IAAI;AAAA,IAClB;AAAA;AAAA,EAEA;AAAA,IAAC;AAAA;AAAA,MACC,KAAI;AAAA,MACJ,MAAK;AAAA,MACL,MAAK;AAAA,MACL,OAAO;AAAA,QACL,SAAS;AAAA,MACX;AAAA,MACA,UAAQ;AAAA;AAAA,EACV;AAAA,EACA,oCAAC,UAAO,MAAK,YAAS,kDAAQ;AAChC;AAEF,IAAO,cAAQ;",
+  "names": []
+}

package/inputs/Input/__stories__/Boolean/index.js

@@ -1,23 +1,31 @@
-import React from 'react';
-import FormBuilder, { Field } from '@digigov/form';
-import { Button } from '@digigov/ui/form/Button';
-var _ref = /*#__PURE__*/React.createElement(Button, {
-  type: "submit"
-}, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1");
-export var Boolean = function Boolean() {
-  return /*#__PURE__*/React.createElement(FormBuilder, {
-    onSubmit: function onSubmit(data) {
+import React from "react";
+import FormBuilder, { Field } from "@digigov/form";
+import { Button } from "@digigov/ui/form/Button";
+const Boolean = () => /* @__PURE__ */ React.createElement(
+  FormBuilder,
+  {
+    onSubmit: (data) => {
       console.log(data);
     }
-  }, /*#__PURE__*/React.createElement(Field, {
-    key: "boolean-value",
-    name: "boolean-value",
-    type: "boolean",
-    label: {
-      primary: 'Ένα απλό true ή false',
-      secondary: 'Το πεδίο είναι τύπου boolean, δηλαδή λογικού μηδέν ή ένα. Μπορείτε να εισάγετε true, false, 0, 1.'
-    },
-    required: true
-  }), _ref);
+  },
+  /* @__PURE__ */ React.createElement(
+    Field,
+    {
+      key: "boolean-value",
+      name: "boolean-value",
+      type: "boolean",
+      label: {
+        primary: "\u0388\u03BD\u03B1 \u03B1\u03C0\u03BB\u03CC true \u03AE false",
+        secondary: "\u03A4\u03BF \u03C0\u03B5\u03B4\u03AF\u03BF \u03B5\u03AF\u03BD\u03B1\u03B9 \u03C4\u03CD\u03C0\u03BF\u03C5 boolean, \u03B4\u03B7\u03BB\u03B1\u03B4\u03AE \u03BB\u03BF\u03B3\u03B9\u03BA\u03BF\u03CD \u03BC\u03B7\u03B4\u03AD\u03BD \u03AE \u03AD\u03BD\u03B1. \u039C\u03C0\u03BF\u03C1\u03B5\u03AF\u03C4\u03B5 \u03BD\u03B1 \u03B5\u03B9\u03C3\u03AC\u03B3\u03B5\u03C4\u03B5 true, false, 0, 1."
+      },
+      required: true
+    }
+  ),
+  /* @__PURE__ */ React.createElement(Button, { type: "submit" }, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1")
+);
+var Boolean_default = Boolean;
+export {
+  Boolean,
+  Boolean_default as default
 };
-export default Boolean;
+//# sourceMappingURL=Boolean.js.map

package/inputs/Input/__stories__/Boolean.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-export declare const Boolean: () => JSX.Element;
+import React from 'react';
+export declare const Boolean: () => React.JSX.Element;
 export default Boolean;