Code

Props

Props	Data Type	Required
message	string	✅
disabled	disabled	❌
position	string (Top, Bottom, Right, Left)	❌
children	React.ReactElement	❌

the id prop is not going to be written by the developer because this prop is going to be generated automatically by the component.

How to use

The Tooltip component can be added to any HTML tags and some of the components included here in the SDS-Components library like Button, Link, etc. To do it, the developer can use the following example:

<Tooltip position='Top'>
    <button>Random button<button>
<Tooltip/>

Compatible Components With Tooltip

Even if Tooltip was made to be used with any HTML element, it is not compatible at the moment of implementing it with all the SDS components, just with the following ones:

• Avatar

• Button

• Link

• Telicon

Live Demo

For detailed code usage documentation, see the Storybooks for each framework below.

React

Storybooksipster-react-component-storybook.netlify.app