77
88import './story.scss' ;
99
10+ import { Help } from '@carbon/icons-react' ;
1011import React , { useRef , useEffect } from 'react' ;
11- import { SquareOutline } from '@carbon/icons-react' ;
1212import { Tooltip } from './' ;
13- import Button from './../Button' ;
1413import mdx from './Tooltip.mdx' ;
1514
1615export 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
6465export 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 = () => {
96101export 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