@qn-pandora/pandora-component 4.3.2 → 4.3.4

package/lib/components/Drawer/index.js

@@ -93,14 +93,14 @@ var Drawer = /** @class */ (function (_super) {
     Object.defineProperty(Drawer.prototype, "extra", {
         get: function () {
             var _a = this.props, closable = _a.closable, closeIconPlacement = _a.closeIconPlacement, showFullScreen = _a.showFullScreen;
-            var fullIcon = showFullScreen === true ? (this.isFullscreen ? (react_1.default.createElement(antd_1.Tooltip, { title: language_1.formatString(type_1.ModalLocale.exit_full, this.context.locale) },
-                react_1.default.createElement(pandora_component_icons_1.FullscreenExitOutlined, { onClick: this.handleFull, className: style_1.SDK_PREFIX + "-drawer-header-full-icon" }))) : (react_1.default.createElement(antd_1.Tooltip, { title: language_1.formatString(type_1.ModalLocale.full, this.context.locale) },
+            var fullIcon = showFullScreen === true ? (this.isFullscreen ? (react_1.default.createElement(antd_1.Tooltip, { title: language_1.formatString(type_1.ModalLocale.exit_full, this.context.locale), getPopupContainer: this.getIconPopupContainer },
+                react_1.default.createElement(pandora_component_icons_1.FullscreenExitOutlined, { onClick: this.handleFull, className: style_1.SDK_PREFIX + "-drawer-header-full-icon" }))) : (react_1.default.createElement(antd_1.Tooltip, { title: language_1.formatString(type_1.ModalLocale.full, this.context.locale), getPopupContainer: this.getIconPopupContainer },
                 react_1.default.createElement(pandora_component_icons_1.FullscreenOutlined, { onClick: this.handleFull, className: style_1.SDK_PREFIX + "-drawer-header-full-icon" })))) : null;
             if (closable !== false && closeIconPlacement === 'right') {
                 return (react_1.default.createElement(react_1.default.Fragment, null,
                     this.props.extra,
                     fullIcon,
-                    react_1.default.createElement(CloseIcon_1.default, { className: style_1.SDK_PREFIX + "-drawer-close-icon", onClick: this.handleClose })));
+                    react_1.default.createElement(CloseIcon_1.default, { className: style_1.SDK_PREFIX + "-drawer-close-icon", onClick: this.handleClose, getPopupContainer: this.getIconPopupContainer })));
             }
             return (react_1.default.createElement(react_1.default.Fragment, null,
                 fullIcon,
@@ -186,6 +186,9 @@ var Drawer = /** @class */ (function (_super) {
             }
         }
     };
+    Drawer.prototype.getIconPopupContainer = function () {
+        return document.getElementsByClassName(this.drawerId)[0] || undefined;
+    };
     Drawer.prototype.componentDidMount = function () {
         document.body.addEventListener('mousedown', this.onMouseClick);
         if (this.props.canDrag) {
@@ -209,7 +212,7 @@ var Drawer = /** @class */ (function (_super) {
         var _b = this.props, width = _b.width, className = _b.className, children = _b.children, canDrag = _b.canDrag, visible = _b.visible, closable = _b.closable, extra = _b.extra, size = _b.size, onClose = _b.onClose, other = __rest(_b, ["width", "className", "children", "canDrag", "visible", "closable", "extra", "size", "onClose"]);
         return (react_1.default.createElement(antd_1.Drawer, __assign({ className: classnames_1.default(this.drawerId, style_1.SDK_PREFIX + "-drawer", className, (_a = {},
                 _a[style_1.SDK_PREFIX + "-drawer-no-mask"] = this.props.mask === false,
-                _a)), width: this.isFullscreen ? '100%' : this.realWidth || 800, zIndex: 1200, visible: visible, closable: this.closable, extra: this.extra, closeIcon: react_1.default.createElement(CloseIcon_1.default, { className: style_1.SDK_PREFIX + "-drawer-close-icon", onClick: this.handleClose }), onClose: this.handleClose }, other),
+                _a)), width: this.isFullscreen ? '100%' : this.realWidth || 800, zIndex: 1200, visible: visible, closable: this.closable, extra: this.extra, closeIcon: react_1.default.createElement(CloseIcon_1.default, { className: style_1.SDK_PREFIX + "-drawer-close-icon", onClick: this.handleClose, getPopupContainer: this.getIconPopupContainer }), onClose: this.handleClose }, other),
             canDrag && (react_1.default.createElement("div", { className: style_1.SDK_PREFIX + "-scroll-handler", onMouseDown: this.onMouseDown })),
             children));
     };
@@ -299,6 +302,12 @@ var Drawer = /** @class */ (function (_super) {
         __metadata("design:paramtypes", [Object]),
         __metadata("design:returntype", void 0)
     ], Drawer.prototype, "handleClose", null);
+    __decorate([
+        bind_1.default,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", []),
+        __metadata("design:returntype", void 0)
+    ], Drawer.prototype, "getIconPopupContainer", null);
     Drawer = __decorate([
         mobx_react_1.observer
     ], Drawer);

package/lib/components/Drawer/style.less

@@ -1,61 +1,61 @@
-@import 'antd/lib/drawer/style/index.less';
-@import '../../style/theme.less';
-
-.@{sdk-prefix}-drawer {
-  .@{ant-prefix}-drawer-content-wrapper {
-    width: 50%;
-    min-width: 300px;
-  }
-  .@{ant-prefix}-drawer-content > div {
-    position: relative;
-  }
-  .@{ant-prefix}-drawer-close-x {
-    width: 60px;
-    height: 60px;
-    line-height: 60px;
-  }
-  .@{ant-prefix}-drawer-header-title {
-    overflow: hidden;
-  }
-}
-
-.@{sdk-prefix}-drawer-size-small {
-  max-width: 38%;
-}
-.@{sdk-prefix}-drawer-size-default {
-  max-width: 50%;
-}
-.@{sdk-prefix}-drawer-size-large {
-  max-width: 75%;
-}
-
-.@{sdk-prefix}-drawer-no-mask {
-  .@{ant-prefix}-drawer-content-wrapper {
-    width: 100%;
-  }
-}
-
-.@{sdk-prefix}-scroll-handler {
-  position: absolute;
-  width: 5px;
-  padding: 4px 0 0;
-  top: 0;
-  left: 0;
-  bottom: 0;
-  z-index: 100;
-  cursor: ew-resize;
-}
-
-.@{sdk-prefix}-drawer-close-icon {
-  margin-left: 24px;
-}
-
-.@{sdk-prefix}-drawer-header-full-icon {
-  margin-left: 24px;
-  color: @font-color-7;
-  font-size: 14px;
-}
-
-.@{sdk-prefix}-drawer-no-mask {
-  background-color: @normal-color;
-}
+@import 'antd/lib/drawer/style/index.less';
+@import '../../style/theme.less';
+
+.@{sdk-prefix}-drawer {
+  .@{ant-prefix}-drawer-content-wrapper {
+    width: 50%;
+    min-width: 300px;
+  }
+  .@{ant-prefix}-drawer-content > div {
+    position: relative;
+  }
+  .@{ant-prefix}-drawer-close-x {
+    width: 60px;
+    height: 60px;
+    line-height: 60px;
+  }
+  .@{ant-prefix}-drawer-header-title {
+    overflow: hidden;
+  }
+}
+
+.@{sdk-prefix}-drawer-size-small {
+  max-width: 38%;
+}
+.@{sdk-prefix}-drawer-size-default {
+  max-width: 50%;
+}
+.@{sdk-prefix}-drawer-size-large {
+  max-width: 75%;
+}
+
+.@{sdk-prefix}-drawer-no-mask {
+  .@{ant-prefix}-drawer-content-wrapper {
+    width: 100%;
+  }
+}
+
+.@{sdk-prefix}-scroll-handler {
+  position: absolute;
+  width: 5px;
+  padding: 4px 0 0;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  z-index: 100;
+  cursor: ew-resize;
+}
+
+.@{sdk-prefix}-drawer-close-icon {
+  margin-left: 24px;
+}
+
+.@{sdk-prefix}-drawer-header-full-icon {
+  margin-left: 24px;
+  color: @font-color-7;
+  font-size: 14px;
+}
+
+.@{sdk-prefix}-drawer-no-mask {
+  background-color: @normal-color;
+}

package/lib/components/FileResumable/constants.d.ts

@@ -30,4 +30,5 @@ export interface IFileResumableProps {
     uploadDesc?: string;
     disabled?: boolean;
     defaultImageUrl?: string;
+    multiple?: boolean;
 }

package/lib/components/FileResumable/index.js

@@ -273,7 +273,7 @@ function FileResumable(props) {
         onError
     ]);
     var handleStart = react_1.useCallback(function () { return __awaiter(_this, void 0, void 0, function () {
-        var params, realFile_1, reader;
+        var params, realFile_1, reader, extension_1;
         var _this = this;
         return __generator(this, function (_a) {
             params = __assign({}, query);
@@ -283,6 +283,7 @@ function FileResumable(props) {
                 reader.readAsText(realFile_1.size > 50 * 1024 * 1024
                     ? realFile_1.slice(0, 2 * 1024 * 1024)
                     : realFile_1);
+                extension_1 = realFile_1.name.split('.').pop().toLowerCase();
                 reader.onloadend = function (e) { return __awaiter(_this, void 0, void 0, function () {
                     var md5Str, id, fileId, error_1;
                     var _a, _b, _c;
@@ -298,7 +299,7 @@ function FileResumable(props) {
                                 return [4 /*yield*/, app_sdk_1.fileIsExit({
                                         resumableModifyTime: realFile_1.lastModified,
                                         resumableFilename: realFile_1.name,
-                                        resumableType: realFile_1.type,
+                                        resumableType: realFile_1.type || "application/" + extension_1,
                                         resumableFileMd5: md5Str,
                                         resumableTotalSize: realFile_1.size
                                     })];
@@ -315,6 +316,7 @@ function FileResumable(props) {
                                     params.resumableFileMd5 = md5Str;
                                     params.resumableModifyTime = realFile_1.lastModified;
                                     params.resumableIdentifier = uuid_1.default();
+                                    params.resumableType = realFile_1.type || "application/" + extension_1;
                                     (_a = resumable.current) === null || _a === void 0 ? void 0 : _a.updateQuery(params);
                                     (_b = resumable.current) === null || _b === void 0 ? void 0 : _b.upload();
                                 }

package/lib/components/FileResumable/style.less

@@ -1,94 +1,94 @@
-@import 'antd/lib/upload/style/index.less';
-@import '../../style/theme.less';
-
-.@{sdk-prefix}-file-resumable {
-  cursor: pointer;
-}
-
-.@{sdk-prefix}-file-resumable-run-container {
-  text-align: right;
-  .@{sdk-prefix}-file-resumable-run-container-icon {
-    color: @theme-color;
-    cursor: pointer;
-    font-size: 14px;
-    margin: 0 6px;
-  }
-
-  .@{sdk-prefix}-file-resumable-run-container-icon-disabled {
-    color: @font-disable-color;
-    &:hover {
-      cursor: not-allowed;
-    }
-  }
-}
-
-.@{sdk-prefix}-file-resumable-upload-icon {
-  font-size: 50px;
-  color: @icon-color;
-}
-
-.downloadIcon {
-  color: @theme-color;
-  cursor: pointer;
-  font-size: 20px;
-}
-
-.@{sdk-prefix}-file-resumable:hover {
-  border-color: @theme-color;
-}
-
-.@{sdk-prefix}-file-resumable-img-container {
-  background: @normal-color;
-  border: 1px dashed @border-color-1;
-  width: 50px;
-  height: 50px;
-  padding: 4px;
-  border-radius: 2px;
-  align-items: center;
-  cursor: pointer;
-  position: relative;
-  font-size: 16px;
-  display: flex;
-  justify-content: center;
-  .@{sdk-prefix}-file-resumable-img-operator {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    position: absolute;
-    top: 4px;
-    left: 4px;
-    right: 4px;
-    bottom: 4px;
-    .anticon {
-      font-size: 16px;
-    }
-  }
-  .@{sdk-prefix}-file-resumable-img-hidden-plus-icon {
-    display: none;
-  }
-
-  .@{sdk-prefix}-file-resumable-img-box {
-    max-width: 100%;
-    max-height: 100%;
-    padding: 4px;
-  }
-
-  &:hover {
-    .@{sdk-prefix}-file-resumable-img-operator {
-      background: @image-operator-hover-bg;
-      display: flex;
-      .anticon {
-        font-size: 16px;
-        color: @normal-color;
-      }
-    }
-  }
-}
-.@{sdk-prefix}-file-resumable-img.ant-upload.ant-upload-drag {
-  width: 50px;
-  height: 50px;
-  border: none;
-  .@{ant-prefix}-upload-btn {
-    padding: 0;
-  }
-}
+@import 'antd/lib/upload/style/index.less';
+@import '../../style/theme.less';
+
+.@{sdk-prefix}-file-resumable {
+  cursor: pointer;
+}
+
+.@{sdk-prefix}-file-resumable-run-container {
+  text-align: right;
+  .@{sdk-prefix}-file-resumable-run-container-icon {
+    color: @theme-color;
+    cursor: pointer;
+    font-size: 14px;
+    margin: 0 6px;
+  }
+
+  .@{sdk-prefix}-file-resumable-run-container-icon-disabled {
+    color: @font-disable-color;
+    &:hover {
+      cursor: not-allowed;
+    }
+  }
+}
+
+.@{sdk-prefix}-file-resumable-upload-icon {
+  font-size: 50px;
+  color: @icon-color;
+}
+
+.downloadIcon {
+  color: @theme-color;
+  cursor: pointer;
+  font-size: 20px;
+}
+
+.@{sdk-prefix}-file-resumable:hover {
+  border-color: @theme-color;
+}
+
+.@{sdk-prefix}-file-resumable-img-container {
+  background: @normal-color;
+  border: 1px dashed @border-color-1;
+  width: 50px;
+  height: 50px;
+  padding: 4px;
+  border-radius: 2px;
+  align-items: center;
+  cursor: pointer;
+  position: relative;
+  font-size: 16px;
+  display: flex;
+  justify-content: center;
+  .@{sdk-prefix}-file-resumable-img-operator {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    position: absolute;
+    top: 4px;
+    left: 4px;
+    right: 4px;
+    bottom: 4px;
+    .anticon {
+      font-size: 16px;
+    }
+  }
+  .@{sdk-prefix}-file-resumable-img-hidden-plus-icon {
+    display: none;
+  }
+
+  .@{sdk-prefix}-file-resumable-img-box {
+    max-width: 100%;
+    max-height: 100%;
+    padding: 4px;
+  }
+
+  &:hover {
+    .@{sdk-prefix}-file-resumable-img-operator {
+      background: @image-operator-hover-bg;
+      display: flex;
+      .anticon {
+        font-size: 16px;
+        color: @normal-color;
+      }
+    }
+  }
+}
+.@{sdk-prefix}-file-resumable-img.ant-upload.ant-upload-drag {
+  width: 50px;
+  height: 50px;
+  border: none;
+  .@{ant-prefix}-upload-btn {
+    padding: 0;
+  }
+}

package/lib/components/Input/style.less

@@ -1,12 +1,12 @@
-@import 'antd/lib/input/style/index.less';
-@import '../../style/theme.less';
-
-.@{ant-prefix}-input {
-  &[disabled] {
-    border-color: @input-disabled-border-color;
-  }
-}
-
-.@{ant-prefix}-input-group-addon {
-  color: @font-color-6;
-}
+@import 'antd/lib/input/style/index.less';
+@import '../../style/theme.less';
+
+.@{ant-prefix}-input {
+  &[disabled] {
+    border-color: @input-disabled-border-color;
+  }
+}
+
+.@{ant-prefix}-input-group-addon {
+  color: @font-color-6;
+}

package/lib/components/KeyValuePair/style.less

@@ -1,25 +1,25 @@
-@import '../../style/theme.less';
-
-.@{sdk-prefix}-key-value-label,
-.@{sdk-prefix}-key-value-value {
-  display: inline-block;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  line-height: 1.8;
-  vertical-align: middle; // overflow：hidden和display: inline-block一起使用时会造成baseline的移动，进而增大高度
-}
-
-.@{sdk-prefix}-key-value-label {
-  color: @font-color-6;
-  width: 30%;
-}
-.@{sdk-prefix}-key-value-label-top {
-  padding-top: 10px;
-  vertical-align: top;
-}
-
-.@{sdk-prefix}-key-value-value {
-  color: @font-color-7;
-  width: 70%;
-}
+@import '../../style/theme.less';
+
+.@{sdk-prefix}-key-value-label,
+.@{sdk-prefix}-key-value-value {
+  display: inline-block;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  line-height: 1.8;
+  vertical-align: middle; // overflow：hidden和display: inline-block一起使用时会造成baseline的移动，进而增大高度
+}
+
+.@{sdk-prefix}-key-value-label {
+  color: @font-color-6;
+  width: 30%;
+}
+.@{sdk-prefix}-key-value-label-top {
+  padding-top: 10px;
+  vertical-align: top;
+}
+
+.@{sdk-prefix}-key-value-value {
+  color: @font-color-7;
+  width: 70%;
+}

package/lib/components/Menu/style.less

@@ -1,18 +1,18 @@
-@import 'antd/lib/menu/style/index.less';
-@import '../../style/theme.less';
-
-.@{ant-prefix}-menu-vertical.@{ant-prefix}-menu-sub:not([class*='-active']),
-.@{ant-prefix}-menu-vertical-left.@{ant-prefix}-menu-sub:not([class*='-active']),
-.@{ant-prefix}-menu-vertical-right.@{ant-prefix}-menu-sub:not([class*='-active']) {
-  max-height: 320px;
-}
-.@{ant-prefix}-menu-item {
-  .@{sdk-prefix}-menu-item-a {
-    color: @font-color-7;
-  }
-}
-.@{ant-prefix}-menu-horizontal
-  > .@{ant-prefix}-menu-item
-  .@{sdk-prefix}-menu-item-a {
-  color: @font-color-7;
-}
+@import 'antd/lib/menu/style/index.less';
+@import '../../style/theme.less';
+
+.@{ant-prefix}-menu-vertical.@{ant-prefix}-menu-sub:not([class*='-active']),
+.@{ant-prefix}-menu-vertical-left.@{ant-prefix}-menu-sub:not([class*='-active']),
+.@{ant-prefix}-menu-vertical-right.@{ant-prefix}-menu-sub:not([class*='-active']) {
+  max-height: 320px;
+}
+.@{ant-prefix}-menu-item {
+  .@{sdk-prefix}-menu-item-a {
+    color: @font-color-7;
+  }
+}
+.@{ant-prefix}-menu-horizontal
+  > .@{ant-prefix}-menu-item
+  .@{sdk-prefix}-menu-item-a {
+  color: @font-color-7;
+}

package/lib/components/Modal/style.less

@@ -1,30 +1,30 @@
-@import 'antd/lib/modal/style/index.less';
-@import '../../style/theme.less';
-
-.@{sdk-prefix}-modal {
-  .@{ant-prefix}-modal-header {
-    border-color: @modal-header-border-color;
-  }
-  .@{ant-prefix}-modal-body {
-    max-height: 70vh;
-    overflow-y: auto;
-    background: @normal-color;
-    padding: 0px 60px;
-    padding-top: 24px;
-    border-radius: 0 0 2px 2px;
-  }
-  .@{ant-prefix}-modal-footer {
-    border: none;
-    padding: 32px 24px 24px 24px;
-    .@{ant-prefix}-btn {
-      min-width: 60px;
-      height: 32px;
-      margin-left: 12px;
-      font-size: 14px;
-      color: @text-color;
-    }
-    .@{ant-prefix}-btn-primary {
-      color: @normal-color;
-    }
-  }
-}
+@import 'antd/lib/modal/style/index.less';
+@import '../../style/theme.less';
+
+.@{sdk-prefix}-modal {
+  .@{ant-prefix}-modal-header {
+    border-color: @modal-header-border-color;
+  }
+  .@{ant-prefix}-modal-body {
+    max-height: 70vh;
+    overflow-y: auto;
+    background: @normal-color;
+    padding: 0px 60px;
+    padding-top: 24px;
+    border-radius: 0 0 2px 2px;
+  }
+  .@{ant-prefix}-modal-footer {
+    border: none;
+    padding: 32px 24px 24px 24px;
+    .@{ant-prefix}-btn {
+      min-width: 60px;
+      height: 32px;
+      margin-left: 12px;
+      font-size: 14px;
+      color: @text-color;
+    }
+    .@{ant-prefix}-btn-primary {
+      color: @normal-color;
+    }
+  }
+}

package/lib/components/NameExplainTooltip/style.less

@@ -1,10 +1,10 @@
-@import '../../style/theme.less';
-
-.@{sdk-prefix}-name-explain-icon {
-  color: @icon-color;
-  transition: color 0.3s;
-  &:hover,
-  .@{ant-prefix}-tooltip-open {
-    color: @theme-color;
-  }
-}
+@import '../../style/theme.less';
+
+.@{sdk-prefix}-name-explain-icon {
+  color: @icon-color;
+  transition: color 0.3s;
+  &:hover,
+  .@{ant-prefix}-tooltip-open {
+    color: @theme-color;
+  }
+}

package/lib/components/NameLimiter/index.d.ts

@@ -1,13 +1,14 @@
-/// <reference types="react" />
+import React from 'react';
 import type { TooltipPlacement } from 'antd/es/tooltip';
 /**
  * 对于超出容器宽度的名称进行省略，使用Tooltip展示。
  */
 export interface INameLimiterProps {
     /** 资源名称 */
-    name: string;
+    name: React.ReactNode;
     /** 用于显示Tooltip的title */
-    title?: string;
+    title?: React.ReactNode;
     placement?: TooltipPlacement;
+    getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
 }
-export default function NameLimiter({ name, title, placement }: INameLimiterProps): JSX.Element;
+export default function NameLimiter({ name, title, placement, getPopupContainer }: INameLimiterProps): JSX.Element;

package/lib/components/NameLimiter/index.js

@@ -27,7 +27,7 @@ var react_1 = __importStar(require("react"));
 var antd_1 = require("antd");
 var style_1 = require("../../constants/style");
 function NameLimiter(_a) {
-    var name = _a.name, title = _a.title, placement = _a.placement;
+    var name = _a.name, title = _a.title, placement = _a.placement, getPopupContainer = _a.getPopupContainer;
     var _b = __read(react_1.useState(false), 2), ellipsis = _b[0], setEllipsis = _b[1];
     var _c = __read(react_1.useState(false), 2), visible = _c[0], setVisible = _c[1];
     var ref = react_1.useRef(null);
@@ -38,7 +38,7 @@ function NameLimiter(_a) {
         }
         setEllipsis(ref.current.clientWidth < ref.current.scrollWidth);
     });
-    return (react_1.default.createElement(antd_1.Tooltip, { overlayClassName: style_1.SDK_PREFIX + "-name-limit-tooltip", placement: placement || 'top', title: title || name, visible: (!!title || ellipsis) && visible, onVisibleChange: setVisible },
+    return (react_1.default.createElement(antd_1.Tooltip, { getPopupContainer: getPopupContainer, overlayClassName: style_1.SDK_PREFIX + "-name-limit-tooltip", placement: placement || 'top', title: title || name, visible: (!!title || ellipsis) && visible, onVisibleChange: setVisible },
         react_1.default.createElement("span", { className: style_1.SDK_PREFIX + "-name-limit", ref: ref }, name)));
 }
 exports.default = NameLimiter;