@hi-ui/pop-confirm 4.0.0-alpha.2 → 4.0.0-alpha.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/lib/cjs/PopConfirm.js +13 -9
  2. package/lib/cjs/PopConfirm.js.map +1 -1
  3. package/lib/cjs/styles/index.scss.js +1 -1
  4. package/lib/cjs/use-pop-confirm.js +42 -46
  5. package/lib/cjs/use-pop-confirm.js.map +1 -1
  6. package/lib/esm/PopConfirm.js +13 -9
  7. package/lib/esm/PopConfirm.js.map +1 -1
  8. package/lib/esm/styles/index.scss.js +1 -1
  9. package/lib/esm/use-pop-confirm.js +40 -44
  10. package/lib/esm/use-pop-confirm.js.map +1 -1
  11. package/lib/types/PopConfirm.d.ts +16 -0
  12. package/lib/types/use-pop-confirm.d.ts +23 -76
  13. package/package.json +17 -16
package/lib/cjs/PopConfirm.js CHANGED
@@ -58,8 +58,8 @@ var PopConfirm = /*#__PURE__*/React.forwardRef(function (_a, ref) {
58
58
  cancelText = _a$cancelText === void 0 ? '取消' : _a$cancelText,
59
59
  _a$confirmText = _a.confirmText,
60
60
  confirmText = _a$confirmText === void 0 ? '确认' : _a$confirmText,
61
- rest = tslib.__rest(_a, ["prefixCls", "role", "className", "children", "title", "icon", "cancelText", "confirmText"]); // TODO: 使用 自定义hook 抽离逻辑，若不需要可以移除
62
-
61
+ footer = _a.footer,
62
+ rest = tslib.__rest(_a, ["prefixCls", "role", "className", "children", "title", "icon", "cancelText", "confirmText", "footer"]);
63
63
 
64
64
  var _usePopConfirm = usePopConfirm.usePopConfirm(rest),
65
65
  rootProps = _usePopConfirm.rootProps,
@@ -69,6 +69,9 @@ var PopConfirm = /*#__PURE__*/React.forwardRef(function (_a, ref) {
69
69
  onConfirm = _usePopConfirm.onConfirm;
70
70
 
71
71
  var cls = classname.cx(prefixCls, className);
72
+ var hasConfirm = confirmText !== null;
73
+ var hasCancel = cancelText !== null;
74
+ var hasFooter = hasConfirm || hasCancel || footer !== null;
72
75
  return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].isValidElement(children) ? /*#__PURE__*/React__default['default'].cloneElement(children, // @ts-ignore
73
76
  getTriggerProps(children.props, children.ref)) : null, /*#__PURE__*/React__default['default'].createElement(popper.PopperPortal, Object.assign({}, getPopperProps()), /*#__PURE__*/React__default['default'].createElement("div", Object.assign({
74
77
  ref: ref,
@@ -79,20 +82,21 @@ var PopConfirm = /*#__PURE__*/React.forwardRef(function (_a, ref) {
79
82
  className: prefixCls + "__content-icon"
80
83
  }, icon) : null, /*#__PURE__*/React__default['default'].createElement("div", {
81
84
  className: prefixCls + "__content-title"
82
- }, title)), /*#__PURE__*/React__default['default'].createElement("div", {
85
+ }, title)), hasFooter ? /*#__PURE__*/React__default['default'].createElement("footer", {
83
86
  className: prefixCls + "__footer"
84
- }, /*#__PURE__*/React__default['default'].createElement(Button__default['default'], {
87
+ }, footer === undefined ? [hasCancel ? /*#__PURE__*/React__default['default'].createElement(Button__default['default'], {
88
+ key: "1",
85
89
  className: prefixCls + "__btn-cancel",
86
90
  type: "default",
87
- appearance: "line",
88
- size: "small",
91
+ size: "sm",
89
92
  onClick: onCancel
90
- }, cancelText), /*#__PURE__*/React__default['default'].createElement(Button__default['default'], {
93
+ }, cancelText) : null, hasConfirm ? /*#__PURE__*/React__default['default'].createElement(Button__default['default'], {
94
+ key: "2",
91
95
  className: prefixCls + "__btn-confirm",
92
96
  type: "primary",
93
- size: "small",
97
+ size: "sm",
94
98
  onClick: onConfirm
95
- }, confirmText)))));
99
+ }, confirmText) : null] : footer) : null)));
96
100
  });
97
101
 
98
102
  if (env.__DEV__) {
package/lib/cjs/PopConfirm.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"PopConfirm.js","sources":["../../src/PopConfirm.tsx"],"sourcesContent":[null],"names":["POP_CONFIRM_PREFIX","getPrefixCls","PopConfirm","forwardRef","_a","ref","prefixCls","className","children","title","icon","defaultTipIcon","cancelText","confirmText","rest","usePopConfirm","rootProps","getPopperProps","getTriggerProps","onCancel","onConfirm","cls","cx","React","isValidElement","cloneElement","props","PopperPortal","Button","type","appearance","size","onClick","__DEV__","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,IAAMA,kBAAkB,GAAGC,sBAAAA,CAAa,aAAbA,CAA3B;AAEA;;;;IAGaC,UAAU,gBAAGC,gBAAAA,CACxB,UACEC,EADF,EAYEC,GAZF;wBAEIC;MAAAA,sCAAYN;MAEZO,eAAAA;MACAC,cAAAA;MACAC,WAAAA;mBACAC;MAAAA,4BAAOC;yBACPC;MAAAA,wCAAa;0BACbC;MAAAA,0CAAc;MACXC,wBATL,YAAA,QAAA,aAAA,YAAA,SAAA,QAAA,cAAA,eAAA;;;uBAc4EC,2BAAAA,CAAcD,IAAdC;MAApEC,SAAR,kBAAQA;MAAWC,cAAnB,kBAAmBA;MAAgBC,eAAnC,kBAAmCA;MAAiBC,QAApD,kBAAoDA;MAAUC,SAA9D,kBAA8DA;;MAExDC,GAAG,GAAGC,YAAAA,CAAGhB,SAAHgB,EAAcf,SAAde;sBAGVC,yBAAAA,cAAAA,mCAAAA,MAAAA,eACGA,yBAAAA,CAAMC,cAAND,CAAqBf,QAArBe,iBACGA,yBAAAA,CAAME,YAANF,CACEf,QADFe;AAGEL,EAAAA,eAAe,CAACV,QAAQ,CAACkB,KAAV,EAAiBlB,QAAQ,CAACH,GAA1B,CAHjBkB,CADHA,GAMG,IAPNA,eAQEA,yBAAAA,cAAAA,CAACI,mBAADJ,oBAAkBN,cAAc,GAAhCM,eACEA,yBAAAA,cAAAA,MAAAA;AAAKlB,IAAAA,GAAG,EAAEA;AAAKE,IAAAA,SAAS,EAAEc;KAASL,UAAnCO,eACEA,yBAAAA,cAAAA,UAAAA;AAAShB,IAAAA,SAAS,EAAKD,SAAL;GAAlBiB,EACGb,IAAI,gBAAGa,yBAAAA,cAAAA,OAAAA;AAAMhB,IAAAA,SAAS,EAAKD,SAAL;GAAfiB,EAAgDb,IAAhDa,CAAH,GAAkE,IADzEA,eAEEA,yBAAAA,cAAAA,MAAAA;AAAKhB,IAAAA,SAAS,EAAKD,SAAL;GAAdiB,EAAgDd,KAAhDc,CAFFA,CADFA,eAKEA,yBAAAA,cAAAA,MAAAA;AAAKhB,IAAAA,SAAS,EAAKD,SAAL;GAAdiB,eACEA,yBAAAA,cAAAA,CAACK,0BAADL;AACEhB,IAAAA,SAAS,EAAKD,SAAL;AACTuB,IAAAA,IAAI,EAAC;AACLC,IAAAA,UAAU,EAAC;AACXC,IAAAA,IAAI,EAAC;AACLC,IAAAA,OAAO,EAAEb;GALXI,EAOGX,UAPHW,CADFA,eAUEA,yBAAAA,cAAAA,CAACK,0BAADL;AACEhB,IAAAA,SAAS,EAAKD,SAAL;AACTuB,IAAAA,IAAI,EAAC;AACLE,IAAAA,IAAI,EAAC;AACLC,IAAAA,OAAO,EAAEZ;GAJXG,EAMGV,WANHU,CAVFA,CALFA,CADFA,CARFA;AArB8B,CAAVpB;;AAoE1B,IAAI8B,WAAJ,EAAa;AACX/B,EAAAA,UAAU,CAACgC,WAAXhC,GAAyB,YAAzBA;;;"}
1
+ {"version":3,"file":"PopConfirm.js","sources":["../../src/PopConfirm.tsx"],"sourcesContent":[null],"names":["POP_CONFIRM_PREFIX","getPrefixCls","PopConfirm","forwardRef","_a","ref","prefixCls","className","children","title","icon","defaultTipIcon","cancelText","confirmText","footer","rest","usePopConfirm","rootProps","getPopperProps","getTriggerProps","onCancel","onConfirm","cls","cx","hasConfirm","hasCancel","hasFooter","React","isValidElement","cloneElement","props","PopperPortal","undefined","Button","key","type","size","onClick","__DEV__","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,IAAMA,kBAAkB,GAAGC,sBAAAA,CAAa,aAAbA,CAA3B;AAEA;;;;IAGaC,UAAU,gBAAGC,gBAAAA,CACxB,UACEC,EADF,EAaEC,GAbF;wBAEIC;MAAAA,sCAAYN;MAEZO,eAAAA;MACAC,cAAAA;MACAC,WAAAA;mBACAC;MAAAA,4BAAOC;yBACPC;MAAAA,wCAAa;0BACbC;MAAAA,0CAAc;MACdC,YAAAA;MACGC,wBAVL,YAAA,QAAA,aAAA,YAAA,SAAA,QAAA,cAAA,eAAA,UAAA;;uBAc4EC,2BAAAA,CAAcD,IAAdC;MAApEC,SAAR,kBAAQA;MAAWC,cAAnB,kBAAmBA;MAAgBC,eAAnC,kBAAmCA;MAAiBC,QAApD,kBAAoDA;MAAUC,SAA9D,kBAA8DA;;MAExDC,GAAG,GAAGC,YAAAA,CAAGjB,SAAHiB,EAAchB,SAAdgB;MAENC,UAAU,GAAGX,WAAW,KAAK;MAC7BY,SAAS,GAAGb,UAAU,KAAK;MAC3Bc,SAAS,GAAGF,UAAU,IAAIC,SAAdD,IAA2BV,MAAM,KAAK;sBAGtDa,yBAAAA,cAAAA,mCAAAA,MAAAA,eACGA,yBAAAA,CAAMC,cAAND,CAAqBnB,QAArBmB,iBACGA,yBAAAA,CAAME,YAANF,CACEnB,QADFmB;AAGER,EAAAA,eAAe,CAACX,QAAQ,CAACsB,KAAV,EAAiBtB,QAAQ,CAACH,GAA1B,CAHjBsB,CADHA,GAMG,IAPNA,eAQEA,yBAAAA,cAAAA,CAACI,mBAADJ,oBAAkBT,cAAc,GAAhCS,eACEA,yBAAAA,cAAAA,MAAAA;AAAKtB,IAAAA,GAAG,EAAEA;AAAKE,IAAAA,SAAS,EAAEe;KAASL,UAAnCU,eACEA,yBAAAA,cAAAA,UAAAA;AAASpB,IAAAA,SAAS,EAAKD,SAAL;GAAlBqB,EACGjB,IAAI,gBAAGiB,yBAAAA,cAAAA,OAAAA;AAAMpB,IAAAA,SAAS,EAAKD,SAAL;GAAfqB,EAAgDjB,IAAhDiB,CAAH,GAAkE,IADzEA,eAEEA,yBAAAA,cAAAA,MAAAA;AAAKpB,IAAAA,SAAS,EAAKD,SAAL;GAAdqB,EAAgDlB,KAAhDkB,CAFFA,CADFA,EAMGD,SAAS,gBACRC,yBAAAA,cAAAA,SAAAA;AAAQpB,IAAAA,SAAS,EAAKD,SAAL;GAAjBqB,EACGb,MAAM,KAAKkB,SAAXlB,GACG,CACEW,SAAS,gBACPE,yBAAAA,cAAAA,CAACM,0BAADN;AACEO,IAAAA,GAAG,EAAC;AACJ3B,IAAAA,SAAS,EAAKD,SAAL;AACT6B,IAAAA,IAAI,EAAC;AACLC,IAAAA,IAAI,EAAC;AACLC,IAAAA,OAAO,EAAEjB;GALXO,EAOGf,UAPHe,CADO,GAUL,IAXN,EAYEH,UAAU,gBACRG,yBAAAA,cAAAA,CAACM,0BAADN;AACEO,IAAAA,GAAG,EAAC;AACJ3B,IAAAA,SAAS,EAAKD,SAAL;AACT6B,IAAAA,IAAI,EAAC;AACLC,IAAAA,IAAI,EAAC;AACLC,IAAAA,OAAO,EAAEhB;GALXM,EAOGd,WAPHc,CADQ,GAUN,IAtBN,CADHb,GAyBGA,MA1BNa,CADQ,GA6BN,IAnCNA,CADFA,CARFA;AAzB8B,CAAVxB;;AAoG1B,IAAImC,WAAJ,EAAa;AACXpC,EAAAA,UAAU,CAACqC,WAAXrC,GAAyB,YAAzBA;;;"}
package/lib/cjs/styles/index.scss.js CHANGED
@@ -12,7 +12,7 @@
12
12
  Object.defineProperty(exports, '__esModule', {
13
13
  value: true
14
14
  });
15
- var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-pop-confirm {\n overflow-wrap: break-word;\n font-size: 0.875rem;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n line-height: 1.375rem;\n line-height: var(--hi-v4-text-lineheight-normal, 1.375rem);\n position: relative;\n background: #fff;\n background: var(--hi-v4-color-static-white, #fff);\n white-space: nowrap;\n -webkit-transition: all 0.5s;\n transition: all 0.5s;\n border-radius: 0.25rem;\n border-radius: var(--hi-v4-border-radius-normal, 0.25rem);\n padding: 12px 16px;\n padding: var(--hi-v4-spacing-6, 12px) var(--hi-v4-spacing-8, 16px);\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column; }\n.hi-v4-pop-confirm__content {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n.hi-v4-pop-confirm__content-icon {\n margin-right: 8px;\n margin-right: var(--hi-v4-spacing-4, 8px);\n color: #ffb40a;\n color: var(--hi-v4-color-amber-500, #ffb40a);\n font-size: 1.25rem;\n font-size: var(--hi-v4-text-size-xxl, 1.25rem); }\n.hi-v4-pop-confirm__footer {\n margin-top: 12px;\n margin-top: var(--hi-v4-spacing-6, 12px);\n text-align: right; }\n";
15
+ var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-pop-confirm {\n overflow-wrap: break-word;\n font-size: 0.875rem;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n line-height: 1.375rem;\n line-height: var(--hi-v4-text-lineheight-normal, 1.375rem);\n position: relative;\n background: #fff;\n background: var(--hi-v4-color-static-white, #fff);\n white-space: nowrap;\n -webkit-transition: all 0.5s;\n transition: all 0.5s;\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 20px;\n padding: var(--hi-v4-spacing-10, 20px);\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column; }\n.hi-v4-pop-confirm__content {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n.hi-v4-pop-confirm__content-icon {\n margin-right: 8px;\n margin-right: var(--hi-v4-spacing-4, 8px);\n color: #fab007;\n color: var(--hi-v4-color-yellow-500, #fab007);\n font-size: 1.5rem;\n font-size: var(--hi-v4-text-size-xxl, 1.5rem); }\n.hi-v4-pop-confirm__footer {\n margin-top: 20px;\n margin-top: var(--hi-v4-spacing-10, 20px);\n text-align: right; }\n";
16
16
 
17
17
  var __styleInject__ = require('style-inject/dist/style-inject.es.js')["default"];
18
18
 
package/lib/cjs/use-pop-confirm.js CHANGED
@@ -17,64 +17,58 @@ var tslib = require('tslib');
17
17
 
18
18
  var React = require('react');
19
19
 
20
- require('@hi-ui/icons');
21
-
22
- var useUncontrolledState = require('@hi-ui/use-uncontrolled-state');
23
-
24
20
  var useLatest = require('@hi-ui/use-latest');
25
21
 
26
22
  var domUtils = require('@hi-ui/dom-utils');
27
23
 
28
24
  var reactUtils = require('@hi-ui/react-utils');
29
25
 
26
+ var popper = require('@hi-ui/popper');
27
+
28
+ var useToggle = require('@hi-ui/use-toggle');
29
+
30
30
  var usePopConfirm = function usePopConfirm(_a) {
31
- var _a$role = _a.role,
32
- role = _a$role === void 0 ? 'alert-dialog' : _a$role,
33
- visibleProp = _a.visible,
34
- onCloseProp = _a.onClose,
31
+ var visibleProp = _a.visible,
35
32
  _a$closeOnCancel = _a.closeOnCancel,
36
33
  closeOnCancel = _a$closeOnCancel === void 0 ? true : _a$closeOnCancel,
37
34
  _a$closeOnConfirm = _a.closeOnConfirm,
38
35
  closeOnConfirm = _a$closeOnConfirm === void 0 ? true : _a$closeOnConfirm,
39
36
  onCancelProp = _a.onCancel,
40
37
  onConfirmProp = _a.onConfirm,
41
- popper = _a.popper,
42
- rest = tslib.__rest(_a, ["role", "visible", "onClose", "disabled", "icon", "closeOnCancel", "closeOnConfirm", "onCancel", "onConfirm", "popper"]);
38
+ onOpen = _a.onOpen,
39
+ _onClose = _a.onClose,
40
+ restProps = tslib.__rest(_a, ["visible", "disabled", "closeOnCancel", "closeOnConfirm", "onCancel", "onConfirm", "onOpen", "onClose"]); // TODO: 移除 popper，使用 hook 重写
41
+
43
42
 
44
- var _useUncontrolledState = useUncontrolledState.useUncontrolledState(false, visibleProp, function (nextVisible) {
45
- if (!nextVisible) {
46
- onCloseProp === null || onCloseProp === void 0 ? void 0 : onCloseProp();
43
+ var _omitPopperOverlayPro = popper.omitPopperOverlayProps(restProps),
44
+ popper$1 = _omitPopperOverlayPro[0],
45
+ rest = _omitPopperOverlayPro[1];
46
+
47
+ var _useUncontrolledToggl = useToggle.useUncontrolledToggle({
48
+ defaultVisible: false,
49
+ visible: visibleProp,
50
+ onOpen: onOpen,
51
+ onClose: function onClose() {
52
+ _onClose === null || _onClose === void 0 ? void 0 : _onClose();
53
+ onCancelProp === null || onCancelProp === void 0 ? void 0 : onCancelProp();
47
54
  }
48
55
  }),
49
- visible = _useUncontrolledState[0],
50
- trySetVisible = _useUncontrolledState[1];
56
+ visible = _useUncontrolledToggl[0],
57
+ visibleAction = _useUncontrolledToggl[1];
51
58
 
52
- var onToggle = React.useCallback(function () {
53
- trySetVisible(function (prev) {
54
- return !prev;
55
- });
56
- }, [trySetVisible]);
57
- var onClose = React.useCallback(function () {
58
- trySetVisible(false);
59
- }, [trySetVisible]);
60
- var cancelClose = React.useCallback(function () {
59
+ var onCancel = React.useCallback(function () {
61
60
  if (closeOnCancel) {
62
- onClose();
61
+ visibleAction.off();
63
62
  }
64
- }, [closeOnCancel, onClose]);
65
- var confirmClose = React.useCallback(function () {
63
+ }, [closeOnCancel, visibleAction]);
64
+ var onConfirmLatest = useLatest.useLatestCallback(onConfirmProp);
65
+ var onConfirm = React.useCallback(function () {
66
+ onConfirmLatest();
67
+
66
68
  if (closeOnConfirm) {
67
- onClose();
69
+ visibleAction.off();
68
70
  }
69
- }, [closeOnConfirm, onClose]);
70
- var onCancelLatest = useLatest.useLatestCallback(onCancelProp);
71
- var onConfirmLatest = useLatest.useLatestCallback(onConfirmProp);
72
- var onCancel = React.useMemo(function () {
73
- return domUtils.mockDefaultHandlers(onCancelLatest, cancelClose);
74
- }, [onCancelLatest, cancelClose]);
75
- var onConfirm = React.useMemo(function () {
76
- return domUtils.mockDefaultHandlers(onConfirmLatest, confirmClose);
77
- }, [onConfirmLatest, confirmClose]);
71
+ }, [closeOnConfirm, visibleAction, onConfirmLatest]);
78
72
 
79
73
  var _useState = React.useState(null),
80
74
  targetEl = _useState[0],
@@ -83,23 +77,25 @@ var usePopConfirm = function usePopConfirm(_a) {
83
77
  var getTriggerProps = React.useCallback(function (props, ref) {
84
78
  return {
85
79
  ref: reactUtils.mergeRefs(setTargetEl, ref),
86
- onClick: domUtils.mockDefaultHandlers(props.onClick, onToggle)
80
+ onClick: domUtils.mockDefaultHandlers(props.onClick, visibleAction.not)
87
81
  };
88
- }, [onToggle, setTargetEl]);
82
+ }, [visibleAction, setTargetEl]);
89
83
  var getPopperProps = React.useCallback(function () {
90
- var popperProps = reactUtils.withDefaultProps(popper, {
84
+ var popperProps = reactUtils.withDefaultProps(popper$1, {
91
85
  arrow: true,
92
- placement: 'top'
86
+ placement: 'top',
87
+ // @DesignToken 10
88
+ gutterGap: 14
93
89
  });
94
90
  return Object.assign(Object.assign({}, popperProps), {
95
91
  visible: visible,
96
92
  attachEl: targetEl,
97
- onClose: onClose
93
+ onClose: visibleAction.off
98
94
  });
99
- }, [visible, targetEl, popper, onClose]);
100
- var rootProps = Object.assign(Object.assign({}, rest), {
101
- role: role
102
- });
95
+ }, [visible, targetEl, popper$1, visibleAction]);
96
+ var rootProps = Object.assign({
97
+ role: 'alert-dialog'
98
+ }, rest);
103
99
  return {
104
100
  rootProps: rootProps,
105
101
  getTriggerProps: getTriggerProps,
package/lib/cjs/use-pop-confirm.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"use-pop-confirm.js","sources":["../../src/use-pop-confirm.ts"],"sourcesContent":[null],"names":["usePopConfirm","_a","role","visibleProp","visible","onCloseProp","onClose","closeOnCancel","closeOnConfirm","onCancelProp","onCancel","onConfirmProp","onConfirm","popper","rest","useUncontrolledState","nextVisible","trySetVisible","onToggle","useCallback","prev","cancelClose","confirmClose","onCancelLatest","useLatestCallback","onConfirmLatest","useMemo","mockDefaultHandlers","useState","targetEl","setTargetEl","getTriggerProps","props","ref","mergeRefs","onClick","getPopperProps","popperProps","withDefaultProps","arrow","placement","attachEl","rootProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAQaA,aAAa,GAAG,SAAhBA,aAAgB,CAACC,EAAD;mBAC3BC;MAAAA,4BAAO;MACEC,iBAATC;MACSC,iBAATC;4BAGAC;MAAAA,8CAAgB;6BAChBC;MAAAA,gDAAiB;MACPC,kBAAVC;MACWC,mBAAXC;MACAC,YAAAA;MACGC,wBAXyB,OAAA,WAAA,WAAA,YAAA,QAAA,iBAAA,kBAAA,YAAA,aAAA,UAAA;;8BAaKC,yCAAAA,CAC/B,KAD+BA,EAE/BZ,WAF+BY,EAG/B,UAACC,WAAD;QACM,CAACA,aAAa;AAChBX,MAAAA,WAAW,SAAXA,IAAAA,WAAW,WAAXA,SAAAA,GAAAA,WAAW,EAAXA;;AAL+C,GAApBU;MAA1BX,OAAP;MAAgBa,aAAhB;;MAUMC,QAAQ,GAAGC,iBAAAA,CAAY;AAC3BF,IAAAA,aAAa,CAAC,UAACG,IAAD;aAAU,CAACA;AAAZ,KAAA,CAAbH;AAD0B,GAAXE,EAEd,CAACF,aAAD,CAFcE;MAIXb,OAAO,GAAGa,iBAAAA,CAAY;AAC1BF,IAAAA,aAAa,CAAC,KAAD,CAAbA;AADyB,GAAXE,EAEb,CAACF,aAAD,CAFaE;MAIVE,WAAW,GAAGF,iBAAAA,CAAY;QAC1BZ,eAAe;AACjBD,MAAAA,OAAO;;AAFoB,GAAXa,EAIjB,CAACZ,aAAD,EAAgBD,OAAhB,CAJiBa;MAMdG,YAAY,GAAGH,iBAAAA,CAAY;QAC3BX,gBAAgB;AAClBF,MAAAA,OAAO;;AAFqB,GAAXa,EAIlB,CAACX,cAAD,EAAiBF,OAAjB,CAJkBa;MAMfI,cAAc,GAAGC,2BAAAA,CAAkBf,YAAlBe;MACjBC,eAAe,GAAGD,2BAAAA,CAAkBb,aAAlBa;MAElBd,QAAQ,GAAGgB,aAAAA,CAAQ;WAAMC,4BAAAA,CAAoBJ,cAApBI,EAAoCN,WAApCM;AAAP,GAAPD,EAAgE,CAC/EH,cAD+E,EAE/EF,WAF+E,CAAhEK;MAKXd,SAAS,GAAGc,aAAAA,CAAQ;WAAMC,4BAAAA,CAAoBF,eAApBE,EAAqCL,YAArCK;AAAP,GAAPD,EAAkE,CAClFD,eADkF,EAElFH,YAFkF,CAAlEI;;kBAKcE,cAAAA,CAA6B,IAA7BA;MAAzBC,QAAP;MAAiBC,WAAjB;;MAEMC,eAAe,GAAGZ,iBAAAA,CACtB,UAACa,KAAD,EAAQC,GAAR;WACS;AACLA,MAAAA,GAAG,EAAEC,oBAAAA,CAAUJ,WAAVI,EAAuBD,GAAvBC,CADA;AAELC,MAAAA,OAAO,EAAER,4BAAAA,CAAoBK,KAAK,CAACG,OAA1BR,EAAmCT,QAAnCS;AAFJ;AAFwB,GAAXR,EAOtB,CAACD,QAAD,EAAWY,WAAX,CAPsBX;MAUlBiB,cAAc,GAAGjB,iBAAAA,CAAY;QAC3BkB,WAAW,GAAGC,2BAAAA,CAAiBzB,MAAjByB,EAAyB;AAAEC,MAAAA,KAAK,EAAE,IAAT;AAAeC,MAAAA,SAAS,EAAE;AAA1B,KAAzBF;2CAGfD;AACHjC,MAAAA,OAAO,EAAPA;AACAqC,MAAAA,QAAQ,EAAEZ;AACVvB,MAAAA,OAAO,EAAPA;;AAP8B,GAAXa,EASpB,CAACf,OAAD,EAAUyB,QAAV,EAAoBhB,MAApB,EAA4BP,OAA5B,CAToBa;MAWjBuB,SAAS,mCACV5B;AACHZ,IAAAA,IAAI,EAAJA;;SAGK;AACLwC,IAAAA,SAAS,EAATA,SADK;AAELX,IAAAA,eAAe,EAAfA,eAFK;AAGLK,IAAAA,cAAc,EAAdA,cAHK;AAIL1B,IAAAA,QAAQ,EAARA,QAJK;AAKLE,IAAAA,SAAS,EAATA;AALK;;;"}
1
+ {"version":3,"file":"use-pop-confirm.js","sources":["../../src/use-pop-confirm.ts"],"sourcesContent":[null],"names":["usePopConfirm","_a","visibleProp","visible","closeOnCancel","closeOnConfirm","onCancelProp","onCancel","onConfirmProp","onConfirm","onOpen","onClose","restProps","omitPopperOverlayProps","popper","rest","useUncontrolledToggle","defaultVisible","visibleAction","useCallback","off","onConfirmLatest","useLatestCallback","useState","targetEl","setTargetEl","getTriggerProps","props","ref","mergeRefs","onClick","mockDefaultHandlers","not","getPopperProps","popperProps","withDefaultProps","arrow","placement","gutterGap","attachEl","rootProps","role"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAOaA,aAAa,GAAG,SAAhBA,aAAgB,CAACC,EAAD;MAClBC,iBAATC;4BAEAC;MAAAA,8CAAgB;6BAChBC;MAAAA,gDAAiB;MACPC,kBAAVC;MACWC,mBAAXC;MACAC,YAAAA;MACAC,cAAAA;MACGC,6BATyB,UAAA,YAAA,iBAAA,kBAAA,YAAA,aAAA,UAAA,WAAA;;;8BAYLC,6BAAAA,CAAuBD,SAAvBC;MAAhBC,QAAP;MAAeC,IAAf;;8BAEiCC,+BAAAA,CAAsB;AACrDC,IAAAA,cAAc,EAAE,KADqC;AAErDd,IAAAA,OAAO,EAAED,WAF4C;AAGrDQ,IAAAA,MAAM,EAANA,MAHqD;AAIrDC,IAAAA,OAAO,EAAE,gBAAA;AACPA,MAAAA,QAAO,SAAPA,IAAAA,QAAO,WAAPA,SAAAA,GAAAA,QAAO,EAAPA;AACAL,MAAAA,YAAY,SAAZA,IAAAA,YAAY,WAAZA,SAAAA,GAAAA,YAAY,EAAZA;;AANmD,GAAtBU;MAA1Bb,OAAP;MAAgBe,aAAhB;;MAUMX,QAAQ,GAAGY,iBAAAA,CAAY;QACvBf,eAAe;AACjBc,MAAAA,aAAa,CAACE,GAAdF;;AAFwB,GAAXC,EAId,CAACf,aAAD,EAAgBc,aAAhB,CAJcC;MAMXE,eAAe,GAAGC,2BAAAA,CAAkBd,aAAlBc;MAElBb,SAAS,GAAGU,iBAAAA,CAAY;AAC5BE,IAAAA,eAAe;;QACXhB,gBAAgB;AAClBa,MAAAA,aAAa,CAACE,GAAdF;;AAHyB,GAAXC,EAKf,CAACd,cAAD,EAAiBa,aAAjB,EAAgCG,eAAhC,CALeF;;kBAOcI,cAAAA,CAA6B,IAA7BA;MAAzBC,QAAP;MAAiBC,WAAjB;;MAEMC,eAAe,GAAGP,iBAAAA,CACtB,UAACQ,KAAD,EAAQC,GAAR;WACS;AACLA,MAAAA,GAAG,EAAEC,oBAAAA,CAAUJ,WAAVI,EAAuBD,GAAvBC,CADA;AAELC,MAAAA,OAAO,EAAEC,4BAAAA,CAAoBJ,KAAK,CAACG,OAA1BC,EAAmCb,aAAa,CAACc,GAAjDD;AAFJ;AAFwB,GAAXZ,EAOtB,CAACD,aAAD,EAAgBO,WAAhB,CAPsBN;MAUlBc,cAAc,GAAGd,iBAAAA,CAAY;QAC3Be,WAAW,GAAGC,2BAAAA,CAAiBrB,QAAjBqB,EAAyB;AAC3CC,MAAAA,KAAK,EAAE,IADoC;AAE3CC,MAAAA,SAAS,EAAE,KAFgC;;AAI3CC,MAAAA,SAAS,EAAE;AAJgC,KAAzBH;2CAQfD;AACH/B,MAAAA,OAAO,EAAPA;AACAoC,MAAAA,QAAQ,EAAEf;AACVb,MAAAA,OAAO,EAAEO,aAAa,CAACE;;AAZO,GAAXD,EAcpB,CAAChB,OAAD,EAAUqB,QAAV,EAAoBV,QAApB,EAA4BI,aAA5B,CAdoBC;MAgBjBqB,SAAS;AACbC,IAAAA,IAAI,EAAE;KACH1B;SAGE;AACLyB,IAAAA,SAAS,EAATA,SADK;AAELd,IAAAA,eAAe,EAAfA,eAFK;AAGLO,IAAAA,cAAc,EAAdA,cAHK;AAIL1B,IAAAA,QAAQ,EAARA,QAJK;AAKLE,IAAAA,SAAS,EAATA;AALK;;;"}
package/lib/esm/PopConfirm.js CHANGED
@@ -32,8 +32,8 @@ var PopConfirm = /*#__PURE__*/forwardRef(function (_a, ref) {
32
32
  cancelText = _a$cancelText === void 0 ? '取消' : _a$cancelText,
33
33
  _a$confirmText = _a.confirmText,
34
34
  confirmText = _a$confirmText === void 0 ? '确认' : _a$confirmText,
35
- rest = __rest(_a, ["prefixCls", "role", "className", "children", "title", "icon", "cancelText", "confirmText"]); // TODO: 使用 自定义hook 抽离逻辑，若不需要可以移除
36
-
35
+ footer = _a.footer,
36
+ rest = __rest(_a, ["prefixCls", "role", "className", "children", "title", "icon", "cancelText", "confirmText", "footer"]);
37
37
 
38
38
  var _usePopConfirm = usePopConfirm(rest),
39
39
  rootProps = _usePopConfirm.rootProps,
@@ -43,6 +43,9 @@ var PopConfirm = /*#__PURE__*/forwardRef(function (_a, ref) {
43
43
  onConfirm = _usePopConfirm.onConfirm;
44
44
 
45
45
  var cls = cx(prefixCls, className);
46
+ var hasConfirm = confirmText !== null;
47
+ var hasCancel = cancelText !== null;
48
+ var hasFooter = hasConfirm || hasCancel || footer !== null;
46
49
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.isValidElement(children) ? /*#__PURE__*/React.cloneElement(children, // @ts-ignore
47
50
  getTriggerProps(children.props, children.ref)) : null, /*#__PURE__*/React.createElement(PopperPortal, Object.assign({}, getPopperProps()), /*#__PURE__*/React.createElement("div", Object.assign({
48
51
  ref: ref,
@@ -53,20 +56,21 @@ var PopConfirm = /*#__PURE__*/forwardRef(function (_a, ref) {
53
56
  className: prefixCls + "__content-icon"
54
57
  }, icon) : null, /*#__PURE__*/React.createElement("div", {
55
58
  className: prefixCls + "__content-title"
56
- }, title)), /*#__PURE__*/React.createElement("div", {
59
+ }, title)), hasFooter ? /*#__PURE__*/React.createElement("footer", {
57
60
  className: prefixCls + "__footer"
58
- }, /*#__PURE__*/React.createElement(Button, {
61
+ }, footer === undefined ? [hasCancel ? /*#__PURE__*/React.createElement(Button, {
62
+ key: "1",
59
63
  className: prefixCls + "__btn-cancel",
60
64
  type: "default",
61
- appearance: "line",
62
- size: "small",
65
+ size: "sm",
63
66
  onClick: onCancel
64
- }, cancelText), /*#__PURE__*/React.createElement(Button, {
67
+ }, cancelText) : null, hasConfirm ? /*#__PURE__*/React.createElement(Button, {
68
+ key: "2",
65
69
  className: prefixCls + "__btn-confirm",
66
70
  type: "primary",
67
- size: "small",
71
+ size: "sm",
68
72
  onClick: onConfirm
69
- }, confirmText)))));
73
+ }, confirmText) : null] : footer) : null)));
70
74
  });
71
75
 
72
76
  if (__DEV__) {
package/lib/esm/PopConfirm.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"PopConfirm.js","sources":["../../src/PopConfirm.tsx"],"sourcesContent":[null],"names":["POP_CONFIRM_PREFIX","getPrefixCls","PopConfirm","forwardRef","_a","ref","prefixCls","className","children","title","icon","defaultTipIcon","cancelText","confirmText","rest","usePopConfirm","rootProps","getPopperProps","getTriggerProps","onCancel","onConfirm","cls","cx","React","isValidElement","cloneElement","props","PopperPortal","Button","type","appearance","size","onClick","__DEV__","displayName"],"mappings":";;;;;;;;;;;;;;;;;AASA,IAAMA,kBAAkB,GAAGC,YAAY,CAAC,aAAD,CAAvC;AAEA;;;;IAGaC,UAAU,gBAAGC,UAAU,CAClC,UACEC,EADF,EAYEC,GAZF;wBAEIC;MAAAA,sCAAYN;MAEZO,eAAAA;MACAC,cAAAA;MACAC,WAAAA;mBACAC;MAAAA,4BAAOC;yBACPC;MAAAA,wCAAa;0BACbC;MAAAA,0CAAc;MACXC,kBATL,YAAA,QAAA,aAAA,YAAA,SAAA,QAAA,cAAA,eAAA;;;uBAc4EC,aAAa,CAACD,IAAD;MAAjFE,SAAR,kBAAQA;MAAWC,cAAnB,kBAAmBA;MAAgBC,eAAnC,kBAAmCA;MAAiBC,QAApD,kBAAoDA;MAAUC,SAA9D,kBAA8DA;;MAExDC,GAAG,GAAGC,EAAE,CAAChB,SAAD,EAAYC,SAAZ;sBAGZgB,mBAAAA,eAAAA,MAAAA,eACGA,KAAK,CAACC,cAAND,CAAqBf,QAArBe,iBACGA,KAAK,CAACE,YAANF,CACEf,QADFe;AAGEL,EAAAA,eAAe,CAACV,QAAQ,CAACkB,KAAV,EAAiBlB,QAAQ,CAACH,GAA1B,CAHjBkB,CADHA,GAMG,IAPNA,eAQEA,mBAAAA,CAACI,YAADJ,oBAAkBN,cAAc,GAAhCM,eACEA,mBAAAA,MAAAA;AAAKlB,IAAAA,GAAG,EAAEA;AAAKE,IAAAA,SAAS,EAAEc;KAASL,UAAnCO,eACEA,mBAAAA,UAAAA;AAAShB,IAAAA,SAAS,EAAKD,SAAL;GAAlBiB,EACGb,IAAI,gBAAGa,mBAAAA,OAAAA;AAAMhB,IAAAA,SAAS,EAAKD,SAAL;GAAfiB,EAAgDb,IAAhDa,CAAH,GAAkE,IADzEA,eAEEA,mBAAAA,MAAAA;AAAKhB,IAAAA,SAAS,EAAKD,SAAL;GAAdiB,EAAgDd,KAAhDc,CAFFA,CADFA,eAKEA,mBAAAA,MAAAA;AAAKhB,IAAAA,SAAS,EAAKD,SAAL;GAAdiB,eACEA,mBAAAA,CAACK,MAADL;AACEhB,IAAAA,SAAS,EAAKD,SAAL;AACTuB,IAAAA,IAAI,EAAC;AACLC,IAAAA,UAAU,EAAC;AACXC,IAAAA,IAAI,EAAC;AACLC,IAAAA,OAAO,EAAEb;GALXI,EAOGX,UAPHW,CADFA,eAUEA,mBAAAA,CAACK,MAADL;AACEhB,IAAAA,SAAS,EAAKD,SAAL;AACTuB,IAAAA,IAAI,EAAC;AACLE,IAAAA,IAAI,EAAC;AACLC,IAAAA,OAAO,EAAEZ;GAJXG,EAMGV,WANHU,CAVFA,CALFA,CADFA,CARFA;AArB8B,CAAA;;AAoEpC,IAAIU,OAAJ,EAAa;AACX/B,EAAAA,UAAU,CAACgC,WAAXhC,GAAyB,YAAzBA;;;"}
1
+ {"version":3,"file":"PopConfirm.js","sources":["../../src/PopConfirm.tsx"],"sourcesContent":[null],"names":["POP_CONFIRM_PREFIX","getPrefixCls","PopConfirm","forwardRef","_a","ref","prefixCls","className","children","title","icon","defaultTipIcon","cancelText","confirmText","footer","rest","usePopConfirm","rootProps","getPopperProps","getTriggerProps","onCancel","onConfirm","cls","cx","hasConfirm","hasCancel","hasFooter","React","isValidElement","cloneElement","props","PopperPortal","undefined","Button","key","type","size","onClick","__DEV__","displayName"],"mappings":";;;;;;;;;;;;;;;;;AASA,IAAMA,kBAAkB,GAAGC,YAAY,CAAC,aAAD,CAAvC;AAEA;;;;IAGaC,UAAU,gBAAGC,UAAU,CAClC,UACEC,EADF,EAaEC,GAbF;wBAEIC;MAAAA,sCAAYN;MAEZO,eAAAA;MACAC,cAAAA;MACAC,WAAAA;mBACAC;MAAAA,4BAAOC;yBACPC;MAAAA,wCAAa;0BACbC;MAAAA,0CAAc;MACdC,YAAAA;MACGC,kBAVL,YAAA,QAAA,aAAA,YAAA,SAAA,QAAA,cAAA,eAAA,UAAA;;uBAc4EC,aAAa,CAACD,IAAD;MAAjFE,SAAR,kBAAQA;MAAWC,cAAnB,kBAAmBA;MAAgBC,eAAnC,kBAAmCA;MAAiBC,QAApD,kBAAoDA;MAAUC,SAA9D,kBAA8DA;;MAExDC,GAAG,GAAGC,EAAE,CAACjB,SAAD,EAAYC,SAAZ;MAERiB,UAAU,GAAGX,WAAW,KAAK;MAC7BY,SAAS,GAAGb,UAAU,KAAK;MAC3Bc,SAAS,GAAGF,UAAU,IAAIC,SAAdD,IAA2BV,MAAM,KAAK;sBAGtDa,mBAAAA,eAAAA,MAAAA,eACGA,KAAK,CAACC,cAAND,CAAqBnB,QAArBmB,iBACGA,KAAK,CAACE,YAANF,CACEnB,QADFmB;AAGER,EAAAA,eAAe,CAACX,QAAQ,CAACsB,KAAV,EAAiBtB,QAAQ,CAACH,GAA1B,CAHjBsB,CADHA,GAMG,IAPNA,eAQEA,mBAAAA,CAACI,YAADJ,oBAAkBT,cAAc,GAAhCS,eACEA,mBAAAA,MAAAA;AAAKtB,IAAAA,GAAG,EAAEA;AAAKE,IAAAA,SAAS,EAAEe;KAASL,UAAnCU,eACEA,mBAAAA,UAAAA;AAASpB,IAAAA,SAAS,EAAKD,SAAL;GAAlBqB,EACGjB,IAAI,gBAAGiB,mBAAAA,OAAAA;AAAMpB,IAAAA,SAAS,EAAKD,SAAL;GAAfqB,EAAgDjB,IAAhDiB,CAAH,GAAkE,IADzEA,eAEEA,mBAAAA,MAAAA;AAAKpB,IAAAA,SAAS,EAAKD,SAAL;GAAdqB,EAAgDlB,KAAhDkB,CAFFA,CADFA,EAMGD,SAAS,gBACRC,mBAAAA,SAAAA;AAAQpB,IAAAA,SAAS,EAAKD,SAAL;GAAjBqB,EACGb,MAAM,KAAKkB,SAAXlB,GACG,CACEW,SAAS,gBACPE,mBAAAA,CAACM,MAADN;AACEO,IAAAA,GAAG,EAAC;AACJ3B,IAAAA,SAAS,EAAKD,SAAL;AACT6B,IAAAA,IAAI,EAAC;AACLC,IAAAA,IAAI,EAAC;AACLC,IAAAA,OAAO,EAAEjB;GALXO,EAOGf,UAPHe,CADO,GAUL,IAXN,EAYEH,UAAU,gBACRG,mBAAAA,CAACM,MAADN;AACEO,IAAAA,GAAG,EAAC;AACJ3B,IAAAA,SAAS,EAAKD,SAAL;AACT6B,IAAAA,IAAI,EAAC;AACLC,IAAAA,IAAI,EAAC;AACLC,IAAAA,OAAO,EAAEhB;GALXM,EAOGd,WAPHc,CADQ,GAUN,IAtBN,CADHb,GAyBGA,MA1BNa,CADQ,GA6BN,IAnCNA,CADFA,CARFA;AAzB8B,CAAA;;AAoGpC,IAAIW,OAAJ,EAAa;AACXpC,EAAAA,UAAU,CAACqC,WAAXrC,GAAyB,YAAzBA;;;"}
package/lib/esm/styles/index.scss.js CHANGED
@@ -7,7 +7,7 @@
7
7
  * This source code is licensed under the MIT license found in the
8
8
  * LICENSE file in the root directory of this source tree.
9
9
  */
10
- var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-pop-confirm {\n overflow-wrap: break-word;\n font-size: 0.875rem;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n line-height: 1.375rem;\n line-height: var(--hi-v4-text-lineheight-normal, 1.375rem);\n position: relative;\n background: #fff;\n background: var(--hi-v4-color-static-white, #fff);\n white-space: nowrap;\n -webkit-transition: all 0.5s;\n transition: all 0.5s;\n border-radius: 0.25rem;\n border-radius: var(--hi-v4-border-radius-normal, 0.25rem);\n padding: 12px 16px;\n padding: var(--hi-v4-spacing-6, 12px) var(--hi-v4-spacing-8, 16px);\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column; }\n.hi-v4-pop-confirm__content {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n.hi-v4-pop-confirm__content-icon {\n margin-right: 8px;\n margin-right: var(--hi-v4-spacing-4, 8px);\n color: #ffb40a;\n color: var(--hi-v4-color-amber-500, #ffb40a);\n font-size: 1.25rem;\n font-size: var(--hi-v4-text-size-xxl, 1.25rem); }\n.hi-v4-pop-confirm__footer {\n margin-top: 12px;\n margin-top: var(--hi-v4-spacing-6, 12px);\n text-align: right; }\n";
10
+ var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-pop-confirm {\n overflow-wrap: break-word;\n font-size: 0.875rem;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n line-height: 1.375rem;\n line-height: var(--hi-v4-text-lineheight-normal, 1.375rem);\n position: relative;\n background: #fff;\n background: var(--hi-v4-color-static-white, #fff);\n white-space: nowrap;\n -webkit-transition: all 0.5s;\n transition: all 0.5s;\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 20px;\n padding: var(--hi-v4-spacing-10, 20px);\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column; }\n.hi-v4-pop-confirm__content {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n.hi-v4-pop-confirm__content-icon {\n margin-right: 8px;\n margin-right: var(--hi-v4-spacing-4, 8px);\n color: #fab007;\n color: var(--hi-v4-color-yellow-500, #fab007);\n font-size: 1.5rem;\n font-size: var(--hi-v4-text-size-xxl, 1.5rem); }\n.hi-v4-pop-confirm__footer {\n margin-top: 20px;\n margin-top: var(--hi-v4-spacing-10, 20px);\n text-align: right; }\n";
11
11
 
12
12
  var __styleInject__ = require('style-inject/dist/style-inject.es.js')["default"];
13
13
 
package/lib/esm/use-pop-confirm.js CHANGED
@@ -8,61 +8,55 @@
8
8
  * LICENSE file in the root directory of this source tree.
9
9
  */
10
10
  import { __rest } from 'tslib';
11
- import { useCallback, useMemo, useState } from 'react';
12
- import '@hi-ui/icons';
13
- import { useUncontrolledState } from '@hi-ui/use-uncontrolled-state';
11
+ import { useCallback, useState } from 'react';
14
12
  import { useLatestCallback } from '@hi-ui/use-latest';
15
13
  import { mockDefaultHandlers } from '@hi-ui/dom-utils';
16
14
  import { mergeRefs, withDefaultProps } from '@hi-ui/react-utils';
15
+ import { omitPopperOverlayProps } from '@hi-ui/popper';
16
+ import { useUncontrolledToggle } from '@hi-ui/use-toggle';
17
17
 
18
18
  var usePopConfirm = function usePopConfirm(_a) {
19
- var _a$role = _a.role,
20
- role = _a$role === void 0 ? 'alert-dialog' : _a$role,
21
- visibleProp = _a.visible,
22
- onCloseProp = _a.onClose,
19
+ var visibleProp = _a.visible,
23
20
  _a$closeOnCancel = _a.closeOnCancel,
24
21
  closeOnCancel = _a$closeOnCancel === void 0 ? true : _a$closeOnCancel,
25
22
  _a$closeOnConfirm = _a.closeOnConfirm,
26
23
  closeOnConfirm = _a$closeOnConfirm === void 0 ? true : _a$closeOnConfirm,
27
24
  onCancelProp = _a.onCancel,
28
25
  onConfirmProp = _a.onConfirm,
29
- popper = _a.popper,
30
- rest = __rest(_a, ["role", "visible", "onClose", "disabled", "icon", "closeOnCancel", "closeOnConfirm", "onCancel", "onConfirm", "popper"]);
26
+ onOpen = _a.onOpen,
27
+ _onClose = _a.onClose,
28
+ restProps = __rest(_a, ["visible", "disabled", "closeOnCancel", "closeOnConfirm", "onCancel", "onConfirm", "onOpen", "onClose"]); // TODO: 移除 popper，使用 hook 重写
31
29
 
32
- var _useUncontrolledState = useUncontrolledState(false, visibleProp, function (nextVisible) {
33
- if (!nextVisible) {
34
- onCloseProp === null || onCloseProp === void 0 ? void 0 : onCloseProp();
30
+
31
+ var _omitPopperOverlayPro = omitPopperOverlayProps(restProps),
32
+ popper = _omitPopperOverlayPro[0],
33
+ rest = _omitPopperOverlayPro[1];
34
+
35
+ var _useUncontrolledToggl = useUncontrolledToggle({
36
+ defaultVisible: false,
37
+ visible: visibleProp,
38
+ onOpen: onOpen,
39
+ onClose: function onClose() {
40
+ _onClose === null || _onClose === void 0 ? void 0 : _onClose();
41
+ onCancelProp === null || onCancelProp === void 0 ? void 0 : onCancelProp();
35
42
  }
36
43
  }),
37
- visible = _useUncontrolledState[0],
38
- trySetVisible = _useUncontrolledState[1];
44
+ visible = _useUncontrolledToggl[0],
45
+ visibleAction = _useUncontrolledToggl[1];
39
46
 
40
- var onToggle = useCallback(function () {
41
- trySetVisible(function (prev) {
42
- return !prev;
43
- });
44
- }, [trySetVisible]);
45
- var onClose = useCallback(function () {
46
- trySetVisible(false);
47
- }, [trySetVisible]);
48
- var cancelClose = useCallback(function () {
47
+ var onCancel = useCallback(function () {
49
48
  if (closeOnCancel) {
50
- onClose();
49
+ visibleAction.off();
51
50
  }
52
- }, [closeOnCancel, onClose]);
53
- var confirmClose = useCallback(function () {
51
+ }, [closeOnCancel, visibleAction]);
52
+ var onConfirmLatest = useLatestCallback(onConfirmProp);
53
+ var onConfirm = useCallback(function () {
54
+ onConfirmLatest();
55
+
54
56
  if (closeOnConfirm) {
55
- onClose();
57
+ visibleAction.off();
56
58
  }
57
- }, [closeOnConfirm, onClose]);
58
- var onCancelLatest = useLatestCallback(onCancelProp);
59
- var onConfirmLatest = useLatestCallback(onConfirmProp);
60
- var onCancel = useMemo(function () {
61
- return mockDefaultHandlers(onCancelLatest, cancelClose);
62
- }, [onCancelLatest, cancelClose]);
63
- var onConfirm = useMemo(function () {
64
- return mockDefaultHandlers(onConfirmLatest, confirmClose);
65
- }, [onConfirmLatest, confirmClose]);
59
+ }, [closeOnConfirm, visibleAction, onConfirmLatest]);
66
60
 
67
61
  var _useState = useState(null),
68
62
  targetEl = _useState[0],
@@ -71,23 +65,25 @@ var usePopConfirm = function usePopConfirm(_a) {
71
65
  var getTriggerProps = useCallback(function (props, ref) {
72
66
  return {
73
67
  ref: mergeRefs(setTargetEl, ref),
74
- onClick: mockDefaultHandlers(props.onClick, onToggle)
68
+ onClick: mockDefaultHandlers(props.onClick, visibleAction.not)
75
69
  };
76
- }, [onToggle, setTargetEl]);
70
+ }, [visibleAction, setTargetEl]);
77
71
  var getPopperProps = useCallback(function () {
78
72
  var popperProps = withDefaultProps(popper, {
79
73
  arrow: true,
80
- placement: 'top'
74
+ placement: 'top',
75
+ // @DesignToken 10
76
+ gutterGap: 14
81
77
  });
82
78
  return Object.assign(Object.assign({}, popperProps), {
83
79
  visible: visible,
84
80
  attachEl: targetEl,
85
- onClose: onClose
81
+ onClose: visibleAction.off
86
82
  });
87
- }, [visible, targetEl, popper, onClose]);
88
- var rootProps = Object.assign(Object.assign({}, rest), {
89
- role: role
90
- });
83
+ }, [visible, targetEl, popper, visibleAction]);
84
+ var rootProps = Object.assign({
85
+ role: 'alert-dialog'
86
+ }, rest);
91
87
  return {
92
88
  rootProps: rootProps,
93
89
  getTriggerProps: getTriggerProps,
package/lib/esm/use-pop-confirm.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"use-pop-confirm.js","sources":["../../src/use-pop-confirm.ts"],"sourcesContent":[null],"names":["usePopConfirm","_a","role","visibleProp","visible","onCloseProp","onClose","closeOnCancel","closeOnConfirm","onCancelProp","onCancel","onConfirmProp","onConfirm","popper","rest","useUncontrolledState","nextVisible","trySetVisible","onToggle","useCallback","prev","cancelClose","confirmClose","onCancelLatest","useLatestCallback","onConfirmLatest","useMemo","mockDefaultHandlers","useState","targetEl","setTargetEl","getTriggerProps","props","ref","mergeRefs","onClick","getPopperProps","popperProps","withDefaultProps","arrow","placement","attachEl","rootProps"],"mappings":";;;;;;;;;;;;;;;;;IAQaA,aAAa,GAAG,SAAhBA,aAAgB,CAACC,EAAD;mBAC3BC;MAAAA,4BAAO;MACEC,iBAATC;MACSC,iBAATC;4BAGAC;MAAAA,8CAAgB;6BAChBC;MAAAA,gDAAiB;MACPC,kBAAVC;MACWC,mBAAXC;MACAC,YAAAA;MACGC,kBAXyB,OAAA,WAAA,WAAA,YAAA,QAAA,iBAAA,kBAAA,YAAA,aAAA,UAAA;;8BAaKC,oBAAoB,CACnD,KADmD,EAEnDZ,WAFmD,EAGnD,UAACa,WAAD;QACM,CAACA,aAAa;AAChBX,MAAAA,WAAW,SAAXA,IAAAA,WAAW,WAAXA,SAAAA,GAAAA,WAAW,EAAXA;;AAL+C,GAAA;MAA9CD,OAAP;MAAgBa,aAAhB;;MAUMC,QAAQ,GAAGC,WAAW,CAAC;AAC3BF,IAAAA,aAAa,CAAC,UAACG,IAAD;aAAU,CAACA;AAAZ,KAAA,CAAbH;AAD0B,GAAA,EAEzB,CAACA,aAAD,CAFyB;MAItBX,OAAO,GAAGa,WAAW,CAAC;AAC1BF,IAAAA,aAAa,CAAC,KAAD,CAAbA;AADyB,GAAA,EAExB,CAACA,aAAD,CAFwB;MAIrBI,WAAW,GAAGF,WAAW,CAAC;QAC1BZ,eAAe;AACjBD,MAAAA,OAAO;;AAFoB,GAAA,EAI5B,CAACC,aAAD,EAAgBD,OAAhB,CAJ4B;MAMzBgB,YAAY,GAAGH,WAAW,CAAC;QAC3BX,gBAAgB;AAClBF,MAAAA,OAAO;;AAFqB,GAAA,EAI7B,CAACE,cAAD,EAAiBF,OAAjB,CAJ6B;MAM1BiB,cAAc,GAAGC,iBAAiB,CAACf,YAAD;MAClCgB,eAAe,GAAGD,iBAAiB,CAACb,aAAD;MAEnCD,QAAQ,GAAGgB,OAAO,CAAC;WAAMC,mBAAmB,CAACJ,cAAD,EAAiBF,WAAjB;AAA1B,GAAA,EAAyD,CAC/EE,cAD+E,EAE/EF,WAF+E,CAAzD;MAKlBT,SAAS,GAAGc,OAAO,CAAC;WAAMC,mBAAmB,CAACF,eAAD,EAAkBH,YAAlB;AAA1B,GAAA,EAA2D,CAClFG,eADkF,EAElFH,YAFkF,CAA3D;;kBAKOM,QAAQ,CAAqB,IAArB;MAAjCC,QAAP;MAAiBC,WAAjB;;MAEMC,eAAe,GAAGZ,WAAW,CACjC,UAACa,KAAD,EAAQC,GAAR;WACS;AACLA,MAAAA,GAAG,EAAEC,SAAS,CAACJ,WAAD,EAAcG,GAAd,CADT;AAELE,MAAAA,OAAO,EAAER,mBAAmB,CAACK,KAAK,CAACG,OAAP,EAAgBjB,QAAhB;AAFvB;AAFwB,GAAA,EAOjC,CAACA,QAAD,EAAWY,WAAX,CAPiC;MAU7BM,cAAc,GAAGjB,WAAW,CAAC;QAC3BkB,WAAW,GAAGC,gBAAgB,CAACzB,MAAD,EAAS;AAAE0B,MAAAA,KAAK,EAAE,IAAT;AAAeC,MAAAA,SAAS,EAAE;AAA1B,KAAT;2CAG/BH;AACHjC,MAAAA,OAAO,EAAPA;AACAqC,MAAAA,QAAQ,EAAEZ;AACVvB,MAAAA,OAAO,EAAPA;;AAP8B,GAAA,EAS/B,CAACF,OAAD,EAAUyB,QAAV,EAAoBhB,MAApB,EAA4BP,OAA5B,CAT+B;MAW5BoC,SAAS,mCACV5B;AACHZ,IAAAA,IAAI,EAAJA;;SAGK;AACLwC,IAAAA,SAAS,EAATA,SADK;AAELX,IAAAA,eAAe,EAAfA,eAFK;AAGLK,IAAAA,cAAc,EAAdA,cAHK;AAIL1B,IAAAA,QAAQ,EAARA,QAJK;AAKLE,IAAAA,SAAS,EAATA;AALK;;;"}
1
+ {"version":3,"file":"use-pop-confirm.js","sources":["../../src/use-pop-confirm.ts"],"sourcesContent":[null],"names":["usePopConfirm","_a","visibleProp","visible","closeOnCancel","closeOnConfirm","onCancelProp","onCancel","onConfirmProp","onConfirm","onOpen","onClose","restProps","omitPopperOverlayProps","popper","rest","useUncontrolledToggle","defaultVisible","visibleAction","useCallback","off","onConfirmLatest","useLatestCallback","useState","targetEl","setTargetEl","getTriggerProps","props","ref","mergeRefs","onClick","mockDefaultHandlers","not","getPopperProps","popperProps","withDefaultProps","arrow","placement","gutterGap","attachEl","rootProps","role"],"mappings":";;;;;;;;;;;;;;;;;IAOaA,aAAa,GAAG,SAAhBA,aAAgB,CAACC,EAAD;MAClBC,iBAATC;4BAEAC;MAAAA,8CAAgB;6BAChBC;MAAAA,gDAAiB;MACPC,kBAAVC;MACWC,mBAAXC;MACAC,YAAAA;MACAC,cAAAA;MACGC,uBATyB,UAAA,YAAA,iBAAA,kBAAA,YAAA,aAAA,UAAA,WAAA;;;8BAYLC,sBAAsB,CAACD,SAAD;MAAtCE,MAAP;MAAeC,IAAf;;8BAEiCC,qBAAqB,CAAC;AACrDC,IAAAA,cAAc,EAAE,KADqC;AAErDd,IAAAA,OAAO,EAAED,WAF4C;AAGrDQ,IAAAA,MAAM,EAANA,MAHqD;AAIrDC,IAAAA,OAAO,EAAE,gBAAA;AACPA,MAAAA,QAAO,SAAPA,IAAAA,QAAO,WAAPA,SAAAA,GAAAA,QAAO,EAAPA;AACAL,MAAAA,YAAY,SAAZA,IAAAA,YAAY,WAAZA,SAAAA,GAAAA,YAAY,EAAZA;;AANmD,GAAD;MAA/CH,OAAP;MAAgBe,aAAhB;;MAUMX,QAAQ,GAAGY,WAAW,CAAC;QACvBf,eAAe;AACjBc,MAAAA,aAAa,CAACE,GAAdF;;AAFwB,GAAA,EAIzB,CAACd,aAAD,EAAgBc,aAAhB,CAJyB;MAMtBG,eAAe,GAAGC,iBAAiB,CAACd,aAAD;MAEnCC,SAAS,GAAGU,WAAW,CAAC;AAC5BE,IAAAA,eAAe;;QACXhB,gBAAgB;AAClBa,MAAAA,aAAa,CAACE,GAAdF;;AAHyB,GAAA,EAK1B,CAACb,cAAD,EAAiBa,aAAjB,EAAgCG,eAAhC,CAL0B;;kBAOGE,QAAQ,CAAqB,IAArB;MAAjCC,QAAP;MAAiBC,WAAjB;;MAEMC,eAAe,GAAGP,WAAW,CACjC,UAACQ,KAAD,EAAQC,GAAR;WACS;AACLA,MAAAA,GAAG,EAAEC,SAAS,CAACJ,WAAD,EAAcG,GAAd,CADT;AAELE,MAAAA,OAAO,EAAEC,mBAAmB,CAACJ,KAAK,CAACG,OAAP,EAAgBZ,aAAa,CAACc,GAA9B;AAFvB;AAFwB,GAAA,EAOjC,CAACd,aAAD,EAAgBO,WAAhB,CAPiC;MAU7BQ,cAAc,GAAGd,WAAW,CAAC;QAC3Be,WAAW,GAAGC,gBAAgB,CAACrB,MAAD,EAAS;AAC3CsB,MAAAA,KAAK,EAAE,IADoC;AAE3CC,MAAAA,SAAS,EAAE,KAFgC;;AAI3CC,MAAAA,SAAS,EAAE;AAJgC,KAAT;2CAQ/BJ;AACH/B,MAAAA,OAAO,EAAPA;AACAoC,MAAAA,QAAQ,EAAEf;AACVb,MAAAA,OAAO,EAAEO,aAAa,CAACE;;AAZO,GAAA,EAc/B,CAACjB,OAAD,EAAUqB,QAAV,EAAoBV,MAApB,EAA4BI,aAA5B,CAd+B;MAgB5BsB,SAAS;AACbC,IAAAA,IAAI,EAAE;KACH1B;SAGE;AACLyB,IAAAA,SAAS,EAATA,SADK;AAELd,IAAAA,eAAe,EAAfA,eAFK;AAGLO,IAAAA,cAAc,EAAdA,cAHK;AAIL1B,IAAAA,QAAQ,EAARA,QAJK;AAKLE,IAAAA,SAAS,EAATA;AALK;;;"}
package/lib/types/PopConfirm.d.ts CHANGED
@@ -10,4 +10,20 @@ export interface PopConfirmProps extends Omit<HiBaseHTMLProps<'div'>, 'title'>,
10
10
  * 确认框标题
11
11
  */
12
12
  title: React.ReactNode;
13
+ /**
14
+ * 取消按钮文案
15
+ */
16
+ cancelText?: React.ReactNode;
17
+ /**
18
+ * 确认按钮文案
19
+ */
20
+ confirmText?: React.ReactNode;
21
+ /**
22
+ * 自定义提示的 icon 图标
23
+ */
24
+ icon?: React.ReactNode;
25
+ /**
26
+ * 自定义底部内容
27
+ */
28
+ footer?: React.ReactNode;
13
29
  }
package/lib/types/use-pop-confirm.d.ts CHANGED
@@ -1,109 +1,56 @@
1
- import React from 'react';
2
- import { PopperPortalProps } from '@hi-ui/popper';
3
- export declare const usePopConfirm: ({ role, visible: visibleProp, onClose: onCloseProp, disabled, icon, closeOnCancel, closeOnConfirm, onCancel: onCancelProp, onConfirm: onConfirmProp, popper, ...rest }: UsePopConfirmProps) => {
4
- rootProps: {
5
- role: React.AriaRole;
6
- /**
7
- * 取消按钮文案
8
- */
9
- cancelText?: React.ReactNode;
10
- /**
11
- * 确认按钮文案
12
- */
13
- confirmText?: React.ReactNode;
14
- };
1
+ /// <reference types="react" />
2
+ export declare const usePopConfirm: ({ visible: visibleProp, disabled, closeOnCancel, closeOnConfirm, onCancel: onCancelProp, onConfirm: onConfirmProp, onOpen, onClose, ...restProps }: UsePopConfirmProps) => {
3
+ rootProps: any;
15
4
  getTriggerProps: (props: any, ref: any) => {
16
5
  ref: ((value: HTMLElement | ((prevState: HTMLElement | null) => HTMLElement | null)) => void) | null;
17
- onClick: (event: React.SyntheticEvent<Element, Event>) => void;
6
+ onClick: (event: import("react").SyntheticEvent<Element, Event>) => void;
18
7
  };
19
8
  getPopperProps: () => {
20
9
  visible: boolean;
21
10
  attachEl: HTMLElement | null;
22
11
  onClose: () => void;
23
- style?: React.CSSProperties | undefined;
24
- children?: React.ReactNode;
25
- role?: string | undefined;
26
- disabledPortal?: boolean | undefined;
27
- container?: HTMLElement | (() => HTMLElement | null) | null | undefined;
28
- prefixCls?: string | undefined;
29
- className?: string | undefined;
30
- zIndex?: number | undefined;
31
- closeOnEsc?: boolean | undefined;
32
- closeOnOutsideClick?: boolean | undefined;
33
- preload?: boolean | undefined;
34
- unmountOnClose?: boolean | undefined;
35
- onOutsideClick?: ((evt: Event) => void) | undefined;
36
- gutterGap?: number | undefined;
37
- crossGap?: number | undefined;
38
- preventOverflow?: boolean | undefined;
39
- flip?: boolean | undefined;
40
- matchWidth?: boolean | undefined;
41
- eventListeners?: boolean | {
42
- scroll?: boolean | undefined;
43
- resize?: boolean | undefined;
44
- } | undefined;
45
- modifiers?: readonly import("@popperjs/core").Modifier<string, any>[] | undefined;
46
- arrowPadding?: number | undefined;
47
- strategy?: "absolute" | "fixed" | undefined;
48
- onKeyDown?: ((evt: React.KeyboardEvent<Element>) => void) | undefined;
49
- onEnter?: (() => void) | undefined;
50
- onExit?: (() => void) | undefined;
51
- onEntered?: (() => void) | undefined;
52
- onExited?: (() => void) | undefined;
53
- arrow: boolean;
54
- placement: import("@popperjs/core").Placement;
12
+ arrow: any;
13
+ placement: any;
14
+ gutterGap: any;
55
15
  };
56
- onCancel: (event: React.SyntheticEvent<Element, Event>) => void;
57
- onConfirm: (event: React.SyntheticEvent<Element, Event>) => void;
16
+ onCancel: () => void;
17
+ onConfirm: () => void;
58
18
  };
59
19
  export interface UsePopConfirmProps {
60
- /**
61
- * 语义化标签
62
- */
63
- role?: React.AriaRole;
64
20
  /**
65
21
  * 是否显示确认框
66
22
  */
67
23
  visible?: boolean;
68
24
  /**
69
- * 确认框关闭时回调
25
+ * 取消时关闭确认框。暂不对外暴露
26
+ * @private
70
27
  */
71
- onClose?: () => void;
28
+ closeOnCancel?: boolean;
72
29
  /**
73
- * 取消按钮文案
30
+ * 确认时关闭确认框。暂不对外暴露
31
+ * @private
74
32
  */
75
- cancelText?: React.ReactNode;
33
+ closeOnConfirm?: boolean;
76
34
  /**
77
- * 确认按钮文案
35
+ * 弹窗打开时回调
78
36
  */
79
- confirmText?: React.ReactNode;
37
+ onOpen?: () => void;
80
38
  /**
81
- * 取消时关闭确认框
39
+ * 弹窗关闭时回调
82
40
  */
83
- closeOnCancel?: boolean;
84
- /**
85
- * 确认时关闭确认框
86
- */
87
- closeOnConfirm?: boolean;
41
+ onClose?: () => void;
88
42
  /**
89
43
  * 点击取消按钮时回调
90
44
  */
91
- onCancel?: (event: React.MouseEvent) => void;
45
+ onCancel?: () => void;
92
46
  /**
93
47
  * 点击确认按钮时回调
94
48
  */
95
- onConfirm?: (event: React.MouseEvent) => void;
49
+ onConfirm?: () => void;
96
50
  /**
97
- * 是否开启禁用
51
+ * 是否开启禁用。暂不对外暴露
52
+ * @private
98
53
  */
99
54
  disabled?: boolean;
100
- /**
101
- * 自定义提示的 icon 图标
102
- */
103
- icon?: React.ReactNode;
104
- /**
105
- * 自定义控制 popper 行为，参见 `PopperProps`
106
- */
107
- popper?: Omit<PopperPortalProps, 'visible' | 'attachEl' | 'onClose'>;
108
55
  }
109
56
  export declare type UsePopConfirmReturn = ReturnType<typeof usePopConfirm>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hi-ui/pop-confirm",
3
- "version": "4.0.0-alpha.2",
3
+ "version": "4.0.0-alpha.23",
4
4
  "description": "A sub-package for @hi-ui/hiui.",
5
5
  "keywords": [],
6
6
  "author": "HIUI <mi-hiui@xiaomi.com>",
@@ -43,26 +43,27 @@
43
43
  "url": "https://github.com/XiaoMi/hiui/issues"
44
44
  },
45
45
  "dependencies": {
46
- "@hi-ui/button": "^4.0.0-alpha.7",
47
- "@hi-ui/classname": "^4.0.0-alpha.0",
48
- "@hi-ui/core": "^4.0.0-alpha.5",
49
- "@hi-ui/core-css": "^4.0.0-alpha.3",
50
- "@hi-ui/dom-utils": "^4.0.0-alpha.2",
51
- "@hi-ui/env": "^4.0.0-alpha.0",
52
- "@hi-ui/icons": "^4.0.0-alpha.10",
53
- "@hi-ui/popper": "^4.0.0-alpha.8",
54
- "@hi-ui/react-utils": "^4.0.0-alpha.2",
55
- "@hi-ui/use-latest": "^4.0.0-alpha.2",
56
- "@hi-ui/use-uncontrolled-state": "^4.0.0-alpha.6"
46
+ "@hi-ui/button": "^4.0.0-alpha.26",
47
+ "@hi-ui/classname": "^4.0.0-alpha.3",
48
+ "@hi-ui/core": "^4.0.0-alpha.20",
49
+ "@hi-ui/core-css": "^4.0.0-alpha.14",
50
+ "@hi-ui/dom-utils": "^4.0.0-alpha.7",
51
+ "@hi-ui/env": "^4.0.0-alpha.6",
52
+ "@hi-ui/icons": "^4.0.0-alpha.29",
53
+ "@hi-ui/popper": "^4.0.0-alpha.25",
54
+ "@hi-ui/react-utils": "^4.0.0-alpha.8",
55
+ "@hi-ui/use-latest": "^4.0.0-alpha.5",
56
+ "@hi-ui/use-toggle": "^4.0.0-alpha.12",
57
+ "@hi-ui/use-uncontrolled-state": "^4.0.0-alpha.14"
57
58
  },
58
59
  "peerDependencies": {
59
- "react": "^17.0.1",
60
- "react-dom": "^17.0.1"
60
+ "react": ">=16.8.6",
61
+ "react-dom": ">=16.8.6"
61
62
  },
62
63
  "devDependencies": {
63
- "@hi-ui/hi-build": "^4.0.0-alpha.0",
64
+ "@hi-ui/hi-build": "^4.0.0-alpha.4",
64
65
  "react": "^17.0.1",
65
66
  "react-dom": "^17.0.1"
66
67
  },
67
- "gitHead": "0135b7a54f5436ac6e5a8ab88daf8468591e18ac"
68
+ "gitHead": "fe96d3d280880a417b9784fa64376e20cd8a8fad"
68
69
  }