@arcblock/ux 2.9.25 → 2.9.27

package/es/Dialog/confirm.js

@@ -1,4 +1,5 @@
 import PropTypes from 'prop-types';
+import { useMemoizedFn } from 'ahooks';
 import Button from '../Button';
 import Dialog from './dialog';
 
@@ -29,6 +30,7 @@ export default function Confirm({
   children,
   onConfirm,
   onCancel,
+  showCloseButton,
   showCancelButton,
   confirmButton,
   cancelButton,
@@ -39,11 +41,18 @@ export default function Confirm({
   PaperProps.style = Object.assign({
     minHeight: 0
   }, PaperProps.style);
+  const handleClose = useMemoizedFn((e, reason) => {
+    if (['backdropClick', 'escapeKeyDown'].includes(reason)) {
+      return;
+    }
+    onCancel();
+  });
   return /*#__PURE__*/_jsx(Dialog, {
     title: title,
     PaperProps: PaperProps,
     ...rest,
-    onClose: () => onCancel(),
+    onClose: handleClose,
+    showCloseButton: showCloseButton,
     slotProps: {
       header: {
         sx: {
@@ -60,7 +69,7 @@ export default function Confirm({
     },
     actions: /*#__PURE__*/_jsxs(_Fragment, {
       children: [showCancelButton && /*#__PURE__*/_jsx(Button, {
-        onClick: () => onCancel(),
+        onClick: e => onCancel(e, 'closeButton'),
         color: "primary",
         ...cancelButton.props,
         children: cancelButton.text
@@ -81,6 +90,7 @@ Confirm.propTypes = {
   onConfirm: PropTypes.func.isRequired,
   onCancel: PropTypes.func.isRequired,
   showCancelButton: PropTypes.bool,
+  showCloseButton: PropTypes.bool,
   // 可以传入 {text: ..., props: ...}
   confirmButton: PropTypes.shape({
     text: PropTypes.string.isRequired,
@@ -93,6 +103,7 @@ Confirm.propTypes = {
   PaperProps: PropTypes.object
 };
 Confirm.defaultProps = {
+  showCloseButton: true,
   showCancelButton: true,
   confirmButton: {
     text: 'Confirm'

package/es/Dialog/use-confirm.js

@@ -13,6 +13,8 @@ const ConfirmHolder = /*#__PURE__*/forwardRef((props, ref) => {
     onConfirm: noop,
     onCancel: noop,
     loading: false,
+    showCancelButton: true,
+    showCloseButton: true,
     confirmButtonText: 'Confirm',
     cancelButtonText: 'Cancel'
   });
@@ -21,6 +23,7 @@ const ConfirmHolder = /*#__PURE__*/forwardRef((props, ref) => {
     setContent(params.content);
     state.onConfirm = params.onConfirm || noop;
     state.onCancel = params.onCancel || noop;
+    state.showCloseButton = params.showCloseButton ?? true;
     state.showCancelButton = params.showCancelButton ?? true;
     if (params.confirmButtonText) state.confirmButtonText = params.confirmButtonText;
     if (params.cancelButtonText) state.cancelButtonText = params.cancelButtonText;
@@ -73,6 +76,7 @@ const ConfirmHolder = /*#__PURE__*/forwardRef((props, ref) => {
         loading: state.loading
       }
     },
+    showCloseButton: state.showCloseButton,
     showCancelButton: state.showCancelButton,
     cancelButton: {
       text: state.cancelButtonText,

package/lib/Dialog/confirm.js

@@ -5,10 +5,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = Confirm;
 var _propTypes = _interopRequireDefault(require("prop-types"));
+var _ahooks = require("ahooks");
 var _Button = _interopRequireDefault(require("../Button"));
 var _dialog = _interopRequireDefault(require("./dialog"));
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["title", "children", "onConfirm", "onCancel", "showCancelButton", "confirmButton", "cancelButton", "PaperProps"];
+const _excluded = ["title", "children", "onConfirm", "onCancel", "showCloseButton", "showCancelButton", "confirmButton", "cancelButton", "PaperProps"];
 /**
   @typedef {Object} ConfirmProps
   @property {boolean} open
@@ -41,6 +42,7 @@ function Confirm(_ref) {
       children,
       onConfirm,
       onCancel,
+      showCloseButton,
       showCancelButton,
       confirmButton,
       cancelButton,
@@ -51,11 +53,18 @@ function Confirm(_ref) {
   PaperProps.style = Object.assign({
     minHeight: 0
   }, PaperProps.style);
+  const handleClose = (0, _ahooks.useMemoizedFn)((e, reason) => {
+    if (['backdropClick', 'escapeKeyDown'].includes(reason)) {
+      return;
+    }
+    onCancel();
+  });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_dialog.default, _objectSpread(_objectSpread({
     title: title,
     PaperProps: PaperProps
   }, rest), {}, {
-    onClose: () => onCancel(),
+    onClose: handleClose,
+    showCloseButton: showCloseButton,
     slotProps: {
       header: {
         sx: {
@@ -72,7 +81,7 @@ function Confirm(_ref) {
     },
     actions: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
       children: [showCancelButton && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, _objectSpread(_objectSpread({
-        onClick: () => onCancel(),
+        onClick: e => onCancel(e, 'closeButton'),
         color: "primary"
       }, cancelButton.props), {}, {
         children: cancelButton.text
@@ -93,6 +102,7 @@ Confirm.propTypes = {
   onConfirm: _propTypes.default.func.isRequired,
   onCancel: _propTypes.default.func.isRequired,
   showCancelButton: _propTypes.default.bool,
+  showCloseButton: _propTypes.default.bool,
   // 可以传入 {text: ..., props: ...}
   confirmButton: _propTypes.default.shape({
     text: _propTypes.default.string.isRequired,
@@ -105,6 +115,7 @@ Confirm.propTypes = {
   PaperProps: _propTypes.default.object
 };
 Confirm.defaultProps = {
+  showCloseButton: true,
   showCancelButton: true,
   confirmButton: {
     text: 'Confirm'

package/lib/Dialog/use-confirm.js

@@ -25,16 +25,19 @@ const ConfirmHolder = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
     onConfirm: _noop.default,
     onCancel: _noop.default,
     loading: false,
+    showCancelButton: true,
+    showCloseButton: true,
     confirmButtonText: 'Confirm',
     cancelButtonText: 'Cancel'
   });
   const open = (0, _ahooks.useMemoizedFn)(function () {
-    var _params$showCancelBut;
+    var _params$showCloseButt, _params$showCancelBut;
     let params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     setTitle(params.title);
     setContent(params.content);
     state.onConfirm = params.onConfirm || _noop.default;
     state.onCancel = params.onCancel || _noop.default;
+    state.showCloseButton = (_params$showCloseButt = params.showCloseButton) !== null && _params$showCloseButt !== void 0 ? _params$showCloseButt : true;
     state.showCancelButton = (_params$showCancelBut = params.showCancelButton) !== null && _params$showCancelBut !== void 0 ? _params$showCancelBut : true;
     if (params.confirmButtonText) state.confirmButtonText = params.confirmButtonText;
     if (params.cancelButtonText) state.cancelButtonText = params.cancelButtonText;
@@ -86,6 +89,7 @@ const ConfirmHolder = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
         loading: state.loading
       }
     },
+    showCloseButton: state.showCloseButton,
     showCancelButton: state.showCancelButton,
     cancelButton: {
       text: state.cancelButtonText,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arcblock/ux",
-  "version": "2.9.25",
+  "version": "2.9.27",
   "description": "Common used react components for arcblock products",
   "keywords": [
     "react",
@@ -352,12 +352,12 @@
   "peerDependencies": {
     "react": ">=18.1.0"
   },
-  "gitHead": "a55d6db8fb2b95082cbd879ed5469543a2c0835f",
+  "gitHead": "136c191575887728058a066851b0c8b6c72a9a57",
   "dependencies": {
     "@arcblock/did-motif": "^1.1.13",
-    "@arcblock/icons": "^2.9.25",
-    "@arcblock/nft-display": "^2.9.25",
-    "@arcblock/react-hooks": "^2.9.25",
+    "@arcblock/icons": "^2.9.27",
+    "@arcblock/nft-display": "^2.9.27",
+    "@arcblock/react-hooks": "^2.9.27",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@emotion/react": "^11.10.4",
     "@emotion/styled": "^11.10.4",

package/src/Dialog/confirm.jsx

@@ -1,4 +1,5 @@
 import PropTypes from 'prop-types';
+import { useMemoizedFn } from 'ahooks';
 
 import Button from '../Button';
 import Dialog from './dialog';
@@ -27,6 +28,7 @@ export default function Confirm({
   children,
   onConfirm,
   onCancel,
+  showCloseButton,
   showCancelButton,
   confirmButton,
   cancelButton,
@@ -41,12 +43,20 @@ export default function Confirm({
     PaperProps.style
   );
 
+  const handleClose = useMemoizedFn((e, reason) => {
+    if (['backdropClick', 'escapeKeyDown'].includes(reason)) {
+      return;
+    }
+    onCancel();
+  });
+
   return (
     <Dialog
       title={title}
       PaperProps={PaperProps}
       {...rest}
-      onClose={() => onCancel()}
+      onClose={handleClose}
+      showCloseButton={showCloseButton}
       slotProps={{
         header: {
           sx: {
@@ -62,7 +72,7 @@ export default function Confirm({
       actions={
         <>
           {showCancelButton && (
-            <Button onClick={() => onCancel()} color="primary" {...cancelButton.props}>
+            <Button onClick={(e) => onCancel(e, 'closeButton')} color="primary" {...cancelButton.props}>
               {cancelButton.text}
             </Button>
           )}
@@ -82,6 +92,7 @@ Confirm.propTypes = {
   onConfirm: PropTypes.func.isRequired,
   onCancel: PropTypes.func.isRequired,
   showCancelButton: PropTypes.bool,
+  showCloseButton: PropTypes.bool,
   // 可以传入 {text: ..., props: ...}
   confirmButton: PropTypes.shape({
     text: PropTypes.string.isRequired,
@@ -95,6 +106,7 @@ Confirm.propTypes = {
 };
 
 Confirm.defaultProps = {
+  showCloseButton: true,
   showCancelButton: true,
   confirmButton: {
     text: 'Confirm',

package/src/Dialog/use-confirm.jsx

@@ -14,6 +14,8 @@ const ConfirmHolder = forwardRef((props, ref) => {
     onConfirm: noop,
     onCancel: noop,
     loading: false,
+    showCancelButton: true,
+    showCloseButton: true,
     confirmButtonText: 'Confirm',
     cancelButtonText: 'Cancel',
   });
@@ -22,6 +24,7 @@ const ConfirmHolder = forwardRef((props, ref) => {
     setContent(params.content);
     state.onConfirm = params.onConfirm || noop;
     state.onCancel = params.onCancel || noop;
+    state.showCloseButton = params.showCloseButton ?? true;
     state.showCancelButton = params.showCancelButton ?? true;
     if (params.confirmButtonText) state.confirmButtonText = params.confirmButtonText;
     if (params.cancelButtonText) state.cancelButtonText = params.cancelButtonText;
@@ -81,6 +84,7 @@ const ConfirmHolder = forwardRef((props, ref) => {
           loading: state.loading,
         },
       }}
+      showCloseButton={state.showCloseButton}
       showCancelButton={state.showCancelButton}
       cancelButton={{
         text: state.cancelButtonText,