import { useDay } from "@datepicker-react/hooks";
import { useRef } from "react";
import { View, styled } from "tamagui";
import { useDatepickerContext } from "./DatePickerProvider";
import { IconButton } from "./IconButton";
import { Body } from "./typography";
import { jsx } from "react/jsx-runtime";
function Day({ dayLabel, date, ...props }) {
  const dayRef = useRef(null), datepickerContext = useDatepickerContext(), {
    isSelected,
    isSelectedStartOrEnd,
    disabledDate,
    onClick,
    isWithinHoverRange
  } = useDay({
    date,
    dayRef,
    ...datepickerContext
  });
  return dayLabel ? /* @__PURE__ */ jsx(
    DayButton,
    {
      ref: dayRef,
      onPress: onClick,
      cursor: "pointer",
      disabled: disabledDate,
      w: 48,
      h: 48,
      hoverStyle: {
        col: "$onSurfaceVariant"
      },
      col: "$onSurface",
      selected: isSelected,
      selectedStartOrEnd: isSelectedStartOrEnd,
      isWithinHoverRange,
      today: isToday(date),
      ...props,
      children: /* @__PURE__ */ jsx(DayText, { selectedStartOrEnd: isSelectedStartOrEnd, children: dayLabel })
    }
  ) : /* @__PURE__ */ jsx(View, {});
}
const DayButton = styled(IconButton, {
  name: "DayButton",
  w: 48,
  h: 48,
  bc: "transparent",
  hoverStyle: {
    col: "$onSurfaceVariant"
  },
  variants: {
    selected: {
      true: {
        backgroundColor: "$outlineVariant"
      }
    },
    selectedStartOrEnd: {
      true: {
        backgroundColor: "$outline"
      }
    },
    today: {
      true: {
        borderWidth: "$border.outline",
        borderColor: "$primary",
        borderRadius: 100
      }
    }
  }
}), DayText = styled(Body, {
  name: "DayText",
  bc: "transparent",
  variants: {
    selectedStartOrEnd: {
      true: {
        color: "$onTertiary"
      }
    }
  }
});
function isToday(date) {
  const today = /* @__PURE__ */ new Date();
  return date.getFullYear() === today.getFullYear() && date.getMonth() === today.getMonth() && date.getDate() === today.getDate();
}
export {
  Day
};
//# sourceMappingURL=Day.js.map
