@element-plus/nightly 0.0.20221019 → 0.0.20221020

package/dist/index.full.mjs

@@ -1,4 +1,4 @@
-/*! Element Plus v0.0.20221019 */
+/*! Element Plus v0.0.20221020 */
 
 import { getCurrentScope, onScopeDispose, unref, readonly, shallowRef, watchEffect, ref, watch, getCurrentInstance, onMounted, nextTick, computed as computed$1, openBlock, createElementBlock, createElementVNode, warn, isVNode, Fragment, Comment, inject, provide, onBeforeUnmount, toRef, onUnmounted, isRef, h as h$1, Teleport, onBeforeMount, defineComponent, normalizeClass, normalizeStyle, renderSlot, mergeProps, useSlots, createBlock, Transition, withCtx, withDirectives, resolveDynamicComponent, createCommentVNode, createTextVNode, toDisplayString, createVNode, vShow, useAttrs as useAttrs$1, withModifiers, reactive, onUpdated, cloneVNode, Text, onDeactivated, renderList, withKeys, createSlots, toRefs, normalizeProps, toRaw as toRaw$1, vModelCheckbox, vModelRadio, resolveComponent, onBeforeUpdate, resolveDirective, vModelText, toHandlers, guardReactiveProps, markRaw, effectScope, triggerRef, shallowReactive, TransitionGroup, createApp, render } from 'vue';
 
@@ -11068,7 +11068,7 @@ const useOrderedChildren = (vm, childComponentName) => {
   };
 };
 
-const version$1 = "0.0.20221019";
+const version$1 = "0.0.20221020";
 
 const makeInstaller = (components = []) => {
   const install = (app, options) => {
@@ -11574,7 +11574,7 @@ const inputEmits = {
   compositionend: (evt) => evt instanceof CompositionEvent
 };
 
-const _hoisted_1$14 = ["role"];
+const _hoisted_1$13 = ["role"];
 const _hoisted_2$G = ["id", "type", "disabled", "formatter", "parser", "readonly", "autocomplete", "tabindex", "aria-label", "placeholder", "form"];
 const _hoisted_3$l = ["id", "tabindex", "disabled", "readonly", "autocomplete", "aria-label", "placeholder", "form"];
 const __default__$1r = defineComponent({
@@ -11974,7 +11974,7 @@ const _sfc_main$2c = /* @__PURE__ */ defineComponent({
             class: normalizeClass(unref(nsInput).e("count"))
           }, toDisplayString(unref(textLength)) + " / " + toDisplayString(unref(attrs).maxlength), 7)) : createCommentVNode("v-if", true)
         ], 64))
-      ], 16, _hoisted_1$14)), [
+      ], 16, _hoisted_1$13)), [
         [vShow, _ctx.type !== "hidden"]
       ]);
     };
@@ -13755,7 +13755,7 @@ const _sfc_main$22 = /* @__PURE__ */ defineComponent({
 });
 var ElTooltipContent = /* @__PURE__ */ _export_sfc(_sfc_main$22, [["__file", "content.vue"]]);
 
-const _hoisted_1$13 = ["innerHTML"];
+const _hoisted_1$12 = ["innerHTML"];
 const _hoisted_2$F = { key: 1 };
 const __default__$1j = defineComponent({
   name: "ElTooltip"
@@ -13904,7 +13904,7 @@ const _sfc_main$21 = /* @__PURE__ */ defineComponent({
                 _ctx.rawContent ? (openBlock(), createElementBlock("span", {
                   key: 0,
                   innerHTML: _ctx.content
-                }, null, 8, _hoisted_1$13)) : (openBlock(), createElementBlock("span", _hoisted_2$F, toDisplayString(_ctx.content), 1))
+                }, null, 8, _hoisted_1$12)) : (openBlock(), createElementBlock("span", _hoisted_2$F, toDisplayString(_ctx.content), 1))
               ]),
               unref(compatShowArrow) ? (openBlock(), createBlock(unref(ElPopperArrow), {
                 key: 0,
@@ -13991,7 +13991,7 @@ const autocompleteEmits = {
   select: (item) => isObject$1(item)
 };
 
-const _hoisted_1$12 = ["aria-expanded", "aria-owns"];
+const _hoisted_1$11 = ["aria-expanded", "aria-owns"];
 const _hoisted_2$E = { key: 0 };
 const _hoisted_3$k = ["id", "aria-selected", "onClick"];
 const COMPONENT_NAME$i = "ElAutocomplete";
@@ -14318,7 +14318,7 @@ const _sfc_main$20 = /* @__PURE__ */ defineComponent({
                 ])
               } : void 0
             ]), 1040, ["model-value", "onKeydown"])
-          ], 14, _hoisted_1$12)
+          ], 14, _hoisted_1$11)
         ]),
         _: 3
       }, 8, ["visible", "placement", "popper-class", "teleported", "transition"]);
@@ -14359,7 +14359,7 @@ const avatarEmits = {
   error: (evt) => evt instanceof Event
 };
 
-const _hoisted_1$11 = ["src", "alt", "srcset"];
+const _hoisted_1$10 = ["src", "alt", "srcset"];
 const __default__$1h = defineComponent({
   name: "ElAvatar"
 });
@@ -14408,7 +14408,7 @@ const _sfc_main$1$ = /* @__PURE__ */ defineComponent({
           srcset: _ctx.srcSet,
           style: normalizeStyle(unref(fitStyle)),
           onError: handleError
-        }, null, 44, _hoisted_1$11)) : _ctx.icon ? (openBlock(), createBlock(unref(ElIcon), { key: 1 }, {
+        }, null, 44, _hoisted_1$10)) : _ctx.icon ? (openBlock(), createBlock(unref(ElIcon), { key: 1 }, {
           default: withCtx(() => [
             (openBlock(), createBlock(resolveDynamicComponent(_ctx.icon)))
           ]),
@@ -14444,7 +14444,56 @@ const backtopEmits = {
   click: (evt) => evt instanceof MouseEvent
 };
 
-const _hoisted_1$10 = ["onClick"];
+const useBackTop = (props, emit, componentName) => {
+  const el = shallowRef();
+  const container = shallowRef();
+  const visible = ref(false);
+  const scrollToTop = () => {
+    if (!el.value)
+      return;
+    const beginTime = Date.now();
+    const beginValue = el.value.scrollTop;
+    const frameFunc = () => {
+      if (!el.value)
+        return;
+      const progress = (Date.now() - beginTime) / 500;
+      if (progress < 1) {
+        el.value.scrollTop = beginValue * (1 - easeInOutCubic(progress));
+        requestAnimationFrame(frameFunc);
+      } else {
+        el.value.scrollTop = 0;
+      }
+    };
+    requestAnimationFrame(frameFunc);
+  };
+  const handleScroll = () => {
+    if (el.value)
+      visible.value = el.value.scrollTop >= props.visibilityHeight;
+  };
+  const handleClick = (event) => {
+    scrollToTop();
+    emit("click", event);
+  };
+  const handleScrollThrottled = useThrottleFn(handleScroll, 300, true);
+  useEventListener(container, "scroll", handleScrollThrottled);
+  onMounted(() => {
+    var _a;
+    container.value = document;
+    el.value = document.documentElement;
+    if (props.target) {
+      el.value = (_a = document.querySelector(props.target)) != null ? _a : void 0;
+      if (!el.value) {
+        throwError(componentName, `target does not exist: ${props.target}`);
+      }
+      container.value = el.value;
+    }
+  });
+  return {
+    visible,
+    handleClick
+  };
+};
+
 const COMPONENT_NAME$h = "ElBacktop";
 const __default__$1g = defineComponent({
   name: COMPONENT_NAME$h
@@ -14456,63 +14505,21 @@ const _sfc_main$1_ = /* @__PURE__ */ defineComponent({
   setup(__props, { emit }) {
     const props = __props;
     const ns = useNamespace("backtop");
-    const el = shallowRef();
-    const container = shallowRef();
-    const visible = ref(false);
+    const { handleClick, visible } = useBackTop(props, emit, COMPONENT_NAME$h);
     const backTopStyle = computed$1(() => ({
       right: `${props.right}px`,
       bottom: `${props.bottom}px`
     }));
-    const scrollToTop = () => {
-      if (!el.value)
-        return;
-      const beginTime = Date.now();
-      const beginValue = el.value.scrollTop;
-      const frameFunc = () => {
-        if (!el.value)
-          return;
-        const progress = (Date.now() - beginTime) / 500;
-        if (progress < 1) {
-          el.value.scrollTop = beginValue * (1 - easeInOutCubic(progress));
-          requestAnimationFrame(frameFunc);
-        } else {
-          el.value.scrollTop = 0;
-        }
-      };
-      requestAnimationFrame(frameFunc);
-    };
-    const handleScroll = () => {
-      if (el.value)
-        visible.value = el.value.scrollTop >= props.visibilityHeight;
-    };
-    const handleClick = (event) => {
-      scrollToTop();
-      emit("click", event);
-    };
-    const handleScrollThrottled = useThrottleFn(handleScroll, 300, true);
-    useEventListener(container, "scroll", handleScrollThrottled);
-    onMounted(() => {
-      var _a;
-      container.value = document;
-      el.value = document.documentElement;
-      if (props.target) {
-        el.value = (_a = document.querySelector(props.target)) != null ? _a : void 0;
-        if (!el.value) {
-          throwError(COMPONENT_NAME$h, `target is not existed: ${props.target}`);
-        }
-        container.value = el.value;
-      }
-    });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(Transition, {
         name: `${unref(ns).namespace.value}-fade-in`
       }, {
         default: withCtx(() => [
-          visible.value ? (openBlock(), createElementBlock("div", {
+          unref(visible) ? (openBlock(), createElementBlock("div", {
             key: 0,
             style: normalizeStyle(unref(backTopStyle)),
             class: normalizeClass(unref(ns).b()),
-            onClick: withModifiers(handleClick, ["stop"])
+            onClick: _cache[0] || (_cache[0] = withModifiers((...args) => unref(handleClick) && unref(handleClick)(...args), ["stop"]))
           }, [
             renderSlot(_ctx.$slots, "default", {}, () => [
               createVNode(unref(ElIcon), {
@@ -14524,7 +14531,7 @@ const _sfc_main$1_ = /* @__PURE__ */ defineComponent({
                 _: 1
               }, 8, ["class"])
             ])
-          ], 14, _hoisted_1$10)) : createCommentVNode("v-if", true)
+          ], 6)) : createCommentVNode("v-if", true)
         ]),
         _: 3
       }, 8, ["name"]);
@@ -14715,6 +14722,54 @@ const ElBreadcrumb = withInstall(Breadcrumb, {
 });
 const ElBreadcrumbItem = withNoopInstall(BreadcrumbItem);
 
+const useButton = (props, emit) => {
+  useDeprecated({
+    from: "type.text",
+    replacement: "link",
+    version: "3.0.0",
+    scope: "props",
+    ref: "https://element-plus.org/en-US/component/button.html#button-attributes"
+  }, computed$1(() => props.type === "text"));
+  const buttonGroupContext = inject(buttonGroupContextKey, void 0);
+  const globalConfig = useGlobalConfig("button");
+  const { form } = useFormItem();
+  const _size = useSize(computed$1(() => buttonGroupContext == null ? void 0 : buttonGroupContext.size));
+  const _disabled = useDisabled();
+  const _ref = ref();
+  const slots = useSlots();
+  const _type = computed$1(() => props.type || (buttonGroupContext == null ? void 0 : buttonGroupContext.type) || "");
+  const autoInsertSpace = computed$1(() => {
+    var _a, _b, _c;
+    return (_c = (_b = props.autoInsertSpace) != null ? _b : (_a = globalConfig.value) == null ? void 0 : _a.autoInsertSpace) != null ? _c : false;
+  });
+  const shouldAddSpace = computed$1(() => {
+    var _a;
+    const defaultSlot = (_a = slots.default) == null ? void 0 : _a.call(slots);
+    if (autoInsertSpace.value && (defaultSlot == null ? void 0 : defaultSlot.length) === 1) {
+      const slot = defaultSlot[0];
+      if ((slot == null ? void 0 : slot.type) === Text) {
+        const text = slot.children;
+        return /^\p{Unified_Ideograph}{2}$/u.test(text.trim());
+      }
+    }
+    return false;
+  });
+  const handleClick = (evt) => {
+    if (props.nativeType === "reset") {
+      form == null ? void 0 : form.resetFields();
+    }
+    emit("click", evt);
+  };
+  return {
+    _disabled,
+    _size,
+    _type,
+    _ref,
+    shouldAddSpace,
+    handleClick
+  };
+};
+
 const buttonTypes = [
   "default",
   "primary",
@@ -15702,45 +15757,9 @@ const _sfc_main$1W = /* @__PURE__ */ defineComponent({
   emits: buttonEmits,
   setup(__props, { expose, emit }) {
     const props = __props;
-    const slots = useSlots();
-    useDeprecated({
-      from: "type.text",
-      replacement: "link",
-      version: "3.0.0",
-      scope: "props",
-      ref: "https://element-plus.org/en-US/component/button.html#button-attributes"
-    }, computed$1(() => props.type === "text"));
-    const buttonGroupContext = inject(buttonGroupContextKey, void 0);
-    const globalConfig = useGlobalConfig("button");
-    const ns = useNamespace("button");
-    const { form } = useFormItem();
-    const _size = useSize(computed$1(() => buttonGroupContext == null ? void 0 : buttonGroupContext.size));
-    const _disabled = useDisabled();
-    const _ref = ref();
-    const _type = computed$1(() => props.type || (buttonGroupContext == null ? void 0 : buttonGroupContext.type) || "");
-    const autoInsertSpace = computed$1(() => {
-      var _a, _b, _c;
-      return (_c = (_b = props.autoInsertSpace) != null ? _b : (_a = globalConfig.value) == null ? void 0 : _a.autoInsertSpace) != null ? _c : false;
-    });
-    const shouldAddSpace = computed$1(() => {
-      var _a;
-      const defaultSlot = (_a = slots.default) == null ? void 0 : _a.call(slots);
-      if (autoInsertSpace.value && (defaultSlot == null ? void 0 : defaultSlot.length) === 1) {
-        const slot = defaultSlot[0];
-        if ((slot == null ? void 0 : slot.type) === Text) {
-          const text = slot.children;
-          return /^\p{Unified_Ideograph}{2}$/u.test(text.trim());
-        }
-      }
-      return false;
-    });
     const buttonStyle = useButtonCustomStyle(props);
-    const handleClick = (evt) => {
-      if (props.nativeType === "reset") {
-        form == null ? void 0 : form.resetFields();
-      }
-      emit("click", evt);
-    };
+    const ns = useNamespace("button");
+    const { _ref, _size, _type, _disabled, shouldAddSpace, handleClick } = useButton(props, emit);
     expose({
       ref: _ref,
       size: _size,
@@ -15770,7 +15789,7 @@ const _sfc_main$1W = /* @__PURE__ */ defineComponent({
         autofocus: _ctx.autofocus,
         type: _ctx.nativeType,
         style: normalizeStyle(unref(buttonStyle)),
-        onClick: handleClick
+        onClick: _cache[0] || (_cache[0] = (...args) => unref(handleClick) && unref(handleClick)(...args))
       }, [
         _ctx.loading ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
           _ctx.$slots.loading ? renderSlot(_ctx.$slots, "loading", { key: 0 }) : (openBlock(), createBlock(unref(ElIcon), {
@@ -16044,86 +16063,6 @@ var dayjs_min = {exports: {}};
 })(dayjs_min);
 var dayjs = dayjs_min.exports;
 
-var localeData$1 = {exports: {}};
-
-(function(module, exports) {
-  !function(n, e) {
-    module.exports = e() ;
-  }(commonjsGlobal, function() {
-    return function(n, e, t) {
-      var r = e.prototype, o = function(n2) {
-        return n2 && (n2.indexOf ? n2 : n2.s);
-      }, u = function(n2, e2, t2, r2, u2) {
-        var i2 = n2.name ? n2 : n2.$locale(), a2 = o(i2[e2]), s2 = o(i2[t2]), f = a2 || s2.map(function(n3) {
-          return n3.slice(0, r2);
-        });
-        if (!u2)
-          return f;
-        var d = i2.weekStart;
-        return f.map(function(n3, e3) {
-          return f[(e3 + (d || 0)) % 7];
-        });
-      }, i = function() {
-        return t.Ls[t.locale()];
-      }, a = function(n2, e2) {
-        return n2.formats[e2] || function(n3) {
-          return n3.replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g, function(n4, e3, t2) {
-            return e3 || t2.slice(1);
-          });
-        }(n2.formats[e2.toUpperCase()]);
-      }, s = function() {
-        var n2 = this;
-        return { months: function(e2) {
-          return e2 ? e2.format("MMMM") : u(n2, "months");
-        }, monthsShort: function(e2) {
-          return e2 ? e2.format("MMM") : u(n2, "monthsShort", "months", 3);
-        }, firstDayOfWeek: function() {
-          return n2.$locale().weekStart || 0;
-        }, weekdays: function(e2) {
-          return e2 ? e2.format("dddd") : u(n2, "weekdays");
-        }, weekdaysMin: function(e2) {
-          return e2 ? e2.format("dd") : u(n2, "weekdaysMin", "weekdays", 2);
-        }, weekdaysShort: function(e2) {
-          return e2 ? e2.format("ddd") : u(n2, "weekdaysShort", "weekdays", 3);
-        }, longDateFormat: function(e2) {
-          return a(n2.$locale(), e2);
-        }, meridiem: this.$locale().meridiem, ordinal: this.$locale().ordinal };
-      };
-      r.localeData = function() {
-        return s.bind(this)();
-      }, t.localeData = function() {
-        var n2 = i();
-        return { firstDayOfWeek: function() {
-          return n2.weekStart || 0;
-        }, weekdays: function() {
-          return t.weekdays();
-        }, weekdaysShort: function() {
-          return t.weekdaysShort();
-        }, weekdaysMin: function() {
-          return t.weekdaysMin();
-        }, months: function() {
-          return t.months();
-        }, monthsShort: function() {
-          return t.monthsShort();
-        }, longDateFormat: function(e2) {
-          return a(n2, e2);
-        }, meridiem: n2.meridiem, ordinal: n2.ordinal };
-      }, t.months = function() {
-        return u(i(), "months");
-      }, t.monthsShort = function() {
-        return u(i(), "monthsShort", "months", 3);
-      }, t.weekdays = function(n2) {
-        return u(i(), "weekdays", null, null, n2);
-      }, t.weekdaysShort = function(n2) {
-        return u(i(), "weekdaysShort", "weekdays", 3, n2);
-      }, t.weekdaysMin = function(n2) {
-        return u(i(), "weekdaysMin", "weekdays", 2, n2);
-      };
-    };
-  });
-})(localeData$1);
-var localeData = localeData$1.exports;
-
 var customParseFormat$1 = {exports: {}};
 
 (function(module, exports) {
@@ -18200,6 +18139,169 @@ const dateTableEmits = {
   pick: (value) => isObject$1(value)
 };
 
+var localeData$1 = {exports: {}};
+
+(function(module, exports) {
+  !function(n, e) {
+    module.exports = e() ;
+  }(commonjsGlobal, function() {
+    return function(n, e, t) {
+      var r = e.prototype, o = function(n2) {
+        return n2 && (n2.indexOf ? n2 : n2.s);
+      }, u = function(n2, e2, t2, r2, u2) {
+        var i2 = n2.name ? n2 : n2.$locale(), a2 = o(i2[e2]), s2 = o(i2[t2]), f = a2 || s2.map(function(n3) {
+          return n3.slice(0, r2);
+        });
+        if (!u2)
+          return f;
+        var d = i2.weekStart;
+        return f.map(function(n3, e3) {
+          return f[(e3 + (d || 0)) % 7];
+        });
+      }, i = function() {
+        return t.Ls[t.locale()];
+      }, a = function(n2, e2) {
+        return n2.formats[e2] || function(n3) {
+          return n3.replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g, function(n4, e3, t2) {
+            return e3 || t2.slice(1);
+          });
+        }(n2.formats[e2.toUpperCase()]);
+      }, s = function() {
+        var n2 = this;
+        return { months: function(e2) {
+          return e2 ? e2.format("MMMM") : u(n2, "months");
+        }, monthsShort: function(e2) {
+          return e2 ? e2.format("MMM") : u(n2, "monthsShort", "months", 3);
+        }, firstDayOfWeek: function() {
+          return n2.$locale().weekStart || 0;
+        }, weekdays: function(e2) {
+          return e2 ? e2.format("dddd") : u(n2, "weekdays");
+        }, weekdaysMin: function(e2) {
+          return e2 ? e2.format("dd") : u(n2, "weekdaysMin", "weekdays", 2);
+        }, weekdaysShort: function(e2) {
+          return e2 ? e2.format("ddd") : u(n2, "weekdaysShort", "weekdays", 3);
+        }, longDateFormat: function(e2) {
+          return a(n2.$locale(), e2);
+        }, meridiem: this.$locale().meridiem, ordinal: this.$locale().ordinal };
+      };
+      r.localeData = function() {
+        return s.bind(this)();
+      }, t.localeData = function() {
+        var n2 = i();
+        return { firstDayOfWeek: function() {
+          return n2.weekStart || 0;
+        }, weekdays: function() {
+          return t.weekdays();
+        }, weekdaysShort: function() {
+          return t.weekdaysShort();
+        }, weekdaysMin: function() {
+          return t.weekdaysMin();
+        }, months: function() {
+          return t.months();
+        }, monthsShort: function() {
+          return t.monthsShort();
+        }, longDateFormat: function(e2) {
+          return a(n2, e2);
+        }, meridiem: n2.meridiem, ordinal: n2.ordinal };
+      }, t.months = function() {
+        return u(i(), "months");
+      }, t.monthsShort = function() {
+        return u(i(), "monthsShort", "months", 3);
+      }, t.weekdays = function(n2) {
+        return u(i(), "weekdays", null, null, n2);
+      }, t.weekdaysShort = function(n2) {
+        return u(i(), "weekdaysShort", "weekdays", 3, n2);
+      }, t.weekdaysMin = function(n2) {
+        return u(i(), "weekdaysMin", "weekdays", 2, n2);
+      };
+    };
+  });
+})(localeData$1);
+var localeData = localeData$1.exports;
+
+const useDateTable = (props, emit) => {
+  dayjs.extend(localeData);
+  const firstDayOfWeek = dayjs.localeData().firstDayOfWeek();
+  const { t, lang } = useLocale();
+  const now = dayjs().locale(lang.value);
+  const isInRange = computed$1(() => !!props.range && !!props.range.length);
+  const rows = computed$1(() => {
+    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$1(() => {
+    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 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()
+    };
+  };
+  return {
+    now,
+    isInRange,
+    rows,
+    weekDays,
+    getFormattedDate,
+    handlePickDay,
+    getSlotData
+  };
+};
+
 const _hoisted_1$W = { key: 0 };
 const _hoisted_2$B = ["onClick"];
 const __default__$19 = defineComponent({
@@ -18211,66 +18313,17 @@ const _sfc_main$1Q = /* @__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$1(() => !!props.range && !!props.range.length);
-    const rows = computed$1(() => {
-      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$1(() => {
-      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") {
@@ -18284,19 +18337,6 @@ const _sfc_main$1Q = /* @__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
     });
@@ -18324,13 +18364,13 @@ const _sfc_main$1Q = /* @__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)
                     ])