dtable-ui-component 6.0.49 → 6.0.50

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

@@ -12,6 +12,7 @@ var _DTableSearchInput = _interopRequireDefault(require("../DTableSearchInput"))
 var _option = _interopRequireDefault(require("./option"));
 var _KeyCodes = _interopRequireDefault(require("../SelectOptionGroup/KeyCodes"));
 require("./select-option-group.css");
+var _jsxRuntime = require("react/jsx-runtime");
 const OPTION_HEIGHT = 32;
 class SelectOptionGroup extends _react.Component {
   constructor(props) {
@@ -132,26 +133,28 @@ class SelectOptionGroup extends _react.Component {
       } = this.props;
       this.filterOptions = this.props.getFilterOptions(searchVal);
       if (this.filterOptions.length === 0) {
-        return /*#__PURE__*/_react.default.createElement("div", {
-          className: "none-search-result"
-        }, noOptionsPlaceholder);
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: "none-search-result",
+          children: noOptionsPlaceholder
+        });
       }
       return this.filterOptions.map((option, index) => {
         const isSelected = selectedOptions.some(item => item.id === option.id);
-        return /*#__PURE__*/_react.default.createElement(_option.default, {
-          key: "".concat(option.id, "-").concat(index),
+        return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_option.default, {
           index: index,
           isActive: this.state.activeIndex === index,
           option: option,
           onSelectOption: onSelectOption,
           changeIndex: this.changeIndex,
-          disableHover: this.state.disableHover
-        }, /*#__PURE__*/_react.default.createElement("div", {
-          className: "option-label text-truncate",
-          title: option.label
-        }, option.label), isSelected && /*#__PURE__*/_react.default.createElement("i", {
-          className: "dtable-font dtable-icon-check-mark"
-        }));
+          disableHover: this.state.disableHover,
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: "option-label text-truncate",
+            title: option.label,
+            children: option.label
+          }), isSelected && /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+            className: "dtable-font dtable-icon-check-mark"
+          })]
+        }, "".concat(option.id, "-").concat(index));
       });
     };
     this.state = {
@@ -209,22 +212,25 @@ class SelectOptionGroup extends _react.Component {
         opacity: 0
       };
     }
-    return /*#__PURE__*/_react.default.createElement("div", {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: (0, _classnames.default)('option-group group-selector', className ? 'option-group-' + className : ''),
       ref: ref => this.optionGroupRef = ref,
       style: style,
-      onMouseDown: this.onMouseDown
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "option-group-search position-relative"
-    }, /*#__PURE__*/_react.default.createElement(_DTableSearchInput.default, {
-      className: "option-search-control",
-      placeholder: searchPlaceholder,
-      onChange: this.onChangeSearch,
-      ref: this.searchInputRef
-    })), /*#__PURE__*/_react.default.createElement("div", {
-      className: "option-group-content",
-      ref: ref => this.optionGroupContentRef = ref
-    }, this.renderOptGroup(searchVal)));
+      onMouseDown: this.onMouseDown,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: "option-group-search position-relative",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DTableSearchInput.default, {
+          className: "option-search-control",
+          placeholder: searchPlaceholder,
+          onChange: this.onChangeSearch,
+          ref: this.searchInputRef
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: "option-group-content",
+        ref: ref => this.optionGroupContentRef = ref,
+        children: this.renderOptGroup(searchVal)
+      })]
+    });
   }
 }
 var _default = exports.default = SelectOptionGroup;

package/lib/DTableModalHeader/index.js

@@ -9,23 +9,27 @@ var _react = _interopRequireDefault(require("react"));
 var _reactstrap = require("reactstrap");
 var _IconButton = _interopRequireDefault(require("../IconButton"));
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 const DTableModalHeader = _ref => {
   let {
     children,
     ...props
   } = _ref;
-  const customCloseBtn = /*#__PURE__*/_react.default.createElement("button", {
+  const customCloseBtn = /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
     type: "button",
     className: "close dtable-modal-close",
     "data-dismiss": "modal",
     "aria-label": "Close",
-    onClick: props.toggle
-  }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
-    icon: "x",
-    className: "dtable-modal-close-inner"
-  }));
-  return /*#__PURE__*/_react.default.createElement(_reactstrap.ModalHeader, Object.assign({}, props, {
-    close: customCloseBtn
-  }), children);
+    onClick: props.toggle,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
+      icon: "x",
+      className: "dtable-modal-close-inner"
+    })
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.ModalHeader, {
+    ...props,
+    close: customCloseBtn,
+    children: children
+  });
 };
 var _default = exports.default = DTableModalHeader;

package/lib/DTablePopover/index.js

@@ -8,6 +8,7 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactstrap = require("reactstrap");
 var _utils = require("../utils/utils");
+var _jsxRuntime = require("react/jsx-runtime");
 class DTablePopover extends _react.default.Component {
   constructor() {
     super(...arguments);
@@ -62,7 +63,7 @@ class DTablePopover extends _react.default.Component {
       modifiers,
       placement
     } = this.props;
-    return /*#__PURE__*/_react.default.createElement(_reactstrap.Popover, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.Popover, {
       placement: placement,
       isOpen: true,
       target: target,
@@ -70,11 +71,13 @@ class DTablePopover extends _react.default.Component {
       hideArrow: hideArrow,
       innerClassName: innerClassName,
       className: popoverClassName,
-      modifiers: modifiers
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      ref: ref => this.dtablePopoverRef = ref,
-      onClick: this.onPopoverInsideClick
-    }, this.props.children));
+      modifiers: modifiers,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        ref: ref => this.dtablePopoverRef = ref,
+        onClick: this.onPopoverInsideClick,
+        children: this.props.children
+      })
+    });
   }
 }
 DTablePopover.defaultProps = {

package/lib/DTableRadio/index.js

@@ -8,6 +8,7 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 function DTableRadio(_ref) {
   let {
     disabled = false,
@@ -18,25 +19,27 @@ function DTableRadio(_ref) {
     value,
     label
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement("label", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
     className: (0, _classnames.default)('dtable-radio w-100 align-items-center position-relative', {
       'dtable-radio-disable': disabled,
       [className]: className
-    })
-  }, /*#__PURE__*/_react.default.createElement("input", {
-    type: "radio",
-    className: "dtable-radio-input position-absolute",
-    checked: isChecked,
-    onChange: disabled ? () => {} : onCheckedChange,
-    name: name,
-    value: value
-  }), /*#__PURE__*/_react.default.createElement("span", {
-    className: (0, _classnames.default)('dtable-radio-indicator position-relative', {
-      'dtable-radio-selected-indicator': isChecked,
-      'dtable-radio-indicator-disable': disabled
-    })
-  }), /*#__PURE__*/_react.default.createElement("span", {
-    className: "dtable-radio-description text-truncate ml-2"
-  }, label));
+    }),
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+      type: "radio",
+      className: "dtable-radio-input position-absolute",
+      checked: isChecked,
+      onChange: disabled ? () => {} : onCheckedChange,
+      name: name,
+      value: value
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: (0, _classnames.default)('dtable-radio-indicator position-relative', {
+        'dtable-radio-selected-indicator': isChecked,
+        'dtable-radio-indicator-disable': disabled
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: "dtable-radio-description text-truncate ml-2",
+      children: label
+    })]
+  });
 }
 var _default = exports.default = DTableRadio;

package/lib/DTableRadioGroup/index.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 const SLIDER_TRANSITION = '150ms cubic-bezier(.4, 0, .2, 1)';
 class DTableRadioGroup extends _react.default.Component {
   constructor(props) {
@@ -73,24 +74,26 @@ class DTableRadioGroup extends _react.default.Component {
     const {
       activeOption
     } = this.state;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "radio-group-wrapper"
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "radio-group-options ".concat(readOnly ? 'read-only' : '')
-    }, options.map(option => {
-      const isActive = activeOption === option ? true : false;
-      const displayOption = optionsDisplay && optionsDisplay[option] || '';
-      return /*#__PURE__*/_react.default.createElement("div", {
-        key: option,
-        ref: ref => this.btn = ref,
-        className: "radio-group-button ".concat(isActive ? 'active' : ''),
-        "data-option": option,
-        onClick: this.onSelectChanged
-      }, displayOption);
-    }), /*#__PURE__*/_react.default.createElement("span", {
-      className: "radio-group-slider btn btn-primary",
-      ref: ref => this.slider = ref
-    })));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "radio-group-wrapper",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        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 ".concat(isActive ? 'active' : ''),
+            "data-option": option,
+            onClick: this.onSelectChanged,
+            children: displayOption
+          }, option);
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: "radio-group-slider btn btn-primary",
+          ref: ref => this.slider = ref
+        })]
+      })
+    });
   }
 }
 var _default = exports.default = DTableRadioGroup;

package/lib/DTableSearchInput/index.js

@@ -9,6 +9,7 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _utils = require("./utils");
+var _jsxRuntime = require("react/jsx-runtime");
 class DtableSearchInput extends _react.Component {
   constructor(props) {
     super(props);
@@ -71,14 +72,15 @@ class DtableSearchInput extends _react.Component {
           clearValue: this.clearSearch
         });
       } else if ((0, _utils.isFunction)(ClearIndicator)) {
-        return /*#__PURE__*/_react.default.createElement(ClearIndicator, {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(ClearIndicator, {
           clearValue: this.clearSearch
         });
       }
-      return /*#__PURE__*/_react.default.createElement("i", {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
         className: (0, _classnames.default)('search-text-clear input-icon-addon', clearClassName),
-        onClick: this.clearSearch
-      }, "\xD7");
+        onClick: this.clearSearch,
+        children: "\xD7"
+      });
     };
     this.state = {
       searchValue: props.value
@@ -111,20 +113,22 @@ class DtableSearchInput extends _react.Component {
     const {
       searchValue
     } = this.state;
-    return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("input", {
-      ref: ref => this.inputRef = ref,
-      type: "text",
-      value: searchValue,
-      className: (0, _classnames.default)('form-control', className),
-      onChange: this.onChange,
-      autoFocus: autoFocus,
-      placeholder: placeholder,
-      onCompositionStart: this.onCompositionStart,
-      onCompositionEnd: this.onCompositionEnd,
-      onKeyDown: onKeyDown,
-      disabled: disabled,
-      style: style
-    }), this.renderClear());
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+        ref: ref => this.inputRef = ref,
+        type: "text",
+        value: searchValue,
+        className: (0, _classnames.default)('form-control', className),
+        onChange: this.onChange,
+        autoFocus: autoFocus,
+        placeholder: placeholder,
+        onCompositionStart: this.onCompositionStart,
+        onCompositionEnd: this.onCompositionEnd,
+        onKeyDown: onKeyDown,
+        disabled: disabled,
+        style: style
+      }), this.renderClear()]
+    });
   }
 }
 DtableSearchInput.defaultProps = {

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

@@ -7,18 +7,23 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 require("./dtable-select-label.css");
+var _jsxRuntime = require("react/jsx-runtime");
 function DTableSelectLabel(_ref) {
   let {
     classname = '',
     name = '',
     isSelect = false
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: "".concat(classname, " w-100 d-flex justify-content-between")
-  }, /*#__PURE__*/_react.default.createElement("span", null, name), isSelect && /*#__PURE__*/_react.default.createElement("div", {
-    className: "dtable-select-check-icon"
-  }, /*#__PURE__*/_react.default.createElement("i", {
-    className: "dtable-font dtable-icon-check-mark"
-  })));
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: "".concat(classname, " w-100 d-flex justify-content-between"),
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      children: name
+    }), isSelect && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "dtable-select-check-icon",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+        className: "dtable-font dtable-icon-check-mark"
+      })
+    })]
+  });
 }
 var _default = exports.default = DTableSelectLabel;

package/lib/DTableSelect/index.js

@@ -8,6 +8,7 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactSelect = _interopRequireDefault(require("react-select"));
 var _utils = require("./utils");
+var _jsxRuntime = require("react/jsx-runtime");
 class DTableSelect extends _react.default.Component {
   render() {
     const {
@@ -29,7 +30,7 @@ class DTableSelect extends _react.default.Component {
       autoFocus,
       className
     } = this.props;
-    return /*#__PURE__*/_react.default.createElement(_reactSelect.default, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.default, {
       value: value,
       onChange: onChange,
       options: options,

package/lib/DTableSelect/utils.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.UserSelectStyle = exports.Option = exports.MenuSelectStyle = exports.MenuList = exports.DropdownIndicator = exports.ClearIndicator = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactSelect = require("react-select");
+var _jsxRuntime = require("react/jsx-runtime");
 // DtableSelect is based on seatable-ui.css, so use the following content to override the default react-select style
 const DEFAULT_CONTROL_STYLE = {
   border: '1px solid rgba(0, 40, 100, 0.12) !important'
@@ -131,13 +132,16 @@ const MenuSelectStyle = exports.MenuSelectStyle = {
   indicatorSeparator: noneCallback
 };
 const DropdownIndicator = props => {
-  return _reactSelect.components.DropdownIndicator && /*#__PURE__*/_react.default.createElement(_reactSelect.components.DropdownIndicator, props, /*#__PURE__*/_react.default.createElement("span", {
-    className: "dtable-font dtable-icon-down3",
-    style: {
-      fontSize: '12px',
-      marginLeft: '-2px'
-    }
-  }));
+  return _reactSelect.components.DropdownIndicator && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.components.DropdownIndicator, {
+    ...props,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: "dtable-font dtable-icon-down3",
+      style: {
+        fontSize: '12px',
+        marginLeft: '-2px'
+      }
+    })
+  });
 };
 exports.DropdownIndicator = DropdownIndicator;
 const ClearIndicator = _ref => {
@@ -153,23 +157,33 @@ const ClearIndicator = _ref => {
     ...innerProps,
     onMouseDown
   };
-  return /*#__PURE__*/_react.default.createElement(_reactSelect.components.ClearIndicator, props, /*#__PURE__*/_react.default.createElement("span", {
-    className: "dtable-font dtable-icon-fork-number",
-    style: {
-      fontSize: '12px',
-      marginRight: '-2px'
-    }
-  }));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.components.ClearIndicator, {
+    ...props,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: "dtable-font dtable-icon-fork-number",
+      style: {
+        fontSize: '12px',
+        marginRight: '-2px'
+      }
+    })
+  });
 };
 exports.ClearIndicator = ClearIndicator;
-const MenuList = props => /*#__PURE__*/_react.default.createElement("div", {
+const MenuList = props => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
   onClick: e => e.nativeEvent.stopImmediatePropagation(),
-  onMouseDown: e => e.nativeEvent.stopImmediatePropagation()
-}, /*#__PURE__*/_react.default.createElement(_reactSelect.components.MenuList, props, props.children));
+  onMouseDown: e => e.nativeEvent.stopImmediatePropagation(),
+  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.components.MenuList, {
+    ...props,
+    children: props.children
+  })
+});
 exports.MenuList = MenuList;
 const Option = props => {
-  return /*#__PURE__*/_react.default.createElement("div", {
-    style: props.data.style
-  }, /*#__PURE__*/_react.default.createElement(_reactSelect.components.Option, props));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    style: props.data.style,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.components.Option, {
+      ...props
+    })
+  });
 };
 exports.Option = Option;

package/lib/DTableSwitch/index.js

@@ -9,6 +9,7 @@ var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _dtableUtils = require("dtable-utils");
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 function DTableSwitch(_ref) {
   let {
     onChange,
@@ -19,31 +20,38 @@ function DTableSwitch(_ref) {
     switchPosition = 'right',
     switchClassName
   } = _ref;
-  const switchNode = /*#__PURE__*/_react.default.createElement("span", {
+  const switchNode = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
     className: "custom-switch-indicator"
   });
-  const textNode = /*#__PURE__*/_react.default.createElement("span", {
-    className: "custom-switch-description text-truncate"
-  }, placeholder);
-  return /*#__PURE__*/_react.default.createElement("div", {
+  const textNode = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+    className: "custom-switch-description text-truncate",
+    children: placeholder
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     className: (0, _classnames.default)('dtable-switch position-relative', {
       'disabled': disabled
     }, {
       [size]: size
     }, {
       [switchClassName]: switchClassName
+    }),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
+      className: "custom-switch",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+        className: "custom-switch-input",
+        type: "checkbox",
+        checked: checked,
+        onChange: onChange,
+        name: "custom-switch-checkbox",
+        disabled: disabled,
+        "aria-label": placeholder,
+        id: 'dtable-switch-' + (0, _dtableUtils.generatorBase64Code)(12)
+      }), switchPosition === 'left' && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+        children: [switchNode, textNode]
+      }), switchPosition === 'right' && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+        children: [textNode, switchNode]
+      })]
     })
-  }, /*#__PURE__*/_react.default.createElement("label", {
-    className: "custom-switch"
-  }, /*#__PURE__*/_react.default.createElement("input", {
-    className: "custom-switch-input",
-    type: "checkbox",
-    checked: checked,
-    onChange: onChange,
-    name: "custom-switch-checkbox",
-    disabled: disabled,
-    "aria-label": placeholder,
-    id: 'dtable-switch-' + (0, _dtableUtils.generatorBase64Code)(12)
-  }), switchPosition === 'left' && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, switchNode, textNode), switchPosition === 'right' && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, textNode, switchNode)));
+  });
 }
 var _default = exports.default = DTableSwitch;

package/lib/DateEditor/index.js

@@ -15,6 +15,7 @@ var _mbEditor = _interopRequireDefault(require("./mb-editor"));
 require("dayjs/locale/zh-cn");
 require("dayjs/locale/en-gb");
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 const DateEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     isMobile,
@@ -58,26 +59,34 @@ const DateEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     onCommit: handelCommit,
     onClose: hideCalendar
   };
-  if (isMobile === false) return /*#__PURE__*/_react.default.createElement(_pcEditor.default, Object.assign({}, props, {
+  if (isMobile === false) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_pcEditor.default, {
+    ...props,
     isInModal: isInModal,
     ref: ref
-  }));
-  if (isMobile === true) return /*#__PURE__*/_react.default.createElement(_mbEditor.default, Object.assign({}, props, {
+  });
+  if (isMobile === true) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_mbEditor.default, {
+    ...props,
     isReadOnly: isReadOnly,
     column: column,
     ref: ref
-  }));
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactResponsive.default, {
-    query: '(min-width: 768px)'
-  }, /*#__PURE__*/_react.default.createElement(_pcEditor.default, Object.assign({}, props, {
-    isInModal: isInModal,
-    ref: ref
-  }))), /*#__PURE__*/_react.default.createElement(_reactResponsive.default, {
-    query: '(max-width: 768px)'
-  }, /*#__PURE__*/_react.default.createElement(_mbEditor.default, Object.assign({}, 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,
+        isInModal: isInModal,
+        ref: ref
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactResponsive.default, {
+      query: '(max-width: 768px)',
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_mbEditor.default, {
+        ...props,
+        isReadOnly: isReadOnly,
+        column: column,
+        ref: ref
+      })
+    })]
+  });
 });
 var _default = exports.default = DateEditor;