Range sources

"use client";
import { RangeSources } from "@/components/ui/notchset/blocks/range-sources";

export default function RangeSourcesDemo() {
  return (
    <div className="w-full max-w-[720px]">
      <RangeSources
        unit="ng/mL"
        ranges={[
          { name: "Optimal", range: "40–60", source: "Notchset optimal set, from Endocrine Society guidance" },
          { name: "Lab range", range: "30–100", source: "Northside Lab reference interval" },
          { name: "Low", range: "under 30", source: "Northside Lab" },
        ]}
        sources={[
          { date: "16 Oct", value: "41", where: "Follow-up panel · PDF p. 2" },
          { date: "25 Mar", value: "23", where: "Annual panel · PDF p. 4" },
        ]}
      />
    </div>
  );
}