Skip to content

Commit c8a7999

Browse files
committed
feat: lock rc package version
1 parent 34263ca commit c8a7999

File tree

11 files changed

+372
-194
lines changed

11 files changed

+372
-194
lines changed

package.json

+8-8
Original file line numberDiff line numberDiff line change
@@ -31,14 +31,14 @@
3131
"immutability-helper": "^3.1.1",
3232
"loadsh": "^0.0.4",
3333
"monaco-editor": "^0.21.2",
34-
"rc-collapse": "^2.0.1",
35-
"rc-dialog": "^8.4.5",
36-
"rc-textarea": "^0.3.1",
37-
"rc-tree": "^3.10.0",
38-
"rc-util": "^5.5.0",
39-
"react": "^16.13.1",
40-
"react-dnd": "^9.3.4",
41-
"react-dnd-html5-backend": "^9.3.4",
34+
"rc-collapse": "~2.0.0",
35+
"rc-dialog": "~8.2.1",
36+
"rc-textarea": "~0.3.0",
37+
"rc-tree": "~3.10.0",
38+
"rc-util": "~5.1.0",
39+
"react": "~16.13.1",
40+
"react-dnd": "~9.3.4",
41+
"react-dnd-html5-backend": "~9.3.4",
4242
"react-dom": "^16.13.1",
4343
"react-scrollbars-custom": "^4.0.25",
4444
"react-split-pane": "^0.1.92",

src/components/button/index.tsx

+4-2
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,15 @@ type BtnSizeType = 'normal' | 'large';
66
export interface IButton extends React.ComponentProps<'a'> {
77
disabled?: boolean;
88
size?: BtnSizeType;
9+
onClick?(event: React.MouseEvent): void;
910
}
1011

1112
export const defaultButtonClassName = 'btn';
1213

1314
export function Button(props: React.PropsWithChildren<IButton>) {
14-
const { className, children, size = 'normal', ...others } = props;
15+
const { className, children, size = 'normal', onClick, ...others } = props;
1516
const disabled = props.disabled ? 'disabled' : null;
17+
const click = (e: React.MouseEvent) => onClick?.(e);
1618
const claNames = classNames(
1719
prefixClaName(defaultButtonClassName),
1820
size,
@@ -21,7 +23,7 @@ export function Button(props: React.PropsWithChildren<IButton>) {
2123
);
2224

2325
return (
24-
<a className={claNames} {...others}>
26+
<a className={claNames} {...others} onClick={click}>
2527
{children}
2628
</a>
2729
);

src/components/button/style.scss

+4-4
Original file line numberDiff line numberDiff line change
@@ -8,18 +8,18 @@ $btn: 'btn';
88
cursor: pointer;
99
display: flex;
1010
justify-content: center;
11-
margin: 10px;
11+
margin: 4px 5px;
1212
outline-offset: 2px;
13+
padding: 4px 10px;
1314
text-align: center;
14-
width: 100%;
1515

1616
&.normal {
17-
padding: 4px;
17+
padding: 4px 15px;
1818
}
1919

2020
&.large {
2121
font-size: 16px;
22-
padding: 8px;
22+
padding: 8px 15px;
2323
}
2424

2525
&.disabled {
+54-68
Original file line numberDiff line numberDiff line change
@@ -1,78 +1,64 @@
11
import * as React from 'react';
22
import { Button, IButton } from 'mo/components/button';
3-
43
export interface ActionButtonProps {
5-
actionFn?: (...args: any[]) => any | PromiseLike<any>;
6-
closeModal: Function;
7-
autoFocus?: boolean;
8-
buttonProps?: IButton;
4+
actionFn?: (...args: any[]) => any | PromiseLike<any>;
5+
closeModal: Function;
6+
buttonProps?: IButton;
97
}
108

11-
const ActionButton: React.FC<ActionButtonProps> = (props) => {
12-
const clickedRef = React.useRef<boolean>(false);
13-
const ref = React.useRef<any>();
14-
15-
React.useEffect(() => {
16-
let timeoutId: number;
17-
if (props.autoFocus) {
18-
const $this = ref.current as HTMLInputElement;
19-
timeoutId = setTimeout(() => $this.focus());
20-
}
21-
return () => {
22-
if (timeoutId) {
23-
clearTimeout(timeoutId);
24-
}
25-
};
26-
}, []);
9+
const ActionButton: React.FC<ActionButtonProps> = props => {
10+
const clickedRef = React.useRef<boolean>(false);
2711

28-
const handlePromiseOnOk = (returnValueOfOnOk?: PromiseLike<any>) => {
29-
const { closeModal } = props;
30-
if (!returnValueOfOnOk || !returnValueOfOnOk.then) {
31-
return;
32-
}
33-
returnValueOfOnOk.then(
34-
(...args: any[]) => {
35-
// It's unnecessary to set loading=false, for the Modal will be unmounted after close.
36-
closeModal(...args);
37-
},
38-
(e: Error) => {
39-
// eslint-disable-next-line no-console
40-
console.error(e);
41-
clickedRef.current = false;
42-
}
43-
);
44-
};
12+
const handlePromiseOnOk = (returnValueOfOnOk?: PromiseLike<any>) => {
13+
const { closeModal } = props;
14+
if (!returnValueOfOnOk || !returnValueOfOnOk.then) {
15+
return;
16+
}
17+
returnValueOfOnOk.then(
18+
(...args: any[]) => {
19+
closeModal(...args);
20+
},
21+
(e: Error) => {
22+
// eslint-disable-next-line no-console
23+
console.error(e);
24+
clickedRef.current = false;
25+
},
26+
);
27+
};
4528

46-
const onClick = () => {
47-
const { actionFn, closeModal } = props;
48-
if (clickedRef.current) {
49-
return;
50-
}
51-
clickedRef.current = true;
52-
if (!actionFn) {
53-
closeModal();
54-
return;
55-
}
56-
let returnValueOfOnOk;
57-
if (actionFn.length) {
58-
returnValueOfOnOk = actionFn(closeModal);
59-
clickedRef.current = false;
60-
} else {
61-
returnValueOfOnOk = actionFn();
62-
if (!returnValueOfOnOk) {
63-
closeModal();
64-
return;
65-
}
66-
}
67-
handlePromiseOnOk(returnValueOfOnOk);
68-
};
29+
const onClick = () => {
30+
const { actionFn, closeModal } = props;
31+
if (clickedRef.current) {
32+
return;
33+
}
34+
clickedRef.current = true;
35+
if (!actionFn) {
36+
closeModal();
37+
return;
38+
}
39+
let returnValueOfOnOk;
40+
if (actionFn.length) {
41+
returnValueOfOnOk = actionFn(closeModal);
42+
clickedRef.current = false;
43+
} else {
44+
returnValueOfOnOk = actionFn();
45+
if (!returnValueOfOnOk) {
46+
closeModal();
47+
return;
48+
}
49+
}
50+
handlePromiseOnOk(returnValueOfOnOk);
51+
};
6952

70-
const { children, buttonProps } = props;
71-
return (
72-
<Button onClick={onClick} {...buttonProps} ref={ref}>
73-
{children}
74-
</Button>
75-
);
53+
const { children, buttonProps } = props;
54+
return (
55+
<Button
56+
onClick={onClick}
57+
{...buttonProps}
58+
>
59+
{children}
60+
</Button>
61+
);
7662
};
7763

78-
export default ActionButton;
64+
export default ActionButton;

src/components/dialog/ConfirmDialog.tsx

+36-38
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,17 @@
11
import * as React from 'react';
2-
import classNames from 'classnames';
3-
import Dialog, { IModalFuncProps } from './Modal';
4-
import ActionButton from './ActionButton';
2+
import { classNames, prefixClaName } from 'mo/common/className';
3+
import Dialog, { IModalFuncProps } from './modal';
4+
import ActionButton from './actionButton';
55

66
interface ConfirmDialogProps extends IModalFuncProps {
77
afterClose?: () => void;
88
close: (...args: any[]) => void;
9-
autoFocusButton?: null | 'ok' | 'cancel';
9+
actions?: any;
1010
}
1111

1212
const ConfirmDialog = (props: ConfirmDialogProps) => {
1313
const {
14+
actions,
1415
icon,
1516
onCancel,
1617
onOk,
@@ -22,48 +23,41 @@ const ConfirmDialog = (props: ConfirmDialogProps) => {
2223
centered,
2324
getContainer,
2425
maskStyle,
25-
okText,
26+
okText = 'Save',
2627
okButtonProps,
27-
cancelText,
28+
cancelText = 'Cancel',
2829
cancelButtonProps,
2930
prefixCls,
3031
bodyStyle,
3132
closable = false,
3233
closeIcon,
33-
modalRender,
34-
focusTriggerAfterClose,
34+
okCancel,
3535
} = props;
3636
const contentPrefixCls = `${prefixCls}-confirm`;
37-
// 默认为 true,保持向下兼容
38-
const okCancel = 'okCancel' in props ? props.okCancel! : true;
3937
const width = props.width || 416;
4038
const style = props.style || {};
4139
const mask = props.mask === undefined ? true : props.mask;
4240
// 默认为 false,保持旧版默认行为
4341
const maskClosable =
4442
props.maskClosable === undefined ? false : props.maskClosable;
45-
const autoFocusButton =
46-
props.autoFocusButton === null ? false : props.autoFocusButton || 'ok';
4743
const transitionName = props.transitionName || 'zoom';
4844
const maskTransitionName = props.maskTransitionName || 'fade';
4945

5046
const classString = classNames(
5147
contentPrefixCls,
5248
`${contentPrefixCls}-${props.type}`,
53-
props.className
49+
props.className,
5450
);
5551

5652
const cancelButton = okCancel && (
5753
<ActionButton
58-
actionFn={onCancel}
59-
closeModal={close}
60-
autoFocus={autoFocusButton === 'cancel'}
61-
buttonProps={cancelButtonProps}
54+
actionFn={onCancel}
55+
closeModal={close}
56+
buttonProps={cancelButtonProps}
6257
>
63-
{cancelText}
58+
{cancelText}
6459
</ActionButton>
65-
);
66-
60+
);
6761
return (
6862
<Dialog
6963
prefixCls={prefixCls}
@@ -89,31 +83,35 @@ const ConfirmDialog = (props: ConfirmDialogProps) => {
8983
getContainer={getContainer}
9084
closable={closable}
9185
closeIcon={closeIcon}
92-
modalRender={modalRender}
93-
focusTriggerAfterClose={focusTriggerAfterClose}
9486
>
95-
<div className={`${contentPrefixCls}-body-wrapper`}>
96-
<div className={`${contentPrefixCls}-body`} style={bodyStyle}>
97-
{icon}
98-
{props.title === undefined ? null : (
99-
<span className={`${contentPrefixCls}-title`}>
87+
<div className={`${contentPrefixCls}-body`} style={bodyStyle}>
88+
<div className={`${contentPrefixCls}__icon`}> {icon} </div>
89+
<div className={`${contentPrefixCls}__message`}>
90+
{props.title !== undefined && (
91+
<span className={`${contentPrefixCls}__message--text`}>
10092
{props.title}
10193
</span>
10294
)}
103-
<div className={`${contentPrefixCls}-content`}>
95+
<div className={`${contentPrefixCls}__message--detail`}>
10496
{props.content}
10597
</div>
10698
</div>
107-
<div className={`${contentPrefixCls}-btns`}>
108-
{cancelButton}
109-
<ActionButton
110-
actionFn={onOk}
111-
closeModal={close}
112-
autoFocus={autoFocusButton === 'ok'}
113-
buttonProps={okButtonProps}
114-
>
115-
{okText}
116-
</ActionButton>
99+
<div className={`${contentPrefixCls}__btns`}>
100+
{
101+
actions === undefined ? (
102+
<>
103+
{cancelButton}
104+
{<ActionButton
105+
actionFn={onOk}
106+
closeModal={close}
107+
buttonProps={okButtonProps}
108+
>
109+
{okText}
110+
</ActionButton>
111+
}
112+
</>
113+
) : actions
114+
}
117115
</div>
118116
</div>
119117
</Dialog>

0 commit comments

Comments
 (0)