dtable-ui-component 6.0.49 → 6.0.50

package/lib/RowExpandDialog/body/index.js

@@ -15,6 +15,7 @@ var _RowExpandFormatter = _interopRequireDefault(require("../../RowExpandFormatt
 var _constants = require("../../constants");
 var _utils = require("../../utils/utils");
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 class Body extends _react.default.Component {
   constructor(_props) {
     super(_props);
@@ -159,7 +160,8 @@ class Body extends _react.default.Component {
         formatter
       } = component || {};
       if (editable) {
-        return /*#__PURE__*/_react.default.createElement(_RowExpandEditor.default, Object.assign({}, props, {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowExpandEditor.default, {
+          ...props,
           column: column,
           row: row,
           component: editor,
@@ -170,22 +172,25 @@ class Body extends _react.default.Component {
           onCommit: value => onChange(column, value),
           onEditorOpen: this.onEditorOpen,
           onEditorClose: this.onEditorClose
-        }));
+        });
       }
-      return /*#__PURE__*/_react.default.createElement(_RowExpandFormatter.default, Object.assign({}, props, {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowExpandFormatter.default, {
+        ...props,
         column: column,
         row: row,
         component: formatter,
         downloadImage: getDownLoadFiles ? this.downloadImage : null
-      }));
+      });
     };
     this.renderColumnContent = (row, column, columnIndex) => {
       const isEditorFocus = columnIndex === this.state.tabIndex && column.editable;
-      return /*#__PURE__*/_react.default.createElement("div", {
-        ref: isEditorFocus ? this.focusDom : null
-      }, /*#__PURE__*/_react.default.createElement(_columnContent.default, {
-        column: column
-      }, this.renderColumnValue(row, column, columnIndex, isEditorFocus)));
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        ref: isEditorFocus ? this.focusDom : null,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_columnContent.default, {
+          column: column,
+          children: this.renderColumnValue(row, column, columnIndex, isEditorFocus)
+        })
+      });
     };
     this.renderChildren = () => {
       const {
@@ -199,7 +204,9 @@ class Body extends _react.default.Component {
       };
       const CustomChildren = children;
       if ( /*#__PURE__*/_react.default.isValidElement(CustomChildren)) return /*#__PURE__*/_react.default.cloneElement(CustomChildren, props);
-      if ((0, _utils.isFunction)(CustomChildren)) return /*#__PURE__*/_react.default.createElement(CustomChildren, props);
+      if ((0, _utils.isFunction)(CustomChildren)) return /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomChildren, {
+        ...props
+      });
       return children;
     };
     this.state = {
@@ -227,37 +234,41 @@ class Body extends _react.default.Component {
       row,
       placeholder
     } = this.props;
-    return /*#__PURE__*/_react.default.createElement(_reactstrap.ModalBody, {
-      className: "dtable-ui-row-expand-body"
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "dtable-ui-row-expand-body-content",
-      ref: ref => this.contentRef = ref
-    }, columns.length === 0 && placeholder && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, placeholder), columns.map((column, index) => {
-      const {
-        type,
-        data
-      } = column;
-      let isHasMore = false;
-      if (type === _dtableUtils.CellType.LINK_FORMULA) {
-        let {
-          array_type
-        } = data || {};
-        const value = this.getCellValue({
-          row,
-          column
-        });
-        const cellValue = (0, _utils.getFormulaArrayValue)(value, !(0, _utils.isArrayFormatColumn)(array_type));
-        if (cellValue.length >= 10) {
-          isHasMore = true;
-        }
-      }
-      return /*#__PURE__*/_react.default.createElement("div", {
-        className: (0, _classnames.default)('dtable-ui-row-expand-item', {
-          'is-has-more': isHasMore
-        }),
-        key: column.key
-      }, this.renderColumnContent(row, column, index));
-    })), this.renderChildren());
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactstrap.ModalBody, {
+      className: "dtable-ui-row-expand-body",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "dtable-ui-row-expand-body-content",
+        ref: ref => this.contentRef = ref,
+        children: [columns.length === 0 && placeholder && /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+          children: placeholder
+        }), columns.map((column, index) => {
+          const {
+            type,
+            data
+          } = column;
+          let isHasMore = false;
+          if (type === _dtableUtils.CellType.LINK_FORMULA) {
+            let {
+              array_type
+            } = data || {};
+            const value = this.getCellValue({
+              row,
+              column
+            });
+            const cellValue = (0, _utils.getFormulaArrayValue)(value, !(0, _utils.isArrayFormatColumn)(array_type));
+            if (cellValue.length >= 10) {
+              isHasMore = true;
+            }
+          }
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: (0, _classnames.default)('dtable-ui-row-expand-item', {
+              'is-has-more': isHasMore
+            }),
+            children: this.renderColumnContent(row, column, index)
+          }, column.key);
+        })]
+      }), this.renderChildren()]
+    });
   }
 }
 var _default = exports.default = Body;

package/lib/RowExpandDialog/column-content/index.js

@@ -9,6 +9,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactstrap = require("reactstrap");
 var _dtableUtils = require("dtable-utils");
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 const ColumnContent = _ref => {
   let {
     column,
@@ -21,30 +22,38 @@ const ColumnContent = _ref => {
     key,
     description
   } = column;
-  return /*#__PURE__*/_react.default.createElement(_reactstrap.Row, {
-    className: "dtable-ui-row-expand-column-content pb-4"
-  }, /*#__PURE__*/_react.default.createElement(_reactstrap.Col, {
-    md: 3,
-    className: "dtable-ui-row-expand-column-content-info d-flex"
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    className: "dtable-ui-header-icon",
-    id: "header-icon-".concat(key)
-  }, /*#__PURE__*/_react.default.createElement("i", {
-    className: _dtableUtils.COLUMNS_ICON_CONFIG[type]
-  })), /*#__PURE__*/_react.default.createElement("span", {
-    className: "dtable-ui-row-expand-column-name"
-  }, name || ''), description && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
-    className: "dtable-font dtable-icon-description dtable-ui-column-tip-icon ml-2",
-    ref: descriptionRef
-  }), descriptionRef.current && /*#__PURE__*/_react.default.createElement(_reactstrap.UncontrolledTooltip, {
-    innerClassName: "dtable-ui-column-description-tip",
-    popperClassName: "dtable-ui-row-expand-column-tip",
-    target: descriptionRef.current,
-    placement: "bottom",
-    fade: false
-  }, description))), /*#__PURE__*/_react.default.createElement(_reactstrap.Col, {
-    md: 9,
-    className: "d-flex align-items-center dtable-ui-row-expand-column-content-value"
-  }, children));
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactstrap.Row, {
+    className: "dtable-ui-row-expand-column-content pb-4",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactstrap.Col, {
+      md: 3,
+      className: "dtable-ui-row-expand-column-content-info d-flex",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "dtable-ui-header-icon",
+        id: "header-icon-".concat(key),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+          className: _dtableUtils.COLUMNS_ICON_CONFIG[type]
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "dtable-ui-row-expand-column-name",
+        children: name || ''
+      }), description && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: "dtable-font dtable-icon-description dtable-ui-column-tip-icon ml-2",
+          ref: descriptionRef
+        }), descriptionRef.current && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.UncontrolledTooltip, {
+          innerClassName: "dtable-ui-column-description-tip",
+          popperClassName: "dtable-ui-row-expand-column-tip",
+          target: descriptionRef.current,
+          placement: "bottom",
+          fade: false,
+          children: description
+        })]
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.Col, {
+      md: 9,
+      className: "d-flex align-items-center dtable-ui-row-expand-column-content-value",
+      children: children
+    })]
+  });
 };
 var _default = exports.default = ColumnContent;

package/lib/RowExpandDialog/header/index.js

@@ -12,6 +12,7 @@ var _lang = require("../../lang");
 var _utils = require("../../utils/utils");
 var _IconButton = _interopRequireDefault(require("../../IconButton"));
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 const Header = _ref => {
   let {
     title,
@@ -28,28 +29,34 @@ const Header = _ref => {
     };
     const CustomTitle = title;
     if ( /*#__PURE__*/_react.default.isValidElement(CustomTitle)) return /*#__PURE__*/_react.default.cloneElement(CustomTitle, props);
-    if ((0, _utils.isFunction)(CustomTitle)) return /*#__PURE__*/_react.default.createElement(CustomTitle, props);
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "dtable-ui-row-expand-header-title text-truncate"
-    }, title);
+    if ((0, _utils.isFunction)(CustomTitle)) return /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomTitle, {
+      ...props
+    });
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "dtable-ui-row-expand-header-title text-truncate",
+      children: title
+    });
   }, [columns, row, title]);
-  return /*#__PURE__*/_react.default.createElement(_reactstrap.ModalHeader, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.ModalHeader, {
     className: "d-print-none dtable-ui-row-expand-header",
-    close: /*#__PURE__*/_react.default.createElement("div", {
-      className: "dtable-ui-row-expand-header-right-btns"
-    }, copyURL && /*#__PURE__*/_react.default.createElement(_IconButton.default, {
-      icon: "url",
-      onClick: () => copyURL(),
-      "aria-label": (0, _lang.getLocale)('Get_URL'),
-      title: (0, _lang.getLocale)('Get_URL')
-    }), children, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
-      icon: "x",
-      onClick: onToggle,
-      title: (0, _lang.getLocale)('Close_expanded_record'),
-      "aria-label": (0, _lang.getLocale)('Close_expanded_record')
-    }))
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "dtable-ui-row-expand-header-left-btns"
-  }, renderTitle()));
+    close: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "dtable-ui-row-expand-header-right-btns",
+      children: [copyURL && /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
+        icon: "url",
+        onClick: () => copyURL(),
+        "aria-label": (0, _lang.getLocale)('Get_URL'),
+        title: (0, _lang.getLocale)('Get_URL')
+      }), children, /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
+        icon: "x",
+        onClick: onToggle,
+        title: (0, _lang.getLocale)('Close_expanded_record'),
+        "aria-label": (0, _lang.getLocale)('Close_expanded_record')
+      })]
+    }),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "dtable-ui-row-expand-header-left-btns",
+      children: renderTitle()
+    })
+  });
 };
 var _default = exports.default = Header;

package/lib/RowExpandDialog/index.js

@@ -17,6 +17,7 @@ var _body = _interopRequireDefault(require("./body"));
 var _lang = require("../lang");
 var _cellComparer = require("../utils/cell-comparer");
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 const RowExpandDialog = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     saveImmediately = true,
@@ -198,7 +199,7 @@ const RowExpandDialog = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
       });
     }
   }), [row, columns]);
-  return /*#__PURE__*/_react.default.createElement(_reactstrap.Modal, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.Modal, {
     isOpen: true,
     toggle: onToggle,
     className: (0, _classnames.default)('dtable-ui-row-expand-dialog', className),
@@ -208,32 +209,44 @@ const RowExpandDialog = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     modalClassName: "dtable-ui-row-expand-modal",
     fade: false,
     innerRef: modalRef,
-    keyboard: false
-  }, isAnimationEnd && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isLoading ? /*#__PURE__*/_react.default.createElement("div", {
-    className: "w-100 -h-100 d-flex align-items-center justify-content-center"
-  }, /*#__PURE__*/_react.default.createElement(_Loading.default, null)) : /*#__PURE__*/_react.default.createElement("div", {
-    className: "dtable-ui-row-expand-details"
-  }, /*#__PURE__*/_react.default.createElement(_header.default, {
-    title: title,
-    row: row,
-    columns: columns,
-    copyURL: copyURL,
-    onToggle: toggle
-  }, children[0]), /*#__PURE__*/_react.default.createElement(_body.default, Object.assign({}, otherProps, {
-    row: row,
-    columns: columns,
-    valueKey: valueKey,
-    onChange: onChange,
-    uploadFile: uploadFile,
-    onToggle: onToggle
-  }), children[1]), (!saveImmediately || isInsertingRow) && /*#__PURE__*/_react.default.createElement(_reactstrap.ModalFooter, null, /*#__PURE__*/_react.default.createElement(_reactstrap.Button, {
-    onClick: toggle,
-    color: "secondary"
-  }, (0, _lang.getLocale)('Cancel')), /*#__PURE__*/_react.default.createElement(_reactstrap.Button, {
-    onClick: onSubmit,
-    disabled: isSaving || !isChangedRef.current,
-    color: "primary"
-  }, (0, _lang.getLocale)('Submit'))))));
+    keyboard: false,
+    children: isAnimationEnd && /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: isLoading ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: "w-100 -h-100 d-flex align-items-center justify-content-center",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Loading.default, {})
+      }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "dtable-ui-row-expand-details",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_header.default, {
+          title: title,
+          row: row,
+          columns: columns,
+          copyURL: copyURL,
+          onToggle: toggle,
+          children: children[0]
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_body.default, {
+          ...otherProps,
+          row: row,
+          columns: columns,
+          valueKey: valueKey,
+          onChange: onChange,
+          uploadFile: uploadFile,
+          onToggle: onToggle,
+          children: children[1]
+        }), (!saveImmediately || isInsertingRow) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactstrap.ModalFooter, {
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.Button, {
+            onClick: toggle,
+            color: "secondary",
+            children: (0, _lang.getLocale)('Cancel')
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactstrap.Button, {
+            onClick: onSubmit,
+            disabled: isSaving || !isChangedRef.current,
+            color: "primary",
+            children: (0, _lang.getLocale)('Submit')
+          })]
+        })]
+      })
+    })
+  });
 });
 RowExpandDialog.Header = _header.default;
 RowExpandDialog.Body = _body.default;

package/lib/RowExpandEditor/add-btn/index.js

@@ -10,15 +10,22 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactResponsive = _interopRequireDefault(require("react-responsive"));
 var _pcAddBtn = _interopRequireDefault(require("./pc-add-btn"));
 var _mbAddBtn = _interopRequireDefault(require("./mb-add-btn"));
+var _jsxRuntime = require("react/jsx-runtime");
 const RowExpandAddBtn = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactResponsive.default, {
-    query: "(min-width: 768px)"
-  }, /*#__PURE__*/_react.default.createElement(_pcAddBtn.default, Object.assign({}, props, {
-    ref: ref
-  }))), /*#__PURE__*/_react.default.createElement(_reactResponsive.default, {
-    query: "(max-width: 768px)"
-  }, /*#__PURE__*/_react.default.createElement(_mbAddBtn.default, Object.assign({}, props, {
-    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)(_pcAddBtn.default, {
+        ...props,
+        ref: ref
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactResponsive.default, {
+      query: "(max-width: 768px)",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_mbAddBtn.default, {
+        ...props,
+        ref: ref
+      })
+    })]
+  });
 });
 var _default = exports.default = RowExpandAddBtn;

package/lib/RowExpandEditor/add-btn/mb-add-btn/index.js

@@ -9,11 +9,13 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 const RowExpandMBAddBtn = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     ref: ref,
     onClick: props.onClick,
-    className: (0, _classnames.default)('dtable-ui-mobile-row-expand-add-btn', props.className)
-  }, props.text);
+    className: (0, _classnames.default)('dtable-ui-mobile-row-expand-add-btn', props.className),
+    children: props.text
+  });
 });
 var _default = exports.default = RowExpandMBAddBtn;

package/lib/RowExpandEditor/add-btn/pc-add-btn/index.js

@@ -10,17 +10,20 @@ var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _constants = require("../../../constants");
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 const RowExpandPCAddBtn = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     ref: ref,
     tabIndex: 0,
     onClick: props.onClick,
     onFocus: props.onFocus,
     role: "button",
     className: (0, _classnames.default)('dtable-ui-row-expand-add-btn d-print-none', props.className),
-    style: props.isFocus ? _constants.ROW_EXPAND_BTN_FOCUS_STYLE : {}
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    className: "d-print-none"
-  }, props.text));
+    style: props.isFocus ? _constants.ROW_EXPAND_BTN_FOCUS_STYLE : {},
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: "d-print-none",
+      children: props.text
+    })
+  });
 });
 var _default = exports.default = RowExpandPCAddBtn;

package/lib/RowExpandEditor/checkbox-editor/index.js

@@ -11,15 +11,22 @@ var _reactResponsive = _interopRequireDefault(require("react-responsive"));
 var _pcEditor = _interopRequireDefault(require("./pc-editor"));
 var _mbEditor = _interopRequireDefault(require("./mb-editor"));
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 const RowExpandCheckboxEditor = /*#__PURE__*/(0, _react.forwardRef)((props, 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, {
-    ref: ref
-  }))), /*#__PURE__*/_react.default.createElement(_reactResponsive.default, {
-    query: "(max-width: 768px)"
-  }, /*#__PURE__*/_react.default.createElement(_mbEditor.default, Object.assign({}, props, {
-    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,
+        ref: ref
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactResponsive.default, {
+      query: "(max-width: 768px)",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_mbEditor.default, {
+        ...props,
+        ref: ref
+      })
+    })]
+  });
 });
 var _default = exports.default = RowExpandCheckboxEditor;

package/lib/RowExpandEditor/checkbox-editor/mb-editor/index.js

@@ -9,6 +9,7 @@ var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _CheckboxEditor = _interopRequireDefault(require("../../../CheckboxEditor"));
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 class RowExpandMBCheckboxEditor extends _react.default.Component {
   constructor(props) {
     super(props);
@@ -23,14 +24,15 @@ class RowExpandMBCheckboxEditor extends _react.default.Component {
       value,
       className
     } = this.props;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: (0, _classnames.default)('dtable-ui-mobile-row-expand-checkbox-editor-container', className)
-    }, /*#__PURE__*/_react.default.createElement(_CheckboxEditor.default, {
-      className: "dtable-ui-row-expand-checkbox-editor mt-0",
-      column: column,
-      value: value,
-      onCommit: this.onCommit
-    }));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _classnames.default)('dtable-ui-mobile-row-expand-checkbox-editor-container', className),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckboxEditor.default, {
+        className: "dtable-ui-row-expand-checkbox-editor mt-0",
+        column: column,
+        value: value,
+        onCommit: this.onCommit
+      })
+    });
   }
 }
 var _default = exports.default = RowExpandMBCheckboxEditor;

package/lib/RowExpandEditor/checkbox-editor/pc-editor.js

@@ -8,6 +8,7 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _CheckboxEditor = _interopRequireDefault(require("../../CheckboxEditor"));
 var _constants = require("../../constants");
+var _jsxRuntime = require("react/jsx-runtime");
 class RowExpandPCCheckboxEditor extends _react.default.Component {
   constructor() {
     super(...arguments);
@@ -27,7 +28,7 @@ class RowExpandPCCheckboxEditor extends _react.default.Component {
       column,
       value
     } = this.props;
-    return /*#__PURE__*/_react.default.createElement(_CheckboxEditor.default, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckboxEditor.default, {
       className: "dtable-ui-row-expand-checkbox-editor mt-2",
       column: column,
       value: value,

package/lib/RowExpandEditor/collaborator-editor/index.js

@@ -10,15 +10,22 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactResponsive = _interopRequireDefault(require("react-responsive"));
 var _pcEditor = _interopRequireDefault(require("./pc-editor"));
 var _mbEditor = _interopRequireDefault(require("./mb-editor"));
+var _jsxRuntime = require("react/jsx-runtime");
 const RowExpandCollaboratorEditor = /*#__PURE__*/(0, _react.forwardRef)((props, 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, {
-    ref: ref
-  }))), /*#__PURE__*/_react.default.createElement(_reactResponsive.default, {
-    query: "(max-width: 768px)"
-  }, /*#__PURE__*/_react.default.createElement(_mbEditor.default, Object.assign({}, props, {
-    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,
+        ref: ref
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactResponsive.default, {
+      query: "(max-width: 768px)",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_mbEditor.default, {
+        ...props,
+        ref: ref
+      })
+    })]
+  });
 });
 var _default = exports.default = RowExpandCollaboratorEditor;

package/lib/RowExpandEditor/collaborator-editor/mb-editor/index.js

@@ -12,6 +12,7 @@ var _CollaboratorItem = _interopRequireDefault(require("../../../CollaboratorIte
 var _rightAngle = _interopRequireDefault(require("../../right-angle"));
 var _addBtn = _interopRequireDefault(require("../../add-btn"));
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 class RowExpandMBCollaboratorEditor extends _react.default.Component {
   constructor(_props) {
     super(_props);
@@ -78,24 +79,22 @@ class RowExpandMBCollaboratorEditor extends _react.default.Component {
             const {
               email
             } = collaborator;
-            return /*#__PURE__*/_react.default.createElement(_CollaboratorItem.default, {
-              key: email,
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_CollaboratorItem.default, {
               collaborator: collaborator
-            });
+            }, email);
           }
           collaborator = {
             name: (0, _lang.getLocale)('Unknown'),
             avatar_url: '',
             email: index + ''
           };
-          return /*#__PURE__*/_react.default.createElement(_CollaboratorItem.default, {
-            key: email,
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_CollaboratorItem.default, {
             className: "dtable-ui-unknown-collaborator",
             collaborator: collaborator
-          });
+          }, email);
         });
       }
-      return /*#__PURE__*/_react.default.createElement(_addBtn.default, {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_addBtn.default, {
         text: (0, _lang.getLocale)('Add_collaborator')
       });
     };
@@ -148,16 +147,19 @@ class RowExpandMBCollaboratorEditor extends _react.default.Component {
       showEditor,
       value
     } = this.state;
-    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-      className: "dtable-ui dtable-ui-mobile-row-expand-collaborators position-relative",
-      onClick: this.openEditor
-    }, this.renderCollaborators(value), /*#__PURE__*/_react.default.createElement(_rightAngle.default, null)), showEditor && /*#__PURE__*/_react.default.createElement(_CollaboratorEditor.default, {
-      value: value,
-      column: column,
-      collaborators: collaborators,
-      onCommit: this.onChange,
-      onClose: this.closeEditor
-    }));
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "dtable-ui dtable-ui-mobile-row-expand-collaborators position-relative",
+        onClick: this.openEditor,
+        children: [this.renderCollaborators(value), /*#__PURE__*/(0, _jsxRuntime.jsx)(_rightAngle.default, {})]
+      }), showEditor && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CollaboratorEditor.default, {
+        value: value,
+        column: column,
+        collaborators: collaborators,
+        onCommit: this.onChange,
+        onClose: this.closeEditor
+      })]
+    });
   }
 }
 var _default = exports.default = RowExpandMBCollaboratorEditor;