Timeframe Tabs

A scrollable, controlled pill-tab row with an animated active-state highlight and a slot for trailing content.

Props

PropertyTypeDefaultDescription
itemsstring[]The pills to render, in order.
valuestringCurrently active pill.
onValueChange(value: string) => voidCalled with the pill value when the user clicks one.
labelstring"Tabs"Accessible label for the tablist.
classNamestringAdditional classes for the root wrapper.
childrenReact.ReactNodeAnything rendered after the pill row — a divider, a dropdown menu, or other trailing actions.