src/components/molecules/modals/tooltip/tooltip.stories.tsx


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

import type { Meta, StoryObj } from '@storybook/react';
import { useBoolean } from '../../../../utils/hooks';
import { Tooltip, type TooltipProps } from './tooltip';

const ControlledTooltip = ({
  isOpen,
  onToggle: _onToggle,
  ...args
}: TooltipProps) => {
  const { deactivate, state: isOpened, toggle } = useBoolean(isOpen);

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

const meta = {
  component: Tooltip,
  title: 'Molecules/Modals/Tooltip',
  render: ControlledTooltip,
} satisfies Meta<typeof Tooltip>;

export default meta;

type Story = StoryObj<typeof meta>;

export const Example: Story = {
  args: {
    children:
      'Inventore natus dignissimos aut illum modi asperiores. Et voluptatibus delectus.',
    heading: 'A title',
    isOpen: false,
  },
};