@opengeoweb/form-fields 4.17.0 → 4.19.0

package/index.esm.js

@@ -115,11 +115,17 @@ var isXHoursAfter = function isXHoursAfter(ownDate, otherDate) {
   return inHours <= hours;
 };
 var isLatitude = function isLatitude(lat) {
-  if (!lat) return true;
+  if (!lat) {
+    return true;
+  }
+
   return isFinite(lat) && Math.abs(lat) <= 90 && regexMaxTwoDecimals.test(lat.toString());
 };
 var isLongitude = function isLongitude(lng) {
-  if (!lng) return true;
+  if (!lng) {
+    return true;
+  }
+
   return isFinite(lng) && Math.abs(lng) <= 180 && lng >= -180 && regexMaxTwoDecimals.test(lng.toString());
 }; // Pass null if no maxValue
 
@@ -717,7 +723,11 @@ var ReactHookFormNumberField = function ReactHookFormNumberField(_a) {
   }, otherProps)));
 };
 
-moment$1.tz.setDefault('Etc/GMT-0');
+moment$1.tz.setDefault('Etc/GMT-0'); // TODO: remove when issue is fixed in upcoming release https://github.com/mui/mui-x/issues/8150
+
+var temporaryStripChineseCharacters = function temporaryStripChineseCharacters(dirtyString) {
+  return dirtyString.replace(/[\u2066\u2067\u2068\u2069\u200e]/g, '');
+};
 var getFormattedValue = function getFormattedValue(value) {
   var isMoment = moment$1(value).isValid();
   return isMoment ? moment$1.utc(value).format() : value;
@@ -742,7 +752,8 @@ var ReactHookKeyboardDateTimePicker = function ReactHookKeyboardDateTimePicker(_
       className = _a.className,
       sx = _a.sx,
       isReadOnly = _a.isReadOnly,
-      otherProps = __rest(_a, ["name", "rules", "disabled", "label", "format", "openTo", "defaultNullValue", "helperText", "onChange", "className", "sx", "isReadOnly"]);
+      inputAdornment = _a.inputAdornment,
+      otherProps = __rest(_a, ["name", "rules", "disabled", "label", "format", "openTo", "defaultNullValue", "helperText", "onChange", "className", "sx", "isReadOnly", "inputAdornment"]);
 
   var _useFormContext = useFormContext(),
       control = _useFormContext.control;
@@ -759,7 +770,9 @@ var ReactHookKeyboardDateTimePicker = function ReactHookKeyboardDateTimePicker(_
       ref = _useController$field.ref,
       formErrors = _useController.formState.errors;
 
-  var errors = getErrors(name, formErrors);
+  var errors = getErrors(name, formErrors); // Ensure value is a Moment object
+
+  var dateValue = value ? moment$1(value) : null;
   return /*#__PURE__*/React.createElement(ReactHookFormFormControl, {
     disabled: disabled,
     errors: errors,
@@ -769,10 +782,9 @@ var ReactHookKeyboardDateTimePicker = function ReactHookKeyboardDateTimePicker(_
   }, /*#__PURE__*/React.createElement(DateTimePicker, Object.assign({
     desktopModeMediaQuery: "@media (min-width: 720px)",
     ampm: false,
-    mask: "____/__/__ __:__",
-    inputFormat: format,
+    format: format,
     label: label,
-    value: value,
+    value: dateValue,
     openTo: openTo,
     disabled: disabled,
     onChange: function onChange(value) {
@@ -780,42 +792,34 @@ var ReactHookKeyboardDateTimePicker = function ReactHookKeyboardDateTimePicker(_
 
       _onChange(getFormattedValue(value));
     },
-    // if focusedView is removed, it will throw an error when switching day to month mode
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    focusedView: "month",
     inputRef: ref,
-    InputAdornmentProps: {
-      position: 'start'
-    },
-    InputProps: Object.assign(Object.assign({
-      endAdornment: /*#__PURE__*/React.createElement(InputAdornment, {
-        style: {
-          paddingTop: '16px'
-        },
-        position: "end"
-      }, "UTC")
-    }, isReadOnly && {
-      readOnly: true
-    }), otherProps.InputProps),
-    hideTabs: false,
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    // eslint-disable-next-line react/jsx-no-duplicate-props
-    inputProps: disabled ? {
-      placeholder: ''
-    } : undefined,
-    renderInput: function renderInput(_a) {
-      _a.error;
-          var props = __rest(_a, ["error"]);
-
-      return /*#__PURE__*/React.createElement(TextField, Object.assign({
+    slotProps: {
+      textField: {
+        variant: 'filled',
         helperText: helperText,
         error: !!errors,
         name: name,
-        "data-testid": otherProps['data-testid'],
-        variant: "filled"
-      }, props));
+        placeholder: disabled ? '' : format.toLowerCase(),
+        InputProps: Object.assign({
+          endAdornment: /*#__PURE__*/React.createElement(InputAdornment, {
+            style: {
+              paddingTop: '16px'
+            },
+            position: "end"
+          }, "UTC")
+        }, isReadOnly && {
+          readOnly: true
+        }),
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        'data-testid': otherProps['data-testid']
+      },
+      inputAdornment: Object.assign({}, inputAdornment || {
+        position: 'start'
+      }),
+      tabs: {
+        hidden: false
+      }
     }
   }, otherProps)));
 };
@@ -966,4 +970,4 @@ var useDraftFormHelpers = function useDraftFormHelpers() {
   };
 };
 
-export { HIDDEN_INPUT_HELPER_IS_DRAFT, ReactHookKeyboardDateTimePicker as ReactHookFormDateTime, ReactHookFormFormControl, ReactHookFormHiddenInput, ReactHookFormNumberField, ReactHookFormProviderWrapper as ReactHookFormProvider, ReactHookFormRadioGroup, ReactHookFormSelect, ReactHookFormTextField, defaultFormOptions, errorMessages, getDeepProperty, hasIntersectionWithFIR, hasMaxFeaturePoints, hasMulitpleIntersections, isAfter, isBefore, isBetween, isEmpty, isGeometryDirty, isInteger, isLatitude, isLongitude, isMaximumOneDrawing, isNonOrBothCoordinates, isValidDate, isValidGeoJsonCoordinates, isValidMax, isValidMin, isXHoursAfter, isXHoursBefore, useDraftFormHelpers };
+export { HIDDEN_INPUT_HELPER_IS_DRAFT, ReactHookKeyboardDateTimePicker as ReactHookFormDateTime, ReactHookFormFormControl, ReactHookFormHiddenInput, ReactHookFormNumberField, ReactHookFormProviderWrapper as ReactHookFormProvider, ReactHookFormRadioGroup, ReactHookFormSelect, ReactHookFormTextField, defaultFormOptions, errorMessages, getDeepProperty, hasIntersectionWithFIR, hasMaxFeaturePoints, hasMulitpleIntersections, isAfter, isBefore, isBetween, isEmpty, isGeometryDirty, isInteger, isLatitude, isLongitude, isMaximumOneDrawing, isNonOrBothCoordinates, isValidDate, isValidGeoJsonCoordinates, isValidMax, isValidMin, isXHoursAfter, isXHoursBefore, temporaryStripChineseCharacters, useDraftFormHelpers };

package/index.umd.js

@@ -177,11 +177,17 @@
       return inHours <= hours;
     };
     var isLatitude = function isLatitude(lat) {
-      if (!lat) return true;
+      if (!lat) {
+        return true;
+      }
+
       return isFinite(lat) && Math.abs(lat) <= 90 && regexMaxTwoDecimals.test(lat.toString());
     };
     var isLongitude = function isLongitude(lng) {
-      if (!lng) return true;
+      if (!lng) {
+        return true;
+      }
+
       return isFinite(lng) && Math.abs(lng) <= 180 && lng >= -180 && regexMaxTwoDecimals.test(lng.toString());
     }; // Pass null if no maxValue
 
@@ -707,7 +713,11 @@
       }, otherProps)));
     };
 
-    moment__default$1["default"].tz.setDefault('Etc/GMT-0');
+    moment__default$1["default"].tz.setDefault('Etc/GMT-0'); // TODO: remove when issue is fixed in upcoming release https://github.com/mui/mui-x/issues/8150
+
+    var temporaryStripChineseCharacters = function temporaryStripChineseCharacters(dirtyString) {
+      return dirtyString.replace(/[\u2066\u2067\u2068\u2069\u200e]/g, '');
+    };
     var getFormattedValue = function getFormattedValue(value) {
       var isMoment = moment__default$1["default"](value).isValid();
       return isMoment ? moment__default$1["default"].utc(value).format() : value;
@@ -732,7 +742,8 @@
           className = _a.className,
           sx = _a.sx,
           isReadOnly = _a.isReadOnly,
-          otherProps = __rest(_a, ["name", "rules", "disabled", "label", "format", "openTo", "defaultNullValue", "helperText", "onChange", "className", "sx", "isReadOnly"]);
+          inputAdornment = _a.inputAdornment,
+          otherProps = __rest(_a, ["name", "rules", "disabled", "label", "format", "openTo", "defaultNullValue", "helperText", "onChange", "className", "sx", "isReadOnly", "inputAdornment"]);
 
       var control = reactHookForm.useFormContext().control;
 
@@ -748,7 +759,9 @@
           ref = _j.ref,
           formErrors = _h.formState.errors;
 
-      var errors = getErrors(name, formErrors);
+      var errors = getErrors(name, formErrors); // Ensure value is a Moment object
+
+      var dateValue = value ? moment__default$1["default"](value) : null;
       return /*#__PURE__*/React__namespace.createElement(ReactHookFormFormControl, {
         disabled: disabled,
         errors: errors,
@@ -758,10 +771,9 @@
       }, /*#__PURE__*/React__namespace.createElement(xDatePickers.DateTimePicker, __assign({
         desktopModeMediaQuery: "@media (min-width: 720px)",
         ampm: false,
-        mask: "____/__/__ __:__",
-        inputFormat: format,
+        format: format,
         label: label,
-        value: value,
+        value: dateValue,
         openTo: openTo,
         disabled: disabled,
         onChange: function onChange(value) {
@@ -769,42 +781,34 @@
 
           _onChange(getFormattedValue(value));
         },
-        // if focusedView is removed, it will throw an error when switching day to month mode
-        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-        // @ts-ignore
-        focusedView: "month",
         inputRef: ref,
-        InputAdornmentProps: {
-          position: 'start'
-        },
-        InputProps: __assign(__assign({
-          endAdornment: /*#__PURE__*/React__namespace.createElement(material.InputAdornment, {
-            style: {
-              paddingTop: '16px'
-            },
-            position: "end"
-          }, "UTC")
-        }, isReadOnly && {
-          readOnly: true
-        }), otherProps.InputProps),
-        hideTabs: false,
-        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-        // @ts-ignore
-        // eslint-disable-next-line react/jsx-no-duplicate-props
-        inputProps: disabled ? {
-          placeholder: ''
-        } : undefined,
-        renderInput: function renderInput(_a) {
-          _a.error;
-              var props = __rest(_a, ["error"]);
-
-          return /*#__PURE__*/React__namespace.createElement(material.TextField, __assign({
+        slotProps: {
+          textField: {
+            variant: 'filled',
             helperText: helperText,
             error: !!errors,
             name: name,
-            "data-testid": otherProps['data-testid'],
-            variant: "filled"
-          }, props));
+            placeholder: disabled ? '' : format.toLowerCase(),
+            InputProps: __assign({
+              endAdornment: /*#__PURE__*/React__namespace.createElement(material.InputAdornment, {
+                style: {
+                  paddingTop: '16px'
+                },
+                position: "end"
+              }, "UTC")
+            }, isReadOnly && {
+              readOnly: true
+            }),
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
+            'data-testid': otherProps['data-testid']
+          },
+          inputAdornment: __assign({}, inputAdornment || {
+            position: 'start'
+          }),
+          tabs: {
+            hidden: false
+          }
         }
       }, otherProps)));
     };
@@ -933,6 +937,7 @@
     exports.isValidMin = isValidMin;
     exports.isXHoursAfter = isXHoursAfter;
     exports.isXHoursBefore = isXHoursBefore;
+    exports.temporaryStripChineseCharacters = temporaryStripChineseCharacters;
     exports.useDraftFormHelpers = useDraftFormHelpers;
 
     Object.defineProperty(exports, '__esModule', { value: true });

package/lib/components/ReactHookFormDateTime.d.ts

@@ -1,16 +1,18 @@
 import * as React from 'react';
 import { SxProps, Theme } from '@mui/material';
 import { Moment } from 'moment-timezone';
-import { DateTimePickerProps } from '@mui/x-date-pickers';
-import { DateTimePickerSlotsComponent } from '@mui/x-date-pickers/DateTimePicker/DateTimePicker';
+import { DateTimePickerProps, DateTimePickerSlotsComponentsProps } from '@mui/x-date-pickers';
 import { ReactHookFormInput } from './types';
+export declare const temporaryStripChineseCharacters: (dirtyString: string) => string;
 export declare const getFormattedValue: (value: Moment | string) => string | Moment;
-declare type ReactHookKeyboardDateTimePickerProps = Partial<Partial<DateTimePickerProps<DateTimePickerSlotsComponent, Moment>>> & ReactHookFormInput<{
+declare type ReactHookKeyboardDateTimePickerProps = DateTimePickerProps<Moment> & DateTimePickerSlotsComponentsProps<Moment> & ReactHookFormInput<{
     defaultNullValue?: string | null;
     value?: string;
     onChange?: (value: string | Moment) => void;
     format?: string;
     sx?: SxProps<Theme>;
-}>;
+}> & {
+    'data-testid'?: string;
+};
 declare const ReactHookKeyboardDateTimePicker: React.FC<ReactHookKeyboardDateTimePickerProps>;
 export default ReactHookKeyboardDateTimePicker;

package/lib/components/index.d.ts

@@ -9,3 +9,4 @@ export { default as ReactHookFormHiddenInput } from './ReactHookFormHiddenInput'
 export { defaultFormOptions } from './ReactHookFormProvider';
 export { errorMessages, isMaximumOneDrawing, isGeometryDirty, isValidGeoJsonCoordinates, hasIntersectionWithFIR, isValidMax, isValidMin, isInteger, isAfter, isBefore, isBetween, isValidDate, hasMaxFeaturePoints, hasMulitpleIntersections, isXHoursBefore, isXHoursAfter, isLatitude, isLongitude, isNonOrBothCoordinates, isEmpty, } from './utils';
 export { getDeepProperty } from './formUtils';
+export { temporaryStripChineseCharacters } from './ReactHookFormDateTime';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/form-fields",
-  "version": "4.17.0",
+  "version": "4.19.0",
   "description": "GeoWeb form-fields library for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {
@@ -14,11 +14,11 @@
   "peerDependencies": {
     "react-hook-form": "^7.41.5",
     "react": "^18.2.0",
-    "@mui/material": "^5.10.8",
-    "@opengeoweb/theme": "4.17.0",
+    "@mui/material": "^5.12.0",
+    "@opengeoweb/theme": "4.19.0",
+    "@mui/x-date-pickers": "^6.2.1",
     "moment": "^2.29.0",
     "moment-timezone": "^0.5.31",
-    "@mui/x-date-pickers": "^5.0.4",
     "lodash": "^4.17.20"
   }
 }