mirror of
https://github.com/Kong/insomnia
synced 2024-11-08 14:49:53 +00:00
5780a7c438
* component migration to new SB instance Migrating help tooltip to new SB instance at /insomnia-components/ also styling component directly via styled components * Adding stories for positions and info vs. question * lint fix * Pulling left positioning out of delay story Co-authored-by: Gregory Schier <gschier1990@gmail.com>
44 lines
1.0 KiB
JavaScript
44 lines
1.0 KiB
JavaScript
import React from 'react';
|
|
import HelpTooltip from './help-tooltip';
|
|
|
|
export default { title: 'Helpers | Help Tooltip' };
|
|
|
|
export const _question = () => (
|
|
<div>
|
|
Hover over the question mark to view <HelpTooltip>This is the help message</HelpTooltip>
|
|
</div>
|
|
);
|
|
|
|
export const _info = () => (
|
|
<div>
|
|
Hover over the info mark to view <HelpTooltip info>This is the help message</HelpTooltip>
|
|
</div>
|
|
);
|
|
|
|
export const _onTop = () => (
|
|
<div>
|
|
Hover over the info mark to view <HelpTooltip info>This is the help message</HelpTooltip>
|
|
</div>
|
|
);
|
|
|
|
export const _onRight = () => (
|
|
<div>
|
|
Hover over the info mark to view
|
|
<HelpTooltip position="right">This is the help message</HelpTooltip>
|
|
</div>
|
|
);
|
|
|
|
export const _onLeft = () => (
|
|
<div>
|
|
Hover over the info mark to view
|
|
<HelpTooltip position="left">This is the help message</HelpTooltip>
|
|
</div>
|
|
);
|
|
|
|
export const _withDelay = () => (
|
|
<div>
|
|
Hover over the info mark to view
|
|
<HelpTooltip delay={900}> This tooltip had a 900ms delay</HelpTooltip>
|
|
</div>
|
|
);
|