@opengeoweb/form-fields 4.18.0 → 4.19.0

package/index.esm.js

@@ -723,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;
@@ -748,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;
@@ -765,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,
@@ -775,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) {
@@ -786,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)));
 };
@@ -972,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

@@ -713,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;
@@ -738,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;
 
@@ -754,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,
@@ -764,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) {
@@ -775,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)));
     };
@@ -939,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.18.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.18.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"
   }
 }