"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import * as React from "react";
import { DayPicker, useDayPicker } from "react-day-picker";
import { ChevronLeft, ChevronRight } from "lucide-react";
import { format } from "date-fns/format";
import { cn } from "@open-mercato/shared/lib/utils";
function MonthNavButton({
  direction,
  locale
}) {
  const dayPicker = useDayPicker();
  const target = direction === "prev" ? dayPicker.previousMonth : dayPicker.nextMonth;
  const Icon = direction === "prev" ? ChevronLeft : ChevronRight;
  const targetLabel = format(target ?? /* @__PURE__ */ new Date(), "MMMM yyyy", locale ? { locale } : void 0);
  const ariaLabel = `Go to ${direction === "prev" ? "previous" : "next"} month: ${targetLabel}`;
  return /* @__PURE__ */ jsx(
    "button",
    {
      type: "button",
      disabled: !target,
      "aria-label": ariaLabel,
      onClick: () => {
        if (target && dayPicker.goToMonth) dayPicker.goToMonth(target);
      },
      className: cn(
        "h-9 w-9 inline-flex items-center justify-center rounded-md shrink-0",
        "border border-border bg-background text-muted-foreground transition-colors",
        "hover:bg-accent hover:text-accent-foreground hover:border-input",
        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
        "disabled:opacity-30 disabled:pointer-events-none disabled:hover:bg-background"
      ),
      children: /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4", "aria-hidden": "true" })
    }
  );
}
function buildMonthCaption(locale, totalMonths) {
  return function MonthCaption({
    calendarMonth,
    displayIndex
  }) {
    const label = format(calendarMonth.date, "MMMM yyyy", locale ? { locale } : void 0);
    const index = typeof displayIndex === "number" ? displayIndex : 0;
    const showPrev = index === 0;
    const showNext = index === totalMonths - 1;
    return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 mb-3", children: [
      showPrev ? /* @__PURE__ */ jsx(MonthNavButton, { direction: "prev", locale }) : /* @__PURE__ */ jsx("div", { className: "h-9 w-9 shrink-0", "aria-hidden": "true" }),
      /* @__PURE__ */ jsx(
        "div",
        {
          className: "flex-1 flex items-center justify-center h-9 rounded-md bg-muted px-3 text-sm font-medium",
          "aria-live": "polite",
          children: label
        }
      ),
      showNext ? /* @__PURE__ */ jsx(MonthNavButton, { direction: "next", locale }) : /* @__PURE__ */ jsx("div", { className: "h-9 w-9 shrink-0", "aria-hidden": "true" })
    ] });
  };
}
function Calendar({
  className,
  classNames,
  showOutsideDays = true,
  fixedWeeks = true,
  locale,
  components,
  numberOfMonths = 1,
  pagedNavigation = true,
  ...props
}) {
  const monthCaption = React.useMemo(
    () => buildMonthCaption(locale, numberOfMonths),
    [locale, numberOfMonths]
  );
  return /* @__PURE__ */ jsx(
    DayPicker,
    {
      showOutsideDays,
      fixedWeeks,
      pagedNavigation,
      locale,
      numberOfMonths,
      className: cn("p-3", className),
      classNames: {
        months: "flex flex-col sm:flex-row gap-4",
        month: "space-y-2",
        month_caption: "",
        caption_label: "sr-only",
        nav: "sr-only",
        month_grid: "w-full border-collapse",
        weekdays: "flex",
        weekday: "text-muted-foreground rounded-md w-9 font-normal text-xs",
        weeks: "w-full border-collapse",
        week: "flex w-full mt-1",
        day: "h-9 w-9 text-center text-sm p-0 relative focus-within:relative focus-within:z-20",
        day_button: cn(
          "h-9 w-9 p-0 font-normal aria-selected:opacity-100",
          "inline-flex items-center justify-center rounded-md text-sm",
          "transition-colors focus:outline-none focus-visible:outline-none disabled:pointer-events-none",
          // Focus indicator is a soft accent fill instead of a ring overlay — keyboard
          // users get a visible cue, but mouse-click focus does not leave a stuck ring
          // on top of the selected cell.
          "hover:bg-accent hover:text-accent-foreground",
          "focus-visible:bg-accent focus-visible:text-accent-foreground"
        ),
        // React-day-picker v9 applies `classNames.selected` / `range_*` to the day
        // CELL (`<td>`) wrapper, not to the inner `<button>`. To keep the parent
        // fill visible through interaction, we (a) paint the cell with the desired
        // bg/text, and (b) force the inner button to render transparent — so the
        // button's own hover/focus-visible bg overrides cannot cover the cell fill.
        selected: cn(
          "!bg-primary !text-primary-foreground rounded-md",
          "[&_button]:!bg-transparent [&_button]:!text-primary-foreground",
          "[&_button:hover]:!bg-transparent [&_button:hover]:!text-primary-foreground",
          "[&_button:focus-visible]:!bg-transparent [&_button:focus-visible]:!text-primary-foreground"
        ),
        range_start: cn(
          "!bg-primary !text-primary-foreground rounded-l-md !rounded-r-none",
          "[&_button]:!bg-transparent [&_button]:!text-primary-foreground",
          "[&_button:hover]:!bg-transparent [&_button:hover]:!text-primary-foreground",
          "[&_button:focus-visible]:!bg-transparent [&_button:focus-visible]:!text-primary-foreground"
        ),
        range_end: cn(
          "!bg-primary !text-primary-foreground rounded-r-md !rounded-l-none",
          "[&_button]:!bg-transparent [&_button]:!text-primary-foreground",
          "[&_button:hover]:!bg-transparent [&_button:hover]:!text-primary-foreground",
          "[&_button:focus-visible]:!bg-transparent [&_button:focus-visible]:!text-primary-foreground"
        ),
        range_middle: cn(
          "!bg-accent !text-accent-foreground !rounded-none",
          "[&_button]:!bg-transparent [&_button]:!text-accent-foreground",
          "[&_button:hover]:!bg-transparent [&_button:hover]:!text-accent-foreground",
          "[&_button:focus-visible]:!bg-transparent [&_button:focus-visible]:!text-accent-foreground"
        ),
        today: "font-semibold text-primary rounded-md",
        outside: "day-outside text-muted-foreground opacity-40 aria-selected:bg-accent/50 aria-selected:text-muted-foreground aria-selected:opacity-30",
        disabled: "text-muted-foreground opacity-50",
        hidden: "invisible",
        ...classNames
      },
      components: {
        MonthCaption: monthCaption,
        ...components
      },
      ...props
    }
  );
}
export {
  Calendar
};
//# sourceMappingURL=calendar.js.map
