import * as React from "react"
import { PeriodLabel } from "@/registry/charts/period-label"

export default function PeriodLabelDemo() {
  return (
    <div className="w-full max-w-md space-y-2">
      <PeriodLabel
        preset="last7"
        from={new Date(Date.UTC(2026, 4, 14))}
        to={new Date(Date.UTC(2026, 4, 20))}
      />
      <PeriodLabel
        preset="thisYear"
        from={new Date(Date.UTC(2026, 0, 1))}
        to={new Date(Date.UTC(2026, 4, 20))}
      />
      <PeriodLabel
        from={new Date(Date.UTC(2025, 11, 28))}
        to={new Date(Date.UTC(2026, 0, 4))}
      />
      <PeriodLabel allTime />
    </div>
  )
}