DatePicker

import { DatePicker } from "@fanvue/ui/date-picker";
import type {
  DatePickerOwnProps,
  DatePickerProps,
  DatePickerVariant,
  DateRange,
} from "@fanvue/ui/date-picker";

import { useState } from "react";
import { DatePicker } from "@fanvue/ui/date-picker";

const DEFAULT_MONTH = new Date(2026, 1);

function Example() {
  const [selected, setSelected] = useState<Date | undefined>();
  return (
    <DatePicker
      mode="single"
      defaultMonth={DEFAULT_MONTH}
      selected={selected}
      onSelect={setSelected}
      onApply={() => console.log("Applied:", selected)}
      onCancel={() => setSelected(undefined)}
    />
  );
}

import { useState } from "react";
import { DatePicker } from "@fanvue/ui/date-picker";

const DEFAULT_MONTH = new Date(2026, 1);

function Example() {
  const [selected, setSelected] = useState<Date | undefined>();
  return (
    <DatePicker
      mode="single"
      defaultMonth={DEFAULT_MONTH}
      selected={selected}
      onSelect={setSelected}
      disabled={{ before: new Date(2026, 1, 10) }}
    />
  );
}

import { useState } from "react";
import { DatePicker } from "@fanvue/ui/date-picker";

const DEFAULT_MONTH = new Date(2026, 1);

function Example() {
  const [selected, setSelected] = useState<Date | undefined>();
  return (
    <DatePicker
      mode="single"
      defaultMonth={DEFAULT_MONTH}
      selected={selected}
      onSelect={setSelected}
      showFooter={false}
    />
  );
}

import { useState } from "react";
import { DatePicker } from "@fanvue/ui/date-picker";

const DEFAULT_MONTH = new Date(2026, 1);

function Example() {
  const [selected, setSelected] = useState<Date | undefined>(new Date(2026, 1, 15));
  return (
    <DatePicker
      mode="single"
      defaultMonth={DEFAULT_MONTH}
      selected={selected}
      onSelect={setSelected}
      onApply={() => console.log("Applied:", selected)}
      onCancel={() => setSelected(undefined)}
    />
  );
}

import { useState } from "react";
import { DatePicker } from "@fanvue/ui/date-picker";

const DEFAULT_MONTH = new Date(2026, 1);

function Example() {
  const [selected, setSelected] = useState<Date | undefined>();
  return (
    <DatePicker
      mode="single"
      defaultMonth={DEFAULT_MONTH}
      selected={selected}
      onSelect={setSelected}
      cancelLabel="Reset"
      applyLabel="Confirm"
      onApply={() => console.log("Applied:", selected)}
      onCancel={() => setSelected(undefined)}
    />
  );
}