@para-ui/core 4.0.0-rc.3 → 4.0.0-rc.5

package/Notification/index.js

@@ -1,45 +1,45 @@
-import { _ as _defineProperty } from '../_verture/defineProperty-1d116156.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import React__default from 'react';
 import Notification from 'rc-notification';
 import WarningCircleF from '@para-ui/icons/WarningCircleF';
-import CompleteIcon from '@para-ui/icons/CheckCircleF';
+import SuccessOutlined from '@para-ui/icons/CheckCircleF';
 import CloseIcon from '@para-ui/icons/Close';
 import CloseCircleF from '@para-ui/icons/CloseCircleF';
 import clsx from 'clsx';
-import { $ as $prefixCls } from '../_verture/constant-0d9802f7.js';
+import { $ as $prefixCls } from '../_verture/constant-5317fc89.js';
 import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
-import '../_verture/typeof-adeedc13.js';
 
-var css_248z = "@charset \"UTF-8\";\n/**\n * @author Hanz\n * @date 2022/1/13 上午10:30\n * @description 通知提醒框\n */\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-notification {\n  position: fixed;\n  padding: 0;\n  color: rgb(29, 33, 38);\n  font-size: 14px;\n  z-index: 9999;\n}\n.paraui-v4-notification-topLeft .paraui-v4-notification-fade-enter.paraui-v4-notification-fade-enter-active, .paraui-v4-notification-bottomLeft .paraui-v4-notification-fade-enter.paraui-v4-notification-fade-enter-active, .paraui-v4-notification-topLeft .paraui-v4-notification-fade-appear.paraui-v4-notification-fade-appear-active, .paraui-v4-notification-bottomLeft .paraui-v4-notification-fade-appear.paraui-v4-notification-fade-appear-active {\n  animation-name: NotificationLeftFadeIn;\n}\n.paraui-v4-notification-hook-holder, .paraui-v4-notification-notice {\n  position: relative;\n  width: 440px;\n  max-width: calc(100vw - 48px);\n  margin-top: 20px;\n  margin-left: auto;\n  overflow: hidden;\n  word-wrap: break-word;\n  background: #fff;\n  border-radius: 4px;\n  box-shadow: 0px 2px 8px 0px rgba(212, 218, 227, 0.4);\n}\n.paraui-v4-notification-hook-holder:first-child, .paraui-v4-notification-notice:first-child {\n  margin-top: 0;\n}\n.paraui-v4-notification-topLeft .paraui-v4-notification-hook-holder, .paraui-v4-notification-topLeft .paraui-v4-notification-notice, .paraui-v4-notification-bottomLeft .paraui-v4-notification-hook-holder, .paraui-v4-notification-bottomLeft .paraui-v4-notification-notice {\n  margin-right: auto;\n  margin-left: 0;\n}\n.paraui-v4-notification-hook-holder > .paraui-v4-notification-notice {\n  margin-bottom: 0;\n  box-shadow: none;\n}\n.paraui-v4-notification-notice {\n  padding: 16px;\n  line-height: 1.5715;\n}\n.paraui-v4-notification-notice-content {\n  position: relative;\n}\n.paraui-v4-notification-notice-message {\n  margin-bottom: 10px;\n  color: rgb(29, 33, 38);\n  font-size: 14px;\n  font-weight: 700;\n  line-height: 20px;\n}\n.paraui-v4-notification-notice-message-single-line-auto-margin {\n  display: block;\n  width: calc(264px - 100%);\n  max-width: 4px;\n  background-color: transparent;\n  pointer-events: none;\n}\n.paraui-v4-notification-notice-message-single-line-auto-margin::before {\n  display: block;\n  content: \"\";\n}\n.paraui-v4-notification-notice-description {\n  font-size: 14px;\n  font-weight: 400;\n  line-height: 20px;\n}\n.paraui-v4-notification-notice-closable .paraui-v4-notification-notice-message {\n  padding-right: 24px;\n}\n.paraui-v4-notification-notice-with-icon .paraui-v4-notification-notice-message {\n  margin-bottom: 8px;\n  margin-left: 24px;\n}\n.paraui-v4-notification-notice-with-icon .paraui-v4-notification-notice-description {\n  margin-left: 24px;\n}\n.paraui-v4-notification-notice-without-description .paraui-v4-notification-notice-message {\n  margin-bottom: 0;\n}\n.paraui-v4-notification .paraui-v4-notification-notice-icon {\n  position: absolute;\n  top: 0px;\n  font-size: 18px;\n  line-height: 24px;\n}\n.paraui-v4-notification .paraui-v4-notification-notice-icon-success {\n  color: rgb(19, 191, 76);\n}\n.paraui-v4-notification .paraui-v4-notification-notice-icon-info {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-notification .paraui-v4-notification-notice-icon-warning {\n  color: rgb(255, 147, 38);\n}\n.paraui-v4-notification .paraui-v4-notification-notice-icon-error {\n  color: rgb(244, 66, 66);\n}\n.paraui-v4-notification-notice-close {\n  position: absolute;\n  top: 16px;\n  right: 16px;\n  color: rgb(92, 101, 115);\n  outline: none;\n}\n.paraui-v4-notification-notice-close:hover {\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-notification .paraui-v4-notification-close-icon {\n  font-size: 18px;\n  cursor: pointer;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-notification .paraui-v4-notification-close-icon:hover {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-notification-notice-btn {\n  float: right;\n  margin-top: 12px;\n}\n.paraui-v4-notification .notification-fade-effect {\n  animation-duration: 0.24s;\n  animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);\n  animation-fill-mode: both;\n}\n.paraui-v4-notification-fade-enter, .paraui-v4-notification-fade-appear {\n  animation-duration: 0.24s;\n  animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);\n  animation-fill-mode: both;\n  opacity: 0;\n  animation-play-state: paused;\n}\n.paraui-v4-notification-fade-leave {\n  animation-duration: 0.24s;\n  animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);\n  animation-fill-mode: both;\n  animation-play-state: paused;\n}\n.paraui-v4-notification-fade-enter.paraui-v4-notification-fade-enter-active, .paraui-v4-notification-fade-appear.paraui-v4-notification-fade-appear-active {\n  animation-name: NotificationFadeIn;\n  animation-play-state: running;\n}\n.paraui-v4-notification-fade-leave.paraui-v4-notification-fade-leave-active {\n  animation-name: NotificationFadeOut;\n  animation-play-state: running;\n}\n@keyframes NotificationFadeIn {\n  0% {\n    left: 440px;\n    opacity: 0;\n  }\n  100% {\n    left: 0;\n    opacity: 1;\n  }\n}\n@keyframes NotificationLeftFadeIn {\n  0% {\n    right: 440px;\n    opacity: 0;\n  }\n  100% {\n    right: 0;\n    opacity: 1;\n  }\n}\n@keyframes NotificationFadeOut {\n  0% {\n    max-height: 150px;\n    margin-bottom: 16px;\n    opacity: 1;\n  }\n  100% {\n    max-height: 0;\n    margin-bottom: 0;\n    padding-top: 0;\n    padding-bottom: 0;\n    opacity: 0;\n  }\n}";
+var css_248z = "@charset \"UTF-8\";\n/**\n * @author Hanz\n * @date 2022/1/13 上午10:30\n * @description 通知提醒框\n */\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-notification {\n  position: fixed;\n  padding: 0;\n  color: rgb(29, 33, 38);\n  font-size: 14px;\n  z-index: 9999;\n}\n.paraui-v4-notification-topLeft .paraui-v4-notification-fade-enter.paraui-v4-notification-fade-enter-active, .paraui-v4-notification-bottomLeft .paraui-v4-notification-fade-enter.paraui-v4-notification-fade-enter-active, .paraui-v4-notification-topLeft .paraui-v4-notification-fade-appear.paraui-v4-notification-fade-appear-active, .paraui-v4-notification-bottomLeft .paraui-v4-notification-fade-appear.paraui-v4-notification-fade-appear-active {\n  animation-name: NotificationLeftFadeIn;\n}\n.paraui-v4-notification-hook-holder, .paraui-v4-notification-notice {\n  position: relative;\n  width: 440px;\n  max-width: calc(100vw - 48px);\n  margin-top: 20px;\n  margin-left: auto;\n  overflow: hidden;\n  word-wrap: break-word;\n  background: #fff;\n  border-radius: 4px;\n  box-shadow: 0px 2px 8px 0px rgba(212, 218, 227, 0.4);\n  border: 1px solid rgba(212, 218, 227, 0.4);\n}\n.paraui-v4-notification-hook-holder:first-child, .paraui-v4-notification-notice:first-child {\n  margin-top: 0;\n}\n.paraui-v4-notification-topLeft .paraui-v4-notification-hook-holder, .paraui-v4-notification-topLeft .paraui-v4-notification-notice, .paraui-v4-notification-bottomLeft .paraui-v4-notification-hook-holder, .paraui-v4-notification-bottomLeft .paraui-v4-notification-notice {\n  margin-right: auto;\n  margin-left: 0;\n}\n.paraui-v4-notification-hook-holder > .paraui-v4-notification-notice {\n  margin-bottom: 0;\n  box-shadow: none;\n}\n.paraui-v4-notification-notice {\n  padding: 16px;\n  line-height: 1.5715;\n}\n.paraui-v4-notification-notice-content {\n  position: relative;\n}\n.paraui-v4-notification-notice-message {\n  margin-bottom: 10px;\n  color: rgb(29, 33, 38);\n  font-size: 14px;\n  font-weight: 700;\n  line-height: 20px;\n}\n.paraui-v4-notification-notice-message-single-line-auto-margin {\n  display: block;\n  width: calc(264px - 100%);\n  max-width: 4px;\n  background-color: transparent;\n  pointer-events: none;\n}\n.paraui-v4-notification-notice-message-single-line-auto-margin::before {\n  display: block;\n  content: \"\";\n}\n.paraui-v4-notification-notice-description {\n  font-size: 14px;\n  font-weight: 400;\n  line-height: 20px;\n}\n.paraui-v4-notification-notice-closable .paraui-v4-notification-notice-message {\n  padding-right: 24px;\n}\n.paraui-v4-notification-notice-with-icon .paraui-v4-notification-notice-message {\n  margin-bottom: 8px;\n  margin-left: 24px;\n}\n.paraui-v4-notification-notice-with-icon .paraui-v4-notification-notice-description {\n  margin-left: 24px;\n}\n.paraui-v4-notification-notice-without-description .paraui-v4-notification-notice-message {\n  margin-bottom: 0;\n}\n.paraui-v4-notification .paraui-v4-notification-notice-icon {\n  position: absolute;\n  top: 0px;\n  font-size: 18px;\n  line-height: 24px;\n}\n.paraui-v4-notification .paraui-v4-notification-notice-icon-success {\n  color: rgb(19, 191, 76);\n}\n.paraui-v4-notification .paraui-v4-notification-notice-icon-info {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-notification .paraui-v4-notification-notice-icon-warning {\n  color: rgb(255, 147, 38);\n}\n.paraui-v4-notification .paraui-v4-notification-notice-icon-error {\n  color: rgb(244, 66, 66);\n}\n.paraui-v4-notification-notice-close {\n  position: absolute;\n  top: 16px;\n  right: 16px;\n  color: rgb(92, 101, 115);\n  outline: none;\n}\n.paraui-v4-notification-notice-close:hover {\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-notification .paraui-v4-notification-close-icon {\n  font-size: 18px;\n  cursor: pointer;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-notification .paraui-v4-notification-close-icon:hover {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-notification-notice-btn {\n  float: right;\n  margin-top: 12px;\n}\n.paraui-v4-notification .notification-fade-effect {\n  animation-duration: 0.24s;\n  animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);\n  animation-fill-mode: both;\n}\n.paraui-v4-notification-fade-enter, .paraui-v4-notification-fade-appear {\n  animation-duration: 0.24s;\n  animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);\n  animation-fill-mode: both;\n  opacity: 0;\n  animation-play-state: paused;\n}\n.paraui-v4-notification-fade-leave {\n  animation-duration: 0.24s;\n  animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);\n  animation-fill-mode: both;\n  animation-play-state: paused;\n}\n.paraui-v4-notification-fade-enter.paraui-v4-notification-fade-enter-active, .paraui-v4-notification-fade-appear.paraui-v4-notification-fade-appear-active {\n  animation-name: NotificationFadeIn;\n  animation-play-state: running;\n}\n.paraui-v4-notification-fade-leave.paraui-v4-notification-fade-leave-active {\n  animation-name: NotificationFadeOut;\n  animation-play-state: running;\n}\n@keyframes NotificationFadeIn {\n  0% {\n    left: 440px;\n    opacity: 0;\n  }\n  100% {\n    left: 0;\n    opacity: 1;\n  }\n}\n@keyframes NotificationLeftFadeIn {\n  0% {\n    right: 440px;\n    opacity: 0;\n  }\n  100% {\n    right: 0;\n    opacity: 1;\n  }\n}\n@keyframes NotificationFadeOut {\n  0% {\n    max-height: 150px;\n    margin-bottom: 16px;\n    opacity: 1;\n  }\n  100% {\n    max-height: 0;\n    margin-bottom: 0;\n    padding-top: 0;\n    padding-bottom: 0;\n    opacity: 0;\n  }\n}";
 styleInject(css_248z);
 
 //通知框实例存储
-var notificationInstance = {};
+const notificationInstance = {};
 // 默认值
-var defaultDuration = 5; //默认 5 秒后自动关闭，配置为 null 则不自动关闭
-var defaultTop = 20;
-var defaultBottom = 20;
-var defaultLeft = 20;
-var defaultRight = 20;
-var defaultPlacement = 'topRight';
-var defaultGetContainer;
-var prefixCls = "".concat($prefixCls, "-notification");
-var defaultCloseIcon = jsx(CloseIcon, {
+let defaultDuration = 5; //默认 5 秒后自动关闭，配置为 null 则不自动关闭
+let defaultTop = 20;
+let defaultBottom = 20;
+let defaultLeft = 20;
+let defaultRight = 20;
+let defaultPlacement = 'topRight';
+let defaultGetContainer;
+const prefixCls = "".concat($prefixCls, "-notification");
+let defaultCloseIcon = jsx(CloseIcon, {
   className: "".concat(prefixCls, "-close-icon")
 });
-var rtl = false;
-var maxCount;
+const rtl = false;
+let maxCount;
 //设置全局配置
 function setNotificationConfig(options) {
-  var duration = options.duration,
-    placement = options.placement,
-    bottom = options.bottom,
-    top = options.top,
-    left = options.left,
-    right = options.right,
-    getContainer = options.getContainer,
-    closeIcon = options.closeIcon;
+  const {
+    duration,
+    placement,
+    bottom,
+    top,
+    left,
+    right,
+    getContainer,
+    closeIcon
+  } = options;
   if (duration !== undefined) {
     defaultDuration = duration;
   }
@@ -70,38 +70,38 @@ function setNotificationConfig(options) {
 }
 //获得位置样式
 function getPlacementStyle(placement) {
-  var top = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultTop;
-  var bottom = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : defaultBottom;
-  var left = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : defaultLeft;
-  var right = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : defaultRight;
-  var style;
+  let top = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultTop;
+  let bottom = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : defaultBottom;
+  let left = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : defaultLeft;
+  let right = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : defaultRight;
+  let style;
   switch (placement) {
     case 'topLeft':
       style = {
-        left: left,
-        top: top,
+        left,
+        top,
         bottom: 'auto'
       };
       break;
     case 'topRight':
       style = {
-        right: right,
-        top: top,
+        right,
+        top,
         bottom: 'auto'
       };
       break;
     case 'bottomLeft':
       style = {
-        left: left,
+        left,
         top: 'auto',
-        bottom: bottom
+        bottom
       };
       break;
     default:
       style = {
-        right: right,
+        right,
         top: 'auto',
-        bottom: bottom
+        bottom
       };
       break;
   }
@@ -109,30 +109,29 @@ function getPlacementStyle(placement) {
 }
 //创建通知框实例
 function getNotificationInstance(args, callback) {
-  var _args$placement = args.placement,
-    placement = _args$placement === void 0 ? defaultPlacement : _args$placement,
-    top = args.top,
-    bottom = args.bottom,
-    left = args.left,
-    right = args.right,
-    _args$getContainer = args.getContainer,
-    getContainer = _args$getContainer === void 0 ? defaultGetContainer : _args$getContainer,
-    _args$closeIcon = args.closeIcon,
-    closeIcon = _args$closeIcon === void 0 ? defaultCloseIcon : _args$closeIcon;
-  var prefixCls = "".concat($prefixCls, "-notification");
-  var cacheKey = "".concat(prefixCls, "-").concat(placement);
-  var cacheInstance = notificationInstance[cacheKey];
+  const {
+    placement = defaultPlacement,
+    top,
+    bottom,
+    left,
+    right,
+    getContainer = defaultGetContainer,
+    closeIcon = defaultCloseIcon
+  } = args;
+  const prefixCls = "".concat($prefixCls, "-notification");
+  const cacheKey = "".concat(prefixCls, "-").concat(placement);
+  const cacheInstance = notificationInstance[cacheKey];
   if (cacheInstance) {
-    Promise.resolve(cacheInstance).then(function (instance) {
+    Promise.resolve(cacheInstance).then(instance => {
       callback({
         prefixCls: "".concat(prefixCls, "-notice"),
-        instance: instance
+        instance
       });
     });
     return;
   }
   //close icon
-  var closeIconToRender = jsx("span", Object.assign({
+  const closeIconToRender = jsx("span", Object.assign({
     className: "".concat(prefixCls, "-close-x")
   }, {
     children: closeIcon || jsx(CloseIcon, {
@@ -140,16 +139,18 @@ function getNotificationInstance(args, callback) {
     })
   }));
   //通知框cls
-  var notificationCls = clsx("".concat(prefixCls, "-").concat(placement), _defineProperty({}, "".concat(prefixCls, "-rtl"), rtl === true));
-  notificationInstance[cacheKey] = new Promise(function (resolve) {
+  const notificationCls = clsx("".concat(prefixCls, "-").concat(placement), {
+    ["".concat(prefixCls, "-rtl")]: rtl === true
+  });
+  notificationInstance[cacheKey] = new Promise(resolve => {
     Notification.newInstance({
-      prefixCls: prefixCls,
+      prefixCls,
       className: notificationCls,
       style: getPlacementStyle(placement, top, bottom, left, right),
-      getContainer: getContainer,
+      getContainer,
       closeIcon: closeIconToRender,
-      maxCount: maxCount
-    }, function (notification) {
+      maxCount
+    }, notification => {
       resolve(notification);
       callback({
         prefixCls: "".concat(prefixCls, "-notice"),
@@ -159,29 +160,30 @@ function getNotificationInstance(args, callback) {
   });
 }
 //通知框类型图标
-var typeToIcon = {
-  success: CompleteIcon,
+const typeToIcon = {
+  success: SuccessOutlined,
   info: WarningCircleF,
   error: CloseCircleF,
   warning: WarningCircleF
 };
 //创建通知框内容配置
 function getNoticeProps(args, prefixCls) {
-  var durationArg = args.duration,
-    icon = args.icon,
-    type = args.type,
-    description = args.description,
-    message = args.message,
-    btn = args.btn,
-    onClose = args.onClose,
-    onClick = args.onClick,
-    key = args.key,
-    style = args.style,
-    className = args.className,
-    _args$closeIcon2 = args.closeIcon,
-    closeIcon = _args$closeIcon2 === void 0 ? defaultCloseIcon : _args$closeIcon2;
-  var duration = durationArg === undefined ? defaultDuration : durationArg;
-  var iconNode = null;
+  const {
+    duration: durationArg,
+    icon,
+    type,
+    description,
+    message,
+    btn,
+    onClose,
+    onClick,
+    key,
+    style,
+    className,
+    closeIcon = defaultCloseIcon
+  } = args;
+  const duration = durationArg === undefined ? defaultDuration : durationArg;
+  let iconNode = null;
   if (icon) {
     iconNode = jsx("span", Object.assign({
       className: "".concat(prefixCls, "-icon")
@@ -193,7 +195,7 @@ function getNoticeProps(args, prefixCls) {
       className: "".concat(prefixCls, "-icon ").concat(prefixCls, "-icon-").concat(type)
     });
   }
-  var autoMarginTag = !description && iconNode ? jsx("span", {
+  const autoMarginTag = !description && iconNode ? jsx("span", {
     className: "".concat(prefixCls, "-message-single-line-auto-margin")
   }) : null;
   return {
@@ -214,38 +216,40 @@ function getNoticeProps(args, prefixCls) {
         children: btn
       })) : null]
     })),
-    duration: duration,
+    duration,
     closable: true,
-    onClose: onClose,
-    onClick: onClick,
-    key: key,
+    onClose,
+    onClick,
+    key,
     style: style || {},
-    className: clsx(className, _defineProperty({}, "".concat(prefixCls, "-").concat(type), !!type)),
-    closeIcon: closeIcon
+    className: clsx(className, {
+      ["".concat(prefixCls, "-").concat(type)]: !!type
+    }),
+    closeIcon
   };
 }
 //通知框调用方法
 function notice(args) {
-  getNotificationInstance(args, function (_ref) {
-    var prefixCls = _ref.prefixCls,
-      instance = _ref.instance;
+  getNotificationInstance(args, _ref => {
+    let {
+      prefixCls,
+      instance
+    } = _ref;
     instance.notice(getNoticeProps(args, prefixCls));
   });
 }
 //通知框api method
-var api = {
+const api = {
   open: notice,
-  close: function close(key) {
-    Object.keys(notificationInstance).forEach(function (cacheKey) {
-      return Promise.resolve(notificationInstance[cacheKey]).then(function (instance) {
-        instance.removeNotice(key);
-      });
-    });
+  close(key) {
+    Object.keys(notificationInstance).forEach(cacheKey => Promise.resolve(notificationInstance[cacheKey]).then(instance => {
+      instance.removeNotice(key);
+    }));
   },
   config: setNotificationConfig,
-  destroy: function destroy() {
-    Object.keys(notificationInstance).forEach(function (cacheKey) {
-      Promise.resolve(notificationInstance[cacheKey]).then(function (instance) {
+  destroy() {
+    Object.keys(notificationInstance).forEach(cacheKey => {
+      Promise.resolve(notificationInstance[cacheKey]).then(instance => {
         instance.destroy();
       });
       delete notificationInstance[cacheKey];
@@ -253,12 +257,10 @@ var api = {
   }
 };
 //通知框预设类型 'success', 'info', 'warning', 'error'
-['success', 'info', 'warning', 'error'].forEach(function (type) {
-  api[type] = function (args) {
-    return api.open(Object.assign(Object.assign({}, args), {
-      type: type
-    }));
-  };
+['success', 'info', 'warning', 'error'].forEach(type => {
+  api[type] = args => api.open(Object.assign(Object.assign({}, args), {
+    type
+  }));
 });
 //兼容warn、warning
 api.warn = api.warning;

package/OperateBtn/index.d.ts

@@ -4,6 +4,7 @@
  * @description 表格操作按钮
  */
 import React, { FunctionComponent } from 'react';
+import { PopConfirmProps } from '../PopConfirm';
 import './index.scss';
 /** 按钮配置 */
 export interface OperateBtnListProps {
@@ -27,6 +28,8 @@ export interface OperateBtnListProps {
     danger?: boolean;
     /** 点击事件 */
     onClick?: (item: OperateBtnListProps, e: any) => void | Promise<boolean | any>;
+    /** 气泡确认框参数 */
+    popConfirmProps?: PopConfirmProps;
     [name: string]: any;
 }
 export interface OperateBtnProps {

package/OperateBtn/index.js

@@ -1,5 +1,3 @@
-import { _ as _slicedToArray } from '../_verture/slicedToArray-a8206399.js';
-import { r as regenerator } from '../_verture/index-232d890b.js';
 import { a as __awaiter } from '../_verture/tslib.es6-55ed4bd2.js';
 import { jsxs, jsx, Fragment as Fragment$1 } from 'react/jsx-runtime';
 import { useState, Fragment } from 'react';
@@ -7,25 +5,27 @@ import More from '@para-ui/icons/More';
 import { Button } from '../Button/index.js';
 import { Tooltip } from '../Tooltip/index.js';
 import { Popover } from '../Popover/index.js';
+import { PopConfirm } from '../PopConfirm/index.js';
 import AutoTips from '../AutoTips/index.js';
-import { $ as $prefixCls } from '../_verture/constant-0d9802f7.js';
-import { u as useFormatMessage } from '../_verture/useFormatMessage-703f8b20.js';
+import { $ as $prefixCls } from '../_verture/constant-5317fc89.js';
+import { u as useFormatMessage } from '../_verture/useFormatMessage-eb13cf56.js';
 import clsx from 'clsx';
 import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
-import '../_verture/unsupportedIterableToArray-cb478f24.js';
-import '../_verture/typeof-c310ee4a.js';
-import '../_verture/typeof-adeedc13.js';
 import '@para-ui/icons/LoadingF';
 import '@para-ui/icons/Down';
-import '../_verture/index-e9007d6a.js';
+import '../_verture/index-da9097d3.js';
 import 'rc-dropdown';
-import '../_verture/usePopupContainer-87febeb9.js';
+import '../_verture/usePopupContainer-635f66f4.js';
 import 'dayjs';
 import '@paraview/lib';
 import 'rc-tooltip';
 import 'rc-tooltip/lib/placements';
 import '@para-ui/icons/Forbid';
 import '@para-ui/core/GlobalContext';
+import '@para-ui/icons/CheckCircleF';
+import '@para-ui/icons/WarningCircle';
+import '@para-ui/icons/CloseCircleF';
+import '@para-ui/icons/WarningCircleF';
 
 var en = {
   more: 'more'
@@ -36,103 +36,64 @@ var zh = {
 };
 
 var localeJson = {
-  zh: zh,
-  en: en
+  zh,
+  en
 };
 
 var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2022/4/13 10:48 AM\n* @description 表格操作按钮\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-operate-btn {\n  font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n  font-size: 14px;\n  font-weight: 400;\n  display: flex;\n  align-items: center;\n}\n.paraui-v4-operate-btn > .operate-btn-line {\n  display: inline-block;\n  width: 1px;\n  background-color: rgb(213, 224, 250);\n  margin: 0 10px;\n}\n.paraui-v4-operate-btn.paraui-v4-operate-btn-small > .operate-btn-line {\n  height: 12px;\n}\n.paraui-v4-operate-btn.paraui-v4-operate-btn-small button svg {\n  font-size: 18px;\n}\n.paraui-v4-operate-btn.paraui-v4-operate-btn-medium > .operate-btn-line {\n  height: 12px;\n}\n.paraui-v4-operate-btn.paraui-v4-operate-btn-medium button svg {\n  font-size: 18px;\n}\n.paraui-v4-operate-btn.paraui-v4-operate-btn-large > .operate-btn-line {\n  height: 12px;\n}\n.paraui-v4-operate-btn.paraui-v4-operate-btn-large button svg {\n  font-size: 18px;\n}\n\n.paraui-v4-operate-btn-popover .operate-btn-list {\n  padding: 4px 0;\n}\n.paraui-v4-operate-btn-popover .operate-btn-list > .operate-btn-list-item {\n  padding: 0 10px;\n  max-width: 120px;\n  cursor: pointer;\n  color: rgb(29, 33, 38);\n  line-height: 30px;\n  text-align: left;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.paraui-v4-operate-btn-popover .operate-btn-list > .operate-btn-list-item:hover {\n  background-color: rgb(247, 248, 250);\n}\n.paraui-v4-operate-btn-popover .operate-btn-list > .operate-btn-list-item-disabled {\n  cursor: not-allowed;\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-operate-btn-popover .operate-btn-list > .operate-btn-list-item-disabled:hover {\n  background-color: white;\n}\n.paraui-v4-operate-btn-popover .operate-btn-list > .operate-btn-list-item-danger {\n  color: rgb(244, 66, 66);\n}";
 styleInject(css_248z);
 
-var OperateBtn = function OperateBtn(props) {
-  var _props$className = props.className,
-    className = _props$className === void 0 ? '' : _props$className,
-    style = props.style,
-    _props$size = props.size,
-    size = _props$size === void 0 ? 'small' : _props$size,
-    list = props.list,
-    _props$showNum = props.showNum,
-    showNum = _props$showNum === void 0 ? 3 : _props$showNum,
-    popoverClassName = props.popoverClassName,
-    _props$placement = props.placement,
-    placement = _props$placement === void 0 ? 'bottom-end' : _props$placement,
-    _props$clickCloseMore = props.clickCloseMore,
-    clickCloseMore = _props$clickCloseMore === void 0 ? true : _props$clickCloseMore,
-    onClick = props.onClick,
-    loadingMapping = props.loadingMapping,
-    _props$key = props.key,
-    key = _props$key === void 0 ? 'key' : _props$key;
+const OperateBtn = props => {
+  const {
+    className = '',
+    style,
+    size = 'small',
+    list,
+    showNum = 3,
+    popoverClassName,
+    placement = 'bottom-end',
+    clickCloseMore = true,
+    onClick,
+    loadingMapping,
+    key = 'key'
+  } = props;
   useFormatMessage('OperateBtn', localeJson);
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    openMoreCom = _useState2[0],
-    setOpenMoreCom = _useState2[1]; // 显示更多
-  var _useState3 = useState({}),
-    _useState4 = _slicedToArray(_useState3, 2),
-    loadingInside = _useState4[0],
-    setLoadingInside = _useState4[1]; // 内部loading
+  const [openMoreCom, setOpenMoreCom] = useState(false); // 显示更多
+  const [loadingInside, setLoadingInside] = useState({}); // 内部loading
   // 点击选项
-  var clickItem = function clickItem(item, index) {
-    return function (e) {
-      return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee() {
-        var handKey, loading, result;
-        return regenerator.wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              if (!(item.disabled || handLoadStatus(item, index))) {
-                _context.next = 2;
-                break;
-              }
-              return _context.abrupt("return");
-            case 2:
-              if (clickCloseMore) closeMore();
-              handKey = item[key];
-              loading = loadingMapping && loadingMapping[handKey]; // 不存在外部loading
-              if (loading === undefined) {
-                loadingInside[index] = true;
-                setLoadingInside(Object.assign({}, loadingInside));
-              }
-              if (!item.onClick) {
-                _context.next = 12;
-                break;
-              }
-              _context.next = 9;
-              return item.onClick(item, e);
-            case 9:
-              result = _context.sent;
-              _context.next = 16;
-              break;
-            case 12:
-              if (!onClick) {
-                _context.next = 16;
-                break;
-              }
-              _context.next = 15;
-              return onClick(item, e);
-            case 15:
-              result = _context.sent;
-            case 16:
-              // 不存在外部loading
-              if (loading === undefined) {
-                loadingInside[index] = result;
-                setLoadingInside(Object.assign({}, loadingInside));
-              }
-            case 17:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee);
-      }));
-    };
-  };
+  const clickItem = (item, index) => e => __awaiter(void 0, void 0, void 0, function* () {
+    if (item.disabled || handLoadStatus(item, index)) return;
+    if (clickCloseMore) closeMore();
+    const handKey = item[key];
+    const loading = loadingMapping && loadingMapping[handKey];
+    // 不存在外部loading
+    if (loading === undefined) {
+      loadingInside[index] = true;
+      setLoadingInside(Object.assign({}, loadingInside));
+    }
+    let result;
+    if (item.onClick) {
+      result = yield item.onClick(item, e);
+    } else {
+      if (onClick) {
+        result = yield onClick(item, e);
+      }
+    }
+    // 不存在外部loading
+    if (loading === undefined) {
+      loadingInside[index] = result;
+      setLoadingInside(Object.assign({}, loadingInside));
+    }
+  });
   // 关闭显示更多
-  var closeMore = function closeMore(bol) {
+  const closeMore = bol => {
     //if (bol) return;
     setOpenMoreCom(Boolean(bol));
   };
   // 处理loading
-  var handLoadStatus = function handLoadStatus(item, index) {
-    var loading;
-    var handKey = item[key];
+  const handLoadStatus = (item, index) => {
+    let loading;
+    const handKey = item[key];
     loading = loadingMapping && loadingMapping[handKey];
     // 外部没有传laoding
     if (loading === undefined) {
@@ -141,20 +102,29 @@ var OperateBtn = function OperateBtn(props) {
     return loading;
   };
   // 处理handClassPopover
-  var handClassPopover = function handClassPopover() {
-    var str = "".concat($prefixCls, "-operate-btn-popover");
+  const handClassPopover = () => {
+    let str = "".concat($prefixCls, "-operate-btn-popover");
     if (popoverClassName) str += " ".concat(popoverClassName);
     return str;
   };
-  var morePopoverContent = function morePopoverContent() {
-    var arr = (list === null || list === void 0 ? void 0 : list.slice(showNum, list === null || list === void 0 ? void 0 : list.length)) || [];
-    var handPopoverClass = function handPopoverClass(item) {
+  // 处理PopConfirm内容
+  const handlePopConfirm = (item, children) => {
+    if (item.popConfirmProps) {
+      return jsx(PopConfirm, Object.assign({}, item.popConfirmProps, {
+        children: children
+      }));
+    }
+    return children;
+  };
+  const morePopoverContent = () => {
+    const arr = (list === null || list === void 0 ? void 0 : list.slice(showNum, list === null || list === void 0 ? void 0 : list.length)) || [];
+    const handPopoverClass = item => {
       return clsx('operate-btn-list-item', item.className, {
         'operate-btn-list-item-disabled': item.disabled,
         'operate-btn-list-item-danger': item.danger
       });
     };
-    var handleBox = function handleBox(item, children, index) {
+    const handleBox = (item, children, index) => {
       return jsx("div", Object.assign({
         className: handPopoverClass(item),
         onClick: clickItem(item, index + showNum),
@@ -166,7 +136,7 @@ var OperateBtn = function OperateBtn(props) {
     return jsx("div", Object.assign({
       className: "operate-btn-list"
     }, {
-      children: arr.map(function (item, index) {
+      children: arr.map((item, index) => {
         if (item.disabled) {
           return jsx(Tooltip, Object.assign({
             disabled: true,
@@ -175,16 +145,16 @@ var OperateBtn = function OperateBtn(props) {
             children: handleBox(item, item.label || item.toolTipTitle, index)
           }), index);
         }
-        return handleBox(item, jsx(AutoTips, Object.assign({
+        return handlePopConfirm(item, handleBox(item, jsx(AutoTips, Object.assign({
           tipMaxWidth: 'none'
         }, {
           children: item.label || item.toolTipTitle
-        })), index);
+        })), index));
       })
     }));
   };
   // 更多按钮
-  var moreRender = function moreRender() {
+  const moreRender = () => {
     return jsx(Fragment$1, {
       children: list && list.length > showNum + 1 && jsx(Popover, Object.assign({
         placement: "bottom-end",
@@ -213,8 +183,8 @@ var OperateBtn = function OperateBtn(props) {
     className: clsx("".concat($prefixCls, "-operate-btn"), className, "".concat($prefixCls, "-operate-btn-").concat(size)),
     style: style
   }, {
-    children: [list === null || list === void 0 ? void 0 : list.map(function (item, index) {
-      var bol = true;
+    children: [list === null || list === void 0 ? void 0 : list.map((item, index) => {
+      let bol = true;
       // 满足这个条件,有更多按钮
       if (list.length > showNum + 1) {
         // 超出显示个数不显示
@@ -243,7 +213,7 @@ var OperateBtn = function OperateBtn(props) {
           danger: item.danger,
           onClick: clickItem(item, index)
         }, {
-          children: item.icon
+          children: handlePopConfirm(item, item.icon)
         })), bol && jsx("span", {
           className: 'operate-btn-line'
         })]