dtable-ui-component 6.0.29-beta11 → 6.0.29-beta2

package/lib/assets/icons/check.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 32 32" style="enable-background:new 0 0 32 32;" xml:space="preserve">
+<title>check</title>
+<g id="check">
+	<g id="路径" transform="translate(0.020249, 4.178564)">
+		<path d="M27.9,0.7L12,18.1L4.1,8.9C3.2,7.9,1.8,7.6,0.7,8.6c-1,0.8-0.9,2.5,0,3.6c6.5,7.3,9.8,11,9.8,11
+			c1,0.9,1.9,1,2.8,0l17.9-19c1-1,1-2.5,0.2-3.4C30.4-0.4,28.8-0.2,27.9,0.7z"/>
+	</g>
+</g>
+</svg>

package/lib/assets/icons/cross.svg

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 32 32" style="enable-background:new 0 0 32 32;" xml:space="preserve">
+<title>x-check-box</title>
+<g id="x-check-box">
+	<g id="fork-number">
+		<path id="路径" d="M18.8,16l8.5-8.5c0.8-0.8,0.8-2.1,0-2.8s-2.1-0.8-2.8,0L16,13.2L7.5,4.6c-0.8-0.8-2.1-0.8-2.8,0
+			s-0.8,2.1,0,2.8l8.5,8.5l-8.5,8.5c-0.8,0.8-0.8,2.1,0,2.8c0.8,0.7,2.1,0.8,2.8,0l8.5-8.5l8.5,8.5c0.8,0.8,2.1,0.8,2.8,0
+			c0.8-0.8,0.8-2.1,0-2.8l0,0L18.8,16z"/>
+	</g>
+</g>
+</svg>

package/lib/assets/icons/dot.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 32 32" style="enable-background:new 0 0 32 32;" xml:space="preserve">
+<title>dot</title>
+<g id="dot">
+	<circle id="椭圆形" cx="16" cy="16" r="9"/>
+</g>
+</svg>

package/lib/constants/index.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.isMobile = exports.SIMPLE_CELL_FORMULA_RESULTS = exports.SIMPLE_CELL_COLUMNS = exports.ROW_EXPAND_FOCUS_STYLE = exports.ROW_EXPAND_BTN_FOCUS_STYLE = exports.NUMBER_TYPES = exports.LONG_TEXT_LENGTH_LIMIT = exports.LONG_TEXT_EXCEED_LIMIT_SUGGEST = exports.LONG_TEXT_EXCEED_LIMIT_MESSAGE = exports.KeyCodes = exports.FORMAT_REG_EXP_LIST = exports.FILE_EDITOR_STATUS = exports.EVENT_BUS_TYPE = exports.DELETED_OPTION_TIPS = exports.DELETED_OPTION_BACKGROUND_COLOR = exports.DEFAULT_CHECKBOX_MARK_STYLE = exports.DATE_TYPES = exports.ARRAY_FORMAT_COLUMNS = void 0;
+exports.SIMPLE_CELL_FORMULA_RESULTS = exports.SIMPLE_CELL_COLUMNS = exports.ROW_EXPAND_FOCUS_STYLE = exports.ROW_EXPAND_BTN_FOCUS_STYLE = exports.NUMBER_TYPES = exports.LONG_TEXT_LENGTH_LIMIT = exports.LONG_TEXT_EXCEED_LIMIT_SUGGEST = exports.LONG_TEXT_EXCEED_LIMIT_MESSAGE = exports.KeyCodes = exports.FORMAT_REG_EXP_LIST = exports.FILE_EDITOR_STATUS = exports.EVENT_BUS_TYPE = exports.DELETED_OPTION_TIPS = exports.DELETED_OPTION_BACKGROUND_COLOR = exports.DEFAULT_CHECKBOX_MARK_STYLE = exports.DATE_TYPES = exports.ARRAY_FORMAT_COLUMNS = void 0;
 var _dtableUtils = require("dtable-utils");
 var _keyCodes = _interopRequireDefault(require("./key-codes"));
 const NUMBER_TYPES = exports.NUMBER_TYPES = {
@@ -53,5 +53,4 @@ const LONG_TEXT_LENGTH_LIMIT = exports.LONG_TEXT_LENGTH_LIMIT = 10 * 10000;
 const FILE_EDITOR_STATUS = exports.FILE_EDITOR_STATUS = {
   PREVIEWER: 'previewer',
   ADDITION: 'addition'
-};
-const isMobile = exports.isMobile = typeof window !== 'undefined' && (window.innerWidth < 768 || navigator.userAgent.toLowerCase().match(/(ipod|ipad|iphone|android|coolpad|mmp|smartphone|midp|wap|xoom|symbian|j2me|blackberry|wince)/i) != null);
+};

package/lib/css/mb-cell-editor.css

@@ -1,4 +1,4 @@
-@media screen and (max-width: 768px) {
+@media screen and (max-width: 767.8px) {
   .dtable-ui-mb-editor-popover {
     position: fixed;
     top: 0;

package/lib/index.js

@@ -10,12 +10,6 @@ Object.defineProperty(exports, "AutoNumberFormatter", {
     return _AutoNumberFormatter.default;
   }
 });
-Object.defineProperty(exports, "BodyPortal", {
-  enumerable: true,
-  get: function () {
-    return _BodyPortal.default;
-  }
-});
 Object.defineProperty(exports, "ButtonFormatter", {
   enumerable: true,
   get: function () {
@@ -184,16 +178,16 @@ Object.defineProperty(exports, "DateFormatter", {
     return _DateFormatter.default;
   }
 });
-Object.defineProperty(exports, "DepartmentSelectFilter", {
+Object.defineProperty(exports, "DepartmentEditor", {
   enumerable: true,
   get: function () {
-    return _DepartmentSelectFilter.default;
+    return _DepartmentEditor.default;
   }
 });
-Object.defineProperty(exports, "DepartmentSingleSelectEditor", {
+Object.defineProperty(exports, "DepartmentSelectFilter", {
   enumerable: true,
   get: function () {
-    return _DepartmentSingleSelectEditor.default;
+    return _DepartmentSelectFilter.default;
   }
 });
 Object.defineProperty(exports, "DepartmentSingleSelectFormatter", {
@@ -340,36 +334,6 @@ Object.defineProperty(exports, "MTimeFormatter", {
     return _MTimeFormatter.default;
   }
 });
-Object.defineProperty(exports, "MobileFullScreenPage", {
-  enumerable: true,
-  get: function () {
-    return _MobileFullScreenPage.default;
-  }
-});
-Object.defineProperty(exports, "MobileModal", {
-  enumerable: true,
-  get: function () {
-    return _MobileModal.default;
-  }
-});
-Object.defineProperty(exports, "MobileOperationSheet", {
-  enumerable: true,
-  get: function () {
-    return _MobileOperationSheet.default;
-  }
-});
-Object.defineProperty(exports, "MobileSelector", {
-  enumerable: true,
-  get: function () {
-    return _MobileSelector.default;
-  }
-});
-Object.defineProperty(exports, "MobileUpload", {
-  enumerable: true,
-  get: function () {
-    return _MobileUpload.default;
-  }
-});
 Object.defineProperty(exports, "ModalPortal", {
   enumerable: true,
   get: function () {
@@ -418,12 +382,6 @@ Object.defineProperty(exports, "RoleStatusEditor", {
     return _RoleStatusEditor.default;
   }
 });
-Object.defineProperty(exports, "RowExpand", {
-  enumerable: true,
-  get: function () {
-    return _RowExpand.default;
-  }
-});
 Object.defineProperty(exports, "RowExpandDialog", {
   enumerable: true,
   get: function () {
@@ -442,12 +400,6 @@ Object.defineProperty(exports, "RowExpandFormatter", {
     return _RowExpandFormatter.default;
   }
 });
-Object.defineProperty(exports, "RowExpandView", {
-  enumerable: true,
-  get: function () {
-    return _RowExpandView.default;
-  }
-});
 Object.defineProperty(exports, "SelectItem", {
   enumerable: true,
   get: function () {
@@ -472,12 +424,6 @@ Object.defineProperty(exports, "SingleSelectFormatter", {
     return _SingleSelectFormatter.default;
   }
 });
-Object.defineProperty(exports, "SvgIcon", {
-  enumerable: true,
-  get: function () {
-    return _SvgIcon.default;
-  }
-});
 Object.defineProperty(exports, "TextEditor", {
   enumerable: true,
   get: function () {
@@ -555,13 +501,11 @@ var _DepartmentSingleSelectFormatter = _interopRequireDefault(require("./Departm
 var _SimpleLongTextFormatter = _interopRequireDefault(require("./SimpleLongTextFormatter"));
 var _RowExpandFormatter = _interopRequireDefault(require("./RowExpandFormatter"));
 var _RowExpandEditor = _interopRequireDefault(require("./RowExpandEditor"));
-var _RowExpand = _interopRequireDefault(require("./RowExpand"));
 var _RowExpandDialog = _interopRequireDefault(require("./RowExpandDialog"));
-var _RowExpandView = _interopRequireDefault(require("./RowExpandView"));
 var _CheckboxEditor = _interopRequireDefault(require("./CheckboxEditor"));
 var _CollaboratorEditor = _interopRequireDefault(require("./CollaboratorEditor"));
 var _DateEditor = _interopRequireDefault(require("./DateEditor"));
-var _DepartmentSingleSelectEditor = _interopRequireDefault(require("./DepartmentSingleSelectEditor"));
+var _DepartmentEditor = _interopRequireDefault(require("./Department-editor"));
 var _DigitalSignEditor = _interopRequireDefault(require("./DigitalSignEditor"));
 var _DurationEditor = _interopRequireDefault(require("./DurationEditor"));
 var _EmailEditor = _interopRequireDefault(require("./EmailEditor"));
@@ -598,11 +542,4 @@ var _CollapsibleSettingLayout = _interopRequireDefault(require("./CollapsibleSet
 var _DTableRadioGroup = _interopRequireDefault(require("./DTableRadioGroup"));
 var _DTableEmptyTip = _interopRequireDefault(require("./DTableEmptyTip"));
 var _IconButton = _interopRequireDefault(require("./IconButton"));
-var _UploadProgress = _interopRequireDefault(require("./UploadProgress"));
-var _SvgIcon = _interopRequireDefault(require("./SvgIcon"));
-var _BodyPortal = _interopRequireDefault(require("./BodyPortal"));
-var _MobileModal = _interopRequireDefault(require("./MobileModal"));
-var _MobileOperationSheet = _interopRequireDefault(require("./MobileOperationSheet"));
-var _MobileUpload = _interopRequireDefault(require("./MobileUpload"));
-var _MobileSelector = _interopRequireDefault(require("./MobileSelector"));
-var _MobileFullScreenPage = _interopRequireDefault(require("./MobileFullScreenPage"));
+var _UploadProgress = _interopRequireDefault(require("./UploadProgress"));

package/lib/locales/de.json

@@ -163,7 +163,5 @@
   "Mark_as_resolved": "Als erledigt markieren",
   "No_comment_yet": "Es sind keine Kommentare vorhanden.",
   "Add_comment": "Kommentar hinzufügen",
-  "Add_participants": "Teilnehmer hinzufügen",
-  "Edit_long_text": "Langtext bearbeiten",
-  "Choose_a_department": "Bereich wählen"
+  "Add_participants": "Teilnehmer hinzufügen"
 }

package/lib/locales/en.json

@@ -163,7 +163,5 @@
   "Mark_as_resolved": "Mark as resolved",
   "No_comment_yet": "No comment yet",
   "Add_comment": "Add comment",
-  "Add_participants": "Add participants",
-  "Edit_long_text": "Edit long text",
-  "Choose_a_department": "Choose a department"
+  "Add_participants": "Add participants"
 }

package/lib/locales/es.json

@@ -163,7 +163,5 @@
   "Mark_as_resolved": "Marcar como resuelto",
   "No_comment_yet": "No comment yet",
   "Add_comment": "Añadir comentario",
-  "Add_participants": "Añadir participantes",
-  "Edit_long_text": "Edit long text",
-  "Choose_a_department": "Choose a department"
+  "Add_participants": "Añadir participantes"
 }

package/lib/locales/fr.json

@@ -163,7 +163,5 @@
   "Mark_as_resolved": "Marquer comme résolu",
   "No_comment_yet": "Aucun commentaire n'est disponible.",
   "Add_comment": "Ajouter un commentaire",
-  "Add_participants": "Ajouter des participants",
-  "Edit_long_text": "Modifier le texte long",
-  "Choose_a_department": "Sélectionner un département"
+  "Add_participants": "Ajouter des participants"
 }

package/lib/locales/pt.json

@@ -163,7 +163,5 @@
   "Mark_as_resolved": "Marca conforme resolvido",
   "No_comment_yet": "No comment yet",
   "Add_comment": "Adicionar comentário",
-  "Add_participants": "Adicione participantes",
-  "Edit_long_text": "Editar texto longo",
-  "Choose_a_department": "Choose a department"
+  "Add_participants": "Adicione participantes"
 }

package/lib/locales/ru.json

@@ -163,7 +163,5 @@
   "Mark_as_resolved": "Пометить как разрешенный",
   "No_comment_yet": "Пока без комментариев",
   "Add_comment": "Добавить комментарий",
-  "Add_participants": "Добавить участников",
-  "Edit_long_text": "Редактировать длинный текст",
-  "Choose_a_department": "Выберите отдел"
+  "Add_participants": "Добавить участников"
 }

package/lib/locales/zh-CN.json

@@ -163,7 +163,5 @@
   "Mark_as_resolved": "标记为已解决",
   "No_comment_yet": "暂无评论",
   "Add_comment": "增加评论",
-  "Add_participants": "添加参与人",
-  "Edit_long_text": "编辑长文本",
-  "Choose_a_department": "选择一个部门"
+  "Add_participants": "添加参与人"
 }

package/lib/select-editor/index.js

@@ -1,34 +1,27 @@
 "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 _reactResponsive = _interopRequireDefault(require("react-responsive"));
-var _pcEditor = _interopRequireDefault(require("./pc-editor"));
-var _mbEditor = _interopRequireDefault(require("./mb-editor"));
-const SelectEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
-  let {
-    isMobile,
-    ...props
-  } = _ref;
-  if (isMobile === false) return /*#__PURE__*/_react.default.createElement(_pcEditor.default, Object.assign({}, props, {
-    ref: ref
-  }));
-  if (isMobile === true) return /*#__PURE__*/_react.default.createElement(_mbEditor.default, Object.assign({}, props, {
-    ref: 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
-  }))));
+Object.defineProperty(exports, "MBSelectEditor", {
+  enumerable: true,
+  get: function () {
+    return _mbSelectEditor.default;
+  }
 });
-var _default = exports.default = SelectEditor;
+Object.defineProperty(exports, "PCSelectEditor", {
+  enumerable: true,
+  get: function () {
+    return _pcSelectEditor.default;
+  }
+});
+Object.defineProperty(exports, "SelectEditorOption", {
+  enumerable: true,
+  get: function () {
+    return _selectEditorOption.default;
+  }
+});
+var _mbSelectEditor = _interopRequireDefault(require("./mb-select-editor"));
+var _pcSelectEditor = _interopRequireDefault(require("./pc-select-editor"));
+var _selectEditorOption = _interopRequireDefault(require("./select-editor-option"));

package/lib/select-editor/mb-select-editor/index.css

@@ -0,0 +1,127 @@
+@import url('../../css/mb-cell-editor.css');
+
+@media screen and (max-width: 767.8px) {
+  .dtable-ui-mb-select-editor-body .mb-selected-item {
+    margin-top: 10px;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-selected-item .title {
+    padding: 6px 16px;
+    border-bottom: 1px solid #e9e9e9;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-selected-item .content {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    min-height: 50px;
+    padding: 8px 16px;
+    border-bottom: 1px solid #e9e9e9;
+    overflow: auto;
+    background-color: #fff;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-selected-item .content .select-option-item {
+    margin: 3px 10px 3px 0;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-search-select-items {
+    padding: 8px 16px;
+    margin-top: 20px;
+    border-top: 1px solid #e9e9e9;
+    border-bottom: 1px solid #e9e9e9;
+    background-color: #fff;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-search-select-items > input {
+    outline: none;
+    height: 30px;
+    padding: 0;
+    line-height: 30px;
+    border: none;
+  }
+  .dtable-ui-mb-select-editor-body .mb-search-select-items > input:focus,
+  .dtable-ui-mb-select-editor-body .mb-search-select-items > input:active {
+    outline: none;
+    box-shadow: none;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-select-options-container {
+    display: flex;
+    flex-direction: column;
+    margin-top: 10px;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-select-options-container .title {
+    padding: 6px 16px;
+    border-bottom: 1px solid #e9e9e9;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-select-options-container .content {
+    display: flex;
+    flex-direction: column;
+    border-bottom: 1px solid #e9e9e9;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-select-options-container .search-result-none {
+    padding: 16px 0;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-select-options-container .mb-select-option-item {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    height: 50px;
+    padding: 10px 10px 10px 16px;
+    font-size: 13px;
+    background-color: #fff;
+    color: #212529;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-select-options-container .mb-select-option-item + .mb-select-option-item {
+    border-top: 1px solid #e9e9e9;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-select-options-container .mb-select-option-item .item-name {
+    display: inline-block;
+    padding: 0 10px;
+    margin-top: 5px;
+    height: 20px;
+    line-height: 20px;
+    text-align: center;
+    text-overflow: ellipsis;
+    border-radius: 10px;
+    overflow: hidden;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-select-options-container .mb-select-option-item .dtable-font {
+    font-size: 12px;
+    color: #798d99;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-create-select-item {
+    display: flex;
+    align-items: center;
+    height: 50px;
+    padding: 0 10px;
+    margin-top: 20px;
+    border-top: 1px solid #dedede;
+    border-bottom: 1px solid #e9e9e9;
+    background-color: #fff;
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-create-select-item .dtable-font {
+    margin-right: 10px;
+    font-size: 12px;
+    font-weight: 600px;
+    transition: translateY(1px);
+  }
+
+  .dtable-ui-mb-select-editor-body .mb-create-select-item .dtable-ui-add-new-option {
+    font-size: 14px;
+    font-weight: 500px;
+  }
+
+}

package/lib/select-editor/mb-select-editor/index.js

@@ -0,0 +1,197 @@
+"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 _lang = require("../../lang");
+var _selectEditorOption = _interopRequireDefault(require("../select-editor-option"));
+var _MBEditorHeader = _interopRequireDefault(require("../../MBEditorHeader"));
+require("./index.css");
+class MBSelectEditorPopover extends _react.default.Component {
+  constructor(props) {
+    super(props);
+    this.handleHistoryBack = e => {
+      e.preventDefault();
+      this.props.onClosePopover();
+    };
+    this.onContainerClick = event => {
+      if (this.editorPopover && this.editorPopover.contains(event.target)) {
+        event.stopPropagation();
+        event.nativeEvent.stopImmediatePropagation();
+        return false;
+      }
+    };
+    this.onChangeSearch = event => {
+      let {
+        searchVal
+      } = this.state;
+      if (searchVal === event.target.value) {
+        return;
+      }
+      searchVal = event.target.value;
+      this.setState({
+        searchVal
+      });
+    };
+    this.getSelectedOptions = () => {
+      let {
+        value,
+        options
+      } = this.props;
+      if (!Array.isArray(value)) {
+        return [];
+      }
+      return options.filter(option => {
+        return value.indexOf(option.id) > -1;
+      });
+    };
+    this.getFilteredOptions = () => {
+      let {
+        options
+      } = this.props;
+      let {
+        searchVal
+      } = this.state;
+      return searchVal ? options.filter(item => item.name.indexOf(searchVal) > -1) : options;
+    };
+    this.onSelectOption = option => {
+      this.props.onOptionItemToggle(option);
+    };
+    this.onAddNewOption = event => {
+      event.stopPropagation();
+      event.nativeEvent.stopImmediatePropagation();
+      let newOption = this.state.searchVal.trim();
+      if (newOption) {
+        this.props.onAddNewOption(newOption);
+        this.props.onClosePopover();
+      }
+    };
+    this.onRemoveOption = option => {
+      this.props.onOptionItemToggle(option);
+    };
+    this.renderSelectOptions = options => {
+      let {
+        value
+      } = this.props;
+      return options.map((option, index) => {
+        let isSelect = value.some(item => item === option.id);
+        let style = {
+          backgroundColor: option.color,
+          color: option.textColor || null
+        };
+        return /*#__PURE__*/_react.default.createElement("div", {
+          className: "mb-select-option-item",
+          key: index,
+          onMouseDown: this.onSelectOption.bind(this, option)
+        }, /*#__PURE__*/_react.default.createElement("span", {
+          className: "mb-select-item"
+        }, /*#__PURE__*/_react.default.createElement("span", {
+          className: "item-name",
+          style: style,
+          title: option.name
+        }, option.name)), /*#__PURE__*/_react.default.createElement("span", {
+          className: "mb-item-checked"
+        }, isSelect && /*#__PURE__*/_react.default.createElement("i", {
+          className: "dtable-font dtable-icon-check-mark"
+        })));
+      });
+    };
+    this.setEditorPopover = editorPopover => {
+      this.editorPopover = editorPopover;
+    };
+    this.state = {
+      searchVal: ''
+    };
+  }
+  componentDidMount() {
+    history.pushState(null, null, '#'); // eslint-disable-line
+    window.addEventListener('popstate', this.handleHistoryBack, false);
+  }
+  componentWillUnmount() {
+    window.removeEventListener('popstate', this.handleHistoryBack, false);
+  }
+  render() {
+    const {
+      isReadOnly,
+      column,
+      isSupportNewOption,
+      isShowRemoveIcon
+    } = this.props;
+    const {
+      searchVal
+    } = this.state;
+    const selectedOptions = this.getSelectedOptions();
+    const filteredOptions = this.getFilteredOptions();
+    let isShowRemoveBtn = !isReadOnly && isShowRemoveIcon;
+    let isShowCreateBtn = !isReadOnly && isSupportNewOption && !!searchVal;
+    if (isShowCreateBtn) {
+      isShowCreateBtn = filteredOptions.length === 0;
+    }
+    return /*#__PURE__*/_react.default.createElement("div", {
+      ref: this.setEditorPopover,
+      className: "dtable-ui-mb-editor-popover mb-select-editor-popover",
+      style: {
+        zIndex: 99
+      },
+      onClick: this.onContainerClick
+    }, /*#__PURE__*/_react.default.createElement(_MBEditorHeader.default, {
+      title: column.name,
+      leftContent: /*#__PURE__*/_react.default.createElement("i", {
+        className: "dtable-font dtable-icon-return"
+      }),
+      onLeftClick: this.props.onClosePopover
+    }), /*#__PURE__*/_react.default.createElement("div", {
+      className: "dtable-ui-mb-editor-body dtable-ui-mb-select-editor-body"
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "mb-selected-item"
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "title"
+    }, (0, _lang.getLocale)('Current_option')), /*#__PURE__*/_react.default.createElement("div", {
+      className: "content"
+    }, selectedOptions.length === 0 && /*#__PURE__*/_react.default.createElement("span", {
+      className: "empty-placeholder"
+    }, (0, _lang.getLocale)('No_option')), selectedOptions.length > 0 && selectedOptions.map(selectedOption => {
+      return /*#__PURE__*/_react.default.createElement(_selectEditorOption.default, {
+        key: selectedOption.id,
+        option: selectedOption,
+        isShowRemoveIcon: isShowRemoveBtn,
+        onDeleteSelectOption: this.onRemoveOption
+      });
+    }))), /*#__PURE__*/_react.default.createElement("div", {
+      className: "mb-search-select-items"
+    }, /*#__PURE__*/_react.default.createElement("input", {
+      className: "form-control",
+      type: "text",
+      placeholder: (0, _lang.getLocale)('Search_option'),
+      value: searchVal,
+      onChange: this.onChangeSearch,
+      onClick: this.onInputClick
+    })), /*#__PURE__*/_react.default.createElement("div", {
+      className: "mb-select-options-container"
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "title"
+    }, /*#__PURE__*/_react.default.createElement("span", null, (0, _lang.getLocale)('Choose_an_option'))), /*#__PURE__*/_react.default.createElement("div", {
+      className: "content"
+    }, /*#__PURE__*/_react.default.createElement(_react.Fragment, null, filteredOptions.length === 0 && /*#__PURE__*/_react.default.createElement("div", {
+      className: "search-result-none"
+    }, (0, _lang.getLocale)('No_options_available')), filteredOptions.length > 0 && this.renderSelectOptions(filteredOptions)))), isShowCreateBtn && /*#__PURE__*/_react.default.createElement("div", {
+      className: "mb-create-select-item",
+      onClick: this.onAddNewOption
+    }, /*#__PURE__*/_react.default.createElement("i", {
+      className: "dtable-font dtable-icon-add-table"
+    }), /*#__PURE__*/_react.default.createElement("span", {
+      className: "dtable-ui-add-new-option"
+    }, "".concat((0, _lang.getLocale)('Add_an_option'), " ").concat(searchVal)))));
+  }
+}
+MBSelectEditorPopover.defaultProps = {
+  isReadOnly: false,
+  isShowRemoveIcon: false,
+  isSupportNewOption: false,
+  value: []
+};
+var _default = exports.default = MBSelectEditorPopover;

package/lib/select-editor/{pc-editor → pc-select-editor}/index.css

@@ -8,7 +8,7 @@
   height: 28px;
 }
 
-.dtable-ui-select-editor-container .select-dtable-ui-mobile-selector-options-container {
+.dtable-ui-select-editor-container .select-options-container {
   min-height: 160px;
   max-height: 200px;
   padding: 10px 0;