Skip to content

Commit d067a1f

Browse files
li-jia-nanli-jia-nan
committed
update destroyTooltipOnHide to destroyOnHidden
1 parent 1f6f3c2 commit d067a1f

13 files changed

+88
-81
lines changed

‎.gitignore

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,15 +30,16 @@ es
3030
coverage
3131
yarn.lock
3232
package-lock.json
33+
pnpm-lock.yaml
3334

3435
# umi
3536
.umi
3637
.umi-production
3738
.umi-test
38-
.env.local
39+
.env.local
3940

4041
# dumi
4142
.dumi/tmp
4243
.dumi/tmp-production
4344

44-
bun.lockb
45+
bun.lockb

‎README.md

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -72,28 +72,28 @@ Online demo: <https://react-component.github.io/tooltip/demo>
7272

7373
### Props
7474

75-
| name | type | default | description |
76-
| -------------------- | ----------------------------------------- | ------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- |
77-
| trigger | string \| string\[] | 'hover' | which actions cause tooltip shown. enum of 'hover','click','focus' |
78-
| visible | boolean | false | whether tooltip is visible |
79-
| defaultVisible | boolean | false | whether tooltip is visible by default |
80-
| placement | string | 'right' | tooltip placement. enum of 'top','left','right','bottom', 'topLeft', 'topRight', 'bottomLeft', 'bottomRight', 'leftTop', 'leftBottom', 'rightTop', 'rightBottom' |
81-
| motion | object | | Config popup motion. Please ref demo for example |
82-
| onVisibleChange | (visible: boolean) => void; | | Callback when visible change |
83-
| afterVisibleChange | (visible: boolean) => void; | | Callback after visible change |
84-
| overlay | ReactNode \| () => ReactNode | | tooltip overlay content |
85-
| overlayStyle | object | | deprecated, Please use `styles={{ root: {} }}` |
86-
| overlayClassName | string | | deprecated, Please use `classNames={{ root: {} }}` |
87-
| prefixCls | string | 'rc-tooltip' | prefix class name of tooltip |
88-
| mouseEnterDelay | number | 0 | delay time (in second) before tooltip shows when mouse enter |
89-
| mouseLeaveDelay | number | 0.1 | delay time (in second) before tooltip hides when mouse leave |
90-
| getTooltipContainer | (triggerNode: HTMLElement) => HTMLElement | () => document.body | get container of tooltip, default to body |
91-
| destroyTooltipOnHide | boolean | false | destroy tooltip when it is hidden |
92-
| align | object | | align config of tooltip. Please ref demo for usage example |
93-
| showArrow | boolean \| object | false | whether to show arrow of tooltip |
94-
| zIndex | number | | config popup tooltip zIndex |
95-
| classNames | classNames?: { root?: string; body?: string;}; | | Semantic DOM class |
96-
| styles | styles?: {root?: React.CSSProperties;body?: React.CSSProperties;}; | | Semantic DOM styles |
75+
| name | type | default | description |
76+
| ------------------- | ------------------------------------------------------------------ | ------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- |
77+
| trigger | string \| string\[] | 'hover' | which actions cause tooltip shown. enum of 'hover','click','focus' |
78+
| visible | boolean | false | whether tooltip is visible |
79+
| defaultVisible | boolean | false | whether tooltip is visible by default |
80+
| placement | string | 'right' | tooltip placement. enum of 'top','left','right','bottom', 'topLeft', 'topRight', 'bottomLeft', 'bottomRight', 'leftTop', 'leftBottom', 'rightTop', 'rightBottom' |
81+
| motion | object | | Config popup motion. Please ref demo for example |
82+
| onVisibleChange | (visible: boolean) => void; | | Callback when visible change |
83+
| afterVisibleChange | (visible: boolean) => void; | | Callback after visible change |
84+
| overlay | ReactNode \| () => ReactNode | | tooltip overlay content |
85+
| overlayStyle | object | | deprecated, Please use `styles={{ root: {} }}` |
86+
| overlayClassName | string | | deprecated, Please use `classNames={{ root: {} }}` |
87+
| prefixCls | string | 'rc-tooltip' | prefix class name of tooltip |
88+
| mouseEnterDelay | number | 0 | delay time (in second) before tooltip shows when mouse enter |
89+
| mouseLeaveDelay | number | 0.1 | delay time (in second) before tooltip hides when mouse leave |
90+
| getTooltipContainer | (triggerNode: HTMLElement) => HTMLElement | () => document.body | get container of tooltip, default to body |
91+
| destroyOnHidden | boolean | false | destroy tooltip when it is hidden |
92+
| align | object | | align config of tooltip. Please ref demo for usage example |
93+
| showArrow | boolean \| object | false | whether to show arrow of tooltip |
94+
| zIndex | number | | config popup tooltip zIndex |
95+
| classNames | classNames?: { root?: string; body?: string;}; | | Semantic DOM class |
96+
| styles | styles?: {root?: React.CSSProperties;body?: React.CSSProperties;}; | | Semantic DOM styles |
9797

9898
## Important Note
9999

‎docs/examples/arrowContent.tsx

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,21 +3,22 @@ import Tooltip from 'rc-tooltip';
33
import '../../assets/bootstrap_white.less';
44

55
const text = <span>Tooltip Text</span>;
6-
const styles = {
6+
7+
const styles: React.CSSProperties = {
78
display: 'table-cell',
89
height: '60px',
910
width: '80px',
1011
textAlign: 'center',
1112
background: '#f6f6f6',
1213
verticalAlign: 'middle',
1314
border: '5px solid white',
14-
} as CSSProperties;
15+
};
1516

16-
const rowStyle = {
17+
const rowStyle: React.CSSProperties = {
1718
display: 'table-row',
1819
};
1920

20-
const Test = () => (
21+
const Test: React.FC = () => (
2122
<div style={{ display: 'table', padding: 120 }}>
2223
<div style={rowStyle}>
2324
<Tooltip

‎docs/examples/formError.tsx

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,8 @@ class Test extends Component {
1919
});
2020
};
2121

22-
handleChange = (e) => {
23-
this.setState({
24-
visible: !e.target.value,
25-
});
22+
handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
23+
this.setState({ visible: !e.target.value });
2624
};
2725

2826
render() {

‎docs/examples/onVisibleChange.tsx

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React, { Component } from 'react';
22
import Tooltip from 'rc-tooltip';
33
import '../../assets/bootstrap.less';
44

5-
function preventDefault(e) {
5+
function preventDefault(e: React.MouseEvent<HTMLAnchorElement, MouseEvent>) {
66
e.preventDefault();
77
}
88

@@ -16,10 +16,8 @@ class Test extends Component {
1616
visible: false,
1717
} as TestState;
1818

19-
onVisibleChange = visible => {
20-
this.setState({
21-
visible,
22-
});
19+
onVisibleChange = (visible: boolean) => {
20+
this.setState({ visible });
2321
};
2422

2523
onDestroy = () => {

‎docs/examples/placement.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import '../../assets/bootstrap.less';
44
import Popup from '../../src/Popup';
55

66
const text = <span>Tooltip Text</span>;
7+
78
const styles: React.CSSProperties = {
89
display: 'table-cell',
910
height: '60px',
@@ -14,11 +15,11 @@ const styles: React.CSSProperties = {
1415
border: '5px solid white',
1516
};
1617

17-
const rowStyle = {
18+
const rowStyle: React.CSSProperties = {
1819
display: 'table-row',
1920
};
2021

21-
const Test = () => (
22+
const Test: React.FC = () => (
2223
<>
2324
<div style={{ display: 'table', padding: 120 }}>
2425
<div style={rowStyle}>

‎docs/examples/point.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@ import '../../assets/bootstrap_white.less';
44

55
const text = <span>Tooltip Text</span>;
66

7-
const Test = () => {
8-
const scrollRef = React.useRef<HTMLDivElement>();
7+
const Test: React.FC = () => {
8+
const scrollRef = React.useRef<HTMLDivElement>(null);
99

1010
return (
1111
<div style={{ padding: 10 }}>

‎docs/examples/showArrow.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,24 @@
1-
import type { CSSProperties } from 'react';
21
import React from 'react';
32
import Tooltip from 'rc-tooltip';
43
import '../../assets/bootstrap_white.less';
54

65
const text = <span>Tooltip Text</span>;
7-
const styles = {
6+
7+
const styles: React.CSSProperties = {
88
display: 'table-cell',
99
height: '60px',
1010
width: '80px',
1111
textAlign: 'center',
1212
background: '#f6f6f6',
1313
verticalAlign: 'middle',
1414
border: '5px solid white',
15-
} as CSSProperties;
15+
};
1616

17-
const rowStyle = {
17+
const rowStyle: React.CSSProperties = {
1818
display: 'table-row',
1919
};
2020

21-
const Test = () => (
21+
const Test: React.FC = () => (
2222
<div style={{ display: 'table', padding: 120 }}>
2323
<div style={rowStyle}>
2424
<Tooltip placement="left" overlay={text} showArrow={false}>

‎docs/examples/simple.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import '../../assets/bootstrap.less';
77
import { placements } from '../../src/placements';
88

99
interface TestState {
10-
destroyTooltipOnHide: boolean;
10+
destroyOnHidden: boolean;
1111
destroyTooltipOptions: { name: string; value: number }[];
1212
placement: string;
1313
transitionName: string;
@@ -19,7 +19,7 @@ interface TestState {
1919

2020
class Test extends Component<any, TestState> {
2121
state = {
22-
destroyTooltipOnHide: false,
22+
destroyOnHidden: false,
2323
destroyTooltipOptions: [
2424
{
2525
name: "don't destroy",
@@ -95,7 +95,7 @@ class Test extends Component<any, TestState> {
9595
onDestroyChange = (e) => {
9696
const { value } = e.target;
9797
this.setState({
98-
destroyTooltipOnHide: [false, { keepParent: false }, { keepParent: true }][value] as boolean,
98+
destroyOnHidden: [false, { keepParent: false }, { keepParent: true }][value] as boolean,
9999
});
100100
};
101101

@@ -137,7 +137,7 @@ class Test extends Component<any, TestState> {
137137
</label>
138138
&nbsp;&nbsp;&nbsp;&nbsp;
139139
<label>
140-
destroyTooltipOnHide:
140+
destroyOnHidden:
141141
<select onChange={this.onDestroyChange}>
142142
{this.state.destroyTooltipOptions.map(({ name, value }) => (
143143
<option key={value} value={value}>
@@ -209,7 +209,7 @@ class Test extends Component<any, TestState> {
209209
placement={this.state.placement}
210210
mouseEnterDelay={0}
211211
mouseLeaveDelay={0.1}
212-
destroyTooltipOnHide={this.state.destroyTooltipOnHide}
212+
destroyOnHidden={this.state.destroyOnHidden}
213213
trigger={Object.keys(this.state.trigger) as ActionType[]}
214214
onVisibleChange={this.onVisibleChange}
215215
overlay={<div style={{ height: 50, width: 50 }}>i am a tooltip</div>}

‎package.json

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -50,8 +50,9 @@
5050
"@rc-component/np": "^1.0.3",
5151
"@testing-library/react": "^14.0.0",
5252
"@types/jest": "^29.4.0",
53-
"@types/react": "^18.0.26",
54-
"@types/react-dom": "^18.0.10",
53+
"@types/node": "^22.15.18",
54+
"@types/react": "^19.1.4",
55+
"@types/react-dom": "^19.1.5",
5556
"@types/warning": "^3.0.0",
5657
"cross-env": "^7.0.0",
5758
"dumi": "^2.2.13",
@@ -61,12 +62,12 @@
6162
"gh-pages": "^3.1.0",
6263
"less": "^4.1.1",
6364
"rc-test": "^7.0.9",
64-
"react": "^18.2.0",
65-
"react-dom": "^18.2.0",
65+
"react": "^19.1.0",
66+
"react-dom": "^19.1.0",
6667
"typescript": "^4.0.5"
6768
},
6869
"peerDependencies": {
69-
"react": ">=16.9.0",
70-
"react-dom": ">=16.9.0"
70+
"react": ">=18.0.0",
71+
"react-dom": ">=18.0.0"
7172
}
7273
}

‎src/Popup.tsx

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,16 @@ export interface ContentProps {
1111
bodyClassName?: string;
1212
}
1313

14-
export default function Popup(props: ContentProps) {
15-
const { children, prefixCls, id, overlayInnerStyle: innerStyle, bodyClassName, className, style } =
16-
props;
14+
const Popup: React.FC<ContentProps> = (props) => {
15+
const {
16+
children,
17+
prefixCls,
18+
id,
19+
overlayInnerStyle: innerStyle,
20+
bodyClassName,
21+
className,
22+
style,
23+
} = props;
1724

1825
return (
1926
<div className={classNames(`${prefixCls}-content`, className)} style={style}>
@@ -27,4 +34,6 @@ export default function Popup(props: ContentProps) {
2734
</div>
2835
</div>
2936
);
30-
}
37+
};
38+
39+
export default Popup;

0 commit comments

Comments
 (0)