Components

CountdownTimer

A countdown timer that displays remaining time in days, hours, minutes, and seconds.

Overview

CountdownTimer counts down to a target date/time, displaying segmented units (days, hours, minutes, seconds) with automatic updates every second.

<CountdownTimer
  targetDate={new Date('2025-01-01T00:00:00')}
  onComplete={() => console.log('Happy New Year!')}
/>

Prop	Type	Default	Description
`targetDate`	`Date`	—	Target date to count down to
`onComplete`	`() => void`	—	Callback when countdown reaches zero
`showDays`	`boolean`	`true`	Show days segment
`showSeconds`	`boolean`	`true`	Show seconds segment
`variant`	`'default' \| 'compact'`	`'default'`	Display style

Component	When to Use Instead
Progress	Progress toward a goal
StatCard	Static numeric display

Cart

A shopping cart display with item list, quantity controls, total, and checkout.

InfiniteScroll

A scroll-triggered pagination component using IntersectionObserver.