dtable-ui-component 6.0.27 → 6.0.29-beta

package/lib/CheckboxEditor/index.js

@@ -59,9 +59,7 @@ class CheckboxEditor extends _react.Component {
       });
     };
     this.renderIcon = (symbol, color) => {
-      const className = (0, _classnames.default)('dtable-ui-checkbox-check-mark', {
-        'dtable-ui-checkbox-check-svg': !(symbol !== null && symbol !== void 0 && symbol.startsWith('dtable-icon'))
-      });
+      let className = 'dtable-ui-checkbox-check-mark';
       if (symbol.startsWith('dtable-icon')) {
         return /*#__PURE__*/_react.default.createElement("span", {
           className: "dtable-font ".concat(symbol, " ").concat(className || ''),
@@ -70,6 +68,10 @@ class CheckboxEditor extends _react.Component {
           }
         });
       }
+      className = (0, _classnames.default)(className, {
+        'dtable-ui-checkbox-check-svg': !(symbol !== null && symbol !== void 0 && symbol.startsWith('dtable-icon')),
+        'scale-icon': _utils.isMobile
+      });
       return /*#__PURE__*/_react.default.createElement(_SvgIcon.default, {
         className: className,
         symbol: symbol,

package/lib/CheckboxFormatter/index.css

@@ -1,6 +1,6 @@
 @import url('../css/cell-formatter.css');
 
-.dtable-ui.checkbox-formatter .checkbox-checked-mark {
+.dtable-ui.checkbox-formatter .dtable-ui-checkbox-check-mark {
   color: #20c933;
   display: flex;
   align-items: center;

package/lib/CheckboxFormatter/index.js

@@ -9,8 +9,32 @@ var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _SvgIcon = _interopRequireDefault(require("../SvgIcon"));
 var _constants = require("../constants");
+var _utils = require("../utils/utils");
 require("./index.css");
 class CheckboxFormatter extends _react.default.PureComponent {
+  constructor() {
+    super(...arguments);
+    this.renderIcon = (symbol, color) => {
+      let className = 'dtable-ui-checkbox-check-mark';
+      if (symbol.startsWith('dtable-icon')) {
+        return /*#__PURE__*/_react.default.createElement("span", {
+          className: "dtable-font ".concat(symbol, " ").concat(className || ''),
+          style: {
+            color
+          }
+        });
+      }
+      className = (0, _classnames.default)(className, {
+        'dtable-ui-checkbox-check-svg': !(symbol !== null && symbol !== void 0 && symbol.startsWith('dtable-icon')),
+        'scale-icon': _utils.isMobile
+      });
+      return /*#__PURE__*/_react.default.createElement(_SvgIcon.default, {
+        className: className,
+        symbol: symbol,
+        color: color
+      });
+    };
+  }
   render() {
     let {
       value,
@@ -25,16 +49,7 @@ class CheckboxFormatter extends _react.default.PureComponent {
     const classname = (0, _classnames.default)('dtable-ui cell-formatter-container checkbox-formatter d-flex align-items-center justify-content-center', containerClassName);
     return /*#__PURE__*/_react.default.createElement("div", {
       className: classname
-    }, checkboxStyle.type.startsWith('dtable-icon') ? /*#__PURE__*/_react.default.createElement("span", {
-      className: "dtable-font ".concat(checkboxStyle.type, " checkbox-checked-mark"),
-      style: {
-        color: checkboxStyle.color
-      }
-    }) : /*#__PURE__*/_react.default.createElement(_SvgIcon.default, {
-      className: "dtable-ui-checkbox-check-svg",
-      symbol: checkboxStyle.type,
-      color: checkboxStyle.color
-    }));
+    }, this.renderIcon(checkboxStyle.type, checkboxStyle.color));
   }
 }
 CheckboxFormatter.defaultProps = {

package/lib/Department-editor/department-multiple-select/index.css

@@ -42,7 +42,6 @@
 .departments-container.dtable-ui .expand {
   color: #b5b5b5;
   font-size: 12px;
-  transform: scale(0.8);
   cursor: pointer;
   margin-left: 0px !important;
 }
@@ -65,6 +64,10 @@
   align-items: center;
 }
 
+.departments-container.dtable-ui .department-item .department-item-fold-btn {
+  margin-right: 2px;
+}
+
 .departments-container.dtable-ui .department-item:hover {
   background: #f5f5f5;
   color: #212529;

package/lib/Department-editor/department-multiple-select/index.js

@@ -100,10 +100,13 @@ function DepartmentMultipleSelect(props) {
       checked: inputChecked,
       style: inputStyle,
       onChange: () => {}
-    }), hasChild && !searchVal && /*#__PURE__*/_react.default.createElement("span", {
-      className: "dtable-font expand dtable-icon-".concat(isExpanded ? 'drop-down' : 'right-slide', " pr-1"),
-      onClick: event => onExpand(event, id, isExpanded)
-    }), /*#__PURE__*/_react.default.createElement("span", {
+    }), hasChild && !searchVal && /*#__PURE__*/_react.default.createElement("div", {
+      onClick: event => onExpand(event, id, isExpanded),
+      role: "button",
+      className: "department-item-fold-btn"
+    }, /*#__PURE__*/_react.default.createElement("span", {
+      className: "dtable-font expand dtable-icon-down3 ".concat(isExpanded ? '' : 'rotate-270')
+    })), /*#__PURE__*/_react.default.createElement("span", {
       style: searchVal ? {} : nameStyle,
       title: name,
       className: "text-truncate"

package/lib/Department-editor/department-single-select.js

@@ -151,10 +151,13 @@ class DepartmentSingleSelect extends _react.Component {
         style: itemStyle
       }, /*#__PURE__*/_react.default.createElement("div", {
         className: "department-item-left-content d-flex align-items-center"
-      }, hasChild && /*#__PURE__*/_react.default.createElement("span", {
-        className: "dtable-font expand dtable-icon-".concat(isExpanded ? 'drop-down' : 'right-slide', " pr-1"),
-        onClick: event => this.onExpand(event, id, isExpanded)
-      }), /*#__PURE__*/_react.default.createElement("span", {
+      }, hasChild && /*#__PURE__*/_react.default.createElement("div", {
+        onClick: event => this.onExpand(event, id, isExpanded),
+        role: "button",
+        className: "department-item-fold-btn"
+      }, /*#__PURE__*/_react.default.createElement("span", {
+        className: "dtable-font expand dtable-icon-down3 ".concat(isExpanded ? '' : 'rotate-270')
+      })), /*#__PURE__*/_react.default.createElement("span", {
         style: nameStyle,
         title: name,
         className: "text-truncate department-name"

package/lib/Department-editor/index.css

@@ -38,6 +38,10 @@
   margin-left: 4px;
 }
 
+.dtable-ui.department-editor-list .department-item-left-content .department-item-fold-btn {
+  margin-right: 2px;
+}
+
 .dtable-ui.department-editor-list .department-check-icon .dtable-icon-check-mark {
   font-size: 12px;
   color: #798d99;

package/lib/SvgIcon/index.js

@@ -6,24 +6,39 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _check = _interopRequireDefault(require("../assets/icons/check.svg"));
+var _cross = _interopRequireDefault(require("../assets/icons/cross.svg"));
+var _dot = _interopRequireDefault(require("../assets/icons/dot.svg"));
 require("./index.css");
-const needScaleIcons = ['check', 'dot', 'cross'];
-const SvgIcon = props => {
-  const {
+const SvgIcon = _ref => {
+  let {
     className,
     symbol,
     color
-  } = props;
-  let iconClass = "dtable-ui-multicolor-icon multicolor-icon-".concat(symbol, " ").concat(className || '');
-  if (needScaleIcons.includes(symbol) && window.isMobile) {
-    iconClass += ' scale-icon';
-  }
-  return /*#__PURE__*/_react.default.createElement("svg", {
+  } = _ref;
+  if (!symbol) return null;
+  const iconClass = "dtable-ui-multicolor-icon multicolor-icon-".concat(symbol, " ").concat(className || '');
+  const props = {
     className: iconClass,
-    "aria-hidden": "true"
-  }, /*#__PURE__*/_react.default.createElement("use", {
-    fill: color,
-    xlinkHref: "#".concat(symbol)
-  }));
+    style: {
+      fill: color
+    }
+  };
+  switch (symbol) {
+    case 'check':
+      {
+        return /*#__PURE__*/_react.default.createElement(_check.default, props);
+      }
+    case 'cross':
+      {
+        return /*#__PURE__*/_react.default.createElement(_cross.default, props);
+      }
+    case 'dot':
+      {
+        return /*#__PURE__*/_react.default.createElement(_dot.default, props);
+      }
+    default:
+      return null;
+  }
 };
 var _default = exports.default = SvgIcon;

package/lib/assets/icons/check.svg

@@ -0,0 +1,15 @@
+<?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">
+<style type="text/css">
+	.st0{fill:#999999;}
+</style>
+<title>check</title>
+<g id="check">
+	<g id="路径" transform="translate(0.020249, 4.178564)">
+		<path class="st0" 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,16 @@
+<?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">
+<style type="text/css">
+	.st0{fill:#999999;}
+</style>
+<title>x-check-box</title>
+<g id="x-check-box">
+	<g id="fork-number">
+		<path id="路径" class="st0" 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,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">
+<style type="text/css">
+	.st0{fill:#999999;}
+</style>
+<title>dot</title>
+<g id="dot">
+	<circle id="椭圆形" class="st0" cx="16" cy="16" r="9"/>
+</g>
+</svg>

package/lib/constants/file.js

@@ -47,6 +47,7 @@ const FILEEXT_ICON_MAP = exports.FILEEXT_ICON_MAP = {
   gif: 'pic',
   bmp: 'pic',
   ico: 'pic',
+  webp: 'pic',
   // folder dir
   folder: 'folder',
   // default

package/lib/index.js

@@ -424,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 () {
@@ -548,5 +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 _UploadProgress = _interopRequireDefault(require("./UploadProgress"));

package/lib/locales/zh-CN.json

@@ -92,7 +92,7 @@
   "Select_department": "选择部门",
   "Default": "默认",
   "Custom": "自定义",
-  "Recently_used": "Recently used",
+  "Recently_used": "最近使用",
   "Digital_signature": "数字签名",
   "Please_sign_on_this_panel": "请在此面板上签名",
   "Re-sign": "重新签名",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dtable-ui-component",
-  "version": "6.0.27",
+  "version": "6.0.29-beta",
   "main": "./lib/index.js",
   "dependencies": {
     "@seafile/react-image-lightbox": "4.0.2",