dtable-ui-component 5.0.9-beta.1 → 5.0.9-beta.2

package/lib/DTableFiltersPopover/widgets/collaborator-filter/index.js

@@ -11,6 +11,7 @@ var _dtableUtils = require("dtable-utils");
 var _DTableCustomizeSelect = _interopRequireDefault(require("../../../DTableCustomizeSelect"));
 var _lang = require("../../../lang");
 require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 class CollaboratorFilter extends _react.Component {
   constructor(props) {
     super(props);
@@ -22,30 +23,38 @@ class CollaboratorFilter extends _react.Component {
             filterIndex,
             columnOption: collaborator
           },
-          label: /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-            className: "select-option-name option-collaborator"
-          }, /*#__PURE__*/_react.default.createElement("div", {
-            className: "collaborator-container"
-          }, /*#__PURE__*/_react.default.createElement("div", {
-            className: "collaborator"
-          }, /*#__PURE__*/_react.default.createElement("span", {
-            className: "collaborator-avatar-container"
-          }, /*#__PURE__*/_react.default.createElement("img", {
-            className: "collaborator-avatar",
-            alt: collaborator.name,
-            src: collaborator.avatar_url
-          })), /*#__PURE__*/_react.default.createElement("span", {
-            className: "collaborator-name text-truncate",
-            style: {
-              maxWidth: '200px'
-            },
-            title: collaborator.name,
-            "aria-label": collaborator.name
-          }, collaborator.name))), /*#__PURE__*/_react.default.createElement("div", {
-            className: "collaborator-check-icon"
-          }, isSelected && /*#__PURE__*/_react.default.createElement("i", {
-            className: "option-edit dtable-font dtable-icon-check-mark"
-          }))))
+          label: /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Fragment, {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+              className: "select-option-name option-collaborator",
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+                className: "collaborator-container",
+                children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+                  className: "collaborator",
+                  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                    className: "collaborator-avatar-container",
+                    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+                      className: "collaborator-avatar",
+                      alt: collaborator.name,
+                      src: collaborator.avatar_url
+                    })
+                  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                    className: "collaborator-name text-truncate",
+                    style: {
+                      maxWidth: '200px'
+                    },
+                    title: collaborator.name,
+                    "aria-label": collaborator.name,
+                    children: collaborator.name
+                  })]
+                })
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+                className: "collaborator-check-icon",
+                children: isSelected && /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+                  className: "option-edit dtable-font dtable-icon-check-mark"
+                })
+              })]
+            })
+          })
         };
       });
     };
@@ -69,35 +78,41 @@ class CollaboratorFilter extends _react.Component {
     let selectedCollaborators = Array.isArray(filterTerm) && filterTerm.length > 0 && filterTerm.map(item => {
       let collaborator = collaborators.find(c => c.email === item);
       if (!collaborator) return null;
-      return /*#__PURE__*/_react.default.createElement("div", {
-        key: item,
-        className: "collaborator"
-      }, /*#__PURE__*/_react.default.createElement("span", {
-        className: "collaborator-avatar-container"
-      }, /*#__PURE__*/_react.default.createElement("img", {
-        className: "collaborator-avatar",
-        alt: collaborator.name,
-        src: collaborator.avatar_url
-      })), /*#__PURE__*/_react.default.createElement("span", {
-        className: "collaborator-name text-truncate",
-        title: collaborator.name,
-        "aria-label": collaborator.name
-      }, collaborator.name), /*#__PURE__*/_react.default.createElement("span", {
-        className: "remove-container"
-      }, /*#__PURE__*/_react.default.createElement("span", {
-        className: "remove-icon",
-        onClick: e => {
-          this.onClick(e, collaborator);
-        }
-      }, /*#__PURE__*/_react.default.createElement("i", {
-        className: "dtable-font dtable-icon-fork-number"
-      }))));
+      return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "collaborator",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: "collaborator-avatar-container",
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+            className: "collaborator-avatar",
+            alt: collaborator.name,
+            src: collaborator.avatar_url
+          })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: "collaborator-name text-truncate",
+          title: collaborator.name,
+          "aria-label": collaborator.name,
+          children: collaborator.name
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: "remove-container",
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "remove-icon",
+            onClick: e => {
+              this.onClick(e, collaborator);
+            },
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+              className: "dtable-font dtable-icon-fork-number"
+            })
+          })
+        })]
+      }, item);
     });
     let value = selectedCollaborators ? {
-      label: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, selectedCollaborators)
+      label: /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+        children: selectedCollaborators
+      })
     } : {};
     let options = Array.isArray(filterTerm) ? this.createCollaboratorOptions(filterIndex, collaborators, filterTerm) : [];
-    return /*#__PURE__*/_react.default.createElement(_DTableCustomizeSelect.default, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_DTableCustomizeSelect.default, {
       className: "selector-collaborator",
       value: value,
       onSelectOption: this.props.onSelectCollaborator,

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

@@ -13,6 +13,7 @@ var _departmentMultipleSelect = _interopRequireDefault(require("../../../Departm
 var _constants = require("../../../Department-editor/constants");
 var _commonHooks = require("../../../hooks/common-hooks");
 var _lang = require("../../../lang");
+var _jsxRuntime = require("react/jsx-runtime");
 function DepartmentMultipleSelectFilter(props) {
   const {
     value,
@@ -31,18 +32,19 @@ function DepartmentMultipleSelectFilter(props) {
         type,
         name
       } = option;
-      return /*#__PURE__*/_react.default.createElement("div", {
+      return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: "dropdown-item d-flex align-items-center",
-        key: index,
-        onClick: event => selectDepartment(event, type)
-      }, /*#__PURE__*/_react.default.createElement("input", {
-        type: "checkbox",
-        className: "vam department-select-input",
-        checked: selectedDepartments.includes(type),
-        onChange: event => selectDepartment(event, type)
-      }), /*#__PURE__*/_react.default.createElement("span", {
-        className: "text-truncate department-name"
-      }, (0, _lang.getLocale)(name)));
+        onClick: event => selectDepartment(event, type),
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+          type: "checkbox",
+          className: "vam department-select-input",
+          checked: selectedDepartments.includes(type),
+          onChange: event => selectDepartment(event, type)
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: "text-truncate department-name",
+          children: (0, _lang.getLocale)(name)
+        })]
+      }, index);
     });
   }
   function onSelectToggle(event) {
@@ -67,31 +69,35 @@ function DepartmentMultipleSelectFilter(props) {
       columnOption
     });
   }
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     ref: selectorRef,
     className: (0, _classnames.default)('dtable-select custom-select', {
       'focus': isShowSelector
     }),
     onClick: onSelectToggle,
-    id: "filter-department-editor"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "selected-option"
-  }, selectedDepartments.length > 0 ? /*#__PURE__*/_react.default.createElement("span", {
-    className: "selected-option-show"
-  }, /*#__PURE__*/_react.default.createElement(_selectedDepartments.default, {
-    value: selectedDepartments,
-    departments: departments
-  })) : /*#__PURE__*/_react.default.createElement("span", {
-    className: "select-placeholder"
-  }, (0, _lang.getLocale)('Select_department')), /*#__PURE__*/_react.default.createElement("span", {
-    className: "dtable-font dtable-icon-drop-down"
-  })), isShowSelector && /*#__PURE__*/_react.default.createElement(_departmentMultipleSelect.default, {
-    isShowSelectedDepartments: false,
-    classNamePrefix: "filter",
-    value: selectedDepartments,
-    onCommit: selectDepartment,
-    renderUserDepartmentOptions: renderUserDepartmentOptions,
-    departments: departments
-  }));
+    id: "filter-department-editor",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "selected-option",
+      children: [selectedDepartments.length > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "selected-option-show",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_selectedDepartments.default, {
+          value: selectedDepartments,
+          departments: departments
+        })
+      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "select-placeholder",
+        children: (0, _lang.getLocale)('Select_department')
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "dtable-font dtable-icon-drop-down"
+      })]
+    }), isShowSelector && /*#__PURE__*/(0, _jsxRuntime.jsx)(_departmentMultipleSelect.default, {
+      isShowSelectedDepartments: false,
+      classNamePrefix: "filter",
+      value: selectedDepartments,
+      onCommit: selectDepartment,
+      renderUserDepartmentOptions: renderUserDepartmentOptions,
+      departments: departments
+    })]
+  });
 }
 var _default = exports.default = DepartmentMultipleSelectFilter;

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

@@ -13,6 +13,7 @@ var _departmentSingleSelect = _interopRequireDefault(require("../../../Departmen
 var _constants = require("../../../Department-editor/constants");
 var _commonHooks = require("../../../hooks/common-hooks");
 var _lang = require("../../../lang");
+var _jsxRuntime = require("react/jsx-runtime");
 function DepartmentSingleSelectFilter(props) {
   const {
     value,
@@ -36,19 +37,22 @@ function DepartmentSingleSelectFilter(props) {
         type,
         name
       } = option;
-      return /*#__PURE__*/_react.default.createElement("div", {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: "dropdown-item department-item d-flex align-items-center",
-        key: index,
-        onClick: event => onSelect(event, type)
-      }, /*#__PURE__*/_react.default.createElement("div", {
-        className: "department-item-left-content d-flex align-items-center"
-      }, /*#__PURE__*/_react.default.createElement("span", {
-        className: "text-truncate department-name"
-      }, (0, _lang.getLocale)(name)), selectedDepartment === type && /*#__PURE__*/_react.default.createElement("span", {
-        className: "department-check-icon"
-      }, /*#__PURE__*/_react.default.createElement("i", {
-        className: "dtable-font dtable-icon-check-mark"
-      }))));
+        onClick: event => onSelect(event, type),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: "department-item-left-content d-flex align-items-center",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "text-truncate department-name",
+            children: (0, _lang.getLocale)(name)
+          }), selectedDepartment === type && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "department-check-icon",
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+              className: "dtable-font dtable-icon-check-mark"
+            })
+          })]
+        })
+      }, index);
     });
   }
   function onSelectToggle(event) {
@@ -65,32 +69,36 @@ function DepartmentSingleSelectFilter(props) {
       columnOption
     });
   }
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     ref: selectorRef,
     className: (0, _classnames.default)('dtable-select custom-select', {
       'focus': isShowSelector
     }),
     onClick: onSelectToggle,
-    id: "filter-department-editor"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "selected-option"
-  }, value ? /*#__PURE__*/_react.default.createElement("span", {
-    className: "selected-option-show"
-  }, /*#__PURE__*/_react.default.createElement(_selectedDepartments.default, {
-    value: selectedDepartmentIds,
-    departments: departments
-  })) : /*#__PURE__*/_react.default.createElement("span", {
-    className: "select-placeholder"
-  }, (0, _lang.getLocale)('Select_department')), /*#__PURE__*/_react.default.createElement("span", {
-    className: "dtable-font dtable-icon-drop-down"
-  })), isShowSelector && /*#__PURE__*/_react.default.createElement(_departmentSingleSelect.default, {
-    enableSelectRange: false,
-    column: column,
-    value: value,
-    onCommit: onCommit,
-    userDepartmentIdsMap: userDepartmentIdsMap,
-    departments: departments,
-    renderUserDepartmentOptions: renderUserDepartmentOptions
-  }));
+    id: "filter-department-editor",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "selected-option",
+      children: [value ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "selected-option-show",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_selectedDepartments.default, {
+          value: selectedDepartmentIds,
+          departments: departments
+        })
+      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "select-placeholder",
+        children: (0, _lang.getLocale)('Select_department')
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "dtable-font dtable-icon-drop-down"
+      })]
+    }), isShowSelector && /*#__PURE__*/(0, _jsxRuntime.jsx)(_departmentSingleSelect.default, {
+      enableSelectRange: false,
+      column: column,
+      value: value,
+      onCommit: onCommit,
+      userDepartmentIdsMap: userDepartmentIdsMap,
+      departments: departments,
+      renderUserDepartmentOptions: renderUserDepartmentOptions
+    })]
+  });
 }
 var _default = exports.default = DepartmentSingleSelectFilter;

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

@@ -15,6 +15,7 @@ var _Picker = _interopRequireDefault(require("@seafile/seafile-calendar/lib/Pick
 var _lang = require("../../lang");
 var _utils = require("../utils");
 require("@seafile/seafile-calendar/assets/index.css");
+var _jsxRuntime = require("react/jsx-runtime");
 let now = (0, _dayjs.default)();
 class FilterCalendar extends _react.Component {
   constructor(props) {
@@ -110,7 +111,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__*/(0, _jsxRuntime.jsx)("input", {
       className: "ant-calendar-picker-input ant-input form-control",
       value: state.value ? state.value.format(this.columnDataFormat) : '',
       disabled: true
@@ -127,7 +128,7 @@ class FilterCalendar extends _react.Component {
       className: 'item-icon dtable-font dtable-icon-x',
       style: clearStyle
     });
-    const calendar = /*#__PURE__*/_react.default.createElement(_seafileCalendar.default, {
+    const calendar = /*#__PURE__*/(0, _jsxRuntime.jsx)(_seafileCalendar.default, {
       className: "dtable-rc-calendar",
       locale: (0, _lang.translateCalendar)(),
       style: {
@@ -141,35 +142,38 @@ class FilterCalendar extends _react.Component {
       onClear: this.onClear,
       clearIcon: clearIcon
     });
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "date-picker-container"
-    }, /*#__PURE__*/_react.default.createElement(_Picker.default, {
-      calendar: calendar,
-      value: state.value,
-      onChange: this.onChange,
-      getCalendarContainer: this.getCalendarContainer,
-      onOpenChange: this.onOpenChange,
-      open: state.open,
-      style: {
-        zIndex: 1001
-      }
-    }, _ref => {
-      let {
-        value
-      } = _ref;
-      return /*#__PURE__*/_react.default.createElement("span", {
-        tabIndex: "0",
-        onFocus: this.onReadOnlyFocus
-      }, /*#__PURE__*/_react.default.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", {
-        ref: this.calendarContainerRef
-      }));
-    }));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "date-picker-container",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Picker.default, {
+        calendar: calendar,
+        value: state.value,
+        onChange: this.onChange,
+        getCalendarContainer: this.getCalendarContainer,
+        onOpenChange: this.onOpenChange,
+        open: state.open,
+        style: {
+          zIndex: 1001
+        },
+        children: _ref => {
+          let {
+            value
+          } = _ref;
+          return /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+            tabIndex: "0",
+            onFocus: this.onReadOnlyFocus,
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+              tabIndex: "-1",
+              readOnly: true,
+              className: "ant-calendar-picker-input ant-input form-control",
+              value: value ? value.format(this.columnDataFormat) : '',
+              onMouseDown: this.handleMouseDown
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              ref: this.calendarContainerRef
+            })]
+          });
+        }
+      })
+    });
   }
 }
 var _default = exports.default = FilterCalendar;