@qn-pandora/pandora-component 5.1.0 → 5.1.2

package/es/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/es/components/Menu/Option.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import React from 'react';
 import type { IMenuProps } from './index';
 export interface IOption {
     key: string;

package/es/components/Menu/Option.js

@@ -9,11 +9,21 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-import * as React from 'react';
+import React from 'react';
 import { Menu as BaseMenu } from 'antd';
 import { SDK_PREFIX } from '../../constants/style';
 var Item = BaseMenu.Item, SubMenu = BaseMenu.SubMenu;
 export default function Option(option) {
+    var handleTitleClick = function (e, option) {
+        var _a;
+        if (option.url || option.internalUrl) {
+            (_a = option.onMenuClick) === null || _a === void 0 ? void 0 : _a.call(option, e);
+            return;
+        }
+        if (option.weburl) {
+            window.open(option.weburl, option.target || '_blank');
+        }
+    };
     if (!option.children) {
         if (option.weburl) {
             return (React.createElement(Item, { key: option.key },
@@ -21,9 +31,7 @@ export default function Option(option) {
         }
         return React.createElement(Item, { key: option.key }, option.text);
     }
-    return (React.createElement(SubMenu, { key: option.key, title: option.text, popupClassName: option.popupClassName, 
-        // 如果子菜单也有url时，点击触发menu的点击回调函数
-        onTitleClick: function (e) { var _a; return option.url && ((_a = option.onMenuClick) === null || _a === void 0 ? void 0 : _a.call(option, e)); } }, option.children.map(function (item) {
+    return (React.createElement(SubMenu, { key: option.key, title: option.text, popupClassName: option.popupClassName, onTitleClick: function (e) { return handleTitleClick(e, option); } }, option.children.map(function (item) {
         return Option(__assign(__assign({}, item), { onMenuClick: option.onMenuClick }));
     })));
 }

package/es/components/Menu/style.css

@@ -68,8 +68,8 @@
   content: '';
 }
 .ant-menu.ant-menu-root:focus-visible {
-  -webkit-box-shadow: 0 0 0 2px #ccd3d9;
-          box-shadow: 0 0 0 2px #ccd3d9;
+  -webkit-box-shadow: 0 0 0 2px #e6eeff;
+          box-shadow: 0 0 0 2px #e6eeff;
 }
 .ant-menu ul,
 .ant-menu ol {
@@ -110,7 +110,7 @@
   transition: border-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
 }
 .ant-menu-submenu-selected {
-  color: #2c6dd2;
+  color: #436bff;
 }
 .ant-menu-item:active,
 .ant-menu-submenu-title:active {
@@ -129,7 +129,7 @@
   color: #7a869a;
 }
 .ant-menu-item a:hover {
-  color: #2c6dd2;
+  color: #436bff;
 }
 .ant-menu-item a::before {
   position: absolute;
@@ -144,7 +144,7 @@
   color: #7a869a;
 }
 .ant-menu-item > .ant-badge a:hover {
-  color: #2c6dd2;
+  color: #436bff;
 }
 .ant-menu-item-divider {
   overflow: hidden;
@@ -166,11 +166,11 @@
   background-color: transparent;
 }
 .ant-menu-item-selected {
-  color: #2c6dd2;
+  color: #436bff;
 }
 .ant-menu-item-selected a,
 .ant-menu-item-selected a:hover {
-  color: #2c6dd2;
+  color: #436bff;
 }
 .ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
   background-color: rgba(255, 255, 255, 0.1);
@@ -266,10 +266,10 @@
 .ant-menu-submenu-title.ant-menu-item-only-child > .ant-menu-item-icon {
   margin-right: 0;
 }
-.ant-menu-item:focus-visible,
-.ant-menu-submenu-title:focus-visible {
-  -webkit-box-shadow: 0 0 0 2px #ccd3d9;
-          box-shadow: 0 0 0 2px #ccd3d9;
+.ant-menu-item:not(.ant-menu-item-disabled):focus-visible,
+.ant-menu-submenu-title:not(.ant-menu-item-disabled):focus-visible {
+  -webkit-box-shadow: 0 0 0 2px #e6eeff;
+          box-shadow: 0 0 0 2px #e6eeff;
 }
 .ant-menu > .ant-menu-item-divider {
   margin: 1px 0;
@@ -333,7 +333,7 @@
   position: absolute;
   width: 6px;
   height: 1.5px;
-  background-color: currentColor;
+  background-color: currentcolor;
   border-radius: 2px;
   -webkit-transition: background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), top 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
   transition: background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), top 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
@@ -351,7 +351,7 @@
 }
 .ant-menu-submenu:hover > .ant-menu-submenu-title > .ant-menu-submenu-expand-icon,
 .ant-menu-submenu:hover > .ant-menu-submenu-title > .ant-menu-submenu-arrow {
-  color: #2c6dd2;
+  color: #436bff;
 }
 .ant-menu-inline-collapsed .ant-menu-submenu-arrow::before,
 .ant-menu-submenu-inline .ant-menu-submenu-arrow::before {
@@ -381,7 +381,7 @@
 .ant-menu-vertical .ant-menu-submenu-selected,
 .ant-menu-vertical-left .ant-menu-submenu-selected,
 .ant-menu-vertical-right .ant-menu-submenu-selected {
-  color: #2c6dd2;
+  color: #436bff;
 }
 .ant-menu-horizontal {
   line-height: 46px;
@@ -404,7 +404,7 @@
 .ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu-open,
 .ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-item-selected,
 .ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu-selected {
-  color: #2c6dd2;
+  color: #436bff;
 }
 .ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-item:hover::after,
 .ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu:hover::after,
@@ -414,7 +414,7 @@
 .ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu-open::after,
 .ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-item-selected::after,
 .ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu-selected::after {
-  border-bottom: 2px solid #2c6dd2;
+  border-bottom: 2px solid #436bff;
 }
 .ant-menu-horizontal > .ant-menu-item,
 .ant-menu-horizontal > .ant-menu-submenu {
@@ -441,13 +441,13 @@
   color: #7a869a;
 }
 .ant-menu-horizontal > .ant-menu-item a:hover {
-  color: #2c6dd2;
+  color: #436bff;
 }
 .ant-menu-horizontal > .ant-menu-item a::before {
   bottom: -2px;
 }
 .ant-menu-horizontal > .ant-menu-item-selected a {
-  color: #2c6dd2;
+  color: #436bff;
 }
 .ant-menu-horizontal::after {
   display: block;
@@ -469,7 +469,7 @@
   top: 0;
   right: 0;
   bottom: 0;
-  border-right: 3px solid #2c6dd2;
+  border-right: 3px solid #436bff;
   -webkit-transform: scaleY(0.0001);
           transform: scaleY(0.0001);
   opacity: 0;
@@ -706,13 +706,22 @@
 .ant-menu-light .ant-menu:not(.ant-menu-inline) .ant-menu-submenu-open,
 .ant-menu-light .ant-menu-submenu-active,
 .ant-menu-light .ant-menu-submenu-title:hover {
-  color: #2c6dd2;
+  color: #436bff;
+}
+.ant-menu.ant-menu-root:focus-visible {
+  -webkit-box-shadow: 0 0 0 2px #2e4dd9;
+          box-shadow: 0 0 0 2px #2e4dd9;
+}
+.ant-menu-dark .ant-menu-item:focus-visible,
+.ant-menu-dark .ant-menu-submenu-title:focus-visible {
+  -webkit-box-shadow: 0 0 0 2px #2e4dd9;
+          box-shadow: 0 0 0 2px #2e4dd9;
 }
 .ant-menu.ant-menu-dark,
 .ant-menu-dark .ant-menu-sub,
 .ant-menu.ant-menu-dark .ant-menu-sub {
   color: #ffffff;
-  background: #2c6dd2;
+  background: #436bff;
 }
 .ant-menu.ant-menu-dark .ant-menu-submenu-title .ant-menu-submenu-arrow,
 .ant-menu-dark .ant-menu-sub .ant-menu-submenu-title .ant-menu-submenu-arrow,
@@ -743,7 +752,7 @@
   top: 0;
   margin-top: 0;
   padding: 0 20px;
-  border-color: #2c6dd2;
+  border-color: #436bff;
   border-bottom: 0;
 }
 .ant-menu-dark.ant-menu-horizontal > .ant-menu-item:hover {

package/es/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/es/components/Modal/style.css

@@ -23,7 +23,7 @@
   padding-bottom: 24px;
 }
 .ant-modal.ant-zoom-enter,
-.ant-modal.antzoom-appear {
+.ant-modal.ant-zoom-appear {
   -webkit-transform: none;
           transform: none;
   opacity: 0;
@@ -55,7 +55,6 @@
   left: 0;
   overflow: auto;
   outline: 0;
-  -webkit-overflow-scrolling: touch;
 }
 .ant-modal-wrap {
   z-index: 1200;
@@ -97,11 +96,11 @@
 }
 .ant-modal-close-x {
   display: block;
-  width: 56px;
-  height: 56px;
+  width: 54px;
+  height: 54px;
   font-size: 16px;
   font-style: normal;
-  line-height: 56px;
+  line-height: 54px;
   text-align: center;
   text-transform: none;
   text-rendering: auto;
@@ -151,6 +150,7 @@
 .ant-modal-centered .ant-modal {
   top: 0;
   display: inline-block;
+  padding-bottom: 0;
   text-align: left;
   vertical-align: middle;
 }
@@ -202,8 +202,8 @@
   margin-left: 38px;
 }
 .ant-modal-confirm .ant-modal-confirm-btns {
-  float: right;
   margin-top: 24px;
+  text-align: right;
 }
 .ant-modal-confirm .ant-modal-confirm-btns .ant-btn + .ant-btn {
   margin-bottom: 0;
@@ -217,11 +217,14 @@
   color: #f0a818;
 }
 .ant-modal-confirm-info .ant-modal-confirm-body > .anticon {
-  color: #7a869a;
+  color: #436bff;
 }
 .ant-modal-confirm-success .ant-modal-confirm-body > .anticon {
   color: #20c997;
 }
+.ant-modal-confirm .ant-zoom-leave .ant-modal-confirm-btns {
+  pointer-events: none;
+}
 .ant-modal-wrap-rtl {
   direction: rtl;
 }
@@ -249,7 +252,7 @@
   margin-left: 0;
 }
 .ant-modal-wrap-rtl .ant-modal-confirm-btns {
-  float: left;
+  text-align: left;
 }
 .ant-modal-wrap-rtl .ant-modal-confirm-btns .ant-btn + .ant-btn {
   margin-right: 8px;

package/es/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/es/components/NameExplainTooltip/style.css

@@ -5,5 +5,5 @@
 }
 .pandora-sdk-name-explain-icon:hover,
 .pandora-sdk-name-explain-icon .ant-tooltip-open {
-  color: #2c6dd2;
+  color: #436bff;
 }

package/es/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/es/components/NameLimiter/index.js

@@ -29,6 +29,6 @@ export default function NameLimiter(_a) {
         }
         setEllipsis(ref.current.clientWidth < ref.current.scrollWidth);
     });
-    return (React.createElement(Tooltip, { getPopupContainer: getPopupContainer, overlayClassName: SDK_PREFIX + "-name-limit-tooltip", placement: placement || 'top', title: title || name, visible: (!!title || ellipsis) && visible, onVisibleChange: setVisible },
+    return (React.createElement(Tooltip, { getPopupContainer: getPopupContainer, overlayClassName: SDK_PREFIX + "-name-limit-tooltip", placement: placement || 'top', title: title || name, open: (!!title || ellipsis) && visible, onOpenChange: setVisible },
         React.createElement("span", { className: SDK_PREFIX + "-name-limit", ref: ref }, name)));
 }