aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/molecules/tooltip/tooltip.stories.tsx
blob: 8a22a060b89e09d8e3ba7188a15999ebeffa4497 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
import { ComponentMeta, ComponentStory } from '@storybook/react';
import { Tooltip } from './tooltip';
import { useState } from 'react';

/**
 * Switch - Storybook Meta
 */
export default {
  title: 'Molecules/Tooltip',
  component: Tooltip,
  args: {},
  argTypes: {},
} as ComponentMeta<typeof Tooltip>;

const Template: ComponentStory<typeof Tooltip> = ({
  isOpen,
  onToggle: _onToggle,
  ...args
}) => {
  const [isOpened, setIsOpened] = useState(isOpen);

  const toggle = () => {
    setIsOpened((prev) => !prev);
  };

  return (
    <div style={{ position: 'relative' }}>
      <Tooltip {...args} isOpen={isOpened} onToggle={toggle} />
    </div>
  );
};

/**
 * Tooltip Stories - Example
 */
export const Example = Template.bind({});
Example.args = {
  children:
    'Inventore natus dignissimos aut illum modi asperiores. Et voluptatibus delectus.',
  heading: 'A title',
  isOpen: false,
};