dtable-ui-component 6.0.110-hap.1 → 6.0.110-hum.4

package/lib/DTableGroupSelect/select-option-group.js

@@ -154,9 +154,9 @@ class SelectOptionGroup extends _react.Component {
             title: option.label,
             children: option.label
           }), isSelected && /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
-            className: "dtable-font dtable-icon-check-mark"
+            className: "dtable-font dtable-icon-check"
           })]
-        }, `${option.id}-${index}`);
+        }, "".concat(option.id, "-").concat(index));
       });
     };
     this.state = {
@@ -220,7 +220,7 @@ class SelectOptionGroup extends _react.Component {
       style: style,
       onMouseDown: this.onMouseDown,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: "position-relative mb-1",
+        className: "position-relative",
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DTableSearchInput.default, {
           className: "option-search-control",
           placeholder: searchPlaceholder,
@@ -230,14 +230,13 @@ class SelectOptionGroup extends _react.Component {
           clearValue: this.clearValue,
           components: {
             ClearIndicator: props => {
-              return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-                className: "clear-search-text",
-                onClick: props.clearValue,
-                title: (0, _lang.getLocale)('Clear_search_text'),
-                "aria-label": (0, _lang.getLocale)('Clear_search_text'),
-                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
-                  icon: "x"
-                })
+              return /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+                className: (0, _classnames.default)('select-search-text-clear input-icon-addon seatable-icon dtable-font dtable-icon-x'),
+                onClick: e => {
+                  e.stopPropagation();
+                  e.nativeEvent.stopImmediatePropagation();
+                  props.clearValue();
+                }
               });
             }
           }

package/lib/DTableIcon/index.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _svgIcon = _interopRequireDefault(require("./svg-icon"));
 require("./index.css");
@@ -23,15 +24,14 @@ const DTableIcon = _ref => {
     if (ariaHidden) {
       customProps['aria-hidden'] = ariaHidden;
     }
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("i", (0, _objectSpread2.default)({
       className: (0, _classnames.default)(symbol, className, {
         'dtable-font': !symbol.includes('dtable-font')
       }),
       style: {
         color
-      },
-      ...customProps
-    });
+      }
+    }, customProps));
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_svgIcon.default, {
     symbol: symbol,

package/lib/DTableIcon/svg-icon.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _jsxRuntime = require("react/jsx-runtime");
 let svgIconComponents = null;
@@ -48,9 +49,8 @@ const SvgIcon = _ref => {
     IconComponent = getSvg(symbol);
   }
   if (!IconComponent) return null;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, {
-    className: (0, _classnames.default)('multicolor-icon', className, `multicolor-icon-${symbol}`),
-    ...props
-  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, (0, _objectSpread2.default)({
+    className: (0, _classnames.default)('multicolor-icon', className, "multicolor-icon-".concat(symbol))
+  }, props));
 };
 var _default = exports.default = SvgIcon;

package/lib/DTableModalHeader/index.js

@@ -5,16 +5,19 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
 var _react = _interopRequireDefault(require("react"));
 var _reactstrap = require("reactstrap");
 var _IconButton = _interopRequireDefault(require("../IconButton"));
 require("./index.css");
 var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["children"];
 const DTableModalHeader = _ref => {
   let {
-    children,
-    ...props
-  } = _ref;
+      children
+    } = _ref,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   const customCloseBtn = /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
     type: "button",
     className: "close dtable-modal-close",
@@ -26,10 +29,9 @@ const DTableModalHeader = _ref => {
       className: "dtable-modal-close-inner"
     })
   });
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.ModalHeader, {
-    ...props,
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.ModalHeader, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
     close: customCloseBtn,
     children: children
-  });
+  }));
 };
 var _default = exports.default = DTableModalHeader;

package/lib/DTableRadioGroup/index.js

@@ -49,7 +49,7 @@ class DTableRadioGroup extends _react.default.Component {
       options
     } = this.props;
     if (!this.btn || !this.slider || !Array.isArray(options)) return;
-    this.slider.style.width = `${100 / options.length}%`;
+    this.slider.style.width = "".concat(100 / options.length, "%");
     this.setSliderTransition();
   }
   componentDidUpdate(prevProps) {
@@ -77,13 +77,13 @@ class DTableRadioGroup extends _react.default.Component {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "radio-group-wrapper",
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: `radio-group-options ${readOnly ? 'read-only' : ''}`,
+        className: "radio-group-options ".concat(readOnly ? 'read-only' : ''),
         children: [options.map(option => {
           const isActive = activeOption === option ? true : false;
           const displayOption = optionsDisplay && optionsDisplay[option] || '';
           return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
             ref: ref => this.btn = ref,
-            className: `radio-group-button ${isActive ? 'active' : ''}`,
+            className: "radio-group-button ".concat(isActive ? 'active' : ''),
             "data-option": option,
             onClick: this.onSelectChanged,
             children: displayOption

package/lib/DTableSelect/dtable-select-label.js

@@ -15,7 +15,7 @@ function DTableSelectLabel(_ref) {
     isSelect = false
   } = _ref;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: `${classname} w-100 d-flex justify-content-between`,
+    className: "".concat(classname, " w-100 d-flex justify-content-between"),
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
       children: name
     }), isSelect && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {

package/lib/DTableSelect/index.js

@@ -1,82 +1,183 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _react = _interopRequireDefault(require("react"));
-var _reactSelect = _interopRequireDefault(require("react-select"));
-var _utils = require("./utils");
+var _reactSelect = _interopRequireWildcard(require("react-select"));
+var _selectStyle = require("./select-style");
+var _selectDropdownIndicator = _interopRequireDefault(require("./select-dropdown-indicator"));
 var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["innerProps"],
+  _excluded2 = ["children"];
+const DropdownIndicator = props => {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.components.DropdownIndicator, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_selectDropdownIndicator.default, {})
+  }));
+};
+const ClearIndicator = _ref => {
+  let {
+      innerProps
+    } = _ref,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  const onMouseDown = e => {
+    e.nativeEvent.stopImmediatePropagation();
+    innerProps.onMouseDown(e);
+  };
+  props.innerProps = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, innerProps), {}, {
+    onMouseDown
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.components.ClearIndicator, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: "d-flex align-items-center",
+      style: {
+        marginLeft: '-2px'
+      },
+      "aria-hidden": "true",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "dtable-font dtable-icon-fork-number",
+        style: {
+          width: '12px',
+          height: '12px'
+        }
+      })
+    })
+  }));
+};
+const MenuList = props => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+  onClick: e => e.nativeEvent.stopImmediatePropagation(),
+  onMouseDown: e => e.nativeEvent.stopImmediatePropagation(),
+  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.components.MenuList, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
+    children: props.children
+  }))
+});
+const Option = props => {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    style: props.data.style,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.components.Option, (0, _objectSpread2.default)({}, props))
+  });
+};
+const ValueContainer = _ref2 => {
+  var _props$selectProps$va;
+  let {
+      children
+    } = _ref2,
+    props = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
+  // Do not show '--'
+  const isClearOption = ((_props$selectProps$va = props.selectProps.value) === null || _props$selectProps$va === void 0 ? void 0 : _props$selectProps$va.value) === null;
+  if (isClearOption) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.components.ValueContainer, (0, _objectSpread2.default)({}, props));
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.components.ValueContainer, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
+    className: "seatable-select-value-container",
+    children: children
+  }));
+};
 class DTableSelect extends _react.default.Component {
+  constructor() {
+    super(...arguments);
+    this.getMenuPortalTarget = () => {
+      const {
+        menuPortalTarget = '.modal'
+      } = this.props;
+      return document.querySelector(menuPortalTarget);
+    };
+    this.handleSelectChange = val => {
+      const {
+        onChange
+      } = this.props;
+      if (!val.value) {
+        onChange('');
+        return;
+      }
+      onChange(val);
+    };
+  }
   render() {
     const {
-      options,
-      onChange,
-      value,
-      isSearchable,
-      placeholder,
-      isMulti,
+      options = [],
+      value = {},
+      isSearchable = false,
+      placeholder = '',
+      isMulti = false,
       menuPosition,
-      isClearable,
-      noOptionsMessage,
+      isClearable = true,
+      noOptionsMessage = () => {
+        return null;
+      },
       classNamePrefix,
-      style,
       innerRef,
-      isDisabled,
+      isDisabled = false,
       form,
+      className = '',
       customFilterOption,
-      autoFocus,
-      className
+      autoFocus
     } = this.props;
+    if (isClearable) {
+      if (value && value.label !== '--' && options[0].label !== '--') {
+        options.unshift({
+          value: null,
+          label: '--'
+        });
+      }
+      if (value && value.label === '--' && options[0].label === '--') {
+        options.shift();
+      }
+    }
+    const optionsWithCheck = options.map(option => {
+      const isSelected = value && value.value === option.value;
+      return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, option), {}, {
+        label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+          className: "d-flex align-items-center justify-content-between",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: "select-option-label",
+            children: option.label
+          }), isSelected && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "dtable-font dtable-icon-check",
+            style: {
+              width: '12px',
+              height: '12px'
+            }
+          })]
+        })
+      });
+    });
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.default, {
       value: value,
-      onChange: onChange,
-      options: options,
+      isDisabled: isDisabled,
+      ref: innerRef,
+      onChange: this.handleSelectChange,
+      options: optionsWithCheck,
       isMulti: isMulti,
       className: className,
       classNamePrefix: classNamePrefix,
-      styles: style || _utils.MenuSelectStyle,
+      styles: _selectStyle.MenuSelectStyle,
       components: {
-        Option: _utils.Option,
-        DropdownIndicator: _utils.DropdownIndicator,
-        MenuList: _utils.MenuList,
-        ClearIndicator: _utils.ClearIndicator
+        Option,
+        DropdownIndicator,
+        MenuList,
+        ClearIndicator,
+        ValueContainer
       },
       placeholder: placeholder,
       isSearchable: isSearchable,
-      isClearable: isClearable,
+      isClearable: false,
       menuPosition: menuPosition || 'fixed' // when use default menuPosition(absolute), menuPortalTarget is unnecessary.
       ,
       menuShouldScrollIntoView: true,
-      menuPortalTarget: document.querySelector(this.props.menuPortalTarget),
+      menuPortalTarget: this.getMenuPortalTarget(),
       captureMenuScroll: false,
       hideSelectedOptions: false,
       noOptionsMessage: noOptionsMessage,
-      isDisabled: isDisabled,
-      ref: innerRef,
       filterOption: customFilterOption,
-      form: form,
       autoFocus: autoFocus,
-      menuIsOpen: true,
-      onMenuClose: () => {},
-      onMenuOpen: () => {}
+      form: form
     });
   }
 }
-exports.default = DTableSelect;
-DTableSelect.defaultProps = {
-  options: [],
-  value: {},
-  isDisabled: false,
-  isSearchable: false,
-  isClearable: false,
-  placeholder: '',
-  isMulti: false,
-  autoFocus: false,
-  menuPortalTarget: '.modal',
-  noOptionsMessage: () => {
-    return null;
-  }
-};
+exports.default = DTableSelect;

package/lib/DTableSelect/select-dropdown-indicator/index.css

@@ -0,0 +1,12 @@
+.select-dropdown-indicator {
+  position: absolute;
+  top: 50%;
+  right: 16px;
+  transform: translateY(-50%);
+  margin-left: -2px;
+}
+
+.select-dropdown-indicator svg {
+  width: 12px;
+  height: 12px;
+}

package/lib/DTableSelect/select-dropdown-indicator/index.js

@@ -0,0 +1,20 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
+const SelectDropdownIndicator = () => {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+    className: "select-dropdown-indicator d-flex align-items-center",
+    "aria-hidden": "true",
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: "dtable-font dtable-icon-down3"
+    })
+  });
+};
+var _default = exports.default = SelectDropdownIndicator;

package/lib/DTableSelect/select-style.js

@@ -0,0 +1,134 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MenuSelectStyle = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+// Seahub select is based on seafile-ui.css, so use the following content to override the default react-select style
+const DEFAULT_CONTROL_STYLE = {
+  fontSize: '14px',
+  padding: '0 4px',
+  border: '1px solid var(--bs-border-color) !important',
+  boxShadow: 'none',
+  backgroundColor: 'var(--bs-popover-bg)',
+  borderRadius: '4px',
+  outline: '0'
+};
+const FOCUS_CONTROL_STYLE = {
+  fontSize: '14px',
+  padding: '0 4px',
+  border: '1px solid #3e84f7',
+  boxShadow: 'none',
+  backgroundColor: 'var(--bs-popover-bg)',
+  borderRadius: '4px',
+  outline: '0'
+};
+const controlCallback = (provided, state) => {
+  const {
+    isDisabled,
+    isFocused
+  } = state;
+  if (isDisabled) {
+    return (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, provided), DEFAULT_CONTROL_STYLE), {}, {
+      cursor: 'default',
+      backgroundColor: '#f5f5f5',
+      opacity: 0.65
+    });
+  }
+  if (isFocused) {
+    return (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, provided), FOCUS_CONTROL_STYLE), {}, {
+      '&:hover': (0, _objectSpread2.default)((0, _objectSpread2.default)({}, provided), FOCUS_CONTROL_STYLE)
+    });
+  }
+  return (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, provided), {}, {
+    fontSize: '14px',
+    lineHeight: '1.5',
+    cursor: 'pointer'
+  }, DEFAULT_CONTROL_STYLE), {}, {
+    '&:hover': (0, _objectSpread2.default)({}, DEFAULT_CONTROL_STYLE)
+  });
+};
+const MenuSelectStyle = exports.MenuSelectStyle = {
+  // .react-select__menu / react-select-2-listbox
+  menu: base => {
+    return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, base), {}, {
+      padding: '4px 0 4px 8px',
+      backgroundColor: 'var(--bs-popover-bg)',
+      border: '1px solid var(--bs-border-secondary-color)',
+      borderRadius: '4px',
+      boxShadow: '0px 6px 14px rgba(0, 0, 0, 0.1)',
+      marginTop: '4px'
+    });
+  },
+  // .react-select__menu-list）
+  menuList: provided => (0, _objectSpread2.default)((0, _objectSpread2.default)({}, provided), {}, {
+    paddingRight: '8px'
+  }),
+  option: (provided, state) => {
+    const {
+      isDisabled,
+      isFocused,
+      isActive,
+      isVisited
+    } = state;
+    let bgColor;
+    if (isActive || isVisited) {
+      bgColor = 'rgba(0, 0, 0, 0.06)';
+    } else if (isFocused) {
+      bgColor = 'var(--bs-bg-color)';
+    } else {
+      bgColor = 'var(--bs-popover-bg)';
+    }
+    return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, provided), {}, {
+      color: 'var(--bs-body-color)',
+      borderRadius: '4px',
+      minHeight: '32px',
+      padding: '6px 12px 6px 8px',
+      cursor: isDisabled ? 'default' : 'pointer',
+      backgroundColor: "".concat(bgColor, " !important")
+    });
+  },
+  control: controlCallback,
+  menuPortal: base => (0, _objectSpread2.default)((0, _objectSpread2.default)({}, base), {}, {
+    zIndex: 9999,
+    backgroundColor: 'var(--bs-popover-bg)',
+    color: 'var(--bs-body-color)',
+    borderColor: 'var(--bs-border-secondary-color)'
+  }),
+  singleValue: provided => {
+    return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, provided), {}, {
+      color: 'var(--bs-body-color)'
+    });
+  },
+  multiValue: provided => {
+    return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, provided), {}, {
+      color: 'var(--bs-body-color)'
+    });
+  },
+  multiValueRemove: styles => (0, _objectSpread2.default)((0, _objectSpread2.default)({}, styles), {}, {
+    color: '#909090',
+    ':hover': {
+      backgroundColor: 'transparent',
+      color: 'var(--bs-icon-color)'
+    }
+  }),
+  input: styles => (0, _objectSpread2.default)((0, _objectSpread2.default)({}, styles), {}, {
+    color: 'var(--bs-body-color)'
+  }),
+  placeholder: (provided, state) => {
+    const {
+      isDisabled
+    } = state;
+    return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, provided), {}, {
+      color: '#868e96',
+      opacity: isDisabled ? 0.65 : 1
+    });
+  },
+  indicatorSeparator: (styles, state) => {
+    return {
+      'display': 'none'
+    };
+  }
+};

package/lib/DTableSelect/user-select.css

@@ -1,51 +1,4 @@
-.user-select .select-module-container {
-  display: flex;
-  align-items: center;
-}
-
-.user-select .select-module.select-module-avatar {
-  height: 24px;
-  width: 24px;
-  border-radius: 50%;
-}
-
-.user-select .select-module.select-module-name {
-  color: #212529;
-  font-size: 14px;
-}
-
-.user-select .true__value-container .select-module-container {
-  display: block;
-}
-
-.user-select .true__value-container .select-module.select-module-avatar {
-  height: 16px;
-  width: 16px;
-  border-radius: 50%;
-}
-
-.user-select .true__value-container .true__multi-value__label {
-  padding: 0px;
-}
-
-.user-select .true__value-container .true__multi-value__label .select-module.select-module-avatar {
-  transform: translateY(-2px);
-}
-
-.user-select .true__value-container .select-module.select-module-name {
-  font-size: 13px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  flex: 1 1;
-  line-height: 20px;
-  margin-left: 5px;
-}
-
-.user-select .true__control.true__control--is-focused,
-.user-select .true__control.true__control--is-focused:hover {
-  background-color: #ffffff;
-  border-color: #1991eb;
-  outline: 0;
-  box-shadow: 0 0 0 2px rgba(70, 127, 207, 0.25);
+/* hide checkbox in select value container */
+.seatable-select-value-container .seatable-multicolor-icon-check {
+  display: none;
 }

package/lib/DateEditor/index.js

@@ -1,11 +1,12 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactResponsive = _interopRequireDefault(require("react-responsive"));
 var _dtableUtils = require("dtable-utils");
@@ -59,33 +60,29 @@ const DateEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     onCommit: handelCommit,
     onClose: hideCalendar
   };
-  if (isMobile === false) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_pcEditor.default, {
-    ...props,
+  if (isMobile === false) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_pcEditor.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
     isInModal: isInModal,
     ref: ref
-  });
-  if (isMobile === true) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_mbEditor.default, {
-    ...props,
+  }));
+  if (isMobile === true) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_mbEditor.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
     isReadOnly: isReadOnly,
     column: column,
     ref: ref
-  });
+  }));
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactResponsive.default, {
       query: '(min-width: 768px)',
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_pcEditor.default, {
-        ...props,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_pcEditor.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
         isInModal: isInModal,
         ref: ref
-      })
+      }))
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactResponsive.default, {
       query: '(max-width: 768px)',
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_mbEditor.default, {
-        ...props,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_mbEditor.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
         isReadOnly: isReadOnly,
         column: column,
         ref: ref
-      })
+      }))
     })]
   });
 });