dtable-ui-component 5.3.1 → 6.0.1

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

@@ -1,4 +1,4 @@
-.option-group {
+.group-selector.option-group {
   position: absolute;
   left: 0;
   min-height: 60px;
@@ -13,29 +13,29 @@
   z-index: 10001;
 }
 
-.option-group .option-group-search {
+.group-selector.option-group .option-group-search {
   width: 100%;
   padding: 6px 10px;
   min-width: 170px;
 }
 
-.option-group-search .form-control {
+.group-selector .option-group-search .form-control {
   height: 31px;
 }
 
-.option-group .none-search-result {
+.group-selector.option-group .none-search-result {
   height: 100px;
   width: 100%;
   padding: 10px;
   color: #666666;
 }
 
-.option-group .option-group-content {
+.group-selector.option-group .option-group-content {
   max-height: 252px;
   overflow-y: auto;
 }
 
-.option {
+.group-selector .option {
   display: block;
   width: 100%;
   line-height: 24px;
@@ -53,39 +53,39 @@
   justify-content: space-between;
 }
 
-.option .dtable-icon-check-mark {
+.group-selector .option .dtable-icon-check-mark {
   font-size: 12px;
   color: #798d99;
 }
 
-.option.option-active {
+.group-selector .option.option-active {
   background-color: #20a0ff;
   color: #fff;
   cursor: pointer;
 }
 
-.option.option-active .dtable-icon-check-mark,
-.option.option-active .select-option-name {
+.group-selector .option.option-active .dtable-icon-check-mark,
+.group-selector .option.option-active .select-option-name {
   color: #fff !important;
 }
 
-.option .select-option-name .single-select-option {
+.group-selector .option .select-option-name .single-select-option {
   margin: 0 0 0 12px;
 }
 
-.option .select-option-name .multiple-select-option {
+.group-selector .option .select-option-name .multiple-select-option {
   margin: 0;
 }
 
-.option-group-selector-single-select .select-option-name {
+.group-selector .option-group-selector-single-select .select-option-name {
   display: flex;
   align-items: center;
   justify-content: space-between;
 }
 
-.option-group-selector-single-select .option:hover,
-.option-group-selector-single-select .option.option-active,
-.option-group-selector-multiple-select .option:hover,
-.option-group-selector-multiple-select .option.option-active {
+.group-selector .option-group-selector-single-select .option:hover,
+.group-selector .option-group-selector-single-select .option.option-active,
+.group-selector .option-group-selector-multiple-select .option:hover,
+.group-selector .option-group-selector-multiple-select .option.option-active {
   background-color: #f5f5f5;
 }

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

@@ -208,7 +208,7 @@ class SelectOptionGroup extends _react.Component {
     return /*#__PURE__*/_react.default.createElement(_ClickOutside.default, {
       onClickOutside: this.props.onClickOutside
     }, /*#__PURE__*/_react.default.createElement("div", {
-      className: (0, _classnames.default)('option-group', className ? 'option-group-' + className : ''),
+      className: (0, _classnames.default)('option-group group-selector', className ? 'option-group-' + className : ''),
       ref: ref => this.optionGroupRef = ref,
       style: style,
       onMouseDown: this.onMouseDown

package/lib/LongTextFormatter/index.js

@@ -8,12 +8,12 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _HtmlLongTextFormatter = _interopRequireDefault(require("../HtmlLongTextFormatter"));
 var _SimpleLongTextFormatter = _interopRequireDefault(require("../SimpleLongTextFormatter"));
-function LongTextFormatter(props) {
-  const {
-    isSample,
+function LongTextFormatter(_ref) {
+  let {
+    isSample = true,
     value,
     containerClassName
-  } = props;
+  } = _ref;
   if (isSample) {
     return /*#__PURE__*/_react.default.createElement(_SimpleLongTextFormatter.default, {
       value: value,
@@ -25,7 +25,4 @@ function LongTextFormatter(props) {
     containerClassName: containerClassName
   });
 }
-LongTextFormatter.defaultProps = {
-  isSample: true
-};
 var _default = exports.default = LongTextFormatter;

package/lib/RoleStatusEditor/index.js

@@ -42,11 +42,12 @@ const RoleStatusEditor = _ref => {
     })
   }))), /*#__PURE__*/_react.default.createElement(_reactstrap.DropdownMenu, {
     positionFixed: true,
-    modifiers: {
-      preventOverflow: {
-        boundariesElement: document.body
+    modifiers: [{
+      name: 'preventOverflow',
+      options: {
+        boundary: document.body
       }
-    }
+    }]
   }, menuOptions.map(option => {
     const {
       value,

package/lib/toaster/toaster.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _reactDom = _interopRequireDefault(require("react-dom"));
+var _client = require("react-dom/client");
 var _toastManager = _interopRequireDefault(require("./toastManager"));
 require("./index.css");
 const isBrowser = typeof window !== 'undefined' && typeof window.document !== 'undefined';
@@ -65,11 +65,12 @@ class Toaster {
     const container = document.createElement('div');
     container.setAttribute('data-evergreen-toaster-container', '');
     document.body.appendChild(container);
-    _reactDom.default.render( /*#__PURE__*/_react.default.createElement(_toastManager.default, {
+    const root = (0, _client.createRoot)(container);
+    root.render( /*#__PURE__*/_react.default.createElement(_toastManager.default, {
       bindNotify: this._bindNotify,
       bindGetToasts: this._bindGetToasts,
       bindCloseAll: this._bindCloseAll
-    }), container);
+    }));
   }
 }
 exports.default = Toaster;

package/package.json

@@ -1,24 +1,21 @@
 {
   "name": "dtable-ui-component",
-  "version": "5.3.1",
+  "version": "6.0.1",
   "main": "./lib/index.js",
   "dependencies": {
-    "@seafile/react-image-lightbox": "3.0.1",
+    "@seafile/react-image-lightbox": "4.0.0",
     "@seafile/seafile-calendar": "0.0.24",
-    "@seafile/seafile-editor": "~1.0.123",
+    "@seafile/seafile-editor": "2.0.0",
     "antd-mobile": "2.3.1",
     "classnames": "2.3.2",
     "dayjs": "1.10.7",
     "dtable-utils": "5.0.11",
     "is-hotkey": "0.2.0",
-    "prop-types": "^15.8.1",
-    "react": "17.0.2",
-    "react-dom": "17.0.2",
-    "react-responsive": "9.0.2",
     "react-color": "2.19.3",
-    "react-select": "5.7.0",
-    "react-transition-group": "^4.4.1",
-    "reactstrap": "8.9.0"
+    "react-responsive": "10.0.0",
+    "react-select": "5.10.0",
+    "react-transition-group": "4.4.5",
+    "reactstrap": "9.2.3"
   },
   "scripts": {
     "lint": "./node_modules/.bin/eslint ./src/ --fix",
@@ -66,6 +63,7 @@
     "@babel/polyfill": "^7.10.1",
     "@babel/preset-env": "^7.9.5",
     "@babel/runtime": "7.22.11",
+    "@cfaester/enzyme-adapter-react-18": "0.8.0",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",
     "@storybook/addon-actions": "7.6.17",
     "@storybook/addon-docs": "7.6.17",
@@ -84,7 +82,6 @@
     "@testing-library/react": "^11.1.0",
     "@testing-library/user-event": "13.5.0",
     "@types/jest": "^29.5.10",
-    "@wojtekmaj/enzyme-adapter-react-17": "0.8.0",
     "autoprefixer": "10.4.5",
     "babel-jest": "^27.4.2",
     "babel-loader": "^8.2.3",
@@ -126,9 +123,12 @@
     "postcss-normalize": "^10.0.1",
     "postcss-preset-env": "^7.0.1",
     "prompts": "^2.4.2",
+    "prop-types": "15.8.1",
+    "react": "18.3.1",
     "react-app-polyfill": "^3.0.0",
     "react-dev-utils": "^12.0.1",
-    "react-element-to-jsx-string": "^14.3.1",
+    "react-dom": "18.3.1",
+    "react-element-to-jsx-string": "15.0.0",
     "react-i18next": "12.1.4",
     "react-refresh": "^0.11.0",
     "resolve": "^1.20.0",