dtable-ui-component 6.0.110-aol.8 → 6.0.110-hap.1

package/lib/DTableSelect/index.js

@@ -58,7 +58,10 @@ class DTableSelect extends _react.default.Component {
       ref: innerRef,
       filterOption: customFilterOption,
       form: form,
-      autoFocus: autoFocus
+      autoFocus: autoFocus,
+      menuIsOpen: true,
+      onMenuClose: () => {},
+      onMenuOpen: () => {}
     });
   }
 }

package/lib/DTableSelect/utils.js

@@ -112,11 +112,11 @@ const MenuSelectStyle = exports.MenuSelectStyle = {
     } = state;
     return {
       ...provided,
+      padding: '8px',
       fontSize: '14px',
       color: '#212529',
       cursor: isDisabled ? 'default' : 'pointer',
       backgroundColor: isFocused ? '#f5f5f5' : '#fff',
-      padding: '8px',
       borderRadius: '4px',
       ':active': {
         backgroundColor: '#f5f5f5'
@@ -126,6 +126,10 @@ const MenuSelectStyle = exports.MenuSelectStyle = {
       },
       '.header-icon .multicolor-icon': {
         color: '#aaa'
+      },
+      '.seatable-ui-select-tip': {
+        fontSize: '12px',
+        color: '#666666'
       }
     };
   },
@@ -134,7 +138,15 @@ const MenuSelectStyle = exports.MenuSelectStyle = {
     ...base,
     zIndex: 9999
   }),
-  indicatorSeparator: noneCallback
+  indicatorSeparator: noneCallback,
+  menuList: provided => ({
+    ...provided,
+    padding: '8px'
+  }),
+  valueContainer: (provided, state) => ({
+    ...provided,
+    padding: '2px 8px 2px 16px'
+  })
 };
 const DropdownIndicator = props => {
   return _reactSelect.components.DropdownIndicator && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.components.DropdownIndicator, {
@@ -143,7 +155,9 @@ const DropdownIndicator = props => {
       className: "dtable-font dtable-icon-down3",
       style: {
         fontSize: '12px',
-        marginLeft: '-2px'
+        marginLeft: '-2px',
+        color: '#666666',
+        paddingRight: '16px'
       }
     })
   });
@@ -185,27 +199,29 @@ const MenuList = props => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
 exports.MenuList = MenuList;
 const Option = props => {
   const {
-    isSelected
+    isSelected,
+    label
   } = 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",
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSelect.components.Option, {
+    ...props,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       style: {
-        fontSize: '14px',
-        color: '#666666',
-        flexShrink: 0
-      }
-    })]
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        width: '100%'
+      },
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: label
+      }), isSelected && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "dtable-font dtable-icon-check",
+        style: {
+          fontSize: '14px',
+          color: '#666666',
+          paddingLeft: '16px'
+        }
+      })]
+    })
   });
 };
 exports.Option = Option;

package/lib/SelectOptionGroup/index.css

@@ -67,11 +67,6 @@
   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/package.json

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