@dartech/arsenal-ui 1.3.41 → 1.3.42

package/index.js

@@ -1979,6 +1979,7 @@ const ControlDate = ({
   format: _format = DATE_DEFAULT_FORMAT,
   hideErrorMessage: _hideErrorMessage = false
 }) => {
+  const [localFormat, setLocalFormat] = useState(DATE_DEFAULT_FORMAT);
   const {
     field,
     fieldState: {
@@ -1990,7 +1991,7 @@ const ControlDate = ({
     rules: {
       required: required && 'Please, fill this field',
       validate: val => {
-        if (isMatch(val, _format)) {
+        if (isMatch(val, localFormat)) {
           return true;
         }
         return 'Incorrect date format';
@@ -1998,16 +1999,25 @@ const ControlDate = ({
     }
   });
   const handleChange = useCallback(date => {
-    field.onChange(isValid(date) ? format(date, _format) : date);
-  }, [field, _format]);
+    field.onChange(isValid(date) ? format(date, localFormat) : date);
+  }, [field, localFormat]);
+  useEffect(() => {
+    const fixedTimeZone = _format.replace(/[Z,z,x]+/g, 'XX');
+    try {
+      isMatch(format(new Date(), fixedTimeZone), fixedTimeZone);
+      setLocalFormat(fixedTimeZone);
+    } catch (e) {
+      console.error(e);
+    }
+  }, [_format]);
   return jsx(DatePicker, Object.assign({}, field, {
     label: required ? jsxs(Fragment, {
       children: [label, " ", jsx("span", {
         children: "*"
       })]
     }) : label,
-    inputFormat: _format,
-    value: _format ? parse(field.value, _format, new Date()) : field.value,
+    inputFormat: localFormat,
+    value: localFormat ? parse(field.value, localFormat, new Date()) : field.value,
     onChange: handleChange,
     renderInput: props => jsx(TextField, Object.assign({}, props, {
       fullWidth: true,
@@ -2033,6 +2043,7 @@ const ControlDateTime = ({
   format: _format = DATE_TIME_DEFAULT_FORMAT,
   hideErrorMessage: _hideErrorMessage = false
 }) => {
+  const [localFormat, setLocalFormat] = useState(DATE_TIME_DEFAULT_FORMAT);
   const {
     field,
     fieldState: {
@@ -2044,7 +2055,7 @@ const ControlDateTime = ({
     rules: {
       required: required && 'Please, fill this field',
       validate: val => {
-        if (isMatch(val, _format)) {
+        if (isMatch(val, localFormat)) {
           return true;
         }
         return 'Incorrect date format';
@@ -2052,8 +2063,17 @@ const ControlDateTime = ({
     }
   });
   const handleChange = useCallback(date => {
-    field.onChange(isValid(date) ? format(date, _format) : date);
-  }, [field, _format]);
+    field.onChange(isValid(date) ? format(date, localFormat) : date);
+  }, [field, localFormat]);
+  useEffect(() => {
+    const fixedTimeZone = _format.replace(/[Z,z,x]+/g, 'XX');
+    try {
+      isMatch(format(new Date(), fixedTimeZone), fixedTimeZone);
+      setLocalFormat(fixedTimeZone);
+    } catch (e) {
+      console.error(e);
+    }
+  }, [_format]);
   return jsx(DateTimePicker, Object.assign({}, field, {
     ampm: false,
     label: required ? jsxs(Fragment, {
@@ -2061,8 +2081,8 @@ const ControlDateTime = ({
         children: "*"
       })]
     }) : label,
-    value: _format ? parse(field.value, _format, new Date()) : field.value,
-    inputFormat: _format,
+    value: localFormat ? parse(field.value, localFormat, new Date()) : field.value,
+    inputFormat: localFormat,
     onChange: handleChange,
     renderInput: props => jsx(TextField, Object.assign({}, props, {
       fullWidth: true,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dartech/arsenal-ui",
-  "version": "1.3.41",
+  "version": "1.3.42",
   "author": "DAR",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"