dtable-ui-component 6.0.29-beta2 → 6.0.29-beta4

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

@@ -0,0 +1,105 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _lang = require("../../lang");
+var _SelectItem = _interopRequireDefault(require("../../SelectItem"));
+var _MobileSelector = _interopRequireDefault(require("../../MobileSelector"));
+var _DTableCommonAddTool = _interopRequireDefault(require("../../DTableCommonAddTool"));
+require("./index.css");
+const {
+  Search,
+  Option,
+  Options,
+  Empty
+} = _MobileSelector.default;
+class MBSelectEditor extends _react.default.Component {
+  constructor(props) {
+    super(props);
+    this.onChangeSearch = newValue => {
+      const {
+        searchVal
+      } = this.state;
+      if (searchVal === newValue) return;
+      this.setState({
+        searchVal: newValue
+      });
+    };
+    this.getDisplayOptions = () => {
+      const {
+        options
+      } = this.props;
+      const {
+        searchVal
+      } = this.state;
+      return searchVal ? options.filter(item => item.name.indexOf(searchVal) > -1) : options;
+    };
+    this.onChange = option => {
+      this.props.onCommit(option);
+    };
+    this.onAddNewOption = event => {
+      event.stopPropagation();
+      event.nativeEvent.stopImmediatePropagation();
+      const name = this.state.searchValue.trim();
+      if (name) {
+        this.props.onAddNewOption(name);
+        this.props.onClose && this.props.onClose();
+      }
+    };
+    this.renderOptions = options => {
+      const {
+        value = [],
+        valueKey
+      } = this.props;
+      return options.map(option => {
+        const isSelected = value.includes(option[valueKey]);
+        return /*#__PURE__*/_react.default.createElement(Option, {
+          key: option[valueKey],
+          isSelected: isSelected,
+          onChange: this.onChange.bind(this, option)
+        }, /*#__PURE__*/_react.default.createElement(_SelectItem.default, {
+          option: option
+        }));
+      });
+    };
+    this.state = {
+      searchVal: ''
+    };
+  }
+  render() {
+    const {
+      column,
+      isSupportNewOption,
+      options,
+      onAddNewOption
+    } = this.props;
+    const {
+      searchVal
+    } = this.state;
+    const displayOptions = this.getDisplayOptions();
+    const isShowCreateBtn = isSupportNewOption && onAddNewOption && !!searchVal && !options.find(item => item.name !== searchVal);
+    return /*#__PURE__*/_react.default.createElement(_MobileSelector.default, {
+      onClose: this.props.onClose,
+      title: column.name,
+      className: "dtable-ui-mobile-select-editor"
+    }, options.length > 10 && /*#__PURE__*/_react.default.createElement(Search, {
+      value: searchVal,
+      placeholder: (0, _lang.getLocale)('Search_option'),
+      onChange: this.onChangeSearch
+    }), /*#__PURE__*/_react.default.createElement(Options, null, displayOptions.length === 0 && /*#__PURE__*/_react.default.createElement(Empty, null, (0, _lang.getLocale)('No_options_available')), displayOptions.length > 0 && this.renderOptions(displayOptions), isShowCreateBtn && /*#__PURE__*/_react.default.createElement(_DTableCommonAddTool.default, {
+      footerName: (0, _lang.getLocale)('Add_option'),
+      callBack: this.onAddNewOption
+    })));
+  }
+}
+MBSelectEditor.defaultProps = {
+  isShowRemoveIcon: false,
+  isSupportNewOption: false,
+  value: [],
+  valueKey: 'id'
+};
+var _default = exports.default = MBSelectEditor;

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

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

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

@@ -45,7 +45,7 @@ class PCSelectEditor extends _react.default.Component {
         option = this.filteredOptions[this.state.highlightIndex];
       }
       if (option) {
-        this.onOptionItemToggle(option);
+        this.onChange(option);
       } else {
         const {
           searchValue
@@ -103,18 +103,18 @@ class PCSelectEditor extends _react.default.Component {
       this.setState({
         searchValue
       });
-      let val = searchValue.toLowerCase();
+      const val = searchValue.toLowerCase();
       this.filteredOptions = val ? options.filter(item => item.name && item.name.toLowerCase().indexOf(val) > -1) : options;
       this.setState({
         highlightIndex: this.filteredOptions.length > 0 ? 0 : -1
       });
     };
     this.onAddNewOption = () => {
-      let name = this.state.searchValue.trim();
+      const name = this.state.searchValue.trim();
       this.props.onAddNewOption(name);
     };
-    this.onOptionItemToggle = item => {
-      this.props.onCommit(item);
+    this.onChange = option => {
+      this.props.onCommit(option);
     };
     this.onMenuMouseEnter = index => {
       this.setState({
@@ -231,7 +231,7 @@ class PCSelectEditor extends _react.default.Component {
       onChange: this.onValueChanged,
       autoFocus: true
     })), /*#__PURE__*/_react.default.createElement("div", {
-      className: "select-options-container",
+      className: "select-dtable-ui-mobile-selector-options-container",
       ref: ref => this.container = ref
     }, this.filteredOptions.length > 0 && this.filteredOptions.map((option, index) => {
       let optionStyle = this.getOptionStyle(option);
@@ -248,7 +248,7 @@ class PCSelectEditor extends _react.default.Component {
         className: (0, _classnames.default)('select-option-item-container', {
           'select-option-item-container-highlight': index === highlightIndex
         }),
-        onMouseDown: this.onOptionItemToggle.bind(this, option),
+        onMouseDown: this.onChange.bind(this, option),
         onMouseEnter: this.onMenuMouseEnter.bind(this, index),
         onMouseLeave: this.onMenuMouseLeave.bind(this, index)
       }, /*#__PURE__*/_react.default.createElement("div", {

package/lib/utils/editor-utils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.initDateEditorLanguage = exports.getTrimmedString = exports.getSelectOptionItem = void 0;
+exports.minDate = exports.maxDate = exports.initDateEditorLanguage = exports.getTrimmedString = exports.getSelectOptionItem = void 0;
 const zhCN = require('@seafile/seafile-calendar/lib/locale/zh_CN');
 const zhTW = require('@seafile/seafile-calendar/lib/locale/zh_TW');
 const enUS = require('@seafile/seafile-calendar/lib/locale/en_US');
@@ -66,4 +66,8 @@ exports.getSelectOptionItem = getSelectOptionItem;
 const getTrimmedString = value => {
   return typeof value === 'string' ? value.trim() : '';
 };
-exports.getTrimmedString = getTrimmedString;
+
+// min date and max date for mobile date picker
+exports.getTrimmedString = getTrimmedString;
+const minDate = exports.minDate = new Date('1900/01/01');
+const maxDate = exports.maxDate = new Date('2100/12/31');

package/lib/utils/get-event-transfer.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _constants = require("../constants");
 const HTML = 'text/html';
 const TEXT = 'text/plain';
 // const FILES = 'files';
@@ -36,7 +37,7 @@ function getEventTransfer(event) {
   let html;
   let text;
   let files;
-  if (window.isMobile) {
+  if (_constants.isMobile) {
     if (window.dtableTransfer) {
       text = window.dtableTransfer['TEXT'];
     }

package/lib/utils/utils.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getTrimmedString = exports.getFormulaArrayValue = exports.getEventClassName = exports.getErrorMsg = exports.downloadFiles = exports.downloadFile = exports.debounce = void 0;
 exports.isArrayFormatColumn = isArrayFormatColumn;
-exports.throttle = exports.openUrlLink = exports.isValidUrl = exports.isValidCellValue = exports.isMobile = exports.isMac = exports.isFunction = void 0;
+exports.throttle = exports.openUrlLink = exports.isValidUrl = exports.isValidCellValue = exports.isQQBuiltInBrowser = exports.isMac = exports.isIPhone = exports.isFunction = void 0;
 var _constants = require("../constants");
 var _url = require("./url");
 const debounce = (fn, wait) => {
@@ -34,13 +34,22 @@ const throttle = (func, delay) => {
   };
 };
 exports.throttle = throttle;
-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);
 const isMac = () => {
   const platform = navigator.platform;
   // eslint-disable-next-line eqeqeq
   return platform == 'Mac68K' || platform == 'MacPPC' || platform == 'Macintosh' || platform == 'MacIntel';
 };
 exports.isMac = isMac;
+const isQQBuiltInBrowser = () => {
+  const userAgent = navigator.userAgent.toLowerCase();
+  return userAgent.indexOf(' qq') > -1 && userAgent.indexOf('mqqbrowser') < 0;
+};
+exports.isQQBuiltInBrowser = isQQBuiltInBrowser;
+const isIPhone = () => {
+  const userAgent = navigator.userAgent.toLowerCase();
+  return /iphone/gi.test(userAgent);
+};
+exports.isIPhone = isIPhone;
 const downloadFile = downloadUrl => {
   const downloadFrame = document.getElementById('dtableUiComponentDownloadFrame');
   if (downloadFrame != null) {

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "dtable-ui-component",
-  "version": "6.0.29-beta2",
+  "version": "6.0.29-beta4",
   "main": "./lib/index.js",
   "dependencies": {
     "@seafile/react-image-lightbox": "4.0.2",
-    "@seafile/seafile-calendar": "0.0.24",
+    "@seafile/seafile-calendar": "0.0.29",
     "@seafile/seafile-editor": "~2.0.6",
     "antd-mobile": "2.3.1",
     "classnames": "2.3.2",

package/lib/CollaboratorEditor/mb-collaborator-editor/index.css

@@ -1,85 +0,0 @@
-@import url('../../css/mb-cell-editor.css');
-
-@media screen and (max-width: 767.8px) {
-  .dtable-ui-mb-collaborator-editor-body .mb-search-collaborator-items {
-    padding: 8px 16px;
-    margin-top: 20px;
-    border-top: 1px solid #e9e9e9;
-    border-bottom: 1px solid #e9e9e9;
-    background-color: #fff;
-  }
-
-  .dtable-ui-mb-collaborator-editor-body .mb-search-collaborator-items > input {
-    outline: none;
-    height: 30px;
-    padding: 0;
-    line-height: 30px;
-    border: none;
-  }
-
-  .dtable-ui-mb-collaborator-editor-body .mb-search-collaborator-items > input:focus,
-  .dtable-ui-mb-collaborator-editor-body .mb-search-collaborator-items > input:active {
-    outline: none;
-    box-shadow: none;
-  }
-
-  .dtable-ui-mb-collaborator-editor-body .mb-collaborators-container {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    margin-top: 10px;
-    min-height: 0;
-  }
-
-  .dtable-ui-mb-collaborator-editor-body .mb-collaborators-container .title {
-    padding: 6px 16px;
-    border-bottom: 1px solid #e9e9e9;
-  }
-
-  .dtable-ui-mb-collaborator-editor-body .mb-collaborators-container .content {
-    flex: 1;
-    overflow: auto;
-    display: flex;
-    flex-direction: column;
-    border-bottom: 1px solid #e9e9e9;
-  }
-
-  .dtable-ui-mb-collaborator-editor-body .search-result-none {
-    padding: 16px 0 16px 16px;
-  }
-
-  .dtable-ui-mb-collaborator-editor-body .mb-collaborator-option-item {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    height: 50px;
-    padding: 10px 10px 10px 16px;
-    font-size: 13px;
-    background-color: #fff;
-  }
-
-  .dtable-ui-mb-collaborator-editor-body .mb-collaborator-option-item {
-    border-bottom: 1px solid #e9e9e9;
-  }
-
-  .dtable-ui-mb-collaborator-editor-body .mb-collaborator-option-item .mb-collaborator-info {
-    display: flex;
-    align-items: center;
-  }
-
-  .dtable-ui-mb-collaborator-editor-body .mb-collaborator-option-item .collaborator-avatar img {
-    width: 24px;
-    height: 24px;
-    border-radius: 50%;
-  }
-
-  .dtable-ui-mb-collaborator-editor-body .mb-collaborator-option-item .collaborator-name {
-    padding: 0 10px;
-    overflow: hidden;
-  }
-
-  .dtable-ui-mb-collaborator-editor-body .mb-collaborator-option-item .dtable-font {
-    font-size: 12px;
-    color: #798d99;
-  }
-}

package/lib/CollaboratorEditor/mb-collaborator-editor/index.js

@@ -1,148 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _dtableUtils = require("dtable-utils");
-var _MBEditorHeader = _interopRequireDefault(require("../../MBEditorHeader"));
-var _DTableSearchInput = _interopRequireDefault(require("../../DTableSearchInput"));
-var _lang = require("../../lang");
-require("./index.css");
-class MBCollaboratorEditor 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 = newValue => {
-      let {
-        searchVal
-      } = this.state;
-      if (searchVal === newValue) return;
-      this.setState({
-        searchVal: newValue
-      });
-    };
-    this.getSelectedCollaborators = () => {
-      let {
-        value,
-        collaborators
-      } = this.props;
-      if (!Array.isArray(value)) {
-        return [];
-      }
-      return collaborators.filter(collaborator => {
-        return value.indexOf(collaborator.email) > -1;
-      });
-    };
-    this.getFilteredCollaborators = () => {
-      let {
-        collaborators
-      } = this.props;
-      let {
-        searchVal
-      } = this.state;
-      return searchVal ? (0, _dtableUtils.searchCollaborators)(collaborators, searchVal) : collaborators;
-    };
-    this.onCollaboratorClick = collaborator => {
-      this.props.onCommit(collaborator);
-    };
-    this.onRemoveCollaborator = collaborator => {
-      this.props.onCommit(collaborator);
-    };
-    this.renderFilteredCollaborators = collaborators => {
-      let {
-        value = []
-      } = this.props;
-      return collaborators.map((collaborator, index) => {
-        const isSelected = value.includes(collaborator.email);
-        return /*#__PURE__*/_react.default.createElement("div", {
-          className: "mb-collaborator-option-item",
-          key: index,
-          onMouseDown: this.onCollaboratorClick.bind(this, collaborator)
-        }, /*#__PURE__*/_react.default.createElement("span", {
-          className: "mb-collaborator-info"
-        }, /*#__PURE__*/_react.default.createElement("span", {
-          className: "collaborator-avatar"
-        }, /*#__PURE__*/_react.default.createElement("img", {
-          src: collaborator.avatar_url,
-          width: "24",
-          height: "24",
-          alt: "avatar"
-        })), /*#__PURE__*/_react.default.createElement("span", {
-          className: "collaborator-name"
-        }, collaborator.name)), isSelected && /*#__PURE__*/_react.default.createElement("i", {
-          className: "mb-collaborator-checked 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 {
-      column
-    } = this.props;
-    const {
-      searchVal
-    } = this.state;
-    let filteredCollaborators = this.getFilteredCollaborators();
-    return /*#__PURE__*/_react.default.createElement("div", {
-      ref: this.setEditorPopover,
-      className: "dtable-ui-mb-editor-popover mb-collaborator-editor-popover",
-      onClick: this.onContainerClick
-    }, /*#__PURE__*/_react.default.createElement(_MBEditorHeader.default, {
-      title: column.name,
-      leftContent: /*#__PURE__*/_react.default.createElement("i", {
-        className: "dtable-font dtable-icon-return"
-      }),
-      rightContent: /*#__PURE__*/_react.default.createElement("span", null, (0, _lang.getLocale)('Done')),
-      onLeftClick: this.props.onClose,
-      onRightClick: this.props.onClose
-    }), /*#__PURE__*/_react.default.createElement("div", {
-      className: "dtable-ui-mb-editor-body dtable-ui-mb-collaborator-editor-body"
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "mb-search-collaborator-items"
-    }, /*#__PURE__*/_react.default.createElement(_DTableSearchInput.default, {
-      autoFocus: true,
-      value: searchVal,
-      placeholder: (0, _lang.getLocale)('Search_collaborator'),
-      onChange: this.onChangeSearch
-    })), /*#__PURE__*/_react.default.createElement("div", {
-      className: "mb-collaborators-container"
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "title"
-    }, (0, _lang.getLocale)('Choose_a_collaborator')), /*#__PURE__*/_react.default.createElement("div", {
-      className: "content"
-    }, filteredCollaborators.length === 0 && /*#__PURE__*/_react.default.createElement("div", {
-      className: "search-result-none"
-    }, (0, _lang.getLocale)('No_collaborators_available')), filteredCollaborators.length > 0 && this.renderFilteredCollaborators(filteredCollaborators)))));
-  }
-}
-MBCollaboratorEditor.defaultProps = {
-  isReadOnly: false,
-  value: []
-};
-var _default = exports.default = MBCollaboratorEditor;

package/lib/DateEditor/mb-date-editor-popover/custom-rc-calendar.css

@@ -1,118 +0,0 @@
-.dtable-ui.mb-date-editor-picker .rc-calendar-date {
-  width: 28px;
-  height: 30px;
-  border-radius: 50%;
-  font-size: 14px;
-  line-height: 30px;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar-date-panel {
-  width: 100%;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-selected-day .rc-calendar-date {
-  background-color: #FcEcD9;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-date:hover,
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-year-panel-year:hover,
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-month-panel-cell .rc-calendar-month-panel-month:hover {
-  background-color: #FcEcD9;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-selected-date .rc-calendar-date,
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-selected-date .rc-calendar-date:hover,
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-year-panel-selected-cell .rc-calendar-year-panel-year,
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-month-panel-selected-cell .rc-calendar-month-panel-month {
-  background-color: #f09f3f;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-next-year-btn:not([href]):not([tabindex]),
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-prev-year-btn:not([href]):not([tabindex]),
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-next-month-btn:not([href]):not([tabindex]),
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-prev-month-btn:not([href]):not([tabindex]) {
-  color: #999;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-next-year-btn:not([href]):not([tabindex]):hover,
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-prev-year-btn:not([href]):not([tabindex]):hover,
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-next-month-btn:not([href]):not([tabindex]):hover,
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-prev-month-btn:not([href]):not([tabindex]):hover {
-  color: #666;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-today .rc-calendar-date {
-  border: none;
-  position: relative;  
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar .rc-calendar-today .rc-calendar-date::after {
-  content: '';
-  background: #f09f3f;
-  position: absolute;
-  width: 4px;
-  height: 4px;
-  border-radius: 50%;
-  left: 45%;
-  bottom: 0%;
-  display: inline-block;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar .rdg-editor-container input.editor-main[readonly] {
-  background-color: #fff;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar-time-picker {
-  z-index: 1;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar-right-panel-body ul li.highlight {
-  margin: 0;
-  border: none;
-  background-color: #fff;
-  font-size: 12px;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar {
-  box-shadow: none;
-  border-radius: 0px;
-  border: 1px solid #e9e9e9;
-  border-left: none;
-  border-right: none;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar-date {
-  font-size: 14px;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar-date-panel {
-  width: 100%;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar-body {
-  height: 22rem;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar-table tr {
-  height: 3rem;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar-prev-month-btn,
-.dtable-ui.mb-date-editor-picker .rc-calendar-next-month-btn,
-.dtable-ui.mb-date-editor-picker .rc-calendar-prev-year-btn,
-.dtable-ui.mb-date-editor-picker .rc-calendar-next-year-btn {
-  font-size: 30px;
-  width: 50px;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar-header {
-  border-bottom: none;
-  margin-top: 0.5rem;
-}
-
-.dtable-ui.mb-date-editor-picker .rc-calendar-year-select,
-.dtable-ui.mb-date-editor-picker .rc-calendar-month-select,
-.dtable-ui.mb-date-editor-picker .rc-calendar-day-select {
-  font-size: 16px;
-  padding: 5px;
-}

package/lib/DateEditor/mb-date-editor-popover/index.css

@@ -1,45 +0,0 @@
-@import url('./custom-rc-calendar.css');
-@import url('../../css/mb-cell-editor.css');
-
-@media screen and (max-width: 767.8px) {
-  .dtable-ui-mb-date-editor-body .mb-date-editor-input {
-    display: flex;
-    border-top: 1px solid #e9e9e9;
-    border-bottom: 1px solid #e9e9e9;
-  }
-
-  .dtable-ui-mb-date-editor-body .mb-date-editor-input .date-input {
-    flex: 1;
-    background-color: #fff;
-  }
-  
-  .dtable-ui-mb-date-editor-body .mb-date-editor-input .date-input .date-input-day {
-    background-color: #f5f5f5;
-    border: 1px solid #e9e9e9;
-    margin: 10px;
-    padding: 3px 5px;
-    border-radius: 3px;
-  }
-
-  .dtable-ui-mb-date-editor-body .dtable-ui.mb-date-editor-picker {
-    display: block;
-    position: relative;
-    margin-top: 20px;
-    line-height: 1.5;
-    box-sizing: border-box;
-  }
-
-  .dtable-ui-mb-date-editor-body .mb-date-editor-clear {
-    padding: 10px 0;
-    margin-top: 20px;
-    border-bottom: 1px solid #e9e9e9;
-    border-top: 1px solid #e9e9e9;
-    text-align: center;
-    color: #d27053;
-    background-color: #fff;
-  }
-
-  .dtable-ui .am-picker-popup-header .am-picker-popup-item {
-    color: #E5A252;
-  }
-}