Date picker

"use client";

import { CalendarDate } from "@internationalized/date";
import { DatePicker } from "@/components/miyuki-ui/date-picker";

export default function DatePickerDemo() {
  return (
    <DatePicker
      className="w-full max-w-[15rem]"
      label="Check-in"
      defaultValue={new CalendarDate(2027, 2, 12)}
      description="From 3 pm. The bath opens at 4."
    />
  );
}

"use client";

import { CalendarDate } from "@internationalized/date";
import { DateRangePicker } from "@/components/miyuki-ui/date-picker";

export default function DatePickerRangeDemo() {
  return (
    <DateRangePicker
      className="w-full max-w-[18rem]"
      label="Stay"
      defaultValue={{ start: new CalendarDate(2027, 2, 12), end: new CalendarDate(2027, 2, 15) }}
      description="Three nights at Ryokan Shizuku."
    />
  );
}