Sha256: 8ae54b027463a25e400fbf31157412786878e380b8f8d54fd82dde507869a990
Contents?: true
Size: 1.07 KB
Versions: 332
Compression:
Stored size: 1.07 KB
Contents
import React from 'react'
import classnames from 'classnames'
import { buildHtmlProps } from '../../utilities/props'
import { globalProps, GlobalProps } from "../../utilities/globalProps"
import IconCircle from '../../pb_icon_circle/_icon_circle'
type TimelineStepProps = {
icon?: string,
iconColor?: 'default' | 'royal' | 'blue' | 'purple' | 'teal' | 'red' | 'yellow' | 'green',
children?: React.ReactNode,
className?: string,
htmlOptions?: { [key: string]: any },
} & GlobalProps
const TimelineStep: React.FC<TimelineStepProps> = ({
icon = 'user',
iconColor = 'default',
children,
className,
htmlOptions = {},
...props
}) => {
const htmlProps = buildHtmlProps(htmlOptions)
return (
<div
{...htmlProps}
className={classnames('pb_timeline_item_step', globalProps(props), className)}
>
{children ? (
children
) : (
<IconCircle icon={icon}
size="xs"
variant={iconColor}
/>
)}
<div className="pb_timeline_item_connector" />
</div>
)
}
export default TimelineStep
Version data entries
332 entries across 332 versions & 1 rubygems