@data-driven-forms/mui-component-mapper 3.20.1 → 3.20.2

package/esm/select/select.js

@@ -10,7 +10,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-import React from 'react';
+import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import FormFieldGrid from '../form-field-grid/form-field-grid';
 import { validationError } from '../validation-error/validation-error';
@@ -103,8 +103,12 @@ var InternalSelect = function InternalSelect(_ref2) {
       isDisabled = _ref2.isDisabled,
       rest = _objectWithoutProperties(_ref2, _excluded2);
 
-  var invalid = validationError(meta, validateOnMount);
-  var internalValue = parseInternalValue(value, isMulti);
+  var invalid = validationError(meta, validateOnMount); // When isMulti is true, the "parseInternalValue" always creates new value array, we need to memoize it to not create new array instance
+  // Memo is required to fix https://github.com/data-driven-forms/react-forms/issues/1366
+
+  var internalValue = useMemo(function () {
+    return parseInternalValue(value, isMulti);
+  }, [value, isMulti]);
   return /*#__PURE__*/React.createElement(FormFieldGrid, FormFieldGridProps, /*#__PURE__*/React.createElement(Autocomplete, _extends({
     filterSelectedOptions: hideSelectedOptions,
     disabled: isDisabled,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@data-driven-forms/mui-component-mapper",
-  "version": "3.20.1",
+  "version": "3.20.2",
   "description": "Component mapper for Material ui component mapper form data-driven-forms.",
   "main": "index.js",
   "module": "esm/index.js",
@@ -29,7 +29,7 @@
     "@mui/material": "^5.10.4"
   },
   "peerDependencies": {
-    "@data-driven-forms/react-form-renderer": "^3.20.1",
+    "@data-driven-forms/react-form-renderer": "^3.20.2",
     "@mui/icons-material": "^5.10.3",
     "@mui/material": "^5.10.4",
     "prop-types": ">=15.7.2",
@@ -37,7 +37,7 @@
     "react-dom": "^17.0.2 || ^18.0.0"
   },
   "dependencies": {
-    "@data-driven-forms/common": "^3.20.1",
+    "@data-driven-forms/common": "^3.20.2",
     "@emotion/react": "^11.10.4",
     "@emotion/styled": "^11.10.4",
     "@mui/system": "^5.10.4",

package/select/select.js

@@ -2,6 +2,8 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
+var _typeof3 = require("@babel/runtime/helpers/typeof");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -15,7 +17,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
@@ -43,6 +45,10 @@ var _excluded = ["inputProps"],
     _excluded2 = ["value", "options", "label", "helperText", "validateOnMount", "meta", "isSearchable", "description", "classNamePrefix", "isMulti", "placeholder", "onInputChange", "isFetching", "noOptionsMessage", "hideSelectedOptions", "closeMenuOnSelect", "required", "onChange", "onFocus", "onBlur", "FormFieldGridProps", "TextFieldProps", "inputProps", "isClearable", "isDisabled"],
     _excluded3 = ["input", "isRequired", "isDisabled", "isReadOnly", "disabled", "multiple", "isMulti", "isClearable", "disableClearable", "loadingMessage", "loadingText", "noOptionsMessage", "noOptionsText", "closeMenuOnSelect"];
 
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -129,8 +135,12 @@ var InternalSelect = function InternalSelect(_ref2) {
       isClearable = _ref2.isClearable,
       isDisabled = _ref2.isDisabled,
       rest = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
-  var invalid = (0, _validationError.validationError)(meta, validateOnMount);
-  var internalValue = (0, _parseInternalValue["default"])(value, isMulti);
+  var invalid = (0, _validationError.validationError)(meta, validateOnMount); // When isMulti is true, the "parseInternalValue" always creates new value array, we need to memoize it to not create new array instance
+  // Memo is required to fix https://github.com/data-driven-forms/react-forms/issues/1366
+
+  var internalValue = (0, _react.useMemo)(function () {
+    return (0, _parseInternalValue["default"])(value, isMulti);
+  }, [value, isMulti]);
   return /*#__PURE__*/_react["default"].createElement(_formFieldGrid["default"], FormFieldGridProps, /*#__PURE__*/_react["default"].createElement(_Autocomplete["default"], (0, _extends2["default"])({
     filterSelectedOptions: hideSelectedOptions,
     disabled: isDisabled,