Skip to content

Commit 181f38f

Browse files
authored
docs(tooltip): revert to peviously correct stories, use help icon (#18245)
1 parent fc76fa7 commit 181f38f

File tree

1 file changed

+15
-8
lines changed

1 file changed

+15
-8
lines changed

packages/react/src/components/Tooltip/Tooltip.stories.js

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7,10 +7,9 @@
77

88
import './story.scss';
99

10+
import { Help } from '@carbon/icons-react';
1011
import React, { useRef, useEffect } from 'react';
11-
import { SquareOutline } from '@carbon/icons-react';
1212
import { Tooltip } from './';
13-
import Button from './../Button';
1413
import mdx from './Tooltip.mdx';
1514

1615
export default {
@@ -56,15 +55,19 @@ export const Default = () => {
5655
'Occasionally, services are updated in a specified time window to ensure no down time for customers.';
5756
return (
5857
<Tooltip align="bottom" label={label}>
59-
<Button>This button has a tooltip</Button>
58+
<button className="sb-tooltip-trigger" type="button">
59+
<Help />
60+
</button>
6061
</Tooltip>
6162
);
6263
};
6364

6465
export const Alignment = () => {
6566
return (
6667
<Tooltip label="Tooltip alignment" align="bottom-left">
67-
<Button>This button has a tooltip</Button>
68+
<button className="sb-tooltip-trigger" type="button">
69+
<Help />
70+
</button>
6871
</Tooltip>
6972
);
7073
};
@@ -86,7 +89,9 @@ export const ExperimentalAutoAlign = () => {
8689
left: '2500px',
8790
}}>
8891
<Tooltip label={tooltipLabel} align="top" autoAlign>
89-
<Button ref={ref}>This button has a tooltip</Button>
92+
<button className="sb-tooltip-trigger" type="button" ref={ref}>
93+
<Help />
94+
</button>
9095
</Tooltip>
9196
</div>
9297
</div>
@@ -96,7 +101,9 @@ export const ExperimentalAutoAlign = () => {
96101
export const Duration = () => {
97102
return (
98103
<Tooltip label="Label one" enterDelayMs={0} leaveDelayMs={300}>
99-
<Button>This button has a tooltip</Button>
104+
<button className="sb-tooltip-trigger" type="button">
105+
<Help />
106+
</button>
100107
</Tooltip>
101108
);
102109
};
@@ -120,8 +127,8 @@ const PlaygroundStory = (props) => {
120127
label={label}
121128
leaveDelayMs={leaveDelayMs}
122129
closeOnActivation={closeOnActivation}>
123-
<button type="button">
124-
<SquareOutline />
130+
<button className="sb-tooltip-trigger" type="button">
131+
<Help />
125132
</button>
126133
</Tooltip>
127134
);

0 commit comments

Comments
 (0)