"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const Vue = require("vue");
const utils$1 = require("../date-picker/utils.js");
const utils = require("./utils.js");
const index_esm = require("../../../@vant/use/dist/index.esm.js");
const useExpose = require("../composables/use-expose.js");
const useHeight = require("../composables/use-height.js");
const CalendarDay = require("./CalendarDay.js");
const props = require("../utils/props.js");
const create = require("../utils/create.js");
const format = require("../utils/format.js");
const dom = require("../utils/dom.js");
const basic = require("../utils/basic.js");
const [name] = create.createNamespace("calendar-month");
const calendarMonthProps = {
  date: props.makeRequiredProp(Date),
  type: String,
  color: String,
  minDate: Date,
  maxDate: Date,
  showMark: Boolean,
  rowHeight: props.numericProp,
  formatter: Function,
  lazyRender: Boolean,
  currentDate: [Date, Array],
  allowSameDay: Boolean,
  showSubtitle: Boolean,
  showMonthTitle: Boolean,
  firstDayOfWeek: Number
};
var stdin_default = Vue.defineComponent({
  name,
  props: calendarMonthProps,
  emits: ["click", "clickDisabledDate"],
  setup(props2, {
    emit,
    slots
  }) {
    const [visible, setVisible] = index_esm.useToggle();
    const daysRef = Vue.ref();
    const monthRef = Vue.ref();
    const height = useHeight.useHeight(monthRef);
    const title = Vue.computed(() => utils.formatMonthTitle(props2.date));
    const rowHeight = Vue.computed(() => format.addUnit(props2.rowHeight));
    const offset = Vue.computed(() => {
      const date = props2.date.getDate();
      const day = props2.date.getDay();
      const realDay = (day - date % 7 + 8) % 7;
      if (props2.firstDayOfWeek) {
        return (realDay + 7 - props2.firstDayOfWeek) % 7;
      }
      return realDay;
    });
    const totalDay = Vue.computed(() => utils$1.getMonthEndDay(props2.date.getFullYear(), props2.date.getMonth() + 1));
    const shouldRender = Vue.computed(() => visible.value || !props2.lazyRender);
    const getTitle = () => title.value;
    const getMultipleDayType = (day) => {
      const isSelected = (date) => props2.currentDate.some((item) => utils.compareDay(item, date) === 0);
      if (isSelected(day)) {
        const prevDay = utils.getPrevDay(day);
        const nextDay = utils.getNextDay(day);
        const prevSelected = isSelected(prevDay);
        const nextSelected = isSelected(nextDay);
        if (prevSelected && nextSelected) {
          return "multiple-middle";
        }
        if (prevSelected) {
          return "end";
        }
        if (nextSelected) {
          return "start";
        }
        return "multiple-selected";
      }
      return "";
    };
    const getRangeDayType = (day) => {
      const [startDay, endDay] = props2.currentDate;
      if (!startDay) {
        return "";
      }
      const compareToStart = utils.compareDay(day, startDay);
      if (!endDay) {
        return compareToStart === 0 ? "start" : "";
      }
      const compareToEnd = utils.compareDay(day, endDay);
      if (props2.allowSameDay && compareToStart === 0 && compareToEnd === 0) {
        return "start-end";
      }
      if (compareToStart === 0) {
        return "start";
      }
      if (compareToEnd === 0) {
        return "end";
      }
      if (compareToStart > 0 && compareToEnd < 0) {
        return "middle";
      }
      return "";
    };
    const getDayType = (day) => {
      const {
        type,
        minDate,
        maxDate,
        currentDate
      } = props2;
      if (minDate && utils.compareDay(day, minDate) < 0 || maxDate && utils.compareDay(day, maxDate) > 0) {
        return "disabled";
      }
      if (currentDate === null) {
        return "";
      }
      if (Array.isArray(currentDate)) {
        if (type === "multiple") {
          return getMultipleDayType(day);
        }
        if (type === "range") {
          return getRangeDayType(day);
        }
      } else if (type === "single") {
        return utils.compareDay(day, currentDate) === 0 ? "selected" : "";
      }
      return "";
    };
    const getBottomInfo = (dayType) => {
      if (props2.type === "range") {
        if (dayType === "start" || dayType === "end") {
          return utils.t(dayType);
        }
        if (dayType === "start-end") {
          return `${utils.t("start")}/${utils.t("end")}`;
        }
      }
    };
    const renderTitle = () => {
      if (props2.showMonthTitle) {
        return Vue.createVNode("div", {
          "class": utils.bem("month-title")
        }, [slots["month-title"] ? slots["month-title"]({
          date: props2.date,
          text: title.value
        }) : title.value]);
      }
    };
    const renderMark = () => {
      if (props2.showMark && shouldRender.value) {
        return Vue.createVNode("div", {
          "class": utils.bem("month-mark")
        }, [props2.date.getMonth() + 1]);
      }
    };
    const placeholders = Vue.computed(() => {
      const count = Math.ceil((totalDay.value + offset.value) / 7);
      return Array(count).fill({
        type: "placeholder"
      });
    });
    const days = Vue.computed(() => {
      const days2 = [];
      const year = props2.date.getFullYear();
      const month = props2.date.getMonth();
      for (let day = 1; day <= totalDay.value; day++) {
        const date = new Date(year, month, day);
        const type = getDayType(date);
        let config = {
          date,
          type,
          text: day,
          bottomInfo: getBottomInfo(type)
        };
        if (props2.formatter) {
          config = props2.formatter(config);
        }
        days2.push(config);
      }
      return days2;
    });
    const disabledDays = Vue.computed(() => days.value.filter((day) => day.type === "disabled"));
    const scrollToDate = (body, targetDate) => {
      if (daysRef.value) {
        const daysRect = index_esm.useRect(daysRef.value);
        const totalRows = placeholders.value.length;
        const currentRow = Math.ceil((targetDate.getDate() + offset.value) / 7);
        const rowOffset = (currentRow - 1) * daysRect.height / totalRows;
        dom.setScrollTop(body, daysRect.top + rowOffset + body.scrollTop - index_esm.useRect(body).top);
      }
    };
    const renderDay = (item, index) => Vue.createVNode(CalendarDay.default, {
      "item": item,
      "index": index,
      "color": props2.color,
      "offset": offset.value,
      "rowHeight": rowHeight.value,
      "onClick": (item2) => emit("click", item2),
      "onClickDisabledDate": (item2) => emit("clickDisabledDate", item2)
    }, basic.pick(slots, ["top-info", "bottom-info", "text"]));
    const renderDays = () => Vue.createVNode("div", {
      "ref": daysRef,
      "role": "grid",
      "class": utils.bem("days")
    }, [renderMark(), (shouldRender.value ? days : placeholders).value.map(renderDay)]);
    useExpose.useExpose({
      getTitle,
      getHeight: () => height.value,
      setVisible,
      scrollToDate,
      disabledDays
    });
    return () => Vue.createVNode("div", {
      "class": utils.bem("month"),
      "ref": monthRef
    }, [renderTitle(), renderDays()]);
  }
});
exports.default = stdin_default;
