@element-plus/nightly 0.0.20221019 → 0.0.20221021

package/es/components/calendar/src/calendar2.mjs

@@ -1,17 +1,11 @@
-import { defineComponent, useSlots, ref, computed, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, renderSlot, toDisplayString, createVNode, withCtx, createTextVNode, createCommentVNode, createSlots, normalizeProps, mergeProps, Fragment, renderList, createBlock } from 'vue';
-import dayjs from 'dayjs';
+import { defineComponent, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, renderSlot, toDisplayString, createVNode, withCtx, createTextVNode, createCommentVNode, createSlots, normalizeProps, mergeProps, Fragment, renderList, createBlock } from 'vue';
 import { ElButtonGroup, ElButton } from '../../button/index.mjs';
 import '../../../hooks/index.mjs';
-import '../../../utils/index.mjs';
-import '../../../constants/index.mjs';
 import DateTable from './date-table2.mjs';
+import { useCalendar } from './use-calendar.mjs';
 import { calendarProps, calendarEmits } from './calendar.mjs';
 import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
 import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
-import { useLocale } from '../../../hooks/use-locale/index.mjs';
-import { INPUT_EVENT, UPDATE_MODEL_EVENT } from '../../../constants/event.mjs';
-import { debugWarn } from '../../../utils/error.mjs';
-import { useDeprecated } from '../../../hooks/use-deprecated/index.mjs';
 
 const COMPONENT_NAME = "ElCalendar";
 const __default__ = defineComponent({
@@ -23,126 +17,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   emits: calendarEmits,
   setup(__props, { expose, emit }) {
     const props = __props;
-    const solts = useSlots();
     const ns = useNamespace("calendar");
-    const { t, lang } = useLocale();
-    const selectedDay = ref();
-    const now = dayjs().locale(lang.value);
-    const realSelectedDay = computed({
-      get() {
-        if (!props.modelValue)
-          return selectedDay.value;
-        return date.value;
-      },
-      set(val) {
-        if (!val)
-          return;
-        selectedDay.value = val;
-        const result = val.toDate();
-        emit(INPUT_EVENT, result);
-        emit(UPDATE_MODEL_EVENT, result);
-      }
-    });
-    const validatedRange = computed(() => {
-      if (!props.range)
-        return [];
-      const rangeArrDayjs = props.range.map((_) => dayjs(_).locale(lang.value));
-      const [startDayjs, endDayjs] = rangeArrDayjs;
-      if (startDayjs.isAfter(endDayjs)) {
-        debugWarn(COMPONENT_NAME, "end time should be greater than start time");
-        return [];
-      }
-      if (startDayjs.isSame(endDayjs, "month")) {
-        return calculateValidatedDateRange(startDayjs, endDayjs);
-      } else {
-        if (startDayjs.add(1, "month").month() !== endDayjs.month()) {
-          debugWarn(COMPONENT_NAME, "start time and end time interval must not exceed two months");
-          return [];
-        }
-        return calculateValidatedDateRange(startDayjs, endDayjs);
-      }
-    });
-    const date = computed(() => {
-      if (!props.modelValue) {
-        if (realSelectedDay.value) {
-          return realSelectedDay.value;
-        } else if (validatedRange.value.length) {
-          return validatedRange.value[0][0];
-        }
-        return now;
-      } else {
-        return dayjs(props.modelValue).locale(lang.value);
-      }
-    });
-    const prevMonthDayjs = computed(() => date.value.subtract(1, "month").date(1));
-    const nextMonthDayjs = computed(() => date.value.add(1, "month").date(1));
-    const prevYearDayjs = computed(() => date.value.subtract(1, "year").date(1));
-    const nextYearDayjs = computed(() => date.value.add(1, "year").date(1));
-    const i18nDate = computed(() => {
-      const pickedMonth = `el.datepicker.month${date.value.format("M")}`;
-      return `${date.value.year()} ${t("el.datepicker.year")} ${t(pickedMonth)}`;
-    });
-    const calculateValidatedDateRange = (startDayjs, endDayjs) => {
-      const firstDay = startDayjs.startOf("week");
-      const lastDay = endDayjs.endOf("week");
-      const firstMonth = firstDay.get("month");
-      const lastMonth = lastDay.get("month");
-      if (firstMonth === lastMonth) {
-        return [[firstDay, lastDay]];
-      } else if (firstMonth + 1 === lastMonth) {
-        const firstMonthLastDay = firstDay.endOf("month");
-        const lastMonthFirstDay = lastDay.startOf("month");
-        const isSameWeek = firstMonthLastDay.isSame(lastMonthFirstDay, "week");
-        const lastMonthStartDay = isSameWeek ? lastMonthFirstDay.add(1, "week") : lastMonthFirstDay;
-        return [
-          [firstDay, firstMonthLastDay],
-          [lastMonthStartDay.startOf("week"), lastDay]
-        ];
-      } else if (firstMonth + 2 === lastMonth || (firstMonth + 1) % 11 === lastMonth) {
-        const firstMonthLastDay = firstDay.endOf("month");
-        const secondMonthFirstDay = firstDay.add(1, "month").startOf("month");
-        const secondMonthStartDay = firstMonthLastDay.isSame(secondMonthFirstDay, "week") ? secondMonthFirstDay.add(1, "week") : secondMonthFirstDay;
-        const secondMonthLastDay = secondMonthStartDay.endOf("month");
-        const lastMonthFirstDay = lastDay.startOf("month");
-        const lastMonthStartDay = secondMonthLastDay.isSame(lastMonthFirstDay, "week") ? lastMonthFirstDay.add(1, "week") : lastMonthFirstDay;
-        return [
-          [firstDay, firstMonthLastDay],
-          [secondMonthStartDay.startOf("week"), secondMonthLastDay],
-          [lastMonthStartDay.startOf("week"), lastDay]
-        ];
-      } else {
-        debugWarn(COMPONENT_NAME, "start time and end time interval must not exceed two months");
-        return [];
-      }
-    };
-    const pickDay = (day) => {
-      realSelectedDay.value = day;
-    };
-    const selectDate = (type) => {
-      let day;
-      if (type === "prev-month") {
-        day = prevMonthDayjs.value;
-      } else if (type === "next-month") {
-        day = nextMonthDayjs.value;
-      } else if (type === "prev-year") {
-        day = prevYearDayjs.value;
-      } else if (type === "next-year") {
-        day = nextYearDayjs.value;
-      } else {
-        day = now;
-      }
-      if (day.isSame(date.value, "day"))
-        return;
-      pickDay(day);
-    };
-    useDeprecated({
-      from: '"dateCell"',
-      replacement: '"date-cell"',
-      scope: "ElCalendar",
-      version: "2.3.0",
-      ref: "https://element-plus.org/en-US/component/calendar.html#slots",
-      type: "Slot"
-    }, computed(() => !!solts.dateCell));
+    const {
+      calculateValidatedDateRange,
+      date,
+      pickDay,
+      realSelectedDay,
+      selectDate,
+      t,
+      i18nDate,
+      validatedRange
+    } = useCalendar(props, emit, COMPONENT_NAME);
     expose({
       selectedDay: realSelectedDay,
       pickDay,
@@ -168,7 +53,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 default: withCtx(() => [
                   createVNode(unref(ElButton), {
                     size: "small",
-                    onClick: _cache[0] || (_cache[0] = ($event) => selectDate("prev-month"))
+                    onClick: _cache[0] || (_cache[0] = ($event) => unref(selectDate)("prev-month"))
                   }, {
                     default: withCtx(() => [
                       createTextVNode(toDisplayString(unref(t)("el.datepicker.prevMonth")), 1)
@@ -177,7 +62,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   }),
                   createVNode(unref(ElButton), {
                     size: "small",
-                    onClick: _cache[1] || (_cache[1] = ($event) => selectDate("today"))
+                    onClick: _cache[1] || (_cache[1] = ($event) => unref(selectDate)("today"))
                   }, {
                     default: withCtx(() => [
                       createTextVNode(toDisplayString(unref(t)("el.datepicker.today")), 1)
@@ -186,7 +71,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   }),
                   createVNode(unref(ElButton), {
                     size: "small",
-                    onClick: _cache[2] || (_cache[2] = ($event) => selectDate("next-month"))
+                    onClick: _cache[2] || (_cache[2] = ($event) => unref(selectDate)("next-month"))
                   }, {
                     default: withCtx(() => [
                       createTextVNode(toDisplayString(unref(t)("el.datepicker.nextMonth")), 1)
@@ -206,7 +91,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           createVNode(DateTable, {
             date: unref(date),
             "selected-day": unref(realSelectedDay),
-            onPick: pickDay
+            onPick: unref(pickDay)
           }, createSlots({ _: 2 }, [
             _ctx.$slots["date-cell"] || _ctx.$slots.dateCell ? {
               name: "date-cell",
@@ -214,7 +99,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 _ctx.$slots["date-cell"] ? renderSlot(_ctx.$slots, "date-cell", normalizeProps(mergeProps({ key: 0 }, data))) : renderSlot(_ctx.$slots, "dateCell", normalizeProps(mergeProps({ key: 1 }, data)))
               ])
             } : void 0
-          ]), 1032, ["date", "selected-day"])
+          ]), 1032, ["date", "selected-day", "onPick"])
         ], 2)) : (openBlock(), createElementBlock("div", {
           key: 1,
           class: normalizeClass(unref(ns).e("body"))
@@ -226,7 +111,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               "selected-day": unref(realSelectedDay),
               range: range_,
               "hide-header": index !== 0,
-              onPick: pickDay
+              onPick: unref(pickDay)
             }, createSlots({ _: 2 }, [
               _ctx.$slots["date-cell"] || _ctx.$slots.dateCell ? {
                 name: "date-cell",
@@ -234,7 +119,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   _ctx.$slots["date-cell"] ? renderSlot(_ctx.$slots, "date-cell", normalizeProps(mergeProps({ key: 0 }, data))) : renderSlot(_ctx.$slots, "dateCell", normalizeProps(mergeProps({ key: 1 }, data)))
                 ])
               } : void 0
-            ]), 1032, ["date", "selected-day", "range", "hide-header"]);
+            ]), 1032, ["date", "selected-day", "range", "hide-header", "onPick"]);
           }), 128))
         ], 2))
       ], 2);

package/es/components/calendar/src/calendar2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"calendar2.mjs","sources":["../../../../../../packages/components/calendar/src/calendar.vue"],"sourcesContent":["<template>\n  <div :class=\"ns.b()\">\n    <div :class=\"ns.e('header')\">\n      <slot name=\"header\" :date=\"i18nDate\">\n        <div :class=\"ns.e('title')\">{{ i18nDate }}</div>\n        <div v-if=\"validatedRange.length === 0\" :class=\"ns.e('button-group')\">\n          <el-button-group>\n            <el-button size=\"small\" @click=\"selectDate('prev-month')\">\n              {{ t('el.datepicker.prevMonth') }}\n            </el-button>\n            <el-button size=\"small\" @click=\"selectDate('today')\">\n              {{ t('el.datepicker.today') }}\n            </el-button>\n            <el-button size=\"small\" @click=\"selectDate('next-month')\">\n              {{ t('el.datepicker.nextMonth') }}\n            </el-button>\n          </el-button-group>\n        </div>\n      </slot>\n    </div>\n    <div v-if=\"validatedRange.length === 0\" :class=\"ns.e('body')\">\n      <date-table :date=\"date\" :selected-day=\"realSelectedDay\" @pick=\"pickDay\">\n        <template\n          v-if=\"$slots['date-cell'] || $slots.dateCell\"\n          #date-cell=\"data\"\n        >\n          <slot v-if=\"$slots['date-cell']\" name=\"date-cell\" v-bind=\"data\" />\n          <slot v-else name=\"dateCell\" v-bind=\"data\" />\n        </template>\n      </date-table>\n    </div>\n    <div v-else :class=\"ns.e('body')\">\n      <date-table\n        v-for=\"(range_, index) in validatedRange\"\n        :key=\"index\"\n        :date=\"range_[0]\"\n        :selected-day=\"realSelectedDay\"\n        :range=\"range_\"\n        :hide-header=\"index !== 0\"\n        @pick=\"pickDay\"\n      >\n        <template\n          v-if=\"$slots['date-cell'] || $slots.dateCell\"\n          #date-cell=\"data\"\n        >\n          <slot v-if=\"$slots['date-cell']\" name=\"date-cell\" v-bind=\"data\" />\n          <slot v-else name=\"dateCell\" v-bind=\"data\" />\n        </template>\n      </date-table>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref, useSlots } from 'vue'\nimport dayjs from 'dayjs'\nimport { ElButton, ElButtonGroup } from '@element-plus/components/button'\nimport { useDeprecated, useLocale, useNamespace } from '@element-plus/hooks'\nimport { debugWarn } from '@element-plus/utils'\nimport { INPUT_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport DateTable from './date-table.vue'\nimport { calendarEmits, calendarProps } from './calendar'\n\nimport type { CalendarDateType } from './calendar'\nimport type { ComputedRef } from 'vue'\nimport type { Dayjs } from 'dayjs'\n\nconst COMPONENT_NAME = 'ElCalendar'\ndefineOptions({\n  name: COMPONENT_NAME,\n})\n\nconst props = defineProps(calendarProps)\nconst emit = defineEmits(calendarEmits)\n\nconst solts = useSlots()\nconst ns = useNamespace('calendar')\nconst { t, lang } = useLocale()\n\nconst selectedDay = ref<Dayjs>()\nconst now = dayjs().locale(lang.value)\n\nconst realSelectedDay = computed<Dayjs | undefined>({\n  get() {\n    if (!props.modelValue) return selectedDay.value\n    return date.value\n  },\n  set(val) {\n    if (!val) return\n    selectedDay.value = val\n    const result = val.toDate()\n\n    emit(INPUT_EVENT, result)\n    emit(UPDATE_MODEL_EVENT, result)\n  },\n})\n\n// if range is valid, we get a two-digit array\nconst validatedRange = computed(() => {\n  if (!props.range) return []\n  const rangeArrDayjs = props.range.map((_) => dayjs(_).locale(lang.value))\n  const [startDayjs, endDayjs] = rangeArrDayjs\n  if (startDayjs.isAfter(endDayjs)) {\n    debugWarn(COMPONENT_NAME, 'end time should be greater than start time')\n    return []\n  }\n  if (startDayjs.isSame(endDayjs, 'month')) {\n    // same month\n    return calculateValidatedDateRange(startDayjs, endDayjs)\n  } else {\n    // two months\n    if (startDayjs.add(1, 'month').month() !== endDayjs.month()) {\n      debugWarn(\n        COMPONENT_NAME,\n        'start time and end time interval must not exceed two months'\n      )\n      return []\n    }\n    return calculateValidatedDateRange(startDayjs, endDayjs)\n  }\n})\n\nconst date: ComputedRef<Dayjs> = computed(() => {\n  if (!props.modelValue) {\n    if (realSelectedDay.value) {\n      return realSelectedDay.value\n    } else if (validatedRange.value.length) {\n      return validatedRange.value[0][0]\n    }\n    return now\n  } else {\n    return dayjs(props.modelValue).locale(lang.value)\n  }\n})\nconst prevMonthDayjs = computed(() => date.value.subtract(1, 'month').date(1))\nconst nextMonthDayjs = computed(() => date.value.add(1, 'month').date(1))\nconst prevYearDayjs = computed(() => date.value.subtract(1, 'year').date(1))\nconst nextYearDayjs = computed(() => date.value.add(1, 'year').date(1))\n\nconst i18nDate = computed(() => {\n  const pickedMonth = `el.datepicker.month${date.value.format('M')}`\n  return `${date.value.year()} ${t('el.datepicker.year')} ${t(pickedMonth)}`\n})\n\n// https://github.com/element-plus/element-plus/issues/3155\n// Calculate the validate date range according to the start and end dates\nconst calculateValidatedDateRange = (\n  startDayjs: Dayjs,\n  endDayjs: Dayjs\n): [Dayjs, Dayjs][] => {\n  const firstDay = startDayjs.startOf('week')\n  const lastDay = endDayjs.endOf('week')\n  const firstMonth = firstDay.get('month')\n  const lastMonth = lastDay.get('month')\n\n  // Current mouth\n  if (firstMonth === lastMonth) {\n    return [[firstDay, lastDay]]\n  }\n  // Two adjacent months\n  else if (firstMonth + 1 === lastMonth) {\n    const firstMonthLastDay = firstDay.endOf('month')\n    const lastMonthFirstDay = lastDay.startOf('month')\n\n    // Whether the last day of the first month and the first day of the last month is in the same week\n    const isSameWeek = firstMonthLastDay.isSame(lastMonthFirstDay, 'week')\n    const lastMonthStartDay = isSameWeek\n      ? lastMonthFirstDay.add(1, 'week')\n      : lastMonthFirstDay\n\n    return [\n      [firstDay, firstMonthLastDay],\n      [lastMonthStartDay.startOf('week'), lastDay],\n    ]\n  }\n  // Three consecutive months (compatible: 2021-01-30 to 2021-02-28)\n  else if (\n    firstMonth + 2 === lastMonth ||\n    (firstMonth + 1) % 11 === lastMonth\n  ) {\n    const firstMonthLastDay = firstDay.endOf('month')\n    const secondMonthFirstDay = firstDay.add(1, 'month').startOf('month')\n\n    // Whether the last day of the first month and the second month is in the same week\n    const secondMonthStartDay = firstMonthLastDay.isSame(\n      secondMonthFirstDay,\n      'week'\n    )\n      ? secondMonthFirstDay.add(1, 'week')\n      : secondMonthFirstDay\n\n    const secondMonthLastDay = secondMonthStartDay.endOf('month')\n    const lastMonthFirstDay = lastDay.startOf('month')\n\n    // Whether the last day of the second month and the last day of the last month is in the same week\n    const lastMonthStartDay = secondMonthLastDay.isSame(\n      lastMonthFirstDay,\n      'week'\n    )\n      ? lastMonthFirstDay.add(1, 'week')\n      : lastMonthFirstDay\n\n    return [\n      [firstDay, firstMonthLastDay],\n      [secondMonthStartDay.startOf('week'), secondMonthLastDay],\n      [lastMonthStartDay.startOf('week'), lastDay],\n    ]\n  }\n  // Other cases\n  else {\n    debugWarn(\n      COMPONENT_NAME,\n      'start time and end time interval must not exceed two months'\n    )\n    return []\n  }\n}\n\nconst pickDay = (day: Dayjs) => {\n  realSelectedDay.value = day\n}\n\nconst selectDate = (type: CalendarDateType) => {\n  let day: Dayjs\n  if (type === 'prev-month') {\n    day = prevMonthDayjs.value\n  } else if (type === 'next-month') {\n    day = nextMonthDayjs.value\n  } else if (type === 'prev-year') {\n    day = prevYearDayjs.value\n  } else if (type === 'next-year') {\n    day = nextYearDayjs.value\n  } else {\n    day = now\n  }\n\n  if (day.isSame(date.value, 'day')) return\n  pickDay(day)\n}\n\nuseDeprecated(\n  {\n    from: '\"dateCell\"',\n    replacement: '\"date-cell\"',\n    scope: 'ElCalendar',\n    version: '2.3.0',\n    ref: 'https://element-plus.org/en-US/component/calendar.html#slots',\n    type: 'Slot',\n  },\n  computed(() => !!solts.dateCell)\n)\n\ndefineExpose({\n  /** @description currently selected date */\n  selectedDay: realSelectedDay,\n  /** @description select a specific date */\n  pickDay,\n  /** @description select date */\n  selectDate,\n  /** @description Calculate the validate date range according to the start and end dates */\n  calculateValidatedDateRange,\n})\n</script>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"calendar2.mjs","sources":["../../../../../../packages/components/calendar/src/calendar.vue"],"sourcesContent":["<template>\n  <div :class=\"ns.b()\">\n    <div :class=\"ns.e('header')\">\n      <slot name=\"header\" :date=\"i18nDate\">\n        <div :class=\"ns.e('title')\">{{ i18nDate }}</div>\n        <div v-if=\"validatedRange.length === 0\" :class=\"ns.e('button-group')\">\n          <el-button-group>\n            <el-button size=\"small\" @click=\"selectDate('prev-month')\">\n              {{ t('el.datepicker.prevMonth') }}\n            </el-button>\n            <el-button size=\"small\" @click=\"selectDate('today')\">\n              {{ t('el.datepicker.today') }}\n            </el-button>\n            <el-button size=\"small\" @click=\"selectDate('next-month')\">\n              {{ t('el.datepicker.nextMonth') }}\n            </el-button>\n          </el-button-group>\n        </div>\n      </slot>\n    </div>\n    <div v-if=\"validatedRange.length === 0\" :class=\"ns.e('body')\">\n      <date-table :date=\"date\" :selected-day=\"realSelectedDay\" @pick=\"pickDay\">\n        <template\n          v-if=\"$slots['date-cell'] || $slots.dateCell\"\n          #date-cell=\"data\"\n        >\n          <slot v-if=\"$slots['date-cell']\" name=\"date-cell\" v-bind=\"data\" />\n          <slot v-else name=\"dateCell\" v-bind=\"data\" />\n        </template>\n      </date-table>\n    </div>\n    <div v-else :class=\"ns.e('body')\">\n      <date-table\n        v-for=\"(range_, index) in validatedRange\"\n        :key=\"index\"\n        :date=\"range_[0]\"\n        :selected-day=\"realSelectedDay\"\n        :range=\"range_\"\n        :hide-header=\"index !== 0\"\n        @pick=\"pickDay\"\n      >\n        <template\n          v-if=\"$slots['date-cell'] || $slots.dateCell\"\n          #date-cell=\"data\"\n        >\n          <slot v-if=\"$slots['date-cell']\" name=\"date-cell\" v-bind=\"data\" />\n          <slot v-else name=\"dateCell\" v-bind=\"data\" />\n        </template>\n      </date-table>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { ElButton, ElButtonGroup } from '@element-plus/components/button'\nimport { useNamespace } from '@element-plus/hooks'\n\nimport DateTable from './date-table.vue'\nimport { useCalendar } from './use-calendar'\nimport { calendarEmits, calendarProps } from './calendar'\n\nconst ns = useNamespace('calendar')\n\nconst COMPONENT_NAME = 'ElCalendar'\ndefineOptions({\n  name: COMPONENT_NAME,\n})\n\nconst props = defineProps(calendarProps)\nconst emit = defineEmits(calendarEmits)\n\nconst {\n  calculateValidatedDateRange,\n  date,\n  pickDay,\n  realSelectedDay,\n  selectDate,\n  t,\n  i18nDate,\n  validatedRange,\n} = useCalendar(props, emit, COMPONENT_NAME)\n\ndefineExpose({\n  /** @description currently selected date */\n  selectedDay: realSelectedDay,\n  /** @description select a specific date */\n  pickDay,\n  /** @description select date */\n  selectDate,\n  /** @description Calculate the validate date range according to the start and end dates */\n  calculateValidatedDateRange,\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;mCAgEc,CAAA;AAAA,EACZ,IAAM,EAAA,cAAA;AACR;;;;;;;AALA,IAAM,MAAA,EAAA,GAAK,aAAa,UAAU,CAAA,CAAA;AAUlC,IAAM,MAAA;AAAA,MACJ,2BAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAA;AAAA,MACA,eAAA;AAAA,MACA,UAAA;AAAA,MACA,CAAA;AAAA,MACA,QAAA;AAAA,MACA,cAAA;AAAA,KACE,GAAA,WAAA,CAAY,KAAO,EAAA,IAAA,EAAM,cAAc,CAAA,CAAA;AAE3C,IAAa,MAAA,CAAA;AAAA,MAEX,WAAa,EAAA,eAAA;AAAA,MAEb,OAAA;AAAA,MAEA,UAAA;AAAA,MAEA,2BAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/components/calendar/src/date-table.d.ts

@@ -1,6 +1,5 @@
 import type { ExtractPropTypes } from 'vue';
 import type { Dayjs } from 'dayjs';
-import type DateTable from './date-table.vue';
 export declare type CalendarDateCellType = 'next' | 'prev' | 'current';
 export declare type CalendarDateCell = {
     text: number;
@@ -40,4 +39,3 @@ export declare const dateTableEmits: {
     pick: (value: Dayjs) => boolean;
 };
 export declare type DateTableEmits = typeof dateTableEmits;
-export declare type DateTableInstance = InstanceType<typeof DateTable>;

package/es/components/calendar/src/date-table.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"date-table.mjs","sources":["../../../../../../packages/components/calendar/src/date-table.ts"],"sourcesContent":["import { buildProps, definePropType, isObject } from '@element-plus/utils'\nimport { rangeArr } from '@element-plus/components/time-picker'\nimport type { ExtractPropTypes } from 'vue'\nimport type { Dayjs } from 'dayjs'\nimport type DateTable from './date-table.vue'\n\nexport type CalendarDateCellType = 'next' | 'prev' | 'current'\nexport type CalendarDateCell = {\n  text: number\n  type: CalendarDateCellType\n}\n\nexport const getPrevMonthLastDays = (date: Dayjs, count: number) => {\n  const lastDay = date.subtract(1, 'month').endOf('month').date()\n  return rangeArr(count).map((_, index) => lastDay - (count - index - 1))\n}\n\nexport const getMonthDays = (date: Dayjs) => {\n  const days = date.daysInMonth()\n  return rangeArr(days).map((_, index) => index + 1)\n}\n\nexport const toNestedArr = (days: CalendarDateCell[]) =>\n  rangeArr(days.length / 7).map((index) => {\n    const start = index * 7\n    return days.slice(start, start + 7)\n  })\n\nexport const dateTableProps = buildProps({\n  selectedDay: {\n    type: definePropType<Dayjs>(Object),\n  },\n  range: {\n    type: definePropType<[Dayjs, Dayjs]>(Array),\n  },\n  date: {\n    type: definePropType<Dayjs>(Object),\n    required: true,\n  },\n  hideHeader: {\n    type: Boolean,\n  },\n} as const)\nexport type DateTableProps = ExtractPropTypes<typeof dateTableProps>\n\nexport const dateTableEmits = {\n  pick: (value: Dayjs) => isObject(value),\n}\nexport type DateTableEmits = typeof dateTableEmits\n\nexport type DateTableInstance = InstanceType<typeof DateTable>\n"],"names":[],"mappings":";;;;;;AAEY,MAAC,oBAAoB,GAAG,CAAC,IAAI,EAAE,KAAK,KAAK;AACrD,EAAE,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,CAAC;AAClE,EAAE,OAAO,QAAQ,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,KAAK,OAAO,IAAI,KAAK,GAAG,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC;AAC1E,EAAE;AACU,MAAC,YAAY,GAAG,CAAC,IAAI,KAAK;AACtC,EAAE,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;AAClC,EAAE,OAAO,QAAQ,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,KAAK,KAAK,GAAG,CAAC,CAAC,CAAC;AACrD,EAAE;AACU,MAAC,WAAW,GAAG,CAAC,IAAI,KAAK,QAAQ,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,KAAK;AAC9E,EAAE,MAAM,KAAK,GAAG,KAAK,GAAG,CAAC,CAAC;AAC1B,EAAE,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;AACtC,CAAC,EAAE;AACS,MAAC,cAAc,GAAG,UAAU,CAAC;AACzC,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,cAAc,CAAC,KAAK,CAAC;AAC/B,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,QAAQ,EAAE,IAAI;AAClB,GAAG;AACH,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,OAAO;AACjB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,cAAc,GAAG;AAC9B,EAAE,IAAI,EAAE,CAAC,KAAK,KAAK,QAAQ,CAAC,KAAK,CAAC;AAClC;;;;"}
+{"version":3,"file":"date-table.mjs","sources":["../../../../../../packages/components/calendar/src/date-table.ts"],"sourcesContent":["import { buildProps, definePropType, isObject } from '@element-plus/utils'\nimport { rangeArr } from '@element-plus/components/time-picker'\nimport type { ExtractPropTypes } from 'vue'\nimport type { Dayjs } from 'dayjs'\n\nexport type CalendarDateCellType = 'next' | 'prev' | 'current'\nexport type CalendarDateCell = {\n  text: number\n  type: CalendarDateCellType\n}\n\nexport const getPrevMonthLastDays = (date: Dayjs, count: number) => {\n  const lastDay = date.subtract(1, 'month').endOf('month').date()\n  return rangeArr(count).map((_, index) => lastDay - (count - index - 1))\n}\n\nexport const getMonthDays = (date: Dayjs) => {\n  const days = date.daysInMonth()\n  return rangeArr(days).map((_, index) => index + 1)\n}\n\nexport const toNestedArr = (days: CalendarDateCell[]) =>\n  rangeArr(days.length / 7).map((index) => {\n    const start = index * 7\n    return days.slice(start, start + 7)\n  })\n\nexport const dateTableProps = buildProps({\n  selectedDay: {\n    type: definePropType<Dayjs>(Object),\n  },\n  range: {\n    type: definePropType<[Dayjs, Dayjs]>(Array),\n  },\n  date: {\n    type: definePropType<Dayjs>(Object),\n    required: true,\n  },\n  hideHeader: {\n    type: Boolean,\n  },\n} as const)\nexport type DateTableProps = ExtractPropTypes<typeof dateTableProps>\n\nexport const dateTableEmits = {\n  pick: (value: Dayjs) => isObject(value),\n}\nexport type DateTableEmits = typeof dateTableEmits\n"],"names":[],"mappings":";;;;;;AAEY,MAAC,oBAAoB,GAAG,CAAC,IAAI,EAAE,KAAK,KAAK;AACrD,EAAE,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,CAAC;AAClE,EAAE,OAAO,QAAQ,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,KAAK,OAAO,IAAI,KAAK,GAAG,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC;AAC1E,EAAE;AACU,MAAC,YAAY,GAAG,CAAC,IAAI,KAAK;AACtC,EAAE,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;AAClC,EAAE,OAAO,QAAQ,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,KAAK,KAAK,GAAG,CAAC,CAAC,CAAC;AACrD,EAAE;AACU,MAAC,WAAW,GAAG,CAAC,IAAI,KAAK,QAAQ,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,KAAK;AAC9E,EAAE,MAAM,KAAK,GAAG,KAAK,GAAG,CAAC,CAAC;AAC1B,EAAE,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;AACtC,CAAC,EAAE;AACS,MAAC,cAAc,GAAG,UAAU,CAAC;AACzC,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,cAAc,CAAC,KAAK,CAAC;AAC/B,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,QAAQ,EAAE,IAAI;AAClB,GAAG;AACH,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,OAAO;AACjB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,cAAc,GAAG;AAC9B,EAAE,IAAI,EAAE,CAAC,KAAK,KAAK,QAAQ,CAAC,KAAK,CAAC;AAClC;;;;"}

package/es/components/calendar/src/date-table.vue.d.ts

@@ -1,21 +1,19 @@
-import dayjs from 'dayjs';
-import type { CalendarDateCell, CalendarDateCellType } from './date-table';
-import type { Dayjs } from 'dayjs';
+import type { CalendarDateCell } from './date-table';
 declare const _default: import("vue").DefineComponent<{
     readonly selectedDay: {
-        readonly type: import("vue").PropType<dayjs.Dayjs>;
+        readonly type: import("vue").PropType<import("dayjs").Dayjs>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
     };
     readonly range: {
-        readonly type: import("vue").PropType<[dayjs.Dayjs, dayjs.Dayjs]>;
+        readonly type: import("vue").PropType<[import("dayjs").Dayjs, import("dayjs").Dayjs]>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
     };
     readonly date: {
-        readonly type: import("vue").PropType<dayjs.Dayjs>;
+        readonly type: import("vue").PropType<import("dayjs").Dayjs>;
         readonly required: true;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -29,19 +27,19 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
         readonly selectedDay: {
-            readonly type: import("vue").PropType<dayjs.Dayjs>;
+            readonly type: import("vue").PropType<import("dayjs").Dayjs>;
             readonly required: false;
             readonly validator: ((val: unknown) => boolean) | undefined;
             __epPropKey: true;
         };
         readonly range: {
-            readonly type: import("vue").PropType<[dayjs.Dayjs, dayjs.Dayjs]>;
+            readonly type: import("vue").PropType<[import("dayjs").Dayjs, import("dayjs").Dayjs]>;
             readonly required: false;
             readonly validator: ((val: unknown) => boolean) | undefined;
             __epPropKey: true;
         };
         readonly date: {
-            readonly type: import("vue").PropType<dayjs.Dayjs>;
+            readonly type: import("vue").PropType<import("dayjs").Dayjs>;
             readonly required: true;
             readonly validator: ((val: unknown) => boolean) | undefined;
             __epPropKey: true;
@@ -53,11 +51,21 @@ declare const _default: import("vue").DefineComponent<{
             __epPropKey: true;
         };
     }>> & {
-        onPick?: ((value: dayjs.Dayjs) => any) | undefined;
+        onPick?: ((value: import("dayjs").Dayjs) => any) | undefined;
     }>>;
-    emit: (event: "pick", value: dayjs.Dayjs) => void;
-    t: import("element-plus/es/hooks").Translator;
-    lang: import("vue").Ref<string>;
+    emit: (event: "pick", value: import("dayjs").Dayjs) => void;
+    isInRange: import("vue").ComputedRef<boolean>;
+    now: import("dayjs").Dayjs;
+    rows: import("vue").ComputedRef<CalendarDateCell[][]>;
+    weekDays: import("vue").ComputedRef<string[]>;
+    getFormattedDate: (day: number, type: import("./date-table").CalendarDateCellType) => import("dayjs").Dayjs;
+    handlePickDay: ({ text, type }: CalendarDateCell) => void;
+    getSlotData: ({ text, type }: CalendarDateCell) => {
+        isSelected: boolean;
+        type: string;
+        day: string;
+        date: Date;
+    };
     nsTable: {
         namespace: import("vue").Ref<string>;
         b: (blockSuffix?: string) => string;
@@ -94,37 +102,24 @@ declare const _default: import("vue").DefineComponent<{
         cssVarBlock: (object: Record<string, string>) => Record<string, string>;
         cssVarBlockName: (name: string) => string;
     };
-    now: dayjs.Dayjs;
-    firstDayOfWeek: number;
-    isInRange: import("vue").ComputedRef<boolean>;
-    rows: import("vue").ComputedRef<CalendarDateCell[][]>;
-    weekDays: import("vue").ComputedRef<string[]>;
-    getFormattedDate: (day: number, type: CalendarDateCellType) => Dayjs;
     getCellClass: ({ text, type }: CalendarDateCell) => string[];
-    handlePickDay: ({ text, type }: CalendarDateCell) => void;
-    getSlotData: ({ text, type }: CalendarDateCell) => {
-        isSelected: boolean;
-        type: string;
-        day: string;
-        date: Date;
-    };
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    pick: (value: dayjs.Dayjs) => boolean;
+    pick: (value: import("dayjs").Dayjs) => boolean;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     readonly selectedDay: {
-        readonly type: import("vue").PropType<dayjs.Dayjs>;
+        readonly type: import("vue").PropType<import("dayjs").Dayjs>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
     };
     readonly range: {
-        readonly type: import("vue").PropType<[dayjs.Dayjs, dayjs.Dayjs]>;
+        readonly type: import("vue").PropType<[import("dayjs").Dayjs, import("dayjs").Dayjs]>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
     };
     readonly date: {
-        readonly type: import("vue").PropType<dayjs.Dayjs>;
+        readonly type: import("vue").PropType<import("dayjs").Dayjs>;
         readonly required: true;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -136,6 +131,6 @@ declare const _default: import("vue").DefineComponent<{
         __epPropKey: true;
     };
 }>> & {
-    onPick?: ((value: dayjs.Dayjs) => any) | undefined;
+    onPick?: ((value: import("dayjs").Dayjs) => any) | undefined;
 }, {}>;
 export default _default;

package/es/components/calendar/src/date-table2.mjs

@@ -1,15 +1,9 @@
-import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, unref, Fragment, renderList, toDisplayString, createCommentVNode, createElementVNode, renderSlot } from 'vue';
-import dayjs from 'dayjs';
-import localeData from 'dayjs/plugin/localeData.js';
+import { defineComponent, openBlock, createElementBlock, normalizeClass, unref, Fragment, renderList, toDisplayString, createCommentVNode, createElementVNode, renderSlot } from 'vue';
 import '../../../hooks/index.mjs';
-import '../../time-picker/index.mjs';
-import '../../../constants/index.mjs';
-import { dateTableProps, dateTableEmits, getPrevMonthLastDays, getMonthDays, toNestedArr } from './date-table.mjs';
+import { dateTableProps, dateTableEmits } from './date-table.mjs';
+import { useDateTable } from './use-date-table.mjs';
 import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
-import { useLocale } from '../../../hooks/use-locale/index.mjs';
 import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
-import { rangeArr } from '../../time-picker/src/utils.mjs';
-import { WEEK_DAYS } from '../../../constants/date.mjs';
 
 const _hoisted_1 = { key: 0 };
 const _hoisted_2 = ["onClick"];
@@ -22,66 +16,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   emits: dateTableEmits,
   setup(__props, { expose, emit }) {
     const props = __props;
-    dayjs.extend(localeData);
-    const { t, lang } = useLocale();
+    const {
+      isInRange,
+      now,
+      rows,
+      weekDays,
+      getFormattedDate,
+      handlePickDay,
+      getSlotData
+    } = useDateTable(props, emit);
     const nsTable = useNamespace("calendar-table");
     const nsDay = useNamespace("calendar-day");
-    const now = dayjs().locale(lang.value);
-    const firstDayOfWeek = dayjs.localeData().firstDayOfWeek();
-    const isInRange = computed(() => !!props.range && !!props.range.length);
-    const rows = computed(() => {
-      let days = [];
-      if (isInRange.value) {
-        const [start, end] = props.range;
-        const currentMonthRange = rangeArr(end.date() - start.date() + 1).map((index) => ({
-          text: start.date() + index,
-          type: "current"
-        }));
-        let remaining = currentMonthRange.length % 7;
-        remaining = remaining === 0 ? 0 : 7 - remaining;
-        const nextMonthRange = rangeArr(remaining).map((_, index) => ({
-          text: index + 1,
-          type: "next"
-        }));
-        days = currentMonthRange.concat(nextMonthRange);
-      } else {
-        const firstDay = props.date.startOf("month").day();
-        const prevMonthDays = getPrevMonthLastDays(props.date, (firstDay - firstDayOfWeek + 7) % 7).map((day) => ({
-          text: day,
-          type: "prev"
-        }));
-        const currentMonthDays = getMonthDays(props.date).map((day) => ({
-          text: day,
-          type: "current"
-        }));
-        days = [...prevMonthDays, ...currentMonthDays];
-        const remaining = 7 - (days.length % 7 || 7);
-        const nextMonthDays = rangeArr(remaining).map((_, index) => ({
-          text: index + 1,
-          type: "next"
-        }));
-        days = days.concat(nextMonthDays);
-      }
-      return toNestedArr(days);
-    });
-    const weekDays = computed(() => {
-      const start = firstDayOfWeek;
-      if (start === 0) {
-        return WEEK_DAYS.map((_) => t(`el.datepicker.weeks.${_}`));
-      } else {
-        return WEEK_DAYS.slice(start).concat(WEEK_DAYS.slice(0, start)).map((_) => t(`el.datepicker.weeks.${_}`));
-      }
-    });
-    const getFormattedDate = (day, type) => {
-      switch (type) {
-        case "prev":
-          return props.date.startOf("month").subtract(1, "month").date(day);
-        case "next":
-          return props.date.startOf("month").add(1, "month").date(day);
-        case "current":
-          return props.date.date(day);
-      }
-    };
     const getCellClass = ({ text, type }) => {
       const classes = [type];
       if (type === "current") {
@@ -95,19 +40,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
       return classes;
     };
-    const handlePickDay = ({ text, type }) => {
-      const date = getFormattedDate(text, type);
-      emit("pick", date);
-    };
-    const getSlotData = ({ text, type }) => {
-      const day = getFormattedDate(text, type);
-      return {
-        isSelected: day.isSame(props.selectedDay),
-        type: `${type}-month`,
-        day: day.format("YYYY-MM-DD"),
-        date: day.toDate()
-      };
-    };
     expose({
       getFormattedDate
     });
@@ -135,13 +67,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 return openBlock(), createElementBlock("td", {
                   key,
                   class: normalizeClass(getCellClass(cell)),
-                  onClick: ($event) => handlePickDay(cell)
+                  onClick: ($event) => unref(handlePickDay)(cell)
                 }, [
                   createElementVNode("div", {
                     class: normalizeClass(unref(nsDay).b())
                   }, [
                     renderSlot(_ctx.$slots, "date-cell", {
-                      data: getSlotData(cell)
+                      data: unref(getSlotData)(cell)
                     }, () => [
                       createElementVNode("span", null, toDisplayString(cell.text), 1)
                     ])

package/es/components/calendar/src/date-table2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"date-table2.mjs","sources":["../../../../../../packages/components/calendar/src/date-table.vue"],"sourcesContent":["<template>\n  <table\n    :class=\"[nsTable.b(), nsTable.is('range', isInRange)]\"\n    cellspacing=\"0\"\n    cellpadding=\"0\"\n  >\n    <thead v-if=\"!hideHeader\">\n      <th v-for=\"day in weekDays\" :key=\"day\">{{ day }}</th>\n    </thead>\n\n    <tbody>\n      <tr\n        v-for=\"(row, index) in rows\"\n        :key=\"index\"\n        :class=\"{\n          [nsTable.e('row')]: true,\n          [nsTable.em('row', 'hide-border')]: index === 0 && hideHeader,\n        }\"\n      >\n        <td\n          v-for=\"(cell, key) in row\"\n          :key=\"key\"\n          :class=\"getCellClass(cell)\"\n          @click=\"handlePickDay(cell)\"\n        >\n          <div :class=\"nsDay.b()\">\n            <slot name=\"date-cell\" :data=\"getSlotData(cell)\">\n              <span>{{ cell.text }}</span>\n            </slot>\n          </div>\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport dayjs from 'dayjs'\nimport localeData from 'dayjs/plugin/localeData.js'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { rangeArr } from '@element-plus/components/time-picker'\nimport { WEEK_DAYS } from '@element-plus/constants'\nimport {\n  dateTableEmits,\n  dateTableProps,\n  getMonthDays,\n  getPrevMonthLastDays,\n  toNestedArr,\n} from './date-table'\n\nimport type { CalendarDateCell, CalendarDateCellType } from './date-table'\nimport type { Dayjs } from 'dayjs'\n\ndefineOptions({\n  name: 'DateTable',\n})\n\nconst props = defineProps(dateTableProps)\nconst emit = defineEmits(dateTableEmits)\n\ndayjs.extend(localeData)\n\nconst { t, lang } = useLocale()\nconst nsTable = useNamespace('calendar-table')\nconst nsDay = useNamespace('calendar-day')\n\nconst now = dayjs().locale(lang.value)\n// https://day.js.org/docs/en/i18n/locale-data\nconst firstDayOfWeek: number = dayjs.localeData().firstDayOfWeek()\n\nconst isInRange = computed(() => !!props.range && !!props.range.length)\n\nconst rows = computed(() => {\n  let days: CalendarDateCell[] = []\n  if (isInRange.value) {\n    const [start, end] = props.range!\n    const currentMonthRange: CalendarDateCell[] = rangeArr(\n      end.date() - start.date() + 1\n    ).map((index) => ({\n      text: start.date() + index,\n      type: 'current',\n    }))\n\n    let remaining = currentMonthRange.length % 7\n    remaining = remaining === 0 ? 0 : 7 - remaining\n    const nextMonthRange: CalendarDateCell[] = rangeArr(remaining).map(\n      (_, index) => ({\n        text: index + 1,\n        type: 'next',\n      })\n    )\n    days = currentMonthRange.concat(nextMonthRange)\n  } else {\n    const firstDay = props.date.startOf('month').day()\n    const prevMonthDays: CalendarDateCell[] = getPrevMonthLastDays(\n      props.date,\n      (firstDay - firstDayOfWeek + 7) % 7\n    ).map((day) => ({\n      text: day,\n      type: 'prev',\n    }))\n    const currentMonthDays: CalendarDateCell[] = getMonthDays(props.date).map(\n      (day) => ({\n        text: day,\n        type: 'current',\n      })\n    )\n    days = [...prevMonthDays, ...currentMonthDays]\n    const remaining = 7 - (days.length % 7 || 7)\n    const nextMonthDays: CalendarDateCell[] = rangeArr(remaining).map(\n      (_, index) => ({\n        text: index + 1,\n        type: 'next',\n      })\n    )\n    days = days.concat(nextMonthDays)\n  }\n  return toNestedArr(days)\n})\n\nconst weekDays = computed(() => {\n  const start = firstDayOfWeek\n  if (start === 0) {\n    return WEEK_DAYS.map((_) => t(`el.datepicker.weeks.${_}`))\n  } else {\n    return WEEK_DAYS.slice(start)\n      .concat(WEEK_DAYS.slice(0, start))\n      .map((_) => t(`el.datepicker.weeks.${_}`))\n  }\n})\n\nconst getFormattedDate = (day: number, type: CalendarDateCellType): Dayjs => {\n  switch (type) {\n    case 'prev':\n      return props.date.startOf('month').subtract(1, 'month').date(day)\n    case 'next':\n      return props.date.startOf('month').add(1, 'month').date(day)\n    case 'current':\n      return props.date.date(day)\n  }\n}\n\nconst getCellClass = ({ text, type }: CalendarDateCell) => {\n  const classes: string[] = [type]\n  if (type === 'current') {\n    const date = getFormattedDate(text, type)\n    if (date.isSame(props.selectedDay, 'day')) {\n      classes.push(nsDay.is('selected'))\n    }\n    if (date.isSame(now, 'day')) {\n      classes.push(nsDay.is('today'))\n    }\n  }\n  return classes\n}\n\nconst handlePickDay = ({ text, type }: CalendarDateCell) => {\n  const date = getFormattedDate(text, type)\n  emit('pick', date)\n}\n\nconst getSlotData = ({ text, type }: CalendarDateCell) => {\n  const day = getFormattedDate(text, type)\n  return {\n    isSelected: day.isSame(props.selectedDay),\n    type: `${type}-month`,\n    day: day.format('YYYY-MM-DD'),\n    date: day.toDate(),\n  }\n}\n\ndefineExpose({\n  /** @description toggle date panel */\n  getFormattedDate,\n})\n</script>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"date-table2.mjs","sources":["../../../../../../packages/components/calendar/src/date-table.vue"],"sourcesContent":["<template>\n  <table\n    :class=\"[nsTable.b(), nsTable.is('range', isInRange)]\"\n    cellspacing=\"0\"\n    cellpadding=\"0\"\n  >\n    <thead v-if=\"!hideHeader\">\n      <th v-for=\"day in weekDays\" :key=\"day\">{{ day }}</th>\n    </thead>\n\n    <tbody>\n      <tr\n        v-for=\"(row, index) in rows\"\n        :key=\"index\"\n        :class=\"{\n          [nsTable.e('row')]: true,\n          [nsTable.em('row', 'hide-border')]: index === 0 && hideHeader,\n        }\"\n      >\n        <td\n          v-for=\"(cell, key) in row\"\n          :key=\"key\"\n          :class=\"getCellClass(cell)\"\n          @click=\"handlePickDay(cell)\"\n        >\n          <div :class=\"nsDay.b()\">\n            <slot name=\"date-cell\" :data=\"getSlotData(cell)\">\n              <span>{{ cell.text }}</span>\n            </slot>\n          </div>\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useNamespace } from '@element-plus/hooks'\nimport { dateTableEmits, dateTableProps } from './date-table'\nimport { useDateTable } from './use-date-table'\n\nimport type { CalendarDateCell } from './date-table'\n\ndefineOptions({\n  name: 'DateTable',\n})\n\nconst props = defineProps(dateTableProps)\nconst emit = defineEmits(dateTableEmits)\n\nconst {\n  isInRange,\n  now,\n  rows,\n  weekDays,\n  getFormattedDate,\n  handlePickDay,\n  getSlotData,\n} = useDateTable(props, emit)\n\nconst nsTable = useNamespace('calendar-table')\nconst nsDay = useNamespace('calendar-day')\n\nconst getCellClass = ({ text, type }: CalendarDateCell) => {\n  const classes: string[] = [type]\n  if (type === 'current') {\n    const date = getFormattedDate(text, type)\n    if (date.isSame(props.selectedDay, 'day')) {\n      classes.push(nsDay.is('selected'))\n    }\n    if (date.isSame(now, 'day')) {\n      classes.push(nsDay.is('today'))\n    }\n  }\n  return classes\n}\n\ndefineExpose({\n  /** @description toggle date panel */\n  getFormattedDate,\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;mCA2Cc,CAAA;AAAA,EACZ,IAAM,EAAA,WAAA;AACR,CAAA,CAAA,CAAA;;;;;;;AAKA,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,GAAA;AAAA,MACA,IAAA;AAAA,MACA,QAAA;AAAA,MACA,gBAAA;AAAA,MACA,aAAA;AAAA,MACA,WAAA;AAAA,KACE,GAAA,YAAA,CAAa,OAAO,IAAI,CAAA,CAAA;AAE5B,IAAM,MAAA,OAAA,GAAU,aAAa,gBAAgB,CAAA,CAAA;AAC7C,IAAM,MAAA,KAAA,GAAQ,aAAa,cAAc,CAAA,CAAA;AAEzC,IAAA,MAAM,YAAe,GAAA,CAAC,EAAE,IAAA,EAAM,IAA6B,EAAA,KAAA;AACzD,MAAM,MAAA,OAAA,GAAoB,CAAC,IAAI,CAAA,CAAA;AAC/B,MAAA,IAAI,SAAS,SAAW,EAAA;AACtB,QAAM,MAAA,IAAA,GAAO,gBAAiB,CAAA,IAAA,EAAM,IAAI,CAAA,CAAA;AACxC,QAAA,IAAI,IAAK,CAAA,MAAA,CAAO,KAAM,CAAA,WAAA,EAAa,KAAK,CAAG,EAAA;AACzC,UAAA,OAAA,CAAQ,IAAK,CAAA,KAAA,CAAM,EAAG,CAAA,UAAU,CAAC,CAAA,CAAA;AAAA,SACnC;AACA,QAAA,IAAI,IAAK,CAAA,MAAA,CAAO,GAAK,EAAA,KAAK,CAAG,EAAA;AAC3B,UAAA,OAAA,CAAQ,IAAK,CAAA,KAAA,CAAM,EAAG,CAAA,OAAO,CAAC,CAAA,CAAA;AAAA,SAChC;AAAA,OACF;AACA,MAAO,OAAA,OAAA,CAAA;AAAA,KACT,CAAA;AAEA,IAAa,MAAA,CAAA;AAAA,MAEX,gBAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/components/calendar/src/instance.d.ts

@@ -0,0 +1,5 @@
+import type DateTable from './date-table.vue';
+import type Calendar from './calendar.vue';
+export declare type DateTableInstance = InstanceType<typeof DateTable>;
+export declare type CalendarDateTableInstance = DateTableInstance;
+export declare type CalendarInstance = InstanceType<typeof Calendar>;

package/es/components/calendar/src/instance.mjs

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=instance.mjs.map

package/es/components/calendar/src/instance.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"instance.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/es/components/calendar/src/use-calendar.d.ts

@@ -0,0 +1,14 @@
+import dayjs from 'dayjs';
+import type { ComputedRef, SetupContext } from 'vue';
+import type { Dayjs } from 'dayjs';
+import type { CalendarDateType, CalendarEmits, CalendarProps } from './calendar';
+export declare const useCalendar: (props: CalendarProps, emit: SetupContext<CalendarEmits>['emit'], componentName: string) => {
+    calculateValidatedDateRange: (startDayjs: Dayjs, endDayjs: Dayjs) => [Dayjs, Dayjs][];
+    date: ComputedRef<dayjs.Dayjs>;
+    realSelectedDay: import("vue").WritableComputedRef<dayjs.Dayjs | undefined>;
+    pickDay: (day: Dayjs) => void;
+    selectDate: (type: CalendarDateType) => void;
+    validatedRange: ComputedRef<[dayjs.Dayjs, dayjs.Dayjs][]>;
+    t: import("element-plus/es/hooks").Translator;
+    i18nDate: ComputedRef<string>;
+};