@itcase/forms 1.1.39 → 1.1.40

package/dist/itcase-forms.cjs.js

@@ -479,6 +479,7 @@ const FileInputDropzone = /*#__PURE__*/React__default.default.memo(function File
     thumbColumn,
     isPreviews,
     onAddFiles,
+    onClickPreview,
     onDeleteFile
   } = props;
 
@@ -661,6 +662,9 @@ const FileInputDropzone = /*#__PURE__*/React__default.default.memo(function File
   }, /*#__PURE__*/React__default.default.createElement("img", {
     className: "form-dropzone__thumb-image-inner",
     src: file.preview || file.image,
+    onClick: event => {
+      onClickPreview && onClickPreview(file, event);
+    },
     onLoad: () => {
       // Revoke data uri after image is loaded
       URL.revokeObjectURL(file.preview);
@@ -820,6 +824,7 @@ const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(pr
     isPreviews,
     isRequired,
     onAddFiles,
+    onClickPreview,
     onDeleteFile
   } = props;
   const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
@@ -954,6 +959,7 @@ const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(pr
       thumbNameTextWrap: thumbNameTextWrap,
       isPreviews: isPreviews,
       onAddFiles: onAddFiles,
+      onClickPreview: onClickPreview,
       onDeleteFile: onDeleteFile
     }));
   });
@@ -1379,8 +1385,8 @@ const FormFieldCode = /*#__PURE__*/React__default.default.memo(function FormFiel
   const {
     name,
     initialValue,
-    messageType,
     label,
+    messageType,
     isDisabled,
     classNameGroupItem,
     fieldProps = {},
@@ -1433,9 +1439,9 @@ const FormFieldCode = /*#__PURE__*/React__default.default.memo(function FormFiel
       isValidState: isValidState
     }, fieldProps), /*#__PURE__*/React__default.default.createElement(Code.Code, Object.assign({
       name: input.name,
+      initialValue: input.value,
       isDisabled: isDisabled,
       autoComplete: "nope",
-      value: input.value,
       onBlur: input.onBlur,
       onChange: input.onChange,
       onFocus: input.onFocus
@@ -2237,9 +2243,9 @@ const FormFieldMaskedInput = /*#__PURE__*/React__default.default.memo(function F
 
     const {
       ref,
+      setUnmaskedValue,
       unmaskedValue,
-      value,
-      setUnmaskedValue
+      value
     } = reactImask.useIMask(optionsMask, {
       onAccept: (newValue, event, element) => {
         if (element) {
@@ -2252,6 +2258,11 @@ const FormFieldMaskedInput = /*#__PURE__*/React__default.default.memo(function F
         setUnmaskedValue(input.value.replace(unmasked, ''));
       }
     }, [input.value]);
+    React.useEffect(() => {
+      if (unmaskedValue !== input.value) {
+        input.onChange(unmaskedValue);
+      }
+    }, [unmaskedValue]);
     const {
       errorKey,
       errorMessage,

package/dist/itcase-forms.esm.js

@@ -468,6 +468,7 @@ const FileInputDropzone = /*#__PURE__*/React.memo(function FileInputDropzone(pro
     thumbColumn,
     isPreviews,
     onAddFiles,
+    onClickPreview,
     onDeleteFile
   } = props;
 
@@ -650,6 +651,9 @@ const FileInputDropzone = /*#__PURE__*/React.memo(function FileInputDropzone(pro
   }, /*#__PURE__*/React.createElement("img", {
     className: "form-dropzone__thumb-image-inner",
     src: file.preview || file.image,
+    onClick: event => {
+      onClickPreview && onClickPreview(file, event);
+    },
     onLoad: () => {
       // Revoke data uri after image is loaded
       URL.revokeObjectURL(file.preview);
@@ -809,6 +813,7 @@ const FileInput = /*#__PURE__*/React.memo(function FileInput(props) {
     isPreviews,
     isRequired,
     onAddFiles,
+    onClickPreview,
     onDeleteFile
   } = props;
   const propsGenerator = useDevicePropsGenerator(props);
@@ -943,6 +948,7 @@ const FileInput = /*#__PURE__*/React.memo(function FileInput(props) {
       thumbNameTextWrap: thumbNameTextWrap,
       isPreviews: isPreviews,
       onAddFiles: onAddFiles,
+      onClickPreview: onClickPreview,
       onDeleteFile: onDeleteFile
     }));
   });
@@ -1368,8 +1374,8 @@ const FormFieldCode = /*#__PURE__*/React.memo(function FormFieldCode(props) {
   const {
     name,
     initialValue,
-    messageType,
     label,
+    messageType,
     isDisabled,
     classNameGroupItem,
     fieldProps = {},
@@ -1422,9 +1428,9 @@ const FormFieldCode = /*#__PURE__*/React.memo(function FormFieldCode(props) {
       isValidState: isValidState
     }, fieldProps), /*#__PURE__*/React.createElement(Code, Object.assign({
       name: input.name,
+      initialValue: input.value,
       isDisabled: isDisabled,
       autoComplete: "nope",
-      value: input.value,
       onBlur: input.onBlur,
       onChange: input.onChange,
       onFocus: input.onFocus
@@ -2226,9 +2232,9 @@ const FormFieldMaskedInput = /*#__PURE__*/React.memo(function FormFieldMaskedInp
 
     const {
       ref,
+      setUnmaskedValue,
       unmaskedValue,
-      value,
-      setUnmaskedValue
+      value
     } = useIMask(optionsMask, {
       onAccept: (newValue, event, element) => {
         if (element) {
@@ -2241,6 +2247,11 @@ const FormFieldMaskedInput = /*#__PURE__*/React.memo(function FormFieldMaskedInp
         setUnmaskedValue(input.value.replace(unmasked, ''));
       }
     }, [input.value]);
+    useEffect(() => {
+      if (unmaskedValue !== input.value) {
+        input.onChange(unmaskedValue);
+      }
+    }, [unmaskedValue]);
     const {
       errorKey,
       errorMessage,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/forms",
-  "version": "1.1.39",
+  "version": "1.1.40",
   "description": "Forms fields, inputs, etc.",
   "keywords": [],
   "license": "MIT",