dtable-statistic 4.3.11 → 4.3.13

package/es/components/index.js

@@ -46,12 +46,6 @@ Object.defineProperty(exports, "SeaTableRadio", {
     return _seatableRadio.default;
   }
 });
-Object.defineProperty(exports, "Select", {
-  enumerable: true,
-  get: function () {
-    return _select.default;
-  }
-});
 Object.defineProperty(exports, "toaster", {
   enumerable: true,
   get: function () {
@@ -65,5 +59,4 @@ var _loading = _interopRequireDefault(require("./loading"));
 var _modalPortal = _interopRequireDefault(require("./modal-portal"));
 var _newTableDialog = _interopRequireDefault(require("./dialog/new-table-dialog"));
 var _seatableRadio = _interopRequireDefault(require("./seatable-radio"));
-var _select = _interopRequireDefault(require("./select"));
 var _toast = _interopRequireDefault(require("./toast"));

package/es/components/popover/color-rules/rule-filters/filter.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactIntlUniversal = _interopRequireDefault(require("react-intl-universal"));
-var _index = require("../../../index");
+var _DTableCustomizeSelect = _interopRequireDefault(require("dtable-ui-component/lib/DTableCustomizeSelect"));
 var _numberInput = _interopRequireDefault(require("./number-input"));
 var _colorRules = require("../../../../constants/color-rules");
 const INPUT_CMP_TYPE_MAP = {
@@ -124,7 +124,7 @@ class Filter extends _react.default.Component {
         case 1:
           {
             const selectedConjunction = conjunctionOptions.find(option => option.value === filterConjunction);
-            return /*#__PURE__*/_react.default.createElement(_index.Select, {
+            return /*#__PURE__*/_react.default.createElement(_DTableCustomizeSelect.default, {
               value: selectedConjunction,
               options: conjunctionOptions,
               onSelectOption: this.onSelectConjunction
@@ -203,13 +203,13 @@ class Filter extends _react.default.Component {
       className: "filter-container"
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: "filter-column"
-    }, /*#__PURE__*/_react.default.createElement(_index.Select, {
+    }, /*#__PURE__*/_react.default.createElement(_DTableCustomizeSelect.default, {
       value: selectedFilterType,
       options: filterTypeOptions,
       onSelectOption: this.onSelectFilterBy
     })), /*#__PURE__*/_react.default.createElement("div", {
       className: "filter-predicate ml-2"
-    }, /*#__PURE__*/_react.default.createElement(_index.Select, {
+    }, /*#__PURE__*/_react.default.createElement(_DTableCustomizeSelect.default, {
       value: selectedPredicate,
       options: this.predicateOptions,
       onSelectOption: this.onSelectPredicate

package/es/components/popover/color-rules/rule-filters/index.css

@@ -208,7 +208,3 @@
   border-color: rgba(0, 40, 100, 0.12);
   box-shadow: unset;
 }
-
-.statistic-color-rule-filters .dtable-select .selected-option {
-  background-color: transparent;
-}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dtable-statistic",
-  "version": "4.3.11",
+  "version": "4.3.13",
   "description": "statistics",
   "main": "dist/dtable-statistic.js",
   "author": "seafile",
@@ -10,7 +10,7 @@
     "@antv/g2": "4.1.46",
     "@antv/util": "3.3.2",
     "@seafile/seafile-calendar": "0.0.24",
-    "comlink": "^4.3.1",
+    "comlink": "^4.4.1",
     "dayjs": "1.10.7",
     "glamor": "^2.20.40",
     "html2canvas": "^1.4.1",
@@ -57,7 +57,7 @@
     "css-minimizer-webpack-plugin": "^3.2.0",
     "dotenv": "^10.0.0",
     "dotenv-expand": "^5.1.0",
-    "dtable-ui-component": "4.3.3",
+    "dtable-ui-component": "4.3.7",
     "dtable-utils": "4.3.5",
     "dtable-web-api": "4.3.5",
     "dtable-store": "4.3.6",

package/es/components/select/index.js

@@ -1,9 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _select = _interopRequireDefault(require("./select"));
-var _default = exports.default = _select.default;

package/es/components/select/option-group.css

@@ -1,104 +0,0 @@
-.option-group {
-  position: absolute;
-  left: 0;
-  min-height: 60px;
-  max-height: 300px;
-  min-width: 100%;
-  max-width: 15rem;
-  padding: .5rem 0;
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
-  background: #fff;
-  border: 1px solid rgba(0, 40, 100, 0.12);
-  border-radius: 3px;
-  z-index: 10001;
-}
-
-.option-group .option-group-search {
-  width: 100%;
-  padding: 0 10px 6px 10px;
-  min-width: 170px;
-}
-
-.option-group-search .form-control {
-  height: 31px;
-}
-
-.option-group .none-search-result {
-  height: 100px;
-  width: 100%;
-  padding: 10px;
-  opacity: .5;
-}
-
-.option-group .option-group-content {
-  max-height: 252px;
-  overflow-y: auto;
-}
-
-.option {
-  display: block;
-  width: 100%;
-  line-height: 24px;
-  padding: .25rem 10px;
-  clear: both;
-  font-weight: 400;
-  color: #212529;
-  text-align: inherit;
-  background-color: transparent;
-  border: 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.option.option-active {
-  background-color: #20a0ff;
-  color: #fff;
-  cursor: pointer;
-}
-
-.option:hover .header-icon .dtable-font,
-.option.option-active .select-option-name {
-  color: #fff;
-}
-
-.option.option-active .header-icon .dtable-font {
-  color: #fff;
-}
-
-.option:not(.option-active):hover .header-icon .dtable-font {
-  color: #aaa;
-}
-
-.option .select-option-name .single-select-option {
-  margin: 0 0 0 12px;
-}
-
-.option .select-option-name .multiple-select-option {
-  margin: 0;
-}
-
-.option-group-selector-single-select .select-option-name,
-.option-group-selector-multiple-select .multiple-option-name {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-
-.option-group-selector-multiple-select .multiple-check-icon {
-  display: inline-flex;
-  width: 20px;
-  text-align: center;
-}
-
-.option-group-selector-multiple-select .multiple-check-icon .dtable-icon-check-mark {
-  font-size: 12px;
-  color: #798d99;
-}
-
-.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 {
-  background-color: #f7f7f7;
-}

package/es/components/select/option-group.js

@@ -1,215 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _dtableSearchInput = _interopRequireDefault(require("../dtable-search-input"));
-var _option = _interopRequireDefault(require("./option"));
-var _constants = require("../../constants");
-require("./option-group.css");
-const OPTION_HEIGHT = 32;
-class OptGroup extends _react.Component {
-  constructor(props) {
-    super(props);
-    this.resetMenuStyle = () => {
-      const {
-        isInModal,
-        position
-      } = this.props;
-      const {
-        top,
-        height
-      } = this.optionGroupRef.getBoundingClientRect();
-      if (isInModal) {
-        if (position.y + position.height + height > window.innerHeight) {
-          this.optionGroupRef.style.top = position.y - height + 'px';
-        }
-        this.optionGroupRef.style.opacity = 1;
-      } else {
-        if (height + top > window.innerHeight) {
-          const borderWidth = 2;
-          this.optionGroupRef.style.top = -1 * (height + borderWidth) + 'px';
-        }
-      }
-    };
-    this.onHotKey = event => {
-      const keyCode = event.keyCode;
-      if (keyCode === _constants.KeyCodes.UpArrow) {
-        this.onPressUp();
-      } else if (keyCode === _constants.KeyCodes.DownArrow) {
-        this.onPressDown();
-      } else if (keyCode === _constants.KeyCodes.Enter) {
-        let option = this.filterOptions && this.filterOptions[this.state.activeIndex];
-        if (option) {
-          this.props.onSelectOption(option.value);
-          if (!this.props.supportMultipleSelect) {
-            this.props.closeSelect();
-          }
-        }
-      } else if (keyCode === _constants.KeyCodes.Tab || keyCode === _constants.KeyCodes.Escape) {
-        this.props.closeSelect();
-        window.app.eventBus.dispatch(_constants.CommonEventTypes.OPEN_SELECT, false);
-      }
-    };
-    this.onPressUp = () => {
-      if (this.state.activeIndex > 0) {
-        this.setState({
-          activeIndex: this.state.activeIndex - 1
-        }, () => {
-          this.scrollContent();
-        });
-      }
-    };
-    this.onPressDown = () => {
-      if (this.filterOptions && this.state.activeIndex < this.filterOptions.length - 1) {
-        this.setState({
-          activeIndex: this.state.activeIndex + 1
-        }, () => {
-          this.scrollContent();
-        });
-      }
-    };
-    this.scrollContent = () => {
-      const {
-        offsetHeight,
-        scrollTop
-      } = this.optionGroupContentRef;
-      this.setState({
-        disableHover: true
-      });
-      this.timer = setTimeout(() => {
-        this.setState({
-          disableHover: false
-        });
-      }, 500);
-      if (this.state.activeIndex * OPTION_HEIGHT === 0) {
-        this.optionGroupContentRef.scrollTop = 0;
-        return;
-      }
-      if (this.state.activeIndex * OPTION_HEIGHT < scrollTop) {
-        this.optionGroupContentRef.scrollTop = scrollTop - OPTION_HEIGHT;
-      } else if (this.state.activeIndex * OPTION_HEIGHT > offsetHeight + scrollTop) {
-        this.optionGroupContentRef.scrollTop = scrollTop + OPTION_HEIGHT;
-      }
-    };
-    this.changeIndex = index => {
-      this.setState({
-        activeIndex: index
-      });
-    };
-    this.onChangeSearch = searchVal => {
-      let value = searchVal || '';
-      if (value !== this.state.searchVal) {
-        this.setState({
-          searchVal: value,
-          activeIndex: -1
-        });
-      }
-    };
-    this.renderOptGroup = searchVal => {
-      let {
-        noOptionsPlaceholder,
-        onSelectOption
-      } = 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 this.filterOptions.map((opt, i) => {
-        let key = opt.value.column ? opt.value.column.key : i;
-        let isActive = this.state.activeIndex === i;
-        return /*#__PURE__*/_react.default.createElement(_option.default, {
-          key: key,
-          index: i,
-          isActive: isActive,
-          value: opt.value,
-          onSelectOption: onSelectOption,
-          changeIndex: this.changeIndex,
-          supportMultipleSelect: this.props.supportMultipleSelect,
-          disableHover: this.state.disableHover
-        }, opt.label);
-      });
-    };
-    this.state = {
-      searchVal: '',
-      activeIndex: -1,
-      disableHover: false
-    };
-    this.filterOptions = null;
-    this.timer = null;
-  }
-  componentDidMount() {
-    window.addEventListener('keydown', this.onHotKey);
-    // Make sure child component is rendered, so current component can be stretched out, then get the correct size
-    setTimeout(() => {
-      this.resetMenuStyle();
-    }, 1);
-  }
-  componentWillUnmount() {
-    this.filterOptions = null;
-    this.timer && clearTimeout(this.timer);
-    window.removeEventListener('keydown', this.onHotKey);
-  }
-  render() {
-    const {
-      searchable,
-      searchPlaceholder,
-      top,
-      left,
-      minWidth,
-      value,
-      isShowSelected,
-      isInModal,
-      position,
-      className
-    } = this.props;
-    let {
-      searchVal
-    } = this.state;
-    let style = {
-      top: top || 0,
-      left: left || 0
-    };
-    if (minWidth) {
-      style = {
-        top: top || 0,
-        left: left || 0,
-        minWidth
-      };
-    }
-    if (isInModal) {
-      style = {
-        position: 'fixed',
-        left: position.x,
-        top: position.y + position.height,
-        minWidth: position.width,
-        opacity: 0
-      };
-    }
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "option-group ".concat(isShowSelected ? 'pt-0' : '', " ").concat(className ? 'option-group-' + className : ''),
-      ref: ref => this.optionGroupRef = ref,
-      style: style
-    }, isShowSelected && /*#__PURE__*/_react.default.createElement("div", {
-      className: "editor-list-delete mb-2",
-      onClick: e => e.stopPropagation()
-    }, value.label || ''), searchable && /*#__PURE__*/_react.default.createElement("div", {
-      className: "option-group-search"
-    }, /*#__PURE__*/_react.default.createElement(_dtableSearchInput.default, {
-      className: "option-search-control",
-      placeholder: searchPlaceholder,
-      onChange: this.onChangeSearch,
-      autoFocus: true
-    })), /*#__PURE__*/_react.default.createElement("div", {
-      className: "option-group-content",
-      ref: ref => this.optionGroupContentRef = ref
-    }, this.renderOptGroup(searchVal)));
-  }
-}
-var _default = exports.default = OptGroup;

package/es/components/select/option.js

@@ -1,45 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-class Option extends _react.Component {
-  constructor() {
-    super(...arguments);
-    this.onSelectOption = (value, event) => {
-      if (this.props.supportMultipleSelect) {
-        event.stopPropagation();
-      }
-      this.props.onSelectOption(value, event);
-    };
-    this.onMouseEnter = () => {
-      if (!this.props.disableHover) {
-        this.props.changeIndex(this.props.index);
-      }
-    };
-    this.onMouseLeave = () => {
-      if (!this.props.disableHover) {
-        this.props.changeIndex(-1);
-      }
-    };
-  }
-  render() {
-    const {
-      isActive
-    } = this.props;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: (0, _classnames.default)('option', {
-        'option-active': isActive
-      }),
-      onClick: this.onSelectOption.bind(this, this.props.value),
-      onMouseEnter: this.onMouseEnter,
-      onMouseLeave: this.onMouseLeave
-    }, this.props.children);
-  }
-}
-var _default = exports.default = Option;

package/es/components/select/select.css

@@ -1,211 +0,0 @@
-.dtable-select {
-  position: relative;
-}
-
-.dtable-select.custom-select {
-  display: flex;
-  padding: 0 10px;
-  border-radius: 3px;
-  align-items: center;
-  justify-content: space-between;
-  max-width: 900px;
-  user-select: none;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -o-user-select: none;
-  -ms-user-select: none;
-  text-align: left;
-}
-
-.dtable-select.custom-select:focus,
-.dtable-select.custom-select.focus {
-  border-color: #1991eb !important;
-  box-shadow: 0 0 0 2px rgba(70, 127, 207, 0.25);
-}
-
-.dtable-select.custom-select.disabled:focus,
-.dtable-select.custom-select.focus.disabled,
-.dtable-select.custom-select.disabled:hover {
-  border-color: rgba(0, 40, 100, 0.12) !important;
-  box-shadow: unset;
-  cursor: default;
-}
-
-.dtable-select.custom-select:hover {
-  cursor: pointer;
-  border-color: rgb(179, 179, 179);
-}
-
-.dtable-select .select-option-name {
-  color: #212529;
-}
-
-.dtable-select .dtable-icon-drop-down {
-  display: inline-block;
-  font-size: 12px;
-  color: #949494;
-  transform: scale(.8) translateY(2px);
-  transition: all .1s;
-}
-
-.dtable-select .dtable-icon-drop-down:hover {
-  color: #000;
-}
-
-.dtable-select .selected-option {
-  display: flex;
-  flex: 1;
-  overflow: hidden;
-  flex-wrap: nowrap;
-  align-items: center;
-  justify-content: space-between;
-  background: #fff;
-}
-
-.dtable-select.selector-collaborator .option-group .option-group-content {
-  padding: 10px;
-}
-
-.dtable-select.selector-collaborator .option {
-  padding: 5px 0 5px 10px !important;
-  line-height: 20px;
-}
-
-.dtable-select .selected-option-show {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.dtable-select .select-placeholder {
-  line-height: 1;
-  font-size: 14px;
-  color: #949494;
-  white-space: nowrap;
-}
-
-/* collaborator select  */
-.collaborator-select-popover.dtable-select {
-  position: unset;
-}
-
-.collaborator-select-popover .collaborator-avatar {
-  width: 16px;
-  height: 16px;
-  transform: translateY(-1px);
-}
-
-.collaborator-select-popover .option-group {
-  position: absolute;
-  left: 0px;
-  min-height: 60px;
-  max-height: unset;
-  min-width: 100%;
-  max-width: 15rem;
-  padding: 0.5rem 0;
-  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 5%);
-  background: #fff;
-  border: 1px solid rgba(0,40,100,.12);
-  border-radius: 3px;
-  z-index: 10001;
-}
-
-.collaborator-select-popover .option-group .option-group-search {
-  width: 100%;
-  padding: 0 10px;
-  min-width: 170px;
-}
-
-.collaborator-select-popover .option-group-search .form-control {
-  height: 31px;
-}
-
-.collaborator-select-popover .option-group .none-search-result {
-  height: 100px;
-  width: 100%;
-  padding: 10px;
-  opacity: .5;
-}
-
-.collaborator-select-popover .option-group .option-group-content {
-  max-height: 252px;
-  overflow-y: auto;
-  padding: 10px;
-}
-
-.collaborator-select-popover .selected-option-show {
-  width: calc(100% - 20px);
-  height: 20px;
-}
-
-.collaborator-select-popover .selected-option {
-  width: auto;
-  overflow-x: auto;
-}
-
-.collaborator-select-popover .dtable-icon-drop-down {
-  margin-left: .5rem;
-}
-
-.collaborator-select-popover .option-collaborator {
-  display: flex;
-}
-
-.collaborator-select-popover .collaborator-container {
-  flex: 1 1;
-}
-
-.collaborator-select-popover .editor-list-delete .collaborator-container {
-  flex: 1 1;
-  display: inline;
-}
-
-.collaborator-select-popover .multiple-check-icon {
-  display: inline-flex;
-  width: 20px;
-  text-align: center;
-}
-
-.collaborator-select-popover .collaborator-check-icon .dtable-icon-check-mark, 
-.collaborator-select-popover .multiple-check-icon .dtable-icon-check-mark {
-  font-size: 12px;
-  color: #798d99;
-}
-
-.collaborator-select-popover.dtable-select .option-active,
-.collaborator-select-popover.dtable-select .option:hover {
-  color: #212529;
-  background-color: #f7f7f7;
-}
-
-.collaborator-select-popover.dtable-select .option.option-active .select-option-name {
-  color: #212529;
-}
-
-.collaborator-select .option-group-content .collaborator,
-.collaborator-select-popover .option-group .option-group-content .collaborator {
-  background: none;
-}
-
-.collaborator-select-popover .collaborator-avatar-container {
-  width: 16px;
-}
-
-.collaborator-select-popover .option-group-content .remove-container {
-  display: none;
-}
-
-.collaborator-select-popover .collaborator-container {
-  display: flex;
-  justify-content: space-between;
-}
-
-.collaborator-container .collaborator-name {
-  margin-left: 5px;
-  max-width: 200px;
-  color: #212529;
-}
-
-.collaborator-select .option-group {
-  max-height: fit-content;
-}

package/es/components/select/select.js

@@ -1,150 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _modalPortal = _interopRequireDefault(require("../modal-portal"));
-var _optionGroup = _interopRequireDefault(require("./option-group"));
-var _constants = require("../../constants");
-require("./select.css");
-class Select extends _react.Component {
-  constructor(props) {
-    super(props);
-    this.onSelectToggle = event => {
-      event.preventDefault();
-      /*
-        if select is showing, click events do not need to be monitored by other click events,
-        so it can be closed when other select is clicked.
-      */
-      if (this.state.isShowSelectOptions) event.nativeEvent.stopImmediatePropagation();
-      let eventClassName = event.target.className;
-      if (this.props.isLocked || eventClassName.indexOf('option-search-control') > -1 || eventClassName === 'option-group-search') return;
-      //Prevent closing by pressing the spacebar in the search input
-      if (event.target.value === '') return;
-      this.setState({
-        isShowSelectOptions: !this.state.isShowSelectOptions
-      });
-      window.app.eventBus.dispatch(_constants.CommonEventTypes.OPEN_SELECT, !this.state.isShowSelectOptions);
-    };
-    this.onMousedown = event => {
-      if (this.props.isShowSelected && event.target.className.includes('icon-fork-number')) {
-        return;
-      }
-      if (!this.selector.contains(event.target)) {
-        this.closeSelect();
-      }
-    };
-    this.closeSelect = () => {
-      this.setState({
-        isShowSelectOptions: false
-      });
-    };
-    this.getSelectedOptionTop = () => {
-      if (!this.selector) return 38;
-      const {
-        height
-      } = this.selector.getBoundingClientRect();
-      return height;
-    };
-    this.getFilterOptions = searchValue => {
-      const {
-        options,
-        searchable
-      } = this.props;
-      if (!searchable) return options || [];
-      const validSearchVal = searchValue.trim().toLowerCase();
-      if (!validSearchVal) return options || [];
-      return options.filter(option => {
-        const {
-          value,
-          name
-        } = option;
-        if (typeof name === 'string') {
-          return name.toLowerCase().indexOf(validSearchVal) > -1;
-        }
-        if (typeof value === 'object') {
-          if (value.column) {
-            return value.column.name.toLowerCase().indexOf(validSearchVal) > -1;
-          }
-          if (value.name) {
-            return value.name.toLowerCase().indexOf(validSearchVal) > -1;
-          }
-          return value.columnOption && value.columnOption.name.toLowerCase().indexOf(validSearchVal) > -1;
-        }
-        return false;
-      });
-    };
-    this.state = {
-      isShowSelectOptions: false
-    };
-  }
-  componentDidMount() {
-    document.addEventListener('mousedown', this.onMousedown);
-  }
-  componentWillUnmount() {
-    document.removeEventListener('mousedown', this.onMousedown);
-  }
-  render() {
-    let {
-      className,
-      value,
-      options,
-      placeholder,
-      searchable,
-      searchPlaceholder,
-      noOptionsPlaceholder,
-      isLocked,
-      isInModal
-    } = this.props;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      ref: node => this.selector = node,
-      className: (0, _classnames.default)('dtable-select custom-select', {
-        'focus': this.state.isShowSelectOptions
-      }, {
-        'disabled': isLocked
-      }, className),
-      onClick: this.onSelectToggle
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "selected-option"
-    }, value.label ? /*#__PURE__*/_react.default.createElement("span", {
-      className: "selected-option-show"
-    }, value.label) : /*#__PURE__*/_react.default.createElement("span", {
-      className: "select-placeholder"
-    }, placeholder), !isLocked && /*#__PURE__*/_react.default.createElement("i", {
-      className: "dtable-font dtable-icon-drop-down"
-    })), this.state.isShowSelectOptions && !isInModal && /*#__PURE__*/_react.default.createElement(_optionGroup.default, {
-      value: value,
-      isShowSelected: this.props.isShowSelected,
-      top: this.getSelectedOptionTop(),
-      options: options,
-      onSelectOption: this.props.onSelectOption,
-      searchable: searchable,
-      searchPlaceholder: searchPlaceholder,
-      noOptionsPlaceholder: noOptionsPlaceholder,
-      closeSelect: this.closeSelect,
-      getFilterOptions: this.getFilterOptions,
-      supportMultipleSelect: this.props.supportMultipleSelect
-    }), this.state.isShowSelectOptions && isInModal && /*#__PURE__*/_react.default.createElement(_modalPortal.default, null, /*#__PURE__*/_react.default.createElement(_optionGroup.default, {
-      className: className,
-      value: value,
-      isShowSelected: this.props.isShowSelected,
-      position: this.selector.getBoundingClientRect(),
-      isInModal: isInModal,
-      top: this.getSelectedOptionTop(),
-      options: options,
-      onSelectOption: this.props.onSelectOption,
-      searchable: searchable,
-      searchPlaceholder: searchPlaceholder,
-      noOptionsPlaceholder: noOptionsPlaceholder,
-      closeSelect: this.closeSelect,
-      getFilterOptions: this.getFilterOptions,
-      supportMultipleSelect: this.props.supportMultipleSelect
-    })));
-  }
-}
-var _default = exports.default = Select;