@hi-ui/pop-confirm 4.2.4 → 5.0.0-alpha.0

package/CHANGELOG.md

@@ -1,5 +1,57 @@
 # @hi-ui/pop-confirm
 
+## 5.0.0-alpha.0
+
+### Major Changes
+
+- 1b05b44a4: feat: 组件的 package.json 中的 exports 统一加上 types 配置 (5.0)
+
+### Minor Changes
+
+- ceca247b4: feat(pop-confirm): PopConfirm 组件支持以 api 方式调用
+
+### Patch Changes
+
+- 694fe87ce: style(pop-confirm): 新版样式修改 (5.0)
+- 61d132802: build: 将 package.json 中 exports 配置中的 types 配置放在最上面 (5.0)
+- c125e4c48: fix: 修复 UI 问题 (5.0)
+- Updated dependencies [dfff90e7c]
+- Updated dependencies [5de7a848b]
+- Updated dependencies [1b05b44a4]
+- Updated dependencies [67960d871]
+- Updated dependencies [de7f92b26]
+- Updated dependencies [8116f0304]
+- Updated dependencies [9fa354f31]
+- Updated dependencies [77ed66eac]
+- Updated dependencies [61d132802]
+- Updated dependencies [489b27cb3]
+- Updated dependencies [6eac4b78b]
+- Updated dependencies [bcd3d08dd]
+- Updated dependencies [4fb586f6f]
+- Updated dependencies [c125e4c48]
+- Updated dependencies [b7ad460d8]
+  - @hi-ui/button@5.0.0-alpha.0
+  - @hi-ui/core@5.0.0-alpha.0
+  - @hi-ui/use-latest@5.0.0-alpha.0
+  - @hi-ui/use-toggle@5.0.0-alpha.0
+  - @hi-ui/use-uncontrolled-state@5.0.0-alpha.0
+  - @hi-ui/icons@5.0.0-alpha.0
+  - @hi-ui/popper@5.0.0-alpha.0
+  - @hi-ui/classname@5.0.0-alpha.0
+  - @hi-ui/dom-utils@5.0.0-alpha.0
+  - @hi-ui/env@5.0.0-alpha.0
+  - @hi-ui/react-utils@5.0.0-alpha.0
+  - @hi-ui/type-assertion@5.0.0-alpha.0
+
+## 4.2.5
+
+### Patch Changes
+
+- [#2813](https://github.com/XiaoMi/hiui/pull/2813) [`084600ea6`](https://github.com/XiaoMi/hiui/commit/084600ea6e4fdec7efde79a3cc90d8ef45ca602f) Thanks [@xiamiao1121](https://github.com/xiamiao1121)! - fix: 修复点击按钮会触发 onCancel 问题
+
+- Updated dependencies [[`3afbf239e`](https://github.com/XiaoMi/hiui/commit/3afbf239e816ede48d6a85cbd99b6b099b8c8eb3)]:
+  - @hi-ui/env@4.0.7
+
 ## 4.2.4
 
 ### Patch Changes

package/lib/cjs/PopConfirm.js

@@ -36,8 +36,10 @@ var POP_CONFIRM_PREFIX = classname.getPrefixCls('pop-confirm');
  * 气泡确认框
  */
 var PopConfirm = /*#__PURE__*/React.forwardRef(function (_a, ref) {
+  var _cx;
   var _a$prefixCls = _a.prefixCls,
     prefixCls = _a$prefixCls === void 0 ? POP_CONFIRM_PREFIX : _a$prefixCls,
+    innerRef = _a.innerRef,
     className = _a.className,
     children = _a.children,
     title = _a.title,
@@ -47,7 +49,7 @@ var PopConfirm = /*#__PURE__*/React.forwardRef(function (_a, ref) {
     cancelTextProp = _a.cancelText,
     confirmTextProp = _a.confirmText,
     footer = _a.footer,
-    rest = tslib.__rest(_a, ["prefixCls", "role", "className", "children", "title", "content", "icon", "cancelText", "confirmText", "footer"]);
+    rest = tslib.__rest(_a, ["prefixCls", "innerRef", "role", "className", "children", "title", "content", "icon", "cancelText", "confirmText", "footer"]);
   var i18n = core.useLocaleContext();
   var cancelText = typeAssertion.isUndef(cancelTextProp) ? i18n.get('popConfirm.cancelText') : cancelTextProp;
   var confirmText = typeAssertion.isUndef(confirmTextProp) ? i18n.get('popConfirm.confirmText') : confirmTextProp;
@@ -56,8 +58,15 @@ var PopConfirm = /*#__PURE__*/React.forwardRef(function (_a, ref) {
     getPopperProps = _usePopConfirm.getPopperProps,
     getTriggerProps = _usePopConfirm.getTriggerProps,
     onCancel = _usePopConfirm.onCancel,
-    onConfirm = _usePopConfirm.onConfirm;
-  var cls = classname.cx(prefixCls, className);
+    onConfirm = _usePopConfirm.onConfirm,
+    visibleAction = _usePopConfirm.visibleAction;
+  React.useImperativeHandle(innerRef, function () {
+    return {
+      open: visibleAction.on,
+      close: visibleAction.off
+    };
+  });
+  var cls = classname.cx(prefixCls, className, (_cx = {}, _cx[prefixCls + "--icon-less"] = icon === null, _cx));
   var hasConfirm = confirmText !== null;
   var hasCancel = cancelText !== null;
   var hasFooter = hasConfirm || hasCancel || footer !== null;
@@ -80,17 +89,19 @@ var PopConfirm = /*#__PURE__*/React.forwardRef(function (_a, ref) {
     key: "1",
     className: prefixCls + "__btn-cancel",
     type: "default",
-    size: "md",
+    appearance: "line",
+    size: "sm",
     onClick: onCancel
   }, cancelText)) : null, hasConfirm ? ( /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
     key: "2",
     className: prefixCls + "__btn-confirm",
     type: "primary",
-    size: "md",
+    size: "sm",
     onClick: onConfirm
   }, confirmText)) : null] : footer)) : null)));
 });
 if (env.__DEV__) {
   PopConfirm.displayName = 'PopConfirm';
 }
+exports.POP_CONFIRM_PREFIX = POP_CONFIRM_PREFIX;
 exports.PopConfirm = PopConfirm;

package/lib/cjs/hooks/use-id/lib/esm/index.js

@@ -0,0 +1,34 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+require('react');
+var v4 = require('../../node_modules/uuid/dist/esm-browser/v4.js');
+
+/** @LICENSE
+ * @hi-ui/use-id
+ * https://github.com/XiaoMi/hiui/tree/master/packages/hooks/use-id#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * Generate a uuid.
+ */
+var uuid = function uuid() {
+  return v4["default"]();
+};
+exports.uuid = uuid;

package/lib/cjs/hooks/use-id/node_modules/uuid/dist/esm-browser/regex.js

@@ -0,0 +1,16 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var REGEX = /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;
+exports["default"] = REGEX;

package/lib/cjs/hooks/use-id/node_modules/uuid/dist/esm-browser/rng.js

@@ -0,0 +1,33 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+
+// Unique ID creation requires a high quality random # generator. In the browser we therefore
+// require the crypto API and do not support built-in fallback to lower quality random number
+// generators (like Math.random()).
+var getRandomValues;
+var rnds8 = new Uint8Array(16);
+function rng() {
+  // lazy load so that environments that need to polyfill have a chance to do so
+  if (!getRandomValues) {
+    // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation. Also,
+    // find the complete implementation of crypto (msCrypto) on IE11.
+    getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto) || typeof msCrypto !== 'undefined' && typeof msCrypto.getRandomValues === 'function' && msCrypto.getRandomValues.bind(msCrypto);
+    if (!getRandomValues) {
+      throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
+    }
+  }
+  return getRandomValues(rnds8);
+}
+exports["default"] = rng;

package/lib/cjs/hooks/use-id/node_modules/uuid/dist/esm-browser/stringify.js

@@ -0,0 +1,41 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var validate = require('./validate.js');
+
+/**
+ * Convert array of 16 byte values to UUID string format of the form:
+ * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
+ */
+
+var byteToHex = [];
+for (var i = 0; i < 256; ++i) {
+  byteToHex.push((i + 0x100).toString(16).substr(1));
+}
+function stringify(arr) {
+  var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  // Note: Be careful editing this code!  It's been tuned for performance
+  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
+  var uuid = (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase(); // Consistency check for valid UUID.  If this throws, it's likely due to one
+  // of the following:
+  // - One or more input array values don't map to a hex octet (leading to
+  // "undefined" in the uuid)
+  // - Invalid input values for the RFC `version` or `variant` fields
+
+  if (!validate["default"](uuid)) {
+    throw TypeError('Stringified UUID is invalid');
+  }
+  return uuid;
+}
+exports["default"] = stringify;

package/lib/cjs/hooks/use-id/node_modules/uuid/dist/esm-browser/v4.js

@@ -0,0 +1,33 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var rng = require('./rng.js');
+var stringify = require('./stringify.js');
+function v4(options, buf, offset) {
+  options = options || {};
+  var rnds = options.random || (options.rng || rng["default"])(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
+
+  rnds[6] = rnds[6] & 0x0f | 0x40;
+  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
+
+  if (buf) {
+    offset = offset || 0;
+    for (var i = 0; i < 16; ++i) {
+      buf[offset + i] = rnds[i];
+    }
+    return buf;
+  }
+  return stringify["default"](rnds);
+}
+exports["default"] = v4;

package/lib/cjs/hooks/use-id/node_modules/uuid/dist/esm-browser/validate.js

@@ -0,0 +1,19 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var regex = require('./regex.js');
+function validate(uuid) {
+  return typeof uuid === 'string' && regex["default"].test(uuid);
+}
+exports["default"] = validate;

package/lib/cjs/icons/index.js

@@ -21,5 +21,5 @@ function _interopDefaultCompat(e) {
   };
 }
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
-var defaultTipIcon = /*#__PURE__*/React__default["default"].createElement(icons.ExclamationCircleFilled, null);
+var defaultTipIcon = /*#__PURE__*/React__default["default"].createElement(icons.InfoCircleFilled, null);
 exports.defaultTipIcon = defaultTipIcon;

package/lib/cjs/index.js

@@ -13,6 +13,9 @@ Object.defineProperty(exports, '__esModule', {
   value: true
 });
 require('./styles/index.scss.js');
-var PopConfirm = require('./PopConfirm.js');
-exports.PopConfirm = PopConfirm.PopConfirm;
-exports["default"] = PopConfirm.PopConfirm;
+var PopConfirm$1 = require('./PopConfirm.js');
+var withApi = require('./with-api.js');
+var PopConfirm = withApi.withPopConfirm(PopConfirm$1.PopConfirm);
+exports.POP_CONFIRM_PREFIX = PopConfirm$1.POP_CONFIRM_PREFIX;
+exports.PopConfirm = PopConfirm;
+exports["default"] = PopConfirm;

package/lib/cjs/styles/index.scss.js

@@ -12,7 +12,7 @@
 Object.defineProperty(exports, '__esModule', {
   value: true
 });
-var css_248z = ".hi-v4-pop-confirm {overflow-wrap: break-word;font-size: var(--hi-v4-text-size-md, 0.875rem);line-height: var(--hi-v4-text-lineheight-md, 1.375rem);position: relative;background: var(--hi-v4-color-static-white, #fff);white-space: nowrap;border-radius: var(--hi-v4-border-radius-lg, 6px);padding: var(--hi-v4-spacing-10, 20px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}.hi-v4-pop-confirm__content {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}.hi-v4-pop-confirm__content-icon {margin-right: var(--hi-v4-spacing-5, 10px);color: var(--hi-v4-color-warning-500, var(--hi-v4-color-yellow-500, #fab007));font-size: var(--hi-v4-text-size-xl, 1.125rem);}.hi-v4-pop-confirm__content-title {color: var(--hi-v4-color-gray-700, #1f2733);font-weight: var(--hi-v4-text-weight-semibold, 600);}.hi-v4-pop-confirm__body {margin: var(--hi-v4-spacing-5, 10px) 0 0 var(--hi-v4-spacing-14, 28px);white-space: normal;color: var(--hi-v4-color-gray-600, #5f6a7a);}.hi-v4-pop-confirm__footer {margin-top: var(--hi-v4-spacing-10, 20px);text-align: right;}";
+var css_248z = ".hi-v5-pop-confirm {overflow-wrap: break-word;font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);position: relative;background: var(--hi-v5-color-static-white, #fff);white-space: nowrap;border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-200, #e6e8eb);border-radius: var(--hi-v5-border-radius-xl, 8px);padding: var(--hi-v5-spacing-8, 16px) var(--hi-v5-spacing-10, 20px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}.hi-v5-pop-confirm__content {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}.hi-v5-pop-confirm__content-icon {margin-right: var(--hi-v5-spacing-4, 8px);color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));font-size: var(--hi-v5-text-size-lg, 1rem);}.hi-v5-pop-confirm__content-title {color: var(--hi-v5-color-gray-700, #1a1d26);font-weight: var(--hi-v5-text-weight-semibold, 600);}.hi-v5-pop-confirm__body {margin: var(--hi-v5-spacing-2, 4px) 0 0 var(--hi-v5-spacing-12, 24px);white-space: normal;color: var(--hi-v5-color-gray-700, #1a1d26);}.hi-v5-pop-confirm--icon-less .hi-v5-pop-confirm__body {margin-left: 0;}.hi-v5-pop-confirm__footer {margin-top: var(--hi-v5-spacing-8, 16px);text-align: right;}";
 var __styleInject__ = require('@hi-ui/style-inject')["default"];
 __styleInject__(css_248z);
 exports["default"] = css_248z;

package/lib/cjs/use-pop-confirm.js

@@ -28,8 +28,9 @@ var usePopConfirm = function usePopConfirm(_a) {
     onCancelProp = _a.onCancel,
     onConfirmProp = _a.onConfirm,
     onOpen = _a.onOpen,
-    _onClose = _a.onClose,
-    restProps = tslib.__rest(_a, ["visible", "disabled", "closeOnCancel", "closeOnConfirm", "onCancel", "onConfirm", "onOpen", "onClose"]);
+    onClose = _a.onClose,
+    attachEl = _a.attachEl,
+    restProps = tslib.__rest(_a, ["visible", "disabled", "closeOnCancel", "closeOnConfirm", "onCancel", "onConfirm", "onOpen", "onClose", "attachEl"]);
   // TODO: 移除 popper，使用 hook 重写
   var _omitPopperOverlayPro = Popper.omitPopperOverlayProps(restProps),
     popper = _omitPopperOverlayPro[0],
@@ -38,18 +39,17 @@ var usePopConfirm = function usePopConfirm(_a) {
       defaultVisible: false,
       visible: visibleProp,
       onOpen: onOpen,
-      onClose: function onClose() {
-        _onClose === null || _onClose === void 0 ? void 0 : _onClose();
-        onCancelProp === null || onCancelProp === void 0 ? void 0 : onCancelProp();
-      }
+      onClose: onClose
     }),
     visible = _useUncontrolledToggl[0],
     visibleAction = _useUncontrolledToggl[1];
+  var onCancelLatest = useLatest.useLatestCallback(onCancelProp);
   var onCancel = React.useCallback(function () {
+    onCancelLatest();
     if (closeOnCancel) {
       visibleAction.off();
     }
-  }, [closeOnCancel, visibleAction]);
+  }, [closeOnCancel, visibleAction, onCancelLatest]);
   var onConfirmLatest = useLatest.useLatestCallback(onConfirmProp);
   var onConfirm = React.useCallback(function () {
     onConfirmLatest();
@@ -75,10 +75,10 @@ var usePopConfirm = function usePopConfirm(_a) {
     });
     return Object.assign(Object.assign({}, popperProps), {
       visible: visible,
-      attachEl: targetEl,
+      attachEl: attachEl !== null && attachEl !== void 0 ? attachEl : targetEl,
       onClose: visibleAction.off
     });
-  }, [visible, targetEl, popper, visibleAction]);
+  }, [visible, attachEl, targetEl, popper, visibleAction]);
   var rootProps = Object.assign({
     role: 'alert-dialog'
   }, rest);
@@ -87,7 +87,8 @@ var usePopConfirm = function usePopConfirm(_a) {
     getTriggerProps: getTriggerProps,
     getPopperProps: getPopperProps,
     onCancel: onCancel,
-    onConfirm: onConfirm
+    onConfirm: onConfirm,
+    visibleAction: visibleAction
   };
 };
 exports.usePopConfirm = usePopConfirm;

package/lib/cjs/utils/container/lib/esm/index.js

@@ -0,0 +1,58 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+
+/** @LICENSE
+ * @hi-ui/container
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/container#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/**
+ * 获取用于承载组件的容器，将挂载在 body 下面
+ *
+ * @param selector 以 `.` 开头的选择器类
+ * @returns 容器元素
+ */
+var getContainer = function getContainer(selector, doc, customWrapper) {
+  if (doc === void 0) {
+    doc = document;
+  }
+  var rootElm = doc.querySelector(selector);
+  if (rootElm) return rootElm;
+  rootElm = doc.createElement('div');
+  rootElm.className = selector.slice(1);
+  var wrapper = customWrapper !== null && customWrapper !== void 0 ? customWrapper : doc.body;
+  wrapper.appendChild(rootElm);
+  return rootElm;
+};
+/**
+ * 从 DOM 中移除指定的承载容器
+ *
+ * @param selector 以 `.` 开头的选择器类
+ */
+var removeContainer = function removeContainer(selector, doc) {
+  if (doc === void 0) {
+    doc = document;
+  }
+  var rootElm = doc.querySelector(selector);
+  if (rootElm && rootElm.parentNode) {
+    rootElm.parentNode.removeChild(rootElm);
+  }
+};
+exports.getContainer = getContainer;
+exports.removeContainer = removeContainer;

package/lib/cjs/with-api.js

@@ -0,0 +1,73 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var tslib = require('tslib');
+var React = require('react');
+var reactDom = require('react-dom');
+var index$1 = require('./utils/container/lib/esm/index.js');
+var index = require('./hooks/use-id/lib/esm/index.js');
+var PopConfirm = require('./PopConfirm.js');
+var prefixCls = PopConfirm.POP_CONFIRM_PREFIX;
+var selector = "." + prefixCls + "-wrapper";
+var popConfirmInstanceCache = {};
+var open = function open(target, _a) {
+  var key = _a.key,
+    disabledPortal = _a.disabledPortal,
+    rest = tslib.__rest(_a, ["key", "disabledPortal"]);
+  if (!key) {
+    key = index.uuid();
+  }
+  var selectId = selector + "__" + key;
+  var container = index$1.getContainer(selectId, undefined, disabledPortal ? target.parentNode : undefined);
+  var popConfirmRef = /*#__PURE__*/React.createRef();
+  var ClonedPopConfirm = /*#__PURE__*/React.createElement(PopConfirm.PopConfirm, Object.assign({
+    innerRef: popConfirmRef,
+    container: container,
+    attachEl: target,
+    closeOnOutsideClick: false,
+    onExited: function onExited() {
+      // 卸载
+      if (container) {
+        reactDom.unmountComponentAtNode(container);
+        index$1.removeContainer(selectId);
+      }
+      container = undefined;
+    }
+  }, rest));
+  requestAnimationFrame(function () {
+    reactDom.render(ClonedPopConfirm, container);
+    popConfirmRef.current.open();
+  });
+  var close = function close() {
+    var _a;
+    (_a = popConfirmRef.current) === null || _a === void 0 ? void 0 : _a.close();
+  };
+  if (key) {
+    popConfirmInstanceCache[key] = close;
+  }
+  return key;
+};
+var close = function close(key) {
+  if (typeof popConfirmInstanceCache[key] === 'function') {
+    popConfirmInstanceCache[key]();
+  }
+  delete popConfirmInstanceCache[key];
+};
+function withPopConfirm(instance) {
+  return Object.assign(instance, {
+    open: open,
+    close: close
+  });
+}
+exports.withPopConfirm = withPopConfirm;

package/lib/esm/PopConfirm.js

@@ -8,7 +8,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import { __rest } from 'tslib';
-import React, { forwardRef } from 'react';
+import React, { forwardRef, useImperativeHandle } from 'react';
 import { getPrefixCls, cx } from '@hi-ui/classname';
 import { __DEV__ } from '@hi-ui/env';
 import { useLocaleContext } from '@hi-ui/core';
@@ -22,8 +22,10 @@ var POP_CONFIRM_PREFIX = getPrefixCls('pop-confirm');
  * 气泡确认框
  */
 var PopConfirm = /*#__PURE__*/forwardRef(function (_a, ref) {
+  var _cx;
   var _a$prefixCls = _a.prefixCls,
     prefixCls = _a$prefixCls === void 0 ? POP_CONFIRM_PREFIX : _a$prefixCls,
+    innerRef = _a.innerRef,
     className = _a.className,
     children = _a.children,
     title = _a.title,
@@ -33,7 +35,7 @@ var PopConfirm = /*#__PURE__*/forwardRef(function (_a, ref) {
     cancelTextProp = _a.cancelText,
     confirmTextProp = _a.confirmText,
     footer = _a.footer,
-    rest = __rest(_a, ["prefixCls", "role", "className", "children", "title", "content", "icon", "cancelText", "confirmText", "footer"]);
+    rest = __rest(_a, ["prefixCls", "innerRef", "role", "className", "children", "title", "content", "icon", "cancelText", "confirmText", "footer"]);
   var i18n = useLocaleContext();
   var cancelText = isUndef(cancelTextProp) ? i18n.get('popConfirm.cancelText') : cancelTextProp;
   var confirmText = isUndef(confirmTextProp) ? i18n.get('popConfirm.confirmText') : confirmTextProp;
@@ -42,8 +44,15 @@ var PopConfirm = /*#__PURE__*/forwardRef(function (_a, ref) {
     getPopperProps = _usePopConfirm.getPopperProps,
     getTriggerProps = _usePopConfirm.getTriggerProps,
     onCancel = _usePopConfirm.onCancel,
-    onConfirm = _usePopConfirm.onConfirm;
-  var cls = cx(prefixCls, className);
+    onConfirm = _usePopConfirm.onConfirm,
+    visibleAction = _usePopConfirm.visibleAction;
+  useImperativeHandle(innerRef, function () {
+    return {
+      open: visibleAction.on,
+      close: visibleAction.off
+    };
+  });
+  var cls = cx(prefixCls, className, (_cx = {}, _cx[prefixCls + "--icon-less"] = icon === null, _cx));
   var hasConfirm = confirmText !== null;
   var hasCancel = cancelText !== null;
   var hasFooter = hasConfirm || hasCancel || footer !== null;
@@ -66,17 +75,18 @@ var PopConfirm = /*#__PURE__*/forwardRef(function (_a, ref) {
     key: "1",
     className: prefixCls + "__btn-cancel",
     type: "default",
-    size: "md",
+    appearance: "line",
+    size: "sm",
     onClick: onCancel
   }, cancelText)) : null, hasConfirm ? ( /*#__PURE__*/React.createElement(Button, {
     key: "2",
     className: prefixCls + "__btn-confirm",
     type: "primary",
-    size: "md",
+    size: "sm",
     onClick: onConfirm
   }, confirmText)) : null] : footer)) : null)));
 });
 if (__DEV__) {
   PopConfirm.displayName = 'PopConfirm';
 }
-export { PopConfirm };
+export { POP_CONFIRM_PREFIX, PopConfirm };

package/lib/esm/hooks/use-id/lib/esm/index.js

@@ -0,0 +1,29 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import 'react';
+import v4 from '../../node_modules/uuid/dist/esm-browser/v4.js';
+
+/** @LICENSE
+ * @hi-ui/use-id
+ * https://github.com/XiaoMi/hiui/tree/master/packages/hooks/use-id#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * Generate a uuid.
+ */
+var uuid = function uuid() {
+  return v4();
+};
+export { uuid };

package/lib/esm/hooks/use-id/node_modules/uuid/dist/esm-browser/regex.js

@@ -0,0 +1,11 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var REGEX = /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;
+export { REGEX as default };

package/lib/esm/hooks/use-id/node_modules/uuid/dist/esm-browser/rng.js

@@ -0,0 +1,27 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+// Unique ID creation requires a high quality random # generator. In the browser we therefore
+// require the crypto API and do not support built-in fallback to lower quality random number
+// generators (like Math.random()).
+var getRandomValues;
+var rnds8 = new Uint8Array(16);
+function rng() {
+  // lazy load so that environments that need to polyfill have a chance to do so
+  if (!getRandomValues) {
+    // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation. Also,
+    // find the complete implementation of crypto (msCrypto) on IE11.
+    getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto) || typeof msCrypto !== 'undefined' && typeof msCrypto.getRandomValues === 'function' && msCrypto.getRandomValues.bind(msCrypto);
+    if (!getRandomValues) {
+      throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
+    }
+  }
+  return getRandomValues(rnds8);
+}
+export { rng as default };

package/lib/esm/hooks/use-id/node_modules/uuid/dist/esm-browser/stringify.js

@@ -0,0 +1,36 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import validate from './validate.js';
+
+/**
+ * Convert array of 16 byte values to UUID string format of the form:
+ * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
+ */
+
+var byteToHex = [];
+for (var i = 0; i < 256; ++i) {
+  byteToHex.push((i + 0x100).toString(16).substr(1));
+}
+function stringify(arr) {
+  var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  // Note: Be careful editing this code!  It's been tuned for performance
+  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
+  var uuid = (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase(); // Consistency check for valid UUID.  If this throws, it's likely due to one
+  // of the following:
+  // - One or more input array values don't map to a hex octet (leading to
+  // "undefined" in the uuid)
+  // - Invalid input values for the RFC `version` or `variant` fields
+
+  if (!validate(uuid)) {
+    throw TypeError('Stringified UUID is invalid');
+  }
+  return uuid;
+}
+export { stringify as default };

package/lib/esm/hooks/use-id/node_modules/uuid/dist/esm-browser/v4.js

@@ -0,0 +1,28 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import rng from './rng.js';
+import stringify from './stringify.js';
+function v4(options, buf, offset) {
+  options = options || {};
+  var rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
+
+  rnds[6] = rnds[6] & 0x0f | 0x40;
+  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
+
+  if (buf) {
+    offset = offset || 0;
+    for (var i = 0; i < 16; ++i) {
+      buf[offset + i] = rnds[i];
+    }
+    return buf;
+  }
+  return stringify(rnds);
+}
+export { v4 as default };

package/lib/esm/hooks/use-id/node_modules/uuid/dist/esm-browser/validate.js

@@ -0,0 +1,14 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import REGEX from './regex.js';
+function validate(uuid) {
+  return typeof uuid === 'string' && REGEX.test(uuid);
+}
+export { validate as default };

package/lib/esm/icons/index.js

@@ -8,6 +8,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
-import { ExclamationCircleFilled } from '@hi-ui/icons';
-var defaultTipIcon = /*#__PURE__*/React.createElement(ExclamationCircleFilled, null);
+import { InfoCircleFilled } from '@hi-ui/icons';
+var defaultTipIcon = /*#__PURE__*/React.createElement(InfoCircleFilled, null);
 export { defaultTipIcon };

package/lib/esm/index.js

@@ -8,4 +8,8 @@
  * LICENSE file in the root directory of this source tree.
  */
 import './styles/index.scss.js';
-export { PopConfirm, PopConfirm as default } from './PopConfirm.js';
+import { PopConfirm as PopConfirm$1 } from './PopConfirm.js';
+export { POP_CONFIRM_PREFIX } from './PopConfirm.js';
+import { withPopConfirm } from './with-api.js';
+var PopConfirm = withPopConfirm(PopConfirm$1);
+export { PopConfirm, PopConfirm as default };

package/lib/esm/styles/index.scss.js

@@ -8,6 +8,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 import __styleInject__ from '@hi-ui/style-inject';
-var css_248z = ".hi-v4-pop-confirm {overflow-wrap: break-word;font-size: var(--hi-v4-text-size-md, 0.875rem);line-height: var(--hi-v4-text-lineheight-md, 1.375rem);position: relative;background: var(--hi-v4-color-static-white, #fff);white-space: nowrap;border-radius: var(--hi-v4-border-radius-lg, 6px);padding: var(--hi-v4-spacing-10, 20px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}.hi-v4-pop-confirm__content {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}.hi-v4-pop-confirm__content-icon {margin-right: var(--hi-v4-spacing-5, 10px);color: var(--hi-v4-color-warning-500, var(--hi-v4-color-yellow-500, #fab007));font-size: var(--hi-v4-text-size-xl, 1.125rem);}.hi-v4-pop-confirm__content-title {color: var(--hi-v4-color-gray-700, #1f2733);font-weight: var(--hi-v4-text-weight-semibold, 600);}.hi-v4-pop-confirm__body {margin: var(--hi-v4-spacing-5, 10px) 0 0 var(--hi-v4-spacing-14, 28px);white-space: normal;color: var(--hi-v4-color-gray-600, #5f6a7a);}.hi-v4-pop-confirm__footer {margin-top: var(--hi-v4-spacing-10, 20px);text-align: right;}";
+var css_248z = ".hi-v5-pop-confirm {overflow-wrap: break-word;font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);position: relative;background: var(--hi-v5-color-static-white, #fff);white-space: nowrap;border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-gray-200, #e6e8eb);border-radius: var(--hi-v5-border-radius-xl, 8px);padding: var(--hi-v5-spacing-8, 16px) var(--hi-v5-spacing-10, 20px);display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}.hi-v5-pop-confirm__content {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}.hi-v5-pop-confirm__content-icon {margin-right: var(--hi-v5-spacing-4, 8px);color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));font-size: var(--hi-v5-text-size-lg, 1rem);}.hi-v5-pop-confirm__content-title {color: var(--hi-v5-color-gray-700, #1a1d26);font-weight: var(--hi-v5-text-weight-semibold, 600);}.hi-v5-pop-confirm__body {margin: var(--hi-v5-spacing-2, 4px) 0 0 var(--hi-v5-spacing-12, 24px);white-space: normal;color: var(--hi-v5-color-gray-700, #1a1d26);}.hi-v5-pop-confirm--icon-less .hi-v5-pop-confirm__body {margin-left: 0;}.hi-v5-pop-confirm__footer {margin-top: var(--hi-v5-spacing-8, 16px);text-align: right;}";
 __styleInject__(css_248z);
 export { css_248z as default };

package/lib/esm/use-pop-confirm.js

@@ -23,8 +23,9 @@ var usePopConfirm = function usePopConfirm(_a) {
     onCancelProp = _a.onCancel,
     onConfirmProp = _a.onConfirm,
     onOpen = _a.onOpen,
-    _onClose = _a.onClose,
-    restProps = __rest(_a, ["visible", "disabled", "closeOnCancel", "closeOnConfirm", "onCancel", "onConfirm", "onOpen", "onClose"]);
+    onClose = _a.onClose,
+    attachEl = _a.attachEl,
+    restProps = __rest(_a, ["visible", "disabled", "closeOnCancel", "closeOnConfirm", "onCancel", "onConfirm", "onOpen", "onClose", "attachEl"]);
   // TODO: 移除 popper，使用 hook 重写
   var _omitPopperOverlayPro = omitPopperOverlayProps(restProps),
     popper = _omitPopperOverlayPro[0],
@@ -33,18 +34,17 @@ var usePopConfirm = function usePopConfirm(_a) {
       defaultVisible: false,
       visible: visibleProp,
       onOpen: onOpen,
-      onClose: function onClose() {
-        _onClose === null || _onClose === void 0 ? void 0 : _onClose();
-        onCancelProp === null || onCancelProp === void 0 ? void 0 : onCancelProp();
-      }
+      onClose: onClose
     }),
     visible = _useUncontrolledToggl[0],
     visibleAction = _useUncontrolledToggl[1];
+  var onCancelLatest = useLatestCallback(onCancelProp);
   var onCancel = useCallback(function () {
+    onCancelLatest();
     if (closeOnCancel) {
       visibleAction.off();
     }
-  }, [closeOnCancel, visibleAction]);
+  }, [closeOnCancel, visibleAction, onCancelLatest]);
   var onConfirmLatest = useLatestCallback(onConfirmProp);
   var onConfirm = useCallback(function () {
     onConfirmLatest();
@@ -70,10 +70,10 @@ var usePopConfirm = function usePopConfirm(_a) {
     });
     return Object.assign(Object.assign({}, popperProps), {
       visible: visible,
-      attachEl: targetEl,
+      attachEl: attachEl !== null && attachEl !== void 0 ? attachEl : targetEl,
       onClose: visibleAction.off
     });
-  }, [visible, targetEl, popper, visibleAction]);
+  }, [visible, attachEl, targetEl, popper, visibleAction]);
   var rootProps = Object.assign({
     role: 'alert-dialog'
   }, rest);
@@ -82,7 +82,8 @@ var usePopConfirm = function usePopConfirm(_a) {
     getTriggerProps: getTriggerProps,
     getPopperProps: getPopperProps,
     onCancel: onCancel,
-    onConfirm: onConfirm
+    onConfirm: onConfirm,
+    visibleAction: visibleAction
   };
 };
 export { usePopConfirm };

package/lib/esm/utils/container/lib/esm/index.js

@@ -0,0 +1,51 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/** @LICENSE
+ * @hi-ui/container
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/container#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/**
+ * 获取用于承载组件的容器，将挂载在 body 下面
+ *
+ * @param selector 以 `.` 开头的选择器类
+ * @returns 容器元素
+ */
+var getContainer = function getContainer(selector, doc, customWrapper) {
+  if (doc === void 0) {
+    doc = document;
+  }
+  var rootElm = doc.querySelector(selector);
+  if (rootElm) return rootElm;
+  rootElm = doc.createElement('div');
+  rootElm.className = selector.slice(1);
+  var wrapper = customWrapper !== null && customWrapper !== void 0 ? customWrapper : doc.body;
+  wrapper.appendChild(rootElm);
+  return rootElm;
+};
+/**
+ * 从 DOM 中移除指定的承载容器
+ *
+ * @param selector 以 `.` 开头的选择器类
+ */
+var removeContainer = function removeContainer(selector, doc) {
+  if (doc === void 0) {
+    doc = document;
+  }
+  var rootElm = doc.querySelector(selector);
+  if (rootElm && rootElm.parentNode) {
+    rootElm.parentNode.removeChild(rootElm);
+  }
+};
+export { getContainer, removeContainer };

package/lib/esm/with-api.js

@@ -0,0 +1,68 @@
+/** @LICENSE
+ * @hi-ui/pop-confirm
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/pop-confirm#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { __rest } from 'tslib';
+import { createElement, createRef } from 'react';
+import { unmountComponentAtNode, render } from 'react-dom';
+import { getContainer, removeContainer } from './utils/container/lib/esm/index.js';
+import { uuid } from './hooks/use-id/lib/esm/index.js';
+import { PopConfirm, POP_CONFIRM_PREFIX } from './PopConfirm.js';
+var prefixCls = POP_CONFIRM_PREFIX;
+var selector = "." + prefixCls + "-wrapper";
+var popConfirmInstanceCache = {};
+var open = function open(target, _a) {
+  var key = _a.key,
+    disabledPortal = _a.disabledPortal,
+    rest = __rest(_a, ["key", "disabledPortal"]);
+  if (!key) {
+    key = uuid();
+  }
+  var selectId = selector + "__" + key;
+  var container = getContainer(selectId, undefined, disabledPortal ? target.parentNode : undefined);
+  var popConfirmRef = /*#__PURE__*/createRef();
+  var ClonedPopConfirm = /*#__PURE__*/createElement(PopConfirm, Object.assign({
+    innerRef: popConfirmRef,
+    container: container,
+    attachEl: target,
+    closeOnOutsideClick: false,
+    onExited: function onExited() {
+      // 卸载
+      if (container) {
+        unmountComponentAtNode(container);
+        removeContainer(selectId);
+      }
+      container = undefined;
+    }
+  }, rest));
+  requestAnimationFrame(function () {
+    render(ClonedPopConfirm, container);
+    popConfirmRef.current.open();
+  });
+  var close = function close() {
+    var _a;
+    (_a = popConfirmRef.current) === null || _a === void 0 ? void 0 : _a.close();
+  };
+  if (key) {
+    popConfirmInstanceCache[key] = close;
+  }
+  return key;
+};
+var close = function close(key) {
+  if (typeof popConfirmInstanceCache[key] === 'function') {
+    popConfirmInstanceCache[key]();
+  }
+  delete popConfirmInstanceCache[key];
+};
+function withPopConfirm(instance) {
+  return Object.assign(instance, {
+    open: open,
+    close: close
+  });
+}
+export { withPopConfirm };

package/lib/types/PopConfirm.d.ts

@@ -1,11 +1,16 @@
 import React from 'react';
 import { HiBaseHTMLProps } from '@hi-ui/core';
 import { UsePopConfirmProps } from './use-pop-confirm';
+export declare const POP_CONFIRM_PREFIX: string;
 /**
  * 气泡确认框
  */
 export declare const PopConfirm: React.ForwardRefExoticComponent<PopConfirmProps & React.RefAttributes<HTMLDivElement | null>>;
 export interface PopConfirmProps extends Omit<HiBaseHTMLProps<'div'>, 'title'>, UsePopConfirmProps {
+    innerRef?: React.Ref<{
+        open: () => void;
+        close: () => void;
+    }>;
     /**
      * 确认框标题
      */

package/lib/types/index.d.ts

@@ -1,3 +1,8 @@
+/// <reference types="react" />
 import './styles/index.scss';
 export * from './PopConfirm';
-export { PopConfirm as default } from './PopConfirm';
+export declare const PopConfirm: import("react").ForwardRefExoticComponent<import("./PopConfirm").PopConfirmProps & import("react").RefAttributes<HTMLDivElement | null>> & {
+    open: (target: HTMLElement, { key, disabledPortal, ...rest }: import("./with-api").PopConfirmApiProps) => import("react").Key;
+    close: (key: string) => void;
+};
+export default PopConfirm;

package/lib/types/use-pop-confirm.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { PopperOverlayProps } from '@hi-ui/popper';
-export declare const usePopConfirm: ({ visible: visibleProp, disabled, closeOnCancel, closeOnConfirm, onCancel: onCancelProp, onConfirm: onConfirmProp, onOpen, onClose, ...restProps }: UsePopConfirmProps) => {
+export declare const usePopConfirm: ({ visible: visibleProp, disabled, closeOnCancel, closeOnConfirm, onCancel: onCancelProp, onConfirm: onConfirmProp, onOpen, onClose, attachEl, ...restProps }: UsePopConfirmProps) => {
     rootProps: any;
     getTriggerProps: (props: any, ref: any) => {
         ref: ((value: HTMLElement | ((prevState: HTMLElement | null) => HTMLElement | null)) => void) | null;
@@ -16,6 +16,12 @@ export declare const usePopConfirm: ({ visible: visibleProp, disabled, closeOnCa
     };
     onCancel: () => void;
     onConfirm: () => void;
+    visibleAction: {
+        set: (stateOrFunction: import("react").SetStateAction<boolean>, ...args: any[]) => void;
+        on: () => void;
+        off: () => void;
+        not: () => void;
+    };
 };
 export interface UsePopConfirmProps extends PopperOverlayProps {
     /**
@@ -52,6 +58,10 @@ export interface UsePopConfirmProps extends PopperOverlayProps {
      * 设置基于 reference 元素的间隙偏移量
      */
     gutterGap?: number;
+    /**
+     * 吸附的元素
+     */
+    attachEl?: HTMLElement;
     /**
      * 是否开启禁用。暂不对外暴露
      * @private

package/lib/types/with-api.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { PopConfirm, PopConfirmProps } from './PopConfirm';
+export interface PopConfirmApiProps extends PopConfirmProps {
+}
+export declare function withPopConfirm(instance: typeof PopConfirm): import("react").ForwardRefExoticComponent<PopConfirmProps & import("react").RefAttributes<HTMLDivElement | null>> & {
+    open: (target: HTMLElement, { key, disabledPortal, ...rest }: PopConfirmApiProps) => import("react").Key;
+    close: (key: string) => void;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hi-ui/pop-confirm",
-  "version": "4.2.4",
+  "version": "5.0.0-alpha.0",
   "description": "A sub-package for @hi-ui/hiui.",
   "keywords": [],
   "author": "HiUI <mi-hiui@xiaomi.com>",
@@ -19,6 +19,7 @@
   "typings": "lib/types/index.d.ts",
   "exports": {
     ".": {
+      "types": "./lib/types/index.d.ts",
       "require": "./lib/cjs/index.js",
       "default": "./lib/esm/index.js"
     }
@@ -43,26 +44,26 @@
     "url": "https://github.com/XiaoMi/hiui/issues"
   },
   "dependencies": {
-    "@hi-ui/button": "^4.0.10",
-    "@hi-ui/classname": "^4.0.5",
-    "@hi-ui/dom-utils": "^4.0.7",
-    "@hi-ui/env": "^4.0.5",
-    "@hi-ui/icons": "^4.0.19",
-    "@hi-ui/popper": "^4.1.5",
-    "@hi-ui/react-utils": "^4.0.4",
-    "@hi-ui/type-assertion": "^4.0.4",
-    "@hi-ui/use-latest": "^4.0.4",
-    "@hi-ui/use-toggle": "^4.0.4",
-    "@hi-ui/use-uncontrolled-state": "^4.0.4"
+    "@hi-ui/button": "^5.0.0-alpha.0",
+    "@hi-ui/classname": "^5.0.0-alpha.0",
+    "@hi-ui/dom-utils": "^5.0.0-alpha.0",
+    "@hi-ui/env": "^5.0.0-alpha.0",
+    "@hi-ui/icons": "^5.0.0-alpha.0",
+    "@hi-ui/popper": "^5.0.0-alpha.0",
+    "@hi-ui/react-utils": "^5.0.0-alpha.0",
+    "@hi-ui/type-assertion": "^5.0.0-alpha.0",
+    "@hi-ui/use-latest": "^5.0.0-alpha.0",
+    "@hi-ui/use-toggle": "^5.0.0-alpha.0",
+    "@hi-ui/use-uncontrolled-state": "^5.0.0-alpha.0"
   },
   "peerDependencies": {
-    "@hi-ui/core": ">=4.0.8",
+    "@hi-ui/core": ">=5.0.0-alpha.0",
     "react": ">=16.8.6",
     "react-dom": ">=16.8.6"
   },
   "devDependencies": {
-    "@hi-ui/core": "^4.0.8",
-    "@hi-ui/core-css": "^4.1.5",
+    "@hi-ui/core": "^5.0.0-alpha.0",
+    "@hi-ui/core-css": "^5.0.0-alpha.0",
     "react": "^17.0.1",
     "react-dom": "^17.0.1"
   }