dtable-ui-component 6.0.110-aol.7 → 6.0.110-aol.8

package/lib/AsyncUserSelect/index.css

@@ -32,15 +32,16 @@
 .dtable-ui-user-select-container .dtable-ui-user-list-container {
   min-height: 160px;
   max-height: 200px;
-  padding: 8px;
+  padding: 8px !important;
   overflow: auto;
+  position: relative;
 }
 
 .dtable-ui-user-select-container .form-control {
   border: none;
   border-bottom: 1px solid rgb(0 40 100 / 12%) !important;
   border-radius: 4px 4px 0 0;
-  padding: .375rem .5rem !important;
+  padding: .375rem 1rem !important;
 }
 
 .dtable-ui-user-select-container .form-control:focus {
@@ -83,10 +84,6 @@
   font-size: 14px;
 }
 
-.dtable-ui-user-select-container .dtable-ui-user-search-container {
-  position: relative;
-}
-
 .dtable-ui-user-select-container .dtable-ui-user-search-container .search-clear-btn {
   position: absolute;
   top: 5px;

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

@@ -220,7 +220,7 @@ class SelectOptionGroup extends _react.Component {
       style: style,
       onMouseDown: this.onMouseDown,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: "position-relative",
+        className: "position-relative mb-1",
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DTableSearchInput.default, {
           className: "option-search-control",
           placeholder: searchPlaceholder,

package/lib/DTableSelect/utils.js

@@ -112,10 +112,12 @@ const MenuSelectStyle = exports.MenuSelectStyle = {
     } = state;
     return {
       ...provided,
-      fontSize: '13px',
+      fontSize: '14px',
       color: '#212529',
       cursor: isDisabled ? 'default' : 'pointer',
       backgroundColor: isFocused ? '#f5f5f5' : '#fff',
+      padding: '8px',
+      borderRadius: '4px',
       ':active': {
         backgroundColor: '#f5f5f5'
       },
@@ -182,11 +184,28 @@ const MenuList = props => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
 });
 exports.MenuList = MenuList;
 const Option = props => {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    style: props.data.style,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.components.Option, {
+  const {
+    isSelected
+  } = props;
+  const baseStyle = props.data.style || {};
+  const containerStyle = {
+    ...baseStyle,
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'space-between'
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    style: containerStyle,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.components.Option, {
       ...props
-    })
+    }), isSelected && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: "dtable-font dtable-icon-check-mark",
+      style: {
+        fontSize: '14px',
+        color: '#666666',
+        flexShrink: 0
+      }
+    })]
   });
 };
 exports.Option = Option;

package/lib/SelectOptionGroup/index.css

@@ -17,7 +17,7 @@
 .option-group .option-group-search {
   width: 100%;
   min-width: 170px;
-  padding: 8px 8px 0 !important
+  padding: 0 0 8px 0 !important;
 }
 
 .option-group-search .form-control {
@@ -67,6 +67,11 @@
   color: #fff;
 }
 
+.optio .dtable-ui-explanation-tip {
+  color: #666666;
+  font-size: 12px !important;
+}
+
 .option.option-active .header-icon .dtable-font,
 .option.option-active .header-icon .multicolor-icon {
   color: #fff;

package/lib/SelectOptionGroup/index.js

@@ -216,7 +216,7 @@ class SelectOptionGroup extends _react.Component {
       style = {
         position: 'fixed',
         left: position.x,
-        top: position.y + position.height + 4,
+        top: `${position.y + position.height + 4}px`,
         minWidth: position.width,
         opacity: 0
       };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dtable-ui-component",
-  "version": "6.0.110-aol.7",
+  "version": "6.0.110-aol.8",
   "main": "./lib/index.js",
   "dependencies": {
     "@seafile/react-image-lightbox": "^5.0.4",