dtable-ui-component 4.4.3-2 → 4.4.3-alpha1

package/lib/DTableFiltersPopover/widgets/department-select-filter/department-multiple-select-filter.js

@@ -1,48 +1,40 @@
-"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 _selectedDepartments = _interopRequireDefault(require("../../../Department-editor/selected-departments"));
-var _departmentMultipleSelect = _interopRequireDefault(require("../../../Department-editor/department-multiple-select"));
-var _constants = require("../../../Department-editor/constants");
-var _commonHooks = require("../../../hooks/common-hooks");
-var _lang = require("../../../lang");
+import React, { useState, useRef } from 'react';
+import classnames from 'classnames';
+import SelectedDepartments from '../../../Department-editor/selected-departments';
+import DepartmentMultipleSelect from '../../../Department-editor/department-multiple-select';
+import { DEPARTMENT_SELECT_RANGE_OPTIONS } from '../../../Department-editor/constants';
+import { useClickOutside } from '../../../hooks/common-hooks';
+import { getLocale } from '../../../lang';
 function DepartmentMultipleSelectFilter(props) {
   const {
     value,
     departments
   } = props;
-  const [isShowSelector, setIsShowSelector] = (0, _react.useState)(false);
-  const [selectedDepartments, setSelectedDepartments] = (0, _react.useState)(value || []);
-  const selectorRef = (0, _react.useRef)(null);
-  (0, _commonHooks.useClickOutside)({
+  const [isShowSelector, setIsShowSelector] = useState(false);
+  const [selectedDepartments, setSelectedDepartments] = useState(value || []);
+  const selectorRef = useRef(null);
+  useClickOutside({
     currDOM: selectorRef.current,
     onClickOutside: () => setIsShowSelector(false)
   }, [selectedDepartments]);
   function renderUserDepartmentOptions() {
-    return _constants.DEPARTMENT_SELECT_RANGE_OPTIONS.slice(0, 2).map((option, index) => {
+    return DEPARTMENT_SELECT_RANGE_OPTIONS.slice(0, 2).map((option, index) => {
       const {
         type,
         name
       } = option;
-      return /*#__PURE__*/_react.default.createElement("div", {
+      return /*#__PURE__*/React.createElement("div", {
         className: "dropdown-item d-flex align-items-center",
         key: index,
         onClick: event => selectDepartment(event, type)
-      }, /*#__PURE__*/_react.default.createElement("input", {
+      }, /*#__PURE__*/React.createElement("input", {
         type: "checkbox",
         className: "vam department-select-input",
         checked: selectedDepartments.includes(type),
         onChange: event => selectDepartment(event, type)
-      }), /*#__PURE__*/_react.default.createElement("span", {
+      }), /*#__PURE__*/React.createElement("span", {
         className: "text-truncate department-name"
-      }, (0, _lang.getLocale)(name)));
+      }, getLocale(name)));
     });
   }
   function onSelectToggle(event) {
@@ -67,25 +59,25 @@ function DepartmentMultipleSelectFilter(props) {
       columnOption
     });
   }
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     ref: selectorRef,
-    className: (0, _classnames.default)('dtable-select custom-select', {
+    className: classnames('dtable-select custom-select', {
       'focus': isShowSelector
     }),
     onClick: onSelectToggle,
     id: "filter-department-editor"
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: "selected-option"
-  }, selectedDepartments.length > 0 ? /*#__PURE__*/_react.default.createElement("span", {
+  }, selectedDepartments.length > 0 ? /*#__PURE__*/React.createElement("span", {
     className: "selected-option-show"
-  }, /*#__PURE__*/_react.default.createElement(_selectedDepartments.default, {
+  }, /*#__PURE__*/React.createElement(SelectedDepartments, {
     value: selectedDepartments,
     departments: departments
-  })) : /*#__PURE__*/_react.default.createElement("span", {
+  })) : /*#__PURE__*/React.createElement("span", {
     className: "select-placeholder"
-  }, (0, _lang.getLocale)('Select_department')), /*#__PURE__*/_react.default.createElement("span", {
+  }, getLocale('Select_department')), /*#__PURE__*/React.createElement("span", {
     className: "dtable-font dtable-icon-drop-down"
-  })), isShowSelector && /*#__PURE__*/_react.default.createElement(_departmentMultipleSelect.default, {
+  })), isShowSelector && /*#__PURE__*/React.createElement(DepartmentMultipleSelect, {
     isShowSelectedDepartments: false,
     classNamePrefix: "filter",
     value: selectedDepartments,
@@ -94,4 +86,4 @@ function DepartmentMultipleSelectFilter(props) {
     departments: departments
   }));
 }
-var _default = exports.default = DepartmentMultipleSelectFilter;
+export default DepartmentMultipleSelectFilter;

package/lib/DTableFiltersPopover/widgets/department-select-filter/department-single-select-filter.js

@@ -1,18 +1,10 @@
-"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 _selectedDepartments = _interopRequireDefault(require("../../../Department-editor/selected-departments"));
-var _departmentSingleSelect = _interopRequireDefault(require("../../../Department-editor/department-single-select"));
-var _constants = require("../../../Department-editor/constants");
-var _commonHooks = require("../../../hooks/common-hooks");
-var _lang = require("../../../lang");
+import React, { useState, useRef } from 'react';
+import classnames from 'classnames';
+import SelectedDepartments from '../../../Department-editor/selected-departments';
+import DepartmentSingleSelect from '../../../Department-editor/department-single-select';
+import { DEPARTMENT_SELECT_RANGE_OPTIONS } from '../../../Department-editor/constants';
+import { useClickOutside } from '../../../hooks/common-hooks';
+import { getLocale } from '../../../lang';
 function DepartmentSingleSelectFilter(props) {
   const {
     value,
@@ -21,33 +13,33 @@ function DepartmentSingleSelectFilter(props) {
     departments,
     userDepartmentIdsMap
   } = props;
-  const [isShowSelector, setIsShowSelector] = (0, _react.useState)(false);
-  const [selectedDepartment, setSelectedDepartment] = (0, _react.useState)(value || '');
-  const selectorRef = (0, _react.useRef)(null);
+  const [isShowSelector, setIsShowSelector] = useState(false);
+  const [selectedDepartment, setSelectedDepartment] = useState(value || '');
+  const selectorRef = useRef(null);
   let selectedDepartmentIds = [];
   selectedDepartmentIds.push(value);
-  (0, _commonHooks.useClickOutside)({
+  useClickOutside({
     currDOM: selectorRef.current,
     onClickOutside: () => setIsShowSelector(false)
   }, [selectedDepartment]);
   function renderUserDepartmentOptions(onSelect) {
     if (!roleId) return [];
-    return _constants.DEPARTMENT_SELECT_RANGE_OPTIONS.slice(0, 2).map((option, index) => {
+    return DEPARTMENT_SELECT_RANGE_OPTIONS.slice(0, 2).map((option, index) => {
       const {
         type,
         name
       } = option;
-      return /*#__PURE__*/_react.default.createElement("div", {
+      return /*#__PURE__*/React.createElement("div", {
         className: "dropdown-item department-item d-flex align-items-center",
         key: index,
         onClick: event => onSelect(event, type)
-      }, /*#__PURE__*/_react.default.createElement("div", {
+      }, /*#__PURE__*/React.createElement("div", {
         className: "department-item-left-content d-flex align-items-center"
-      }, /*#__PURE__*/_react.default.createElement("span", {
+      }, /*#__PURE__*/React.createElement("span", {
         className: "text-truncate department-name"
-      }, (0, _lang.getLocale)(name)), selectedDepartment === type && /*#__PURE__*/_react.default.createElement("span", {
+      }, getLocale(name)), selectedDepartment === type && /*#__PURE__*/React.createElement("span", {
         className: "department-check-icon"
-      }, /*#__PURE__*/_react.default.createElement("i", {
+      }, /*#__PURE__*/React.createElement("i", {
         className: "dtable-font dtable-icon-check-mark"
       }))));
     });
@@ -66,25 +58,25 @@ function DepartmentSingleSelectFilter(props) {
       columnOption
     });
   }
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     ref: selectorRef,
-    className: (0, _classnames.default)('dtable-select custom-select', {
+    className: classnames('dtable-select custom-select', {
       'focus': isShowSelector
     }),
     onClick: onSelectToggle,
     id: "filter-department-editor"
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: "selected-option"
-  }, value ? /*#__PURE__*/_react.default.createElement("span", {
+  }, value ? /*#__PURE__*/React.createElement("span", {
     className: "selected-option-show"
-  }, /*#__PURE__*/_react.default.createElement(_selectedDepartments.default, {
+  }, /*#__PURE__*/React.createElement(SelectedDepartments, {
     value: selectedDepartmentIds,
     departments: departments
-  })) : /*#__PURE__*/_react.default.createElement("span", {
+  })) : /*#__PURE__*/React.createElement("span", {
     className: "select-placeholder"
-  }, (0, _lang.getLocale)('Select_department')), /*#__PURE__*/_react.default.createElement("span", {
+  }, getLocale('Select_department')), /*#__PURE__*/React.createElement("span", {
     className: "dtable-font dtable-icon-drop-down"
-  })), isShowSelector && /*#__PURE__*/_react.default.createElement(_departmentSingleSelect.default, {
+  })), isShowSelector && /*#__PURE__*/React.createElement(DepartmentSingleSelect, {
     enableSelectRange: false,
     column: column,
     value: value,
@@ -94,4 +86,4 @@ function DepartmentSingleSelectFilter(props) {
     renderUserDepartmentOptions: renderUserDepartmentOptions
   }));
 }
-var _default = exports.default = DepartmentSingleSelectFilter;
+export default DepartmentSingleSelectFilter;

package/lib/DTableFiltersPopover/widgets/filter-calendar.js

@@ -1,22 +1,14 @@
-"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 _dayjs = _interopRequireDefault(require("../../utils/dayjs"));
-require("dayjs/locale/zh-cn");
-require("dayjs/locale/en-gb");
-var _seafileCalendar = _interopRequireDefault(require("@seafile/seafile-calendar"));
-var _Picker = _interopRequireDefault(require("@seafile/seafile-calendar/lib/Picker"));
-var _lang = require("../../lang");
-var _utils = require("../utils");
-require("@seafile/seafile-calendar/assets/index.css");
-let now = (0, _dayjs.default)();
-class FilterCalendar extends _react.Component {
+import React, { Component } from 'react';
+import dayjs from '../../utils/dayjs';
+import 'dayjs/locale/zh-cn';
+import 'dayjs/locale/en-gb';
+import Calendar from '@seafile/seafile-calendar';
+import DatePicker from '@seafile/seafile-calendar/lib/Picker';
+import { translateCalendar } from '../../lang';
+import { getDateColumnFormat } from '../utils';
+import '@seafile/seafile-calendar/assets/index.css';
+let now = dayjs();
+class FilterCalendar extends Component {
   constructor(props) {
     super(props);
     this.handleMouseDown = e => {
@@ -80,10 +72,10 @@ class FilterCalendar extends _react.Component {
       open: false,
       value: null
     };
-    const DataFormat = (0, _utils.getDateColumnFormat)(props.filterColumn).trim();
+    const DataFormat = getDateColumnFormat(props.filterColumn).trim();
     //Minutes and seconds are not supported at present
     this.columnDataFormat = DataFormat.split(' ')[0];
-    this.calendarContainerRef = /*#__PURE__*/_react.default.createRef();
+    this.calendarContainerRef = React.createRef();
     this.defaultCalendarValue = null;
   }
   componentDidMount() {
@@ -98,10 +90,10 @@ class FilterCalendar extends _react.Component {
       now = now.locale('en-gb');
     }
     this.defaultCalendarValue = now.clone();
-    if (value && (0, _dayjs.default)(value).isValid()) {
-      let validValue = (0, _dayjs.default)(value).isValid() ? (0, _dayjs.default)(value) : (0, _dayjs.default)(this.defaultCalendarValue);
+    if (value && dayjs(value).isValid()) {
+      let validValue = dayjs(value).isValid() ? dayjs(value) : dayjs(this.defaultCalendarValue);
       this.setState({
-        value: iszhcn ? (0, _dayjs.default)(validValue).locale('zh-cn') : (0, _dayjs.default)(validValue).locale('en-gb')
+        value: iszhcn ? dayjs(validValue).locale('zh-cn') : dayjs(validValue).locale('en-gb')
       });
     }
   }
@@ -110,7 +102,7 @@ class FilterCalendar extends _react.Component {
       isReadOnly
     } = this.props;
     const state = this.state;
-    if (isReadOnly) return /*#__PURE__*/_react.default.createElement("input", {
+    if (isReadOnly) return /*#__PURE__*/React.createElement("input", {
       className: "ant-calendar-picker-input ant-input form-control",
       value: state.value ? state.value.format(this.columnDataFormat) : '',
       disabled: true
@@ -123,13 +115,13 @@ class FilterCalendar extends _react.Component {
       color: 'gray',
       fontSize: '12px'
     };
-    const clearIcon = /*#__PURE__*/_react.default.createElement('i', {
+    const clearIcon = React.createElement('i', {
       className: 'item-icon dtable-font dtable-icon-x',
       style: clearStyle
     });
-    const calendar = /*#__PURE__*/_react.default.createElement(_seafileCalendar.default, {
+    const calendar = /*#__PURE__*/React.createElement(Calendar, {
       className: "dtable-rc-calendar",
-      locale: (0, _lang.translateCalendar)(),
+      locale: translateCalendar(),
       style: {
         zIndex: 1001
       },
@@ -141,9 +133,9 @@ class FilterCalendar extends _react.Component {
       onClear: this.onClear,
       clearIcon: clearIcon
     });
-    return /*#__PURE__*/_react.default.createElement("div", {
+    return /*#__PURE__*/React.createElement("div", {
       className: "date-picker-container"
-    }, /*#__PURE__*/_react.default.createElement(_Picker.default, {
+    }, /*#__PURE__*/React.createElement(DatePicker, {
       calendar: calendar,
       value: state.value,
       onChange: this.onChange,
@@ -157,19 +149,19 @@ class FilterCalendar extends _react.Component {
       let {
         value
       } = _ref;
-      return /*#__PURE__*/_react.default.createElement("span", {
+      return /*#__PURE__*/React.createElement("span", {
         tabIndex: "0",
         onFocus: this.onReadOnlyFocus
-      }, /*#__PURE__*/_react.default.createElement("input", {
+      }, /*#__PURE__*/React.createElement("input", {
         tabIndex: "-1",
         readOnly: true,
         className: "ant-calendar-picker-input ant-input form-control",
         value: value ? value.format(this.columnDataFormat) : '',
         onMouseDown: this.handleMouseDown
-      }), /*#__PURE__*/_react.default.createElement("div", {
+      }), /*#__PURE__*/React.createElement("div", {
         ref: this.calendarContainerRef
       }));
     }));
   }
 }
-var _default = exports.default = FilterCalendar;
+export default FilterCalendar;