"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const style = require("../../../../utils/dom/style.js");
const arrays = require("../../../../utils/arrays.js");
const index$1 = require("../../../../hooks/use-locale/index.js");
const index = require("../../../../hooks/use-namespace/index.js");
const utils$1 = require("../../../time-picker/src/utils.js");
const utils = require("../utils.js");
const basicCellRender = require("./basic-cell-render.js");
const basicYearTable = require("../props/basic-year-table.js");
const Vue = require("vue");
const dayjs_min = require("../../../../../../../_virtual/dayjs.min.js");
const _hoisted_1 = ["aria-label"];
const _hoisted_2 = [
  "aria-selected",
  "aria-label",
  "tabindex",
  "onKeydown"
];
var basic_year_table_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ Vue.defineComponent({
  __name: "basic-year-table",
  props: basicYearTable.basicYearTableProps,
  emits: [
    "changerange",
    "pick",
    "select"
  ],
  setup(__props, { expose: __expose, emit: __emit }) {
    const datesInYear = (year, lang2) => {
      const firstDay = dayjs_min.default(String(year)).locale(lang2).startOf("year");
      return utils$1.rangeArr(firstDay.endOf("year").dayOfYear()).map((n) => firstDay.add(n, "day").toDate());
    };
    const props = __props;
    const emit = __emit;
    const ns = index.useNamespace("year-table");
    const { t, lang } = index$1.useLocale();
    const tbodyRef = Vue.ref();
    const currentCellRef = Vue.ref();
    const startYear = Vue.computed(() => {
      return Math.floor(props.date.year() / 10) * 10;
    });
    const tableRows = Vue.ref([
      [],
      [],
      []
    ]);
    const lastRow = Vue.ref();
    const lastColumn = Vue.ref();
    const rows = Vue.computed(() => {
      var _a, _b, _c;
      const rows2 = tableRows.value;
      const now = dayjs_min.default().locale(lang.value).startOf("year");
      for (let i = 0; i < 3; i++) {
        const row = rows2[i];
        for (let j = 0; j < 4; j++) {
          if (i * 4 + j >= 10) break;
          let cell = row[j];
          if (!cell) cell = {
            row: i,
            column: j,
            type: "normal",
            inRange: false,
            start: false,
            end: false,
            text: -1,
            disabled: false,
            isSelected: false,
            customClass: void 0,
            date: void 0,
            dayjs: void 0,
            isCurrent: void 0,
            selected: void 0,
            renderText: void 0,
            timestamp: void 0
          };
          cell.type = "normal";
          const index2 = i * 4 + j + startYear.value;
          const calTime = dayjs_min.default().year(index2);
          const calEndDate = props.rangeState.endDate || props.maxDate || props.rangeState.selecting && props.minDate || null;
          cell.inRange = !!(props.minDate && calTime.isSameOrAfter(props.minDate, "year") && calEndDate && calTime.isSameOrBefore(calEndDate, "year")) || !!(props.minDate && calTime.isSameOrBefore(props.minDate, "year") && calEndDate && calTime.isSameOrAfter(calEndDate, "year"));
          if ((_a = props.minDate) == null ? void 0 : _a.isSameOrAfter(calEndDate)) {
            cell.start = !!(calEndDate && calTime.isSame(calEndDate, "year"));
            cell.end = !!(props.minDate && calTime.isSame(props.minDate, "year"));
          } else {
            cell.start = !!(props.minDate && calTime.isSame(props.minDate, "year"));
            cell.end = !!(calEndDate && calTime.isSame(calEndDate, "year"));
          }
          if (now.isSame(calTime)) cell.type = "today";
          cell.text = index2;
          const cellDate = calTime.toDate();
          cell.disabled = ((_b = props.disabledDate) == null ? void 0 : _b.call(props, cellDate)) || false;
          cell.date = cellDate;
          cell.customClass = (_c = props.cellClassName) == null ? void 0 : _c.call(props, cellDate);
          cell.dayjs = calTime;
          cell.timestamp = calTime.valueOf();
          cell.isSelected = isSelectedCell(cell);
          row[j] = cell;
        }
      }
      return rows2;
    });
    const focus = () => {
      var _a;
      (_a = currentCellRef.value) == null ? void 0 : _a.focus();
    };
    const getCellKls = (cell) => {
      const kls = {};
      const today = dayjs_min.default().locale(lang.value);
      const year = cell.text;
      kls.disabled = props.disabled || (props.disabledDate ? datesInYear(year, lang.value).every(props.disabledDate) : false);
      kls.today = today.year() === year;
      kls.current = arrays.castArray(props.parsedValue).some((d) => d.year() === year);
      if (cell.customClass) kls[cell.customClass] = true;
      if (cell.inRange) {
        kls["in-range"] = true;
        if (cell.start) kls["start-date"] = true;
        if (cell.end) kls["end-date"] = true;
      }
      return kls;
    };
    const isSelectedCell = (cell) => {
      const year = cell.text;
      return arrays.castArray(props.date).some((date) => date.year() === year);
    };
    const handleYearTableClick = (event) => {
      var _a;
      if (props.disabled) return;
      const target = (_a = event.target) == null ? void 0 : _a.closest("td");
      if (!target || !target.textContent || style.hasClass(target, "disabled")) return;
      const column = target.cellIndex;
      const selectedYear = target.parentNode.rowIndex * 4 + column + startYear.value;
      const newDate = dayjs_min.default().year(selectedYear);
      if (props.selectionMode === "range") if (!props.rangeState.selecting) {
        emit("pick", {
          minDate: newDate,
          maxDate: null
        });
        emit("select", true);
      } else {
        if (props.minDate && newDate >= props.minDate) emit("pick", {
          minDate: props.minDate,
          maxDate: newDate
        });
        else emit("pick", {
          minDate: newDate,
          maxDate: props.minDate
        });
        emit("select", false);
      }
      else if (props.selectionMode === "years") {
        if (event.type === "keydown") {
          emit("pick", arrays.castArray(props.parsedValue), false);
          return;
        }
        const vaildYear = utils.getValidDateOfYear(newDate.startOf("year"), lang.value, props.disabledDate);
        emit("pick", style.hasClass(target, "current") ? arrays.castArray(props.parsedValue).filter((d) => (d == null ? void 0 : d.year()) !== selectedYear) : arrays.castArray(props.parsedValue).concat([vaildYear]));
      } else emit("pick", selectedYear);
    };
    const handleMouseMove = (event) => {
      var _a;
      if (!props.rangeState.selecting) return;
      const target = (_a = event.target) == null ? void 0 : _a.closest("td");
      if (!target) return;
      const row = target.parentNode.rowIndex;
      const column = target.cellIndex;
      if (rows.value[row][column].disabled) return;
      if (row !== lastRow.value || column !== lastColumn.value) {
        lastRow.value = row;
        lastColumn.value = column;
        emit("changerange", {
          selecting: true,
          endDate: dayjs_min.default().year(startYear.value).add(row * 4 + column, "year")
        });
      }
    };
    Vue.watch(() => props.date, async () => {
      var _a, _b;
      if ((_a = tbodyRef.value) == null ? void 0 : _a.contains(document.activeElement)) {
        await Vue.nextTick();
        (_b = currentCellRef.value) == null ? void 0 : _b.focus();
      }
    });
    __expose({ focus });
    return (_ctx, _cache) => {
      return Vue.openBlock(), Vue.createElementBlock("table", {
        role: "grid",
        "aria-label": Vue.unref(t)("el.datepicker.yearTablePrompt"),
        class: Vue.normalizeClass(Vue.unref(ns).b()),
        onClick: handleYearTableClick,
        onMousemove: handleMouseMove
      }, [Vue.createElementVNode("tbody", {
        ref_key: "tbodyRef",
        ref: tbodyRef
      }, [(Vue.openBlock(true), Vue.createElementBlock(Vue.Fragment, null, Vue.renderList(rows.value, (row, rowKey) => {
        return Vue.openBlock(), Vue.createElementBlock("tr", { key: rowKey }, [(Vue.openBlock(true), Vue.createElementBlock(Vue.Fragment, null, Vue.renderList(row, (cell, cellKey) => {
          return Vue.openBlock(), Vue.createElementBlock("td", {
            key: `${rowKey}_${cellKey}`,
            ref_for: true,
            ref: (el) => cell.isSelected && (currentCellRef.value = el),
            class: Vue.normalizeClass(["available", getCellKls(cell)]),
            "aria-selected": cell.isSelected,
            "aria-label": String(cell.text),
            tabindex: cell.isSelected ? 0 : -1,
            onKeydown: [Vue.withKeys(Vue.withModifiers(handleYearTableClick, ["prevent", "stop"]), ["space"]), Vue.withKeys(Vue.withModifiers(handleYearTableClick, ["prevent", "stop"]), ["enter"])]
          }, [Vue.createVNode(Vue.unref(basicCellRender.default), { cell }, null, 8, ["cell"])], 42, _hoisted_2);
        }), 128))]);
      }), 128))], 512)], 42, _hoisted_1);
    };
  }
});
exports.default = basic_year_table_vue_vue_type_script_setup_true_lang_default;
