@element-plus/nightly 0.0.20260812 → 0.0.20260814

package/es/components/date-picker-panel/src/date-picker-com/panel-year-range.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"panel-year-range.mjs","names":[],"sources":["../../../../../../../packages/components/date-picker-panel/src/date-picker-com/panel-year-range.vue"],"sourcesContent":["<template>\n  <div :class=\"panelKls\">\n    <div :class=\"ppNs.e('body-wrapper')\">\n      <slot name=\"sidebar\" :class=\"ppNs.e('sidebar')\" />\n      <div v-if=\"hasShortcuts\" :class=\"ppNs.e('sidebar')\">\n        <button\n          v-for=\"(shortcut, key) in shortcuts\"\n          :key=\"key\"\n          type=\"button\"\n          :class=\"ppNs.e('shortcut')\"\n          :disabled=\"yearRangeDisabled\"\n          @click=\"handleShortcutClick(shortcut)\"\n        >\n          {{ shortcut.text }}\n        </button>\n      </div>\n      <div :class=\"ppNs.e('body')\">\n        <div :class=\"leftPanelKls.content\">\n          <div :class=\"drpNs.e('header')\">\n            <button\n              type=\"button\"\n              :class=\"leftPanelKls.arrowLeftBtn\"\n              :disabled=\"yearRangeDisabled\"\n              @click=\"leftPrevYear\"\n            >\n              <slot name=\"prev-year\">\n                <el-icon><d-arrow-left /></el-icon>\n              </slot>\n            </button>\n            <button\n              v-if=\"unlinkPanels || singlePanel\"\n              type=\"button\"\n              :disabled=\"!enableYearArrow || yearRangeDisabled\"\n              :class=\"leftPanelKls.arrowRightBtn\"\n              @click=\"leftNextYear\"\n            >\n              <slot name=\"next-year\">\n                <el-icon><d-arrow-right /></el-icon>\n              </slot>\n            </button>\n            <div>{{ leftLabel }}</div>\n          </div>\n          <year-table\n            selection-mode=\"range\"\n            :date=\"leftDate\"\n            :min-date=\"minDate\"\n            :max-date=\"maxDate\"\n            :range-state=\"rangeState\"\n            :disabled-date=\"disabledDate\"\n            :disabled=\"yearRangeDisabled\"\n            :cell-class-name=\"cellClassName\"\n            @changerange=\"handleChangeRange\"\n            @pick=\"handleRangePick\"\n            @select=\"onSelect\"\n          />\n        </div>\n        <div v-if=\"!singlePanel\" :class=\"rightPanelKls.content\">\n          <div :class=\"drpNs.e('header')\">\n            <button\n              v-if=\"unlinkPanels\"\n              type=\"button\"\n              :disabled=\"!enableYearArrow || yearRangeDisabled\"\n              :class=\"rightPanelKls.arrowLeftBtn\"\n              @click=\"rightPrevYear\"\n            >\n              <slot name=\"prev-year\">\n                <el-icon><d-arrow-left /></el-icon>\n              </slot>\n            </button>\n            <button\n              type=\"button\"\n              :class=\"rightPanelKls.arrowRightBtn\"\n              :disabled=\"yearRangeDisabled\"\n              @click=\"rightNextYear\"\n            >\n              <slot name=\"next-year\">\n                <el-icon><d-arrow-right /></el-icon>\n              </slot>\n            </button>\n            <div>{{ rightLabel }}</div>\n          </div>\n          <year-table\n            selection-mode=\"range\"\n            :date=\"rightDate\"\n            :min-date=\"minDate\"\n            :max-date=\"maxDate\"\n            :range-state=\"rangeState\"\n            :disabled-date=\"disabledDate\"\n            :disabled=\"yearRangeDisabled\"\n            :cell-class-name=\"cellClassName\"\n            @changerange=\"handleChangeRange\"\n            @pick=\"handleRangePick\"\n            @select=\"onSelect\"\n          />\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, ref, toRef, unref, useSlots, watch } from 'vue'\nimport dayjs from 'dayjs'\nimport { DArrowLeft, DArrowRight } from '@element-plus/icons-vue'\nimport ElIcon from '@element-plus/components/icon'\nimport { useLocale } from '@element-plus/hooks'\nimport { PICKER_BASE_INJECTION_KEY } from '@element-plus/components/time-picker'\nimport {\n  panelYearRangeEmits,\n  panelYearRangeProps,\n} from '../props/panel-year-range'\nimport { useYearRangeHeader } from '../composables/use-year-range-header'\nimport { useRangePicker } from '../composables/use-range-picker'\nimport {\n  correctlyParseUserInput,\n  getDefaultValue,\n  isValidRange,\n} from '../utils'\nimport YearTable from './basic-year-table.vue'\nimport { useFormDisabled } from '@element-plus/components/form'\n\nimport type { Dayjs } from 'dayjs'\n\ndefineOptions({\n  name: 'DatePickerYearRange',\n})\n\nconst props = defineProps(panelYearRangeProps)\nconst emit = defineEmits(panelYearRangeEmits)\nconst step = 10\nconst unit = 'year'\n\nconst { lang } = useLocale()\nconst leftDate = ref(dayjs().locale(lang.value))\nconst rightDate = ref(dayjs().locale(lang.value).add(step, unit))\nconst pickerBase = inject(PICKER_BASE_INJECTION_KEY) as any\nconst { shortcuts, disabledDate, cellClassName } = pickerBase.props\nconst format = toRef(pickerBase.props, 'format')\nconst defaultValue = toRef(pickerBase.props, 'defaultValue')\n\nconst {\n  minDate,\n  maxDate,\n  rangeState,\n  ppNs,\n  drpNs,\n\n  handleChangeRange,\n  handleRangeConfirm,\n  handleShortcutClick,\n  onSelect,\n  parseValue,\n} = useRangePicker(props, {\n  defaultValue,\n  leftDate,\n  rightDate,\n  step,\n  unit,\n  sortDates,\n})\n\nconst {\n  leftPrevYear,\n  rightNextYear,\n  leftNextYear,\n  rightPrevYear,\n  leftLabel,\n  rightLabel,\n  leftYear,\n  rightYear,\n} = useYearRangeHeader({\n  unlinkPanels: toRef(props, 'unlinkPanels'),\n  leftDate,\n  rightDate,\n})\n\nconst yearRangeDisabled = useFormDisabled()\n\nconst hasShortcuts = computed(() => !!shortcuts.length)\n\nconst panelKls = computed(() => [\n  ppNs.b(),\n  drpNs.b(),\n  ppNs.is('border', props.border),\n  ppNs.is('disabled', yearRangeDisabled.value),\n  {\n    'has-sidebar': Boolean(useSlots().sidebar) || hasShortcuts.value,\n    'single-panel': props.singlePanel,\n  },\n])\n\nconst leftPanelKls = computed(() => {\n  return {\n    content: [\n      ppNs.e('content'),\n      drpNs.e('content'),\n      drpNs.is('left', !props.singlePanel),\n    ],\n    arrowLeftBtn: [ppNs.e('icon-btn'), 'd-arrow-left'],\n    arrowRightBtn: [\n      ppNs.e('icon-btn'),\n      ppNs.is('disabled', !enableYearArrow.value || yearRangeDisabled.value),\n      'd-arrow-right',\n    ],\n  }\n})\n\nconst rightPanelKls = computed(() => {\n  return {\n    content: [ppNs.e('content'), drpNs.e('content'), 'is-right'],\n    arrowLeftBtn: [\n      ppNs.e('icon-btn'),\n      ppNs.is('disabled', !enableYearArrow.value || yearRangeDisabled.value),\n      'd-arrow-left',\n    ],\n    arrowRightBtn: [ppNs.e('icon-btn'), 'd-arrow-right'],\n  }\n})\n\nconst enableYearArrow = computed(() => {\n  return (\n    props.singlePanel ||\n    (props.unlinkPanels && rightYear.value > leftYear.value + 1)\n  )\n})\n\ntype RangePickValue = {\n  minDate: Dayjs\n  maxDate: Dayjs\n}\nconst handleRangePick = (val: RangePickValue, close = true) => {\n  const minDate_ = val.minDate\n  const maxDate_ = val.maxDate\n  if (maxDate.value === maxDate_ && minDate.value === minDate_) {\n    return\n  }\n  emit('calendar-change', [minDate_.toDate(), maxDate_ && maxDate_.toDate()])\n  maxDate.value = maxDate_\n  minDate.value = minDate_\n\n  if (!close) return\n  handleRangeConfirm()\n}\n\nconst parseUserInput = (value: Dayjs | Dayjs[]) => {\n  return correctlyParseUserInput(value, format.value, lang.value)\n}\n\nconst isValidValue = (date: [Dayjs, Dayjs]) => {\n  return (\n    isValidRange(date) &&\n    (disabledDate\n      ? !disabledDate(date[0].toDate()) && !disabledDate(date[1].toDate())\n      : true)\n  )\n}\n\nconst handleClear = () => {\n  let valueOnClear = null\n  if (pickerBase?.emptyValues) {\n    valueOnClear = pickerBase.emptyValues.valueOnClear.value\n  }\n  const defaultArr = getDefaultValue(unref(defaultValue), {\n    lang: unref(lang),\n    step,\n    unit,\n    unlinkPanels: props.unlinkPanels,\n  })\n  leftDate.value = defaultArr[0]\n  rightDate.value = defaultArr[1]\n  emit('pick', valueOnClear)\n}\n\nfunction sortDates(minDate: Dayjs | undefined, maxDate: Dayjs | undefined) {\n  if (props.unlinkPanels && maxDate) {\n    const minDateYear = minDate?.year() || 0\n    const maxDateYear = maxDate.year()\n\n    rightDate.value =\n      minDateYear + step > maxDateYear ? maxDate.add(step, unit) : maxDate\n  } else {\n    rightDate.value = leftDate.value.add(step, unit)\n  }\n}\n\nwatch(\n  () => props.visible,\n  (visible) => {\n    if (!visible && rangeState.value.selecting) {\n      parseValue(props.parsedValue)\n      onSelect(false)\n    }\n  }\n)\n\nemit('set-picker-option', ['isValidValue', isValidValue])\nemit('set-picker-option', ['parseUserInput', parseUserInput])\nemit('set-picker-option', ['handleClear', handleClear])\n</script>\n"],"mappings":""}
+{"version":3,"file":"panel-year-range.mjs","names":[],"sources":["../../../../../../../packages/components/date-picker-panel/src/date-picker-com/panel-year-range.vue"],"sourcesContent":["<template>\n  <div :class=\"panelKls\">\n    <div :class=\"ppNs.e('body-wrapper')\">\n      <slot name=\"sidebar\" :class=\"ppNs.e('sidebar')\" />\n      <div v-if=\"hasShortcuts\" :class=\"ppNs.e('sidebar')\">\n        <button\n          v-for=\"(shortcut, key) in shortcuts\"\n          :key=\"key\"\n          type=\"button\"\n          :class=\"ppNs.e('shortcut')\"\n          :disabled=\"yearRangeDisabled\"\n          @click=\"handleShortcutClick(shortcut)\"\n        >\n          {{ shortcut.text }}\n        </button>\n      </div>\n      <div :class=\"ppNs.e('body')\">\n        <div :class=\"leftPanelKls.content\">\n          <div :class=\"drpNs.e('header')\">\n            <button\n              type=\"button\"\n              :class=\"leftPanelKls.arrowLeftBtn\"\n              :disabled=\"yearRangeDisabled\"\n              @click=\"leftPrevYear\"\n            >\n              <slot name=\"prev-year\">\n                <el-icon><d-arrow-left /></el-icon>\n              </slot>\n            </button>\n            <button\n              v-if=\"unlinkPanels || singlePanel\"\n              type=\"button\"\n              :disabled=\"!enableYearArrow || yearRangeDisabled\"\n              :class=\"leftPanelKls.arrowRightBtn\"\n              @click=\"leftNextYear\"\n            >\n              <slot name=\"next-year\">\n                <el-icon><d-arrow-right /></el-icon>\n              </slot>\n            </button>\n            <div>{{ leftLabel }}</div>\n          </div>\n          <year-table\n            selection-mode=\"range\"\n            :date=\"leftDate\"\n            :min-date=\"minDate\"\n            :max-date=\"maxDate\"\n            :range-state=\"rangeState\"\n            :disabled-date=\"disabledDate\"\n            :disabled=\"yearRangeDisabled\"\n            :cell-class-name=\"cellClassName\"\n            @changerange=\"handleChangeRange\"\n            @pick=\"handleRangePick\"\n            @select=\"onSelect\"\n          />\n        </div>\n        <div v-if=\"!singlePanel\" :class=\"rightPanelKls.content\">\n          <div :class=\"drpNs.e('header')\">\n            <button\n              v-if=\"unlinkPanels\"\n              type=\"button\"\n              :disabled=\"!enableYearArrow || yearRangeDisabled\"\n              :class=\"rightPanelKls.arrowLeftBtn\"\n              @click=\"rightPrevYear\"\n            >\n              <slot name=\"prev-year\">\n                <el-icon><d-arrow-left /></el-icon>\n              </slot>\n            </button>\n            <button\n              type=\"button\"\n              :class=\"rightPanelKls.arrowRightBtn\"\n              :disabled=\"yearRangeDisabled\"\n              @click=\"rightNextYear\"\n            >\n              <slot name=\"next-year\">\n                <el-icon><d-arrow-right /></el-icon>\n              </slot>\n            </button>\n            <div>{{ rightLabel }}</div>\n          </div>\n          <year-table\n            selection-mode=\"range\"\n            :date=\"rightDate\"\n            :min-date=\"minDate\"\n            :max-date=\"maxDate\"\n            :range-state=\"rangeState\"\n            :disabled-date=\"disabledDate\"\n            :disabled=\"yearRangeDisabled\"\n            :cell-class-name=\"cellClassName\"\n            @changerange=\"handleChangeRange\"\n            @pick=\"handleRangePick\"\n            @select=\"onSelect\"\n          />\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, ref, toRef, unref, useSlots, watch } from 'vue'\nimport dayjs from 'dayjs'\nimport { DArrowLeft, DArrowRight } from '@element-plus/icons-vue'\nimport ElIcon from '@element-plus/components/icon'\nimport { useLocale } from '@element-plus/hooks'\nimport { PICKER_BASE_INJECTION_KEY } from '@element-plus/components/time-picker'\nimport {\n  panelYearRangeEmits,\n  panelYearRangeProps,\n} from '../props/panel-year-range'\nimport { useYearRangeHeader } from '../composables/use-year-range-header'\nimport { useRangePicker } from '../composables/use-range-picker'\nimport {\n  correctlyParseUserInput,\n  getDefaultValue,\n  isValidRange,\n} from '../utils'\nimport YearTable from './basic-year-table.vue'\nimport { useFormDisabled } from '@element-plus/components/form'\n\nimport type { Dayjs } from 'dayjs'\n\ndefineOptions({\n  name: 'DatePickerYearRange',\n})\n\nconst props = defineProps(panelYearRangeProps)\nconst emit = defineEmits(panelYearRangeEmits)\nconst step = 10\nconst unit = 'year'\n\nconst { lang } = useLocale()\nconst leftDate = ref(dayjs().locale(lang.value))\nconst rightDate = ref(dayjs().locale(lang.value).add(step, unit))\nconst pickerBase = inject(PICKER_BASE_INJECTION_KEY) as any\nconst { shortcuts, cellClassName } = pickerBase.props\nconst disabledDate = toRef(pickerBase.props, 'disabledDate')\nconst format = toRef(pickerBase.props, 'format')\nconst defaultValue = toRef(pickerBase.props, 'defaultValue')\n\nconst {\n  minDate,\n  maxDate,\n  rangeState,\n  ppNs,\n  drpNs,\n\n  handleChangeRange,\n  handleRangeConfirm,\n  handleShortcutClick,\n  onSelect,\n  parseValue,\n} = useRangePicker(props, {\n  defaultValue,\n  leftDate,\n  rightDate,\n  step,\n  unit,\n  sortDates,\n})\n\nconst {\n  leftPrevYear,\n  rightNextYear,\n  leftNextYear,\n  rightPrevYear,\n  leftLabel,\n  rightLabel,\n  leftYear,\n  rightYear,\n} = useYearRangeHeader({\n  unlinkPanels: toRef(props, 'unlinkPanels'),\n  leftDate,\n  rightDate,\n})\n\nconst yearRangeDisabled = useFormDisabled()\n\nconst hasShortcuts = computed(() => !!shortcuts.length)\n\nconst panelKls = computed(() => [\n  ppNs.b(),\n  drpNs.b(),\n  ppNs.is('border', props.border),\n  ppNs.is('disabled', yearRangeDisabled.value),\n  {\n    'has-sidebar': Boolean(useSlots().sidebar) || hasShortcuts.value,\n    'single-panel': props.singlePanel,\n  },\n])\n\nconst leftPanelKls = computed(() => {\n  return {\n    content: [\n      ppNs.e('content'),\n      drpNs.e('content'),\n      drpNs.is('left', !props.singlePanel),\n    ],\n    arrowLeftBtn: [ppNs.e('icon-btn'), 'd-arrow-left'],\n    arrowRightBtn: [\n      ppNs.e('icon-btn'),\n      ppNs.is('disabled', !enableYearArrow.value || yearRangeDisabled.value),\n      'd-arrow-right',\n    ],\n  }\n})\n\nconst rightPanelKls = computed(() => {\n  return {\n    content: [ppNs.e('content'), drpNs.e('content'), 'is-right'],\n    arrowLeftBtn: [\n      ppNs.e('icon-btn'),\n      ppNs.is('disabled', !enableYearArrow.value || yearRangeDisabled.value),\n      'd-arrow-left',\n    ],\n    arrowRightBtn: [ppNs.e('icon-btn'), 'd-arrow-right'],\n  }\n})\n\nconst enableYearArrow = computed(() => {\n  return (\n    props.singlePanel ||\n    (props.unlinkPanels && rightYear.value > leftYear.value + 1)\n  )\n})\n\ntype RangePickValue = {\n  minDate: Dayjs\n  maxDate: Dayjs\n}\nconst handleRangePick = (val: RangePickValue, close = true) => {\n  const minDate_ = val.minDate\n  const maxDate_ = val.maxDate\n  if (maxDate.value === maxDate_ && minDate.value === minDate_) {\n    return\n  }\n  emit('calendar-change', [minDate_.toDate(), maxDate_ && maxDate_.toDate()])\n  maxDate.value = maxDate_\n  minDate.value = minDate_\n\n  if (!close) return\n  handleRangeConfirm()\n}\n\nconst parseUserInput = (value: Dayjs | Dayjs[]) => {\n  return correctlyParseUserInput(value, format.value, lang.value)\n}\n\nconst isValidValue = (date: [Dayjs, Dayjs]) => {\n  return (\n    isValidRange(date) &&\n    (disabledDate.value\n      ? !disabledDate.value(date[0].toDate()) &&\n        !disabledDate.value(date[1].toDate())\n      : true)\n  )\n}\n\nconst handleClear = () => {\n  let valueOnClear = null\n  if (pickerBase?.emptyValues) {\n    valueOnClear = pickerBase.emptyValues.valueOnClear.value\n  }\n  const defaultArr = getDefaultValue(unref(defaultValue), {\n    lang: unref(lang),\n    step,\n    unit,\n    unlinkPanels: props.unlinkPanels,\n  })\n  leftDate.value = defaultArr[0]\n  rightDate.value = defaultArr[1]\n  emit('pick', valueOnClear)\n}\n\nfunction sortDates(minDate: Dayjs | undefined, maxDate: Dayjs | undefined) {\n  if (props.unlinkPanels && maxDate) {\n    const minDateYear = minDate?.year() || 0\n    const maxDateYear = maxDate.year()\n\n    rightDate.value =\n      minDateYear + step > maxDateYear ? maxDate.add(step, unit) : maxDate\n  } else {\n    rightDate.value = leftDate.value.add(step, unit)\n  }\n}\n\nwatch(\n  () => props.visible,\n  (visible) => {\n    if (!visible && rangeState.value.selecting) {\n      parseValue(props.parsedValue)\n      onSelect(false)\n    }\n  }\n)\n\nemit('set-picker-option', ['isValidValue', isValidValue])\nemit('set-picker-option', ['parseUserInput', parseUserInput])\nemit('set-picker-option', ['handleClear', handleClear])\n</script>\n"],"mappings":""}

package/es/components/date-picker-panel/src/date-picker-com/panel-year-range.vue_vue_type_script_setup_true_lang.mjs

@@ -30,7 +30,8 @@ var panel_year_range_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		const leftDate = ref(dayjs().locale(lang.value));
 		const rightDate = ref(dayjs().locale(lang.value).add(step, unit));
 		const pickerBase = inject(PICKER_BASE_INJECTION_KEY);
-		const { shortcuts, disabledDate, cellClassName } = pickerBase.props;
+		const { shortcuts, cellClassName } = pickerBase.props;
+		const disabledDate = toRef(pickerBase.props, "disabledDate");
 		const format = toRef(pickerBase.props, "format");
 		const defaultValue = toRef(pickerBase.props, "defaultValue");
 		const { minDate, maxDate, rangeState, ppNs, drpNs, handleChangeRange, handleRangeConfirm, handleShortcutClick, onSelect, parseValue } = useRangePicker(props, {
@@ -105,7 +106,7 @@ var panel_year_range_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 			return correctlyParseUserInput(value, format.value, lang.value);
 		};
 		const isValidValue = (date) => {
-			return isValidRange(date) && (disabledDate ? !disabledDate(date[0].toDate()) && !disabledDate(date[1].toDate()) : true);
+			return isValidRange(date) && (disabledDate.value ? !disabledDate.value(date[0].toDate()) && !disabledDate.value(date[1].toDate()) : true);
 		};
 		const handleClear = () => {
 			let valueOnClear = null;
@@ -178,7 +179,7 @@ var panel_year_range_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 					"min-date": unref(minDate),
 					"max-date": unref(maxDate),
 					"range-state": unref(rangeState),
-					"disabled-date": unref(disabledDate),
+					"disabled-date": disabledDate.value,
 					disabled: unref(yearRangeDisabled),
 					"cell-class-name": unref(cellClassName),
 					onChangerange: unref(handleChangeRange),
@@ -224,7 +225,7 @@ var panel_year_range_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 					"min-date": unref(minDate),
 					"max-date": unref(maxDate),
 					"range-state": unref(rangeState),
-					"disabled-date": unref(disabledDate),
+					"disabled-date": disabledDate.value,
 					disabled: unref(yearRangeDisabled),
 					"cell-class-name": unref(cellClassName),
 					onChangerange: unref(handleChangeRange),

package/es/components/date-picker-panel/src/date-picker-com/panel-year-range.vue_vue_type_script_setup_true_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"panel-year-range.vue_vue_type_script_setup_true_lang.mjs","names":["unlinkPanels","singlePanel"],"sources":["../../../../../../../packages/components/date-picker-panel/src/date-picker-com/panel-year-range.vue"],"sourcesContent":["<template>\n  <div :class=\"panelKls\">\n    <div :class=\"ppNs.e('body-wrapper')\">\n      <slot name=\"sidebar\" :class=\"ppNs.e('sidebar')\" />\n      <div v-if=\"hasShortcuts\" :class=\"ppNs.e('sidebar')\">\n        <button\n          v-for=\"(shortcut, key) in shortcuts\"\n          :key=\"key\"\n          type=\"button\"\n          :class=\"ppNs.e('shortcut')\"\n          :disabled=\"yearRangeDisabled\"\n          @click=\"handleShortcutClick(shortcut)\"\n        >\n          {{ shortcut.text }}\n        </button>\n      </div>\n      <div :class=\"ppNs.e('body')\">\n        <div :class=\"leftPanelKls.content\">\n          <div :class=\"drpNs.e('header')\">\n            <button\n              type=\"button\"\n              :class=\"leftPanelKls.arrowLeftBtn\"\n              :disabled=\"yearRangeDisabled\"\n              @click=\"leftPrevYear\"\n            >\n              <slot name=\"prev-year\">\n                <el-icon><d-arrow-left /></el-icon>\n              </slot>\n            </button>\n            <button\n              v-if=\"unlinkPanels || singlePanel\"\n              type=\"button\"\n              :disabled=\"!enableYearArrow || yearRangeDisabled\"\n              :class=\"leftPanelKls.arrowRightBtn\"\n              @click=\"leftNextYear\"\n            >\n              <slot name=\"next-year\">\n                <el-icon><d-arrow-right /></el-icon>\n              </slot>\n            </button>\n            <div>{{ leftLabel }}</div>\n          </div>\n          <year-table\n            selection-mode=\"range\"\n            :date=\"leftDate\"\n            :min-date=\"minDate\"\n            :max-date=\"maxDate\"\n            :range-state=\"rangeState\"\n            :disabled-date=\"disabledDate\"\n            :disabled=\"yearRangeDisabled\"\n            :cell-class-name=\"cellClassName\"\n            @changerange=\"handleChangeRange\"\n            @pick=\"handleRangePick\"\n            @select=\"onSelect\"\n          />\n        </div>\n        <div v-if=\"!singlePanel\" :class=\"rightPanelKls.content\">\n          <div :class=\"drpNs.e('header')\">\n            <button\n              v-if=\"unlinkPanels\"\n              type=\"button\"\n              :disabled=\"!enableYearArrow || yearRangeDisabled\"\n              :class=\"rightPanelKls.arrowLeftBtn\"\n              @click=\"rightPrevYear\"\n            >\n              <slot name=\"prev-year\">\n                <el-icon><d-arrow-left /></el-icon>\n              </slot>\n            </button>\n            <button\n              type=\"button\"\n              :class=\"rightPanelKls.arrowRightBtn\"\n              :disabled=\"yearRangeDisabled\"\n              @click=\"rightNextYear\"\n            >\n              <slot name=\"next-year\">\n                <el-icon><d-arrow-right /></el-icon>\n              </slot>\n            </button>\n            <div>{{ rightLabel }}</div>\n          </div>\n          <year-table\n            selection-mode=\"range\"\n            :date=\"rightDate\"\n            :min-date=\"minDate\"\n            :max-date=\"maxDate\"\n            :range-state=\"rangeState\"\n            :disabled-date=\"disabledDate\"\n            :disabled=\"yearRangeDisabled\"\n            :cell-class-name=\"cellClassName\"\n            @changerange=\"handleChangeRange\"\n            @pick=\"handleRangePick\"\n            @select=\"onSelect\"\n          />\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, ref, toRef, unref, useSlots, watch } from 'vue'\nimport dayjs from 'dayjs'\nimport { DArrowLeft, DArrowRight } from '@element-plus/icons-vue'\nimport ElIcon from '@element-plus/components/icon'\nimport { useLocale } from '@element-plus/hooks'\nimport { PICKER_BASE_INJECTION_KEY } from '@element-plus/components/time-picker'\nimport {\n  panelYearRangeEmits,\n  panelYearRangeProps,\n} from '../props/panel-year-range'\nimport { useYearRangeHeader } from '../composables/use-year-range-header'\nimport { useRangePicker } from '../composables/use-range-picker'\nimport {\n  correctlyParseUserInput,\n  getDefaultValue,\n  isValidRange,\n} from '../utils'\nimport YearTable from './basic-year-table.vue'\nimport { useFormDisabled } from '@element-plus/components/form'\n\nimport type { Dayjs } from 'dayjs'\n\ndefineOptions({\n  name: 'DatePickerYearRange',\n})\n\nconst props = defineProps(panelYearRangeProps)\nconst emit = defineEmits(panelYearRangeEmits)\nconst step = 10\nconst unit = 'year'\n\nconst { lang } = useLocale()\nconst leftDate = ref(dayjs().locale(lang.value))\nconst rightDate = ref(dayjs().locale(lang.value).add(step, unit))\nconst pickerBase = inject(PICKER_BASE_INJECTION_KEY) as any\nconst { shortcuts, disabledDate, cellClassName } = pickerBase.props\nconst format = toRef(pickerBase.props, 'format')\nconst defaultValue = toRef(pickerBase.props, 'defaultValue')\n\nconst {\n  minDate,\n  maxDate,\n  rangeState,\n  ppNs,\n  drpNs,\n\n  handleChangeRange,\n  handleRangeConfirm,\n  handleShortcutClick,\n  onSelect,\n  parseValue,\n} = useRangePicker(props, {\n  defaultValue,\n  leftDate,\n  rightDate,\n  step,\n  unit,\n  sortDates,\n})\n\nconst {\n  leftPrevYear,\n  rightNextYear,\n  leftNextYear,\n  rightPrevYear,\n  leftLabel,\n  rightLabel,\n  leftYear,\n  rightYear,\n} = useYearRangeHeader({\n  unlinkPanels: toRef(props, 'unlinkPanels'),\n  leftDate,\n  rightDate,\n})\n\nconst yearRangeDisabled = useFormDisabled()\n\nconst hasShortcuts = computed(() => !!shortcuts.length)\n\nconst panelKls = computed(() => [\n  ppNs.b(),\n  drpNs.b(),\n  ppNs.is('border', props.border),\n  ppNs.is('disabled', yearRangeDisabled.value),\n  {\n    'has-sidebar': Boolean(useSlots().sidebar) || hasShortcuts.value,\n    'single-panel': props.singlePanel,\n  },\n])\n\nconst leftPanelKls = computed(() => {\n  return {\n    content: [\n      ppNs.e('content'),\n      drpNs.e('content'),\n      drpNs.is('left', !props.singlePanel),\n    ],\n    arrowLeftBtn: [ppNs.e('icon-btn'), 'd-arrow-left'],\n    arrowRightBtn: [\n      ppNs.e('icon-btn'),\n      ppNs.is('disabled', !enableYearArrow.value || yearRangeDisabled.value),\n      'd-arrow-right',\n    ],\n  }\n})\n\nconst rightPanelKls = computed(() => {\n  return {\n    content: [ppNs.e('content'), drpNs.e('content'), 'is-right'],\n    arrowLeftBtn: [\n      ppNs.e('icon-btn'),\n      ppNs.is('disabled', !enableYearArrow.value || yearRangeDisabled.value),\n      'd-arrow-left',\n    ],\n    arrowRightBtn: [ppNs.e('icon-btn'), 'd-arrow-right'],\n  }\n})\n\nconst enableYearArrow = computed(() => {\n  return (\n    props.singlePanel ||\n    (props.unlinkPanels && rightYear.value > leftYear.value + 1)\n  )\n})\n\ntype RangePickValue = {\n  minDate: Dayjs\n  maxDate: Dayjs\n}\nconst handleRangePick = (val: RangePickValue, close = true) => {\n  const minDate_ = val.minDate\n  const maxDate_ = val.maxDate\n  if (maxDate.value === maxDate_ && minDate.value === minDate_) {\n    return\n  }\n  emit('calendar-change', [minDate_.toDate(), maxDate_ && maxDate_.toDate()])\n  maxDate.value = maxDate_\n  minDate.value = minDate_\n\n  if (!close) return\n  handleRangeConfirm()\n}\n\nconst parseUserInput = (value: Dayjs | Dayjs[]) => {\n  return correctlyParseUserInput(value, format.value, lang.value)\n}\n\nconst isValidValue = (date: [Dayjs, Dayjs]) => {\n  return (\n    isValidRange(date) &&\n    (disabledDate\n      ? !disabledDate(date[0].toDate()) && !disabledDate(date[1].toDate())\n      : true)\n  )\n}\n\nconst handleClear = () => {\n  let valueOnClear = null\n  if (pickerBase?.emptyValues) {\n    valueOnClear = pickerBase.emptyValues.valueOnClear.value\n  }\n  const defaultArr = getDefaultValue(unref(defaultValue), {\n    lang: unref(lang),\n    step,\n    unit,\n    unlinkPanels: props.unlinkPanels,\n  })\n  leftDate.value = defaultArr[0]\n  rightDate.value = defaultArr[1]\n  emit('pick', valueOnClear)\n}\n\nfunction sortDates(minDate: Dayjs | undefined, maxDate: Dayjs | undefined) {\n  if (props.unlinkPanels && maxDate) {\n    const minDateYear = minDate?.year() || 0\n    const maxDateYear = maxDate.year()\n\n    rightDate.value =\n      minDateYear + step > maxDateYear ? maxDate.add(step, unit) : maxDate\n  } else {\n    rightDate.value = leftDate.value.add(step, unit)\n  }\n}\n\nwatch(\n  () => props.visible,\n  (visible) => {\n    if (!visible && rangeState.value.selecting) {\n      parseValue(props.parsedValue)\n      onSelect(false)\n    }\n  }\n)\n\nemit('set-picker-option', ['isValidValue', isValidValue])\nemit('set-picker-option', ['parseUserInput', parseUserInput])\nemit('set-picker-option', ['handleClear', handleClear])\n</script>\n"],"mappings":"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"}
+{"version":3,"file":"panel-year-range.vue_vue_type_script_setup_true_lang.mjs","names":["unlinkPanels","singlePanel"],"sources":["../../../../../../../packages/components/date-picker-panel/src/date-picker-com/panel-year-range.vue"],"sourcesContent":["<template>\n  <div :class=\"panelKls\">\n    <div :class=\"ppNs.e('body-wrapper')\">\n      <slot name=\"sidebar\" :class=\"ppNs.e('sidebar')\" />\n      <div v-if=\"hasShortcuts\" :class=\"ppNs.e('sidebar')\">\n        <button\n          v-for=\"(shortcut, key) in shortcuts\"\n          :key=\"key\"\n          type=\"button\"\n          :class=\"ppNs.e('shortcut')\"\n          :disabled=\"yearRangeDisabled\"\n          @click=\"handleShortcutClick(shortcut)\"\n        >\n          {{ shortcut.text }}\n        </button>\n      </div>\n      <div :class=\"ppNs.e('body')\">\n        <div :class=\"leftPanelKls.content\">\n          <div :class=\"drpNs.e('header')\">\n            <button\n              type=\"button\"\n              :class=\"leftPanelKls.arrowLeftBtn\"\n              :disabled=\"yearRangeDisabled\"\n              @click=\"leftPrevYear\"\n            >\n              <slot name=\"prev-year\">\n                <el-icon><d-arrow-left /></el-icon>\n              </slot>\n            </button>\n            <button\n              v-if=\"unlinkPanels || singlePanel\"\n              type=\"button\"\n              :disabled=\"!enableYearArrow || yearRangeDisabled\"\n              :class=\"leftPanelKls.arrowRightBtn\"\n              @click=\"leftNextYear\"\n            >\n              <slot name=\"next-year\">\n                <el-icon><d-arrow-right /></el-icon>\n              </slot>\n            </button>\n            <div>{{ leftLabel }}</div>\n          </div>\n          <year-table\n            selection-mode=\"range\"\n            :date=\"leftDate\"\n            :min-date=\"minDate\"\n            :max-date=\"maxDate\"\n            :range-state=\"rangeState\"\n            :disabled-date=\"disabledDate\"\n            :disabled=\"yearRangeDisabled\"\n            :cell-class-name=\"cellClassName\"\n            @changerange=\"handleChangeRange\"\n            @pick=\"handleRangePick\"\n            @select=\"onSelect\"\n          />\n        </div>\n        <div v-if=\"!singlePanel\" :class=\"rightPanelKls.content\">\n          <div :class=\"drpNs.e('header')\">\n            <button\n              v-if=\"unlinkPanels\"\n              type=\"button\"\n              :disabled=\"!enableYearArrow || yearRangeDisabled\"\n              :class=\"rightPanelKls.arrowLeftBtn\"\n              @click=\"rightPrevYear\"\n            >\n              <slot name=\"prev-year\">\n                <el-icon><d-arrow-left /></el-icon>\n              </slot>\n            </button>\n            <button\n              type=\"button\"\n              :class=\"rightPanelKls.arrowRightBtn\"\n              :disabled=\"yearRangeDisabled\"\n              @click=\"rightNextYear\"\n            >\n              <slot name=\"next-year\">\n                <el-icon><d-arrow-right /></el-icon>\n              </slot>\n            </button>\n            <div>{{ rightLabel }}</div>\n          </div>\n          <year-table\n            selection-mode=\"range\"\n            :date=\"rightDate\"\n            :min-date=\"minDate\"\n            :max-date=\"maxDate\"\n            :range-state=\"rangeState\"\n            :disabled-date=\"disabledDate\"\n            :disabled=\"yearRangeDisabled\"\n            :cell-class-name=\"cellClassName\"\n            @changerange=\"handleChangeRange\"\n            @pick=\"handleRangePick\"\n            @select=\"onSelect\"\n          />\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, ref, toRef, unref, useSlots, watch } from 'vue'\nimport dayjs from 'dayjs'\nimport { DArrowLeft, DArrowRight } from '@element-plus/icons-vue'\nimport ElIcon from '@element-plus/components/icon'\nimport { useLocale } from '@element-plus/hooks'\nimport { PICKER_BASE_INJECTION_KEY } from '@element-plus/components/time-picker'\nimport {\n  panelYearRangeEmits,\n  panelYearRangeProps,\n} from '../props/panel-year-range'\nimport { useYearRangeHeader } from '../composables/use-year-range-header'\nimport { useRangePicker } from '../composables/use-range-picker'\nimport {\n  correctlyParseUserInput,\n  getDefaultValue,\n  isValidRange,\n} from '../utils'\nimport YearTable from './basic-year-table.vue'\nimport { useFormDisabled } from '@element-plus/components/form'\n\nimport type { Dayjs } from 'dayjs'\n\ndefineOptions({\n  name: 'DatePickerYearRange',\n})\n\nconst props = defineProps(panelYearRangeProps)\nconst emit = defineEmits(panelYearRangeEmits)\nconst step = 10\nconst unit = 'year'\n\nconst { lang } = useLocale()\nconst leftDate = ref(dayjs().locale(lang.value))\nconst rightDate = ref(dayjs().locale(lang.value).add(step, unit))\nconst pickerBase = inject(PICKER_BASE_INJECTION_KEY) as any\nconst { shortcuts, cellClassName } = pickerBase.props\nconst disabledDate = toRef(pickerBase.props, 'disabledDate')\nconst format = toRef(pickerBase.props, 'format')\nconst defaultValue = toRef(pickerBase.props, 'defaultValue')\n\nconst {\n  minDate,\n  maxDate,\n  rangeState,\n  ppNs,\n  drpNs,\n\n  handleChangeRange,\n  handleRangeConfirm,\n  handleShortcutClick,\n  onSelect,\n  parseValue,\n} = useRangePicker(props, {\n  defaultValue,\n  leftDate,\n  rightDate,\n  step,\n  unit,\n  sortDates,\n})\n\nconst {\n  leftPrevYear,\n  rightNextYear,\n  leftNextYear,\n  rightPrevYear,\n  leftLabel,\n  rightLabel,\n  leftYear,\n  rightYear,\n} = useYearRangeHeader({\n  unlinkPanels: toRef(props, 'unlinkPanels'),\n  leftDate,\n  rightDate,\n})\n\nconst yearRangeDisabled = useFormDisabled()\n\nconst hasShortcuts = computed(() => !!shortcuts.length)\n\nconst panelKls = computed(() => [\n  ppNs.b(),\n  drpNs.b(),\n  ppNs.is('border', props.border),\n  ppNs.is('disabled', yearRangeDisabled.value),\n  {\n    'has-sidebar': Boolean(useSlots().sidebar) || hasShortcuts.value,\n    'single-panel': props.singlePanel,\n  },\n])\n\nconst leftPanelKls = computed(() => {\n  return {\n    content: [\n      ppNs.e('content'),\n      drpNs.e('content'),\n      drpNs.is('left', !props.singlePanel),\n    ],\n    arrowLeftBtn: [ppNs.e('icon-btn'), 'd-arrow-left'],\n    arrowRightBtn: [\n      ppNs.e('icon-btn'),\n      ppNs.is('disabled', !enableYearArrow.value || yearRangeDisabled.value),\n      'd-arrow-right',\n    ],\n  }\n})\n\nconst rightPanelKls = computed(() => {\n  return {\n    content: [ppNs.e('content'), drpNs.e('content'), 'is-right'],\n    arrowLeftBtn: [\n      ppNs.e('icon-btn'),\n      ppNs.is('disabled', !enableYearArrow.value || yearRangeDisabled.value),\n      'd-arrow-left',\n    ],\n    arrowRightBtn: [ppNs.e('icon-btn'), 'd-arrow-right'],\n  }\n})\n\nconst enableYearArrow = computed(() => {\n  return (\n    props.singlePanel ||\n    (props.unlinkPanels && rightYear.value > leftYear.value + 1)\n  )\n})\n\ntype RangePickValue = {\n  minDate: Dayjs\n  maxDate: Dayjs\n}\nconst handleRangePick = (val: RangePickValue, close = true) => {\n  const minDate_ = val.minDate\n  const maxDate_ = val.maxDate\n  if (maxDate.value === maxDate_ && minDate.value === minDate_) {\n    return\n  }\n  emit('calendar-change', [minDate_.toDate(), maxDate_ && maxDate_.toDate()])\n  maxDate.value = maxDate_\n  minDate.value = minDate_\n\n  if (!close) return\n  handleRangeConfirm()\n}\n\nconst parseUserInput = (value: Dayjs | Dayjs[]) => {\n  return correctlyParseUserInput(value, format.value, lang.value)\n}\n\nconst isValidValue = (date: [Dayjs, Dayjs]) => {\n  return (\n    isValidRange(date) &&\n    (disabledDate.value\n      ? !disabledDate.value(date[0].toDate()) &&\n        !disabledDate.value(date[1].toDate())\n      : true)\n  )\n}\n\nconst handleClear = () => {\n  let valueOnClear = null\n  if (pickerBase?.emptyValues) {\n    valueOnClear = pickerBase.emptyValues.valueOnClear.value\n  }\n  const defaultArr = getDefaultValue(unref(defaultValue), {\n    lang: unref(lang),\n    step,\n    unit,\n    unlinkPanels: props.unlinkPanels,\n  })\n  leftDate.value = defaultArr[0]\n  rightDate.value = defaultArr[1]\n  emit('pick', valueOnClear)\n}\n\nfunction sortDates(minDate: Dayjs | undefined, maxDate: Dayjs | undefined) {\n  if (props.unlinkPanels && maxDate) {\n    const minDateYear = minDate?.year() || 0\n    const maxDateYear = maxDate.year()\n\n    rightDate.value =\n      minDateYear + step > maxDateYear ? maxDate.add(step, unit) : maxDate\n  } else {\n    rightDate.value = leftDate.value.add(step, unit)\n  }\n}\n\nwatch(\n  () => props.visible,\n  (visible) => {\n    if (!visible && rangeState.value.selecting) {\n      parseValue(props.parsedValue)\n      onSelect(false)\n    }\n  }\n)\n\nemit('set-picker-option', ['isValidValue', isValidValue])\nemit('set-picker-option', ['parseUserInput', parseUserInput])\nemit('set-picker-option', ['handleClear', handleClear])\n</script>\n"],"mappings":"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"}

package/es/components/date-picker-panel/src/date-picker-panel.d.ts

@@ -25,7 +25,7 @@ declare const _default: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   readonly showConfirm: BooleanConstructor;
   readonly showFooter: BooleanConstructor;
   readonly showWeekNumber: BooleanConstructor;
-  readonly type: EpPropFinalized<(new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType) | (((new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType)) | null)[], unknown, unknown, "date", boolean>;
+  readonly type: EpPropFinalized<(new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType) | (((new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType)) | null)[], unknown, unknown, "date", boolean>;
   readonly clearable: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly border: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly editable: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
@@ -51,7 +51,7 @@ declare const _default: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   readonly dateFormat: StringConstructor;
   readonly timeFormat: StringConstructor;
   readonly disabled: EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
-  readonly modelValue: EpPropFinalized<(new (...args: any[]) => string | number | Date | number[] | string[] | Date[]) | (() => ModelValueType) | (((new (...args: any[]) => string | number | Date | number[] | string[] | Date[]) | (() => ModelValueType)) | null)[], unknown, unknown, "", boolean>;
+  readonly modelValue: EpPropFinalized<(new (...args: any[]) => string | number | string[] | Date | number[] | Date[]) | (() => ModelValueType) | (((new (...args: any[]) => string | number | string[] | Date | number[] | Date[]) | (() => ModelValueType)) | null)[], unknown, unknown, "", boolean>;
   readonly defaultValue: {
     readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => Date | [Date, Date]) | (() => SingleOrRange<Date>) | (((new (...args: any[]) => Date | [Date, Date]) | (() => SingleOrRange<Date>)) | null)[], unknown, unknown>>;
     readonly required: false;
@@ -65,7 +65,7 @@ declare const _default: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
     __epPropKey: true;
   };
   readonly isRange: BooleanConstructor;
-}>, () => _$vue_jsx_runtime0.JSX.Element, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, ("update:modelValue" | "clear" | "calendar-change" | "panel-change" | "visible-change")[], "update:modelValue" | "clear" | "calendar-change" | "panel-change" | "visible-change", _$vue.PublicProps, Readonly<_$vue.ExtractPropTypes<{
+}>, () => _$vue_jsx_runtime0.JSX.Element, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, ("clear" | "update:modelValue" | "calendar-change" | "panel-change" | "visible-change")[], "clear" | "update:modelValue" | "calendar-change" | "panel-change" | "visible-change", _$vue.PublicProps, Readonly<_$vue.ExtractPropTypes<{
   readonly disabledDate: {
     readonly type: _$vue.PropType<Function>;
     readonly required: false;
@@ -85,7 +85,7 @@ declare const _default: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   readonly showConfirm: BooleanConstructor;
   readonly showFooter: BooleanConstructor;
   readonly showWeekNumber: BooleanConstructor;
-  readonly type: EpPropFinalized<(new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType) | (((new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType)) | null)[], unknown, unknown, "date", boolean>;
+  readonly type: EpPropFinalized<(new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType) | (((new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType)) | null)[], unknown, unknown, "date", boolean>;
   readonly clearable: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly border: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly editable: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
@@ -111,7 +111,7 @@ declare const _default: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   readonly dateFormat: StringConstructor;
   readonly timeFormat: StringConstructor;
   readonly disabled: EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
-  readonly modelValue: EpPropFinalized<(new (...args: any[]) => string | number | Date | number[] | string[] | Date[]) | (() => ModelValueType) | (((new (...args: any[]) => string | number | Date | number[] | string[] | Date[]) | (() => ModelValueType)) | null)[], unknown, unknown, "", boolean>;
+  readonly modelValue: EpPropFinalized<(new (...args: any[]) => string | number | string[] | Date | number[] | Date[]) | (() => ModelValueType) | (((new (...args: any[]) => string | number | string[] | Date | number[] | Date[]) | (() => ModelValueType)) | null)[], unknown, unknown, "", boolean>;
   readonly defaultValue: {
     readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => Date | [Date, Date]) | (() => SingleOrRange<Date>) | (((new (...args: any[]) => Date | [Date, Date]) | (() => SingleOrRange<Date>)) | null)[], unknown, unknown>>;
     readonly required: false;
@@ -126,15 +126,15 @@ declare const _default: _$vue.DefineComponent<_$vue.ExtractPropTypes<{
   };
   readonly isRange: BooleanConstructor;
 }>> & Readonly<{
-  "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
   onClear?: ((...args: any[]) => any) | undefined;
+  "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
   "onCalendar-change"?: ((...args: any[]) => any) | undefined;
   "onPanel-change"?: ((...args: any[]) => any) | undefined;
   "onVisible-change"?: ((...args: any[]) => any) | undefined;
 }>, {
-  readonly type: EpPropMergeType<(new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType) | (((new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType)) | null)[], unknown, unknown>;
+  readonly type: EpPropMergeType<(new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType) | (((new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType)) | null)[], unknown, unknown>;
   readonly disabled: EpPropMergeType<BooleanConstructor, unknown, unknown>;
-  readonly modelValue: EpPropMergeType<(new (...args: any[]) => string | number | Date | number[] | string[] | Date[]) | (() => ModelValueType) | (((new (...args: any[]) => string | number | Date | number[] | string[] | Date[]) | (() => ModelValueType)) | null)[], unknown, unknown>;
+  readonly modelValue: EpPropMergeType<(new (...args: any[]) => string | number | string[] | Date | number[] | Date[]) | (() => ModelValueType) | (((new (...args: any[]) => string | number | string[] | Date | number[] | Date[]) | (() => ModelValueType)) | null)[], unknown, unknown>;
   readonly clearable: EpPropMergeType<BooleanConstructor, unknown, unknown>;
   readonly border: EpPropMergeType<BooleanConstructor, unknown, unknown>;
   readonly editable: EpPropMergeType<BooleanConstructor, unknown, unknown>;

package/es/components/date-picker-panel/src/panel-utils.d.ts

@@ -21,7 +21,7 @@ declare const getPanel: (type: DatePickerType) => ({
     };
     readonly singlePanel: BooleanConstructor;
     readonly type: {
-      readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
+      readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
       readonly required: true;
       readonly validator: ((val: unknown) => boolean) | undefined;
       __epPropKey: true;
@@ -76,7 +76,7 @@ declare const getPanel: (type: DatePickerType) => ({
     };
     readonly singlePanel: BooleanConstructor;
     readonly type: {
-      readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
+      readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
       readonly required: true;
       readonly validator: ((val: unknown) => boolean) | undefined;
       __epPropKey: true;
@@ -122,7 +122,7 @@ declare const getPanel: (type: DatePickerType) => ({
   };
   readonly singlePanel: BooleanConstructor;
   readonly type: {
-    readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
+    readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
     readonly required: true;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
@@ -280,7 +280,7 @@ declare const getPanel: (type: DatePickerType) => ({
     readonly visible: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
     readonly format: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
     readonly type: {
-      readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
+      readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
       readonly required: true;
       readonly validator: ((val: unknown) => boolean) | undefined;
       __epPropKey: true;
@@ -306,12 +306,12 @@ declare const getPanel: (type: DatePickerType) => ({
     readonly disabled: boolean;
     readonly visible: EpPropMergeType<BooleanConstructor, unknown, unknown>;
     readonly border: boolean;
+    readonly format: string;
     readonly editable: EpPropMergeType<BooleanConstructor, unknown, unknown>;
     readonly showNow: EpPropMergeType<BooleanConstructor, unknown, unknown>;
     readonly showConfirm: boolean;
     readonly showFooter: EpPropMergeType<BooleanConstructor, unknown, unknown>;
     readonly showWeekNumber: boolean;
-    readonly format: string;
   }, true, {}, {}, _$vue.GlobalComponents, _$vue.GlobalDirectives, string, {}, any, _$vue.ComponentProvideOptions, {
     P: {};
     B: {};
@@ -329,7 +329,7 @@ declare const getPanel: (type: DatePickerType) => ({
     readonly visible: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
     readonly format: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
     readonly type: {
-      readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
+      readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
       readonly required: true;
       readonly validator: ((val: unknown) => boolean) | undefined;
       __epPropKey: true;
@@ -351,12 +351,12 @@ declare const getPanel: (type: DatePickerType) => ({
     readonly disabled: boolean;
     readonly visible: EpPropMergeType<BooleanConstructor, unknown, unknown>;
     readonly border: boolean;
+    readonly format: string;
     readonly editable: EpPropMergeType<BooleanConstructor, unknown, unknown>;
     readonly showNow: EpPropMergeType<BooleanConstructor, unknown, unknown>;
     readonly showConfirm: boolean;
     readonly showFooter: EpPropMergeType<BooleanConstructor, unknown, unknown>;
     readonly showWeekNumber: boolean;
-    readonly format: string;
   }>;
   __isFragment?: never;
   __isTeleport?: never;
@@ -371,7 +371,7 @@ declare const getPanel: (type: DatePickerType) => ({
   readonly visible: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly format: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
   readonly type: {
-    readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
+    readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
     readonly required: true;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
@@ -397,12 +397,12 @@ declare const getPanel: (type: DatePickerType) => ({
   readonly disabled: boolean;
   readonly visible: EpPropMergeType<BooleanConstructor, unknown, unknown>;
   readonly border: boolean;
+  readonly format: string;
   readonly editable: EpPropMergeType<BooleanConstructor, unknown, unknown>;
   readonly showNow: EpPropMergeType<BooleanConstructor, unknown, unknown>;
   readonly showConfirm: boolean;
   readonly showFooter: EpPropMergeType<BooleanConstructor, unknown, unknown>;
   readonly showWeekNumber: boolean;
-  readonly format: string;
 }, {}, string, {}, _$vue.GlobalComponents, _$vue.GlobalDirectives, string, _$vue.ComponentProvideOptions> & _$vue.VNodeProps & _$vue.AllowedComponentProps & _$vue.ComponentCustomProps & (new () => {
   $slots: {
     sidebar?: (props: {

package/es/components/date-picker-panel/src/props/date-picker-panel.d.ts

@@ -25,7 +25,7 @@ declare const datePickerPanelProps: {
   readonly showConfirm: BooleanConstructor;
   readonly showFooter: BooleanConstructor;
   readonly showWeekNumber: BooleanConstructor;
-  readonly type: EpPropFinalized<(new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType) | (((new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType)) | null)[], unknown, unknown, "date", boolean>;
+  readonly type: EpPropFinalized<(new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType) | (((new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => DatePickerType)) | null)[], unknown, unknown, "date", boolean>;
   readonly clearable: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly border: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly editable: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
@@ -51,7 +51,7 @@ declare const datePickerPanelProps: {
   readonly dateFormat: StringConstructor;
   readonly timeFormat: StringConstructor;
   readonly disabled: EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
-  readonly modelValue: EpPropFinalized<(new (...args: any[]) => string | number | Date | number[] | string[] | Date[]) | (() => ModelValueType) | (((new (...args: any[]) => string | number | Date | number[] | string[] | Date[]) | (() => ModelValueType)) | null)[], unknown, unknown, "", boolean>;
+  readonly modelValue: EpPropFinalized<(new (...args: any[]) => string | number | string[] | Date | number[] | Date[]) | (() => ModelValueType) | (((new (...args: any[]) => string | number | string[] | Date | number[] | Date[]) | (() => ModelValueType)) | null)[], unknown, unknown, "", boolean>;
   readonly defaultValue: {
     readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => Date | [Date, Date]) | (() => SingleOrRange<Date>) | (((new (...args: any[]) => Date | [Date, Date]) | (() => SingleOrRange<Date>)) | null)[], unknown, unknown>>;
     readonly required: false;

package/es/components/date-picker-panel/src/props/panel-date-pick.d.ts

@@ -15,7 +15,7 @@ declare const panelDatePickProps: {
   readonly visible: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
   readonly format: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
   readonly type: {
-    readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
+    readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
     readonly required: true;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;

package/es/components/date-picker-panel/src/props/panel-date-range.d.ts

@@ -20,7 +20,7 @@ declare const panelDateRangeProps: {
   };
   readonly singlePanel: BooleanConstructor;
   readonly type: {
-    readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
+    readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
     readonly required: true;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;

package/es/components/date-picker-panel/src/props/shared.d.ts

@@ -57,7 +57,7 @@ declare const datePickerSharedProps: {
 };
 declare const panelSharedProps: {
   readonly type: {
-    readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "quarter" | "quarters" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
+    readonly type: _$vue.PropType<EpPropMergeType<(new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (((new (...args: any[]) => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange") | (() => "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange")) | null)[], "year" | "months" | "month" | "date" | "years" | "dates" | "quarter" | "quarters" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange" | "quarterrange", unknown>>;
     readonly required: true;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;

package/es/components/descriptions/src/description-item.d.ts

@@ -7,17 +7,17 @@ declare const descriptionItemProps: {
   label: EpPropFinalized<StringConstructor, unknown, unknown, string, boolean>;
   span: EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
   rowspan: EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
-  width: EpPropFinalized<(StringConstructor | NumberConstructor)[], unknown, unknown, string, boolean>;
-  minWidth: EpPropFinalized<(StringConstructor | NumberConstructor)[], unknown, unknown, string, boolean>;
+  width: EpPropFinalized<(NumberConstructor | StringConstructor)[], unknown, unknown, string, boolean>;
+  minWidth: EpPropFinalized<(NumberConstructor | StringConstructor)[], unknown, unknown, string, boolean>;
   labelWidth: {
-    readonly type: _$vue.PropType<EpPropMergeType<(StringConstructor | NumberConstructor)[], unknown, unknown>>;
+    readonly type: _$vue.PropType<EpPropMergeType<(NumberConstructor | StringConstructor)[], unknown, unknown>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
   };
-  align: EpPropFinalized<StringConstructor, "left" | "center" | "right", unknown, string, boolean>;
+  align: EpPropFinalized<StringConstructor, "center" | "left" | "right", unknown, string, boolean>;
   labelAlign: {
-    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "left" | "center" | "right", unknown>>;
+    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "center" | "left" | "right", unknown>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
@@ -29,17 +29,17 @@ declare const DescriptionItem: _$vue.DefineComponent<ExtractPropTypes<{
   label: EpPropFinalized<StringConstructor, unknown, unknown, string, boolean>;
   span: EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
   rowspan: EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
-  width: EpPropFinalized<(StringConstructor | NumberConstructor)[], unknown, unknown, string, boolean>;
-  minWidth: EpPropFinalized<(StringConstructor | NumberConstructor)[], unknown, unknown, string, boolean>;
+  width: EpPropFinalized<(NumberConstructor | StringConstructor)[], unknown, unknown, string, boolean>;
+  minWidth: EpPropFinalized<(NumberConstructor | StringConstructor)[], unknown, unknown, string, boolean>;
   labelWidth: {
-    readonly type: _$vue.PropType<EpPropMergeType<(StringConstructor | NumberConstructor)[], unknown, unknown>>;
+    readonly type: _$vue.PropType<EpPropMergeType<(NumberConstructor | StringConstructor)[], unknown, unknown>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
   };
-  align: EpPropFinalized<StringConstructor, "left" | "center" | "right", unknown, string, boolean>;
+  align: EpPropFinalized<StringConstructor, "center" | "left" | "right", unknown, string, boolean>;
   labelAlign: {
-    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "left" | "center" | "right", unknown>>;
+    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "center" | "left" | "right", unknown>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
@@ -50,17 +50,17 @@ declare const DescriptionItem: _$vue.DefineComponent<ExtractPropTypes<{
   label: EpPropFinalized<StringConstructor, unknown, unknown, string, boolean>;
   span: EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
   rowspan: EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
-  width: EpPropFinalized<(StringConstructor | NumberConstructor)[], unknown, unknown, string, boolean>;
-  minWidth: EpPropFinalized<(StringConstructor | NumberConstructor)[], unknown, unknown, string, boolean>;
+  width: EpPropFinalized<(NumberConstructor | StringConstructor)[], unknown, unknown, string, boolean>;
+  minWidth: EpPropFinalized<(NumberConstructor | StringConstructor)[], unknown, unknown, string, boolean>;
   labelWidth: {
-    readonly type: _$vue.PropType<EpPropMergeType<(StringConstructor | NumberConstructor)[], unknown, unknown>>;
+    readonly type: _$vue.PropType<EpPropMergeType<(NumberConstructor | StringConstructor)[], unknown, unknown>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
   };
-  align: EpPropFinalized<StringConstructor, "left" | "center" | "right", unknown, string, boolean>;
+  align: EpPropFinalized<StringConstructor, "center" | "left" | "right", unknown, string, boolean>;
   labelAlign: {
-    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "left" | "center" | "right", unknown>>;
+    readonly type: _$vue.PropType<EpPropMergeType<StringConstructor, "center" | "left" | "right", unknown>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
@@ -69,12 +69,12 @@ declare const DescriptionItem: _$vue.DefineComponent<ExtractPropTypes<{
   labelClassName: EpPropFinalized<StringConstructor, unknown, unknown, string, boolean>;
 }>> & Readonly<{}>, {
   className: string;
-  minWidth: EpPropMergeType<(StringConstructor | NumberConstructor)[], unknown, unknown>;
-  width: EpPropMergeType<(StringConstructor | NumberConstructor)[], unknown, unknown>;
+  minWidth: EpPropMergeType<(NumberConstructor | StringConstructor)[], unknown, unknown>;
+  width: EpPropMergeType<(NumberConstructor | StringConstructor)[], unknown, unknown>;
   label: string;
   span: number;
   rowspan: number;
-  align: EpPropMergeType<StringConstructor, "left" | "center" | "right", unknown>;
+  align: EpPropMergeType<StringConstructor, "center" | "left" | "right", unknown>;
   labelClassName: string;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, true, {}, any>;
 type DescriptionItemProps = ExtractPropTypes<typeof descriptionItemProps>;

package/es/components/dialog/src/dialog.vue.d.ts

@@ -23,17 +23,17 @@ declare const __VLS_base: _$vue.DefineComponent<DialogProps, {
   resetPosition: () => void;
   handleClose: () => void;
 }, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+  close: () => void;
   "update:modelValue": (value: boolean) => void;
   open: () => void;
-  close: () => void;
   opened: () => void;
   closed: () => void;
   openAutoFocus: () => void;
   closeAutoFocus: () => void;
 }, string, _$vue.PublicProps, Readonly<DialogProps> & Readonly<{
+  onClose?: (() => any) | undefined;
   "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
   onOpen?: (() => any) | undefined;
-  onClose?: (() => any) | undefined;
   onOpened?: (() => any) | undefined;
   onClosed?: (() => any) | undefined;
   onOpenAutoFocus?: (() => any) | undefined;

package/es/components/divider/src/divider.d.ts

@@ -23,7 +23,7 @@ interface DividerProps {
  */
 declare const dividerProps: {
   readonly direction: EpPropFinalized<StringConstructor, "horizontal" | "vertical", unknown, "horizontal", boolean>;
-  readonly contentPosition: EpPropFinalized<StringConstructor, "left" | "center" | "right", unknown, "center", boolean>;
+  readonly contentPosition: EpPropFinalized<StringConstructor, "center" | "left" | "right", unknown, "center", boolean>;
   readonly borderStyle: EpPropFinalized<(new (...args: any[]) => string) | (() => string) | (((new (...args: any[]) => string) | (() => string)) | null)[], unknown, unknown, "solid", boolean>;
 };
 /**