overleaf-cep/services/web/frontend/stories/ui/tooltip.stories.tsx
Tim Down 28468e134c Merge pull request #24660 from overleaf/td-bs5-remove-react-bootstrap-0
Remove react-bootstrap 0.33.1

GitOrigin-RevId: c320a6b18c576afdc0fd49559915d3d2f3a7a1ef
2025-04-10 08:04:50 +00:00

38 lines
939 B
TypeScript

import OLButton from '@/features/ui/components/ol/ol-button'
import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
import { Meta } from '@storybook/react'
export const Tooltips = () => {
const placements = ['top', 'right', 'bottom', 'left'] as const
return (
<div
style={{
width: '200px',
display: 'flex',
flexDirection: 'column',
margin: '0 auto',
padding: '35px 0',
gap: '35px',
}}
>
{placements.map(placement => (
<OLTooltip
key={placement}
id={`tooltip-${placement}`}
description={`Tooltip on ${placement}`}
overlayProps={{ placement }}
>
<OLButton variant="secondary">Tooltip on {placement}</OLButton>
</OLTooltip>
))}
</div>
)
}
const meta: Meta<typeof OLTooltip> = {
title: 'Shared / Components / Tooltip',
component: OLTooltip,
}
export default meta