UNPKG

@olleemilsson/flowbite-react

Version:

<div align="center"> <h1>:construction: flowbite-react (unreleased) :construction:</h1> <p> <a href="https://flowbite-react.com"> <img alt="Flowbite - Tailwind CSS components" width="350" src=".github/assets/flowbite-react-github.png"> <

30 lines (29 loc) 1.4 kB
import { jsx as _jsx } from "react/jsx-runtime"; import classNames from 'classnames'; import { useTheme } from '../Flowbite'; import { TimelineBody } from './TimelineBody'; import { TimelineContent } from './TimelineContent'; import { TimelineContext } from './TimelineContext'; import { TimelineItem } from './TimelineItem'; import { TimelinePoint } from './TimelinePoint'; import { TimelineTime } from './TimelineTime'; import { TimelineTitle } from './TimelineTitle'; const TimelineComponent = ({ children, horizontal, className }) => { const theme = useTheme().theme.timeline; return (_jsx(TimelineContext.Provider, { value: { horizontal }, children: _jsx("ol", { "data-testid": "timeline-component", className: classNames(horizontal && theme.direction.horizontal, !horizontal && theme.direction.vertical, className), children: children }) })); }; TimelineComponent.displayName = 'Timeline'; TimelineItem.displayName = 'Timeline.Item'; TimelinePoint.displayName = 'Timeline.Point'; TimelineContent.displayName = 'Timeline.Content'; TimelineTime.displayName = 'Timeline.Time'; TimelineTitle.displayName = 'Timeline.Title'; TimelineBody.displayName = 'Timeline.Body'; export const Timeline = Object.assign(TimelineComponent, { Item: TimelineItem, Point: TimelinePoint, Content: TimelineContent, Time: TimelineTime, Title: TimelineTitle, Body: TimelineBody, });