Skip to content

Commit b6ab688

Browse files
docs: remove getContent prop
1 parent e11edc6 commit b6ab688

File tree

4 files changed

+14
-81
lines changed

4 files changed

+14
-81
lines changed

docs/docs/examples/get-content.mdx

Lines changed: 0 additions & 58 deletions
This file was deleted.

docs/docs/examples/state.mdx

Lines changed: 12 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ export const ControlledExample = () => {
4141
<>
4242
<TooltipAnchor
4343
id="tooltip-anchor"
44-
data-tooltip-content="1"
44+
data-tooltip-content="Same Tooltip, different anchor element. This little buddy is 1"
4545
onMouseEnter={() => {
4646
setAnchorId('tooltip-anchor')
4747
if (!isOpen) {
@@ -53,7 +53,7 @@ export const ControlledExample = () => {
5353
</TooltipAnchor>
5454
<TooltipAnchor
5555
id="tooltip-anchor-2"
56-
data-tooltip-content="2"
56+
data-tooltip-content="Same Tooltip, different anchor element. This little buddy is 2"
5757
onMouseEnter={() => {
5858
setAnchorId('tooltip-anchor-2')
5959
if (!isOpen) {
@@ -65,7 +65,7 @@ export const ControlledExample = () => {
6565
</TooltipAnchor>
6666
<TooltipAnchor
6767
id="tooltip-anchor-3"
68-
data-tooltip-content="3"
68+
data-tooltip-content="Same Tooltip, different anchor element. This little buddy is 3"
6969
onMouseEnter={() => {
7070
setAnchorId('tooltip-anchor-3')
7171
if (!isOpen) {
@@ -77,7 +77,7 @@ export const ControlledExample = () => {
7777
</TooltipAnchor>
7878
<TooltipAnchor
7979
id="tooltip-anchor-4"
80-
data-tooltip-content="4"
80+
data-tooltip-content="Same Tooltip, different anchor element. This little buddy is 4"
8181
onMouseEnter={() => {
8282
setAnchorId('tooltip-anchor-4')
8383
if (!isOpen) {
@@ -89,7 +89,7 @@ export const ControlledExample = () => {
8989
</TooltipAnchor>
9090
<TooltipAnchor
9191
id="tooltip-anchor-5"
92-
data-tooltip-content="5"
92+
data-tooltip-content="Same Tooltip, different anchor element. This little buddy is 5"
9393
onMouseEnter={() => {
9494
setAnchorId('tooltip-anchor-5')
9595
if (!isOpen) {
@@ -101,7 +101,7 @@ export const ControlledExample = () => {
101101
</TooltipAnchor>
102102
<TooltipAnchor
103103
id="tooltip-anchor-6"
104-
data-tooltip-content="6"
104+
data-tooltip-content="Same Tooltip, different anchor element. This little buddy is 6"
105105
onMouseEnter={() => {
106106
setAnchorId('tooltip-anchor-6')
107107
if (!isOpen) {
@@ -113,9 +113,6 @@ export const ControlledExample = () => {
113113
</TooltipAnchor>
114114
<Tooltip
115115
anchorId={anchorId}
116-
getContent={(dataTip) =>
117-
`Same Tooltip, different anchor element. This little buddy is ${dataTip}`
118-
}
119116
isOpen={isOpen}
120117
/>
121118
</>
@@ -191,7 +188,6 @@ const [anchorId, setAnchorId] = useState('tooltip-anchor')
191188
> ◕‿‿◕ </a>
192189
<Tooltip
193190
anchorId={anchorId}
194-
getContent={(dataTip) => `Same Tooltip, different anchor element. This little buddy is ${dataTip}`}
195191
isOpen={isOpen}
196192
/>
197193
```
@@ -206,7 +202,7 @@ export const UncontrolledExample = () => {
206202
<>
207203
<TooltipAnchor
208204
id="tooltip-anchor-uncontrolled"
209-
data-tooltip-content="1"
205+
data-tooltip-content="Same Tooltip, different anchor element. This little buddy is 1"
210206
onMouseEnter={() => {
211207
setAnchorId('tooltip-anchor-uncontrolled')
212208
}}
@@ -215,7 +211,7 @@ export const UncontrolledExample = () => {
215211
</TooltipAnchor>
216212
<TooltipAnchor
217213
id="tooltip-anchor-uncontrolled-2"
218-
data-tooltip-content="2"
214+
data-tooltip-content="Same Tooltip, different anchor element. This little buddy is 2"
219215
onMouseEnter={() => {
220216
setAnchorId('tooltip-anchor-uncontrolled-2')
221217
}}
@@ -224,7 +220,7 @@ export const UncontrolledExample = () => {
224220
</TooltipAnchor>
225221
<TooltipAnchor
226222
id="tooltip-anchor-uncontrolled-3"
227-
data-tooltip-content="3"
223+
data-tooltip-content="Same Tooltip, different anchor element. This little buddy is 3"
228224
onMouseEnter={() => {
229225
setAnchorId('tooltip-anchor-uncontrolled-3')
230226
}}
@@ -233,7 +229,7 @@ export const UncontrolledExample = () => {
233229
</TooltipAnchor>
234230
<TooltipAnchor
235231
id="tooltip-anchor-uncontrolled-4"
236-
data-tooltip-content="4"
232+
data-tooltip-content="Same Tooltip, different anchor element. This little buddy is 4"
237233
onMouseEnter={() => {
238234
setAnchorId('tooltip-anchor-uncontrolled-4')
239235
}}
@@ -242,7 +238,7 @@ export const UncontrolledExample = () => {
242238
</TooltipAnchor>
243239
<TooltipAnchor
244240
id="tooltip-anchor-uncontrolled-5"
245-
data-tooltip-content="5"
241+
data-tooltip-content="Same Tooltip, different anchor element. This little buddy is 5"
246242
onMouseEnter={() => {
247243
setAnchorId('tooltip-anchor-uncontrolled-5')
248244
}}
@@ -251,7 +247,7 @@ export const UncontrolledExample = () => {
251247
</TooltipAnchor>
252248
<TooltipAnchor
253249
id="tooltip-anchor-uncontrolled-6"
254-
data-tooltip-content="6"
250+
data-tooltip-content="Same Tooltip, different anchor element. This little buddy is 6"
255251
onMouseEnter={() => {
256252
setAnchorId('tooltip-anchor-uncontrolled-6')
257253
}}
@@ -260,9 +256,6 @@ export const UncontrolledExample = () => {
260256
</TooltipAnchor>
261257
<Tooltip
262258
anchorId={anchorId}
263-
getContent={(dataTip) =>
264-
`Same Tooltip, different anchor element. This little buddy is ${dataTip}`
265-
}
266259
/>
267260
</>
268261
)
@@ -318,7 +311,6 @@ const [anchorId, setAnchorId] = useState('tooltip-anchor')
318311
> ◕‿‿◕ </a>
319312
<Tooltip
320313
anchorId={anchorId}
321-
getContent={(dataTip) => `Same Tooltip, different anchor element. This little buddy is ${dataTip}`}
322314
/>
323315
```
324316

docs/docs/options.mdx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,6 @@ import 'react-tooltip/dist/react-tooltip.css'
6767
| delayShow | number | false | | any `number` | tooltip show will be delayed in miliseconds by the amount of value |
6868
| delayHide | number | false | | any `number` | tooltip hide will be delayed in miliseconds by the amount of value |
6969
| style | CSSProperties | false | | any React inline style | add styles directly to the component by `style` attribute |
70-
| getContent | function | false | | (value: string) => string | a method available to parse, format or modify the given content of tooltip before show it |
7170
| isOpen | boolen | false | handled by internal state | `true` `false` | the tooltip can be controlled or uncontrolled, this attribute can be used to handle show and hide tooltip outside tooltip (can be used **without** `setIsOpen`) |
7271
| setIsOpen | function | false | | | the tooltip can be controlled or uncontrolled, this attribute can be used to handle show and hide tooltip outside tooltip |
7372

docs/docs/upgrade-guide/changelog-v4-v5.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ V4 was a great react tooltip component but was built a few years ago, he was bui
2727
- - If you already have a `Tooltip` component in your application and want to explicitly declare this is `ReactTooltip`, just `import { Tooltip as ReactTooltip } from "react-tooltip"`
2828
- CSS import is now optional, so, you can modify and/or add any styling to your floating tooltip element
2929
- `data-tip` attribute now is `data-content`
30-
- `getContent` prop now doesn't accept `any` anymore, just a `function`
30+
- `getContent` prop was removed. Instead, you can directly pass dynamic content to the `content` tooltip prop, or to `data-tooltip-content`
3131
- default behavior of tooltip now is `solid` instead of `float`
3232

3333
## New Props
@@ -65,7 +65,7 @@ V4 was a great react tooltip component but was built a few years ago, he was bui
6565
- [ ] eventOff - **Deprecated**
6666
- [ ] isCapture - **Deprecated**
6767
- [ ] globalEventOff - **Deprecated**
68-
- [x] getContent - Now this attribute only accepts a function instead of any
68+
- [ ] getContent - use dynamic `content` instead
6969
- [ ] afterShow - not implemented yet, if many users need this feature, we will work on this one.
7070
- [ ] afterHide - not implemented yet, if many users need this feature, we will work on this one.
7171
- [ ] overridePosition - **Deprecated**

0 commit comments

Comments
 (0)