hongluan-ui/es/components/date-picker/src/date-picker-com/panel-date-pick.mjs.map

Hongluan Component Library for Vue 3

{"version":3,"file":"panel-date-pick.mjs","sources":["../../../../../../../packages/components/date-picker/src/date-picker-com/panel-date-pick.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      {\n        'has-sidebar': $slots.sidebar || hasShortcuts,\n        'has-time': showTime,\n      },\n      namespace + '-date-picker',\n    ]\"\n  >\n    <div class=\"picker-wrapper\">\n      <slot name=\"sidebar\" :class=\"['picker-sidebar', namespace + '-group', 'vertical']\"></slot>\n      <hl-group v-if=\"hasShortcuts\" :class=\"['picker-sidebar']\" dir=\"vertical\">\n        <hl-group v-for=\"(shortcut, key) in shortcuts\" :key=\"key\" class=\"p-x-sm p-y-xxs hover:text-hover cursor-pointer\" @click=\"handleShortcutClick(shortcut)\">\n          {{ shortcut.text }}\n        </hl-group>\n      </hl-group>\n      <div class=\"picker-body\">\n        <hl-group v-if=\"showTime\" class=\"picker-time-header\" deep-merge indent full>\n          <hl-input\n            :placeholder=\"t('hl.datepicker.selectDate')\"\n            size=\"sm\"\n            :model-value=\"visibleDate\"\n            :validate-event=\"false\"\n            @input=\"(val) => (userInputDate = val)\"\n            @change=\"handleVisibleDateChange\"\n          >\n            <template #prefix>\n              <hl-icon>\n                <system-calendar />\n              </hl-icon>\n            </template>\n          </hl-input>\n          <div v-click-outside=\"handleTimePickClose\">\n            <hl-input\n              :placeholder=\"t('hl.datepicker.selectTime')\"\n              :model-value=\"visibleTime\"\n              size=\"sm\"\n              :validate-event=\"false\"\n              @focus=\"onTimePickerInputFocus\"\n              @input=\"(val) => (userInputTime = val)\"\n              @change=\"handleVisibleTimeChange\"\n            >\n              <template #prefix>\n                <hl-icon>\n                  <system-clock />\n                </hl-icon>\n              </template>\n            </hl-input>\n            <time-pick-panel\n              :visible=\"timePickerVisible\"\n              :format=\"timeFormat\"\n              :parsed-value=\"innerDate\"\n              @pick=\"handleTimePick\"\n            />\n          </div>\n        </hl-group>\n        <!--:class=\"{ '': currentView === 'year' || currentView === 'month' }\"-->\n        <div v-show=\"currentView !== 'time'\" :class=\"['picker-body-header', namespace + '-group', 'full']\">\n          <div class=\"group-item static\">\n            <hl-button size=\"sm\" class=\"prev-year\" equal :aria-label=\"t(`hl.datepicker.prevYear`)\" @click=\"moveByYear(false)\">\n              <slot name=\"prev-year\">\n                <hl-icon>\n                  <system-double-arrow-left />\n                </hl-icon>\n              </slot>\n            </hl-button>\n            <hl-button\n              v-show=\"currentView === 'date'\"\n              size=\"sm\"\n              class=\"prev-month\"\n              equal\n              :aria-label=\"t(`hl.datepicker.prevMonth`)\"\n              @click=\"moveByMonth(false)\"\n            >\n              <slot name=\"prev-month\">\n                <hl-icon>\n                  <system-arrow-left />\n                </hl-icon>\n              </slot>\n            </hl-button>\n          </div>\n          <div class=\"header-label group-item\">\n            <hl-button\n              role=\"button\"\n              aria-live=\"polite\"\n              tabindex=\"0\"\n              @keydown.enter=\"showPicker('year')\"\n              @click=\"showPicker('year')\"\n            >\n              {{ yearLabel }}\n            </hl-button>\n            <hl-button\n              v-show=\"currentView === 'date'\"\n              role=\"button\"\n              aria-live=\"polite\"\n              tabindex=\"0\"\n              :class=\"{ active: currentView === 'month' }\"\n              @keydown.enter=\"showPicker('month')\"\n              @click=\"showPicker('month')\"\n            >\n              {{ t(`hl.datepicker.month${month + 1}`) }}\n            </hl-button>\n          </div>\n          <div class=\"group-item static\">\n            <hl-button\n              v-show=\"currentView === 'date'\"\n              size=\"sm\"\n              class=\"next-month\"\n              equal\n              :aria-label=\"t(`hl.datepicker.nextMonth`)\"\n              @click=\"moveByMonth(true)\"\n            >\n              <slot name=\"next-month\">\n                <hl-icon>\n                  <system-arrow-right />\n                </hl-icon>\n              </slot>\n            </hl-button>\n            <hl-button size=\"sm\" class=\"next-year\" equal :aria-label=\"t(`hl.datepicker.nextYear`)\" @click=\"moveByYear(true)\">\n              <slot name=\"next-year\">\n                <hl-icon>\n                  <system-double-arrow-right />\n                </hl-icon>\n              </slot>\n            </hl-button>\n          </div>\n        </div>\n        <div class=\"picker-body-content\" @keydown=\"handleKeydownTable\">\n          <date-table\n            v-if=\"currentView === 'date'\"\n            ref=\"currentViewRef\"\n            :selection-mode=\"selectionMode\"\n            :date=\"innerDate\"\n            :parsed-value=\"parsedValue\"\n            :disabled-date=\"disabledDate\"\n            :cell-class-name=\"cellClassName\"\n            @pick=\"handleDatePick\"\n          />\n          <year-table\n            v-if=\"currentView === 'year'\"\n            ref=\"currentViewRef\"\n            :selection-mode=\"selectionMode\"\n            :date=\"innerDate\"\n            :disabled-date=\"disabledDate\"\n            :parsed-value=\"parsedValue\"\n            @pick=\"handleYearPick\"\n          />\n          <month-table\n            v-if=\"currentView === 'month'\"\n            ref=\"currentViewRef\"\n            :selection-mode=\"selectionMode\"\n            :date=\"innerDate\"\n            :parsed-value=\"parsedValue\"\n            :disabled-date=\"disabledDate\"\n            @pick=\"handleMonthPick\"\n          />\n        </div>\n      </div>\n    </div>\n    <div v-show=\"footerVisible\" class=\"picker-footer\">\n      <hl-button\n        v-show=\"!isMultipleType\"\n        type=\"link\"\n        :disabled=\"disabledNow\"\n        @click=\"changeToNow\"\n      >\n        {{ t('hl.datepicker.now') }}\n      </hl-button>\n      <hl-button\n        plain\n        type=\"primary\"\n        :disabled=\"disabledConfirm\"\n        @click=\"onConfirm\"\n      >\n        {{ t('hl.datepicker.confirm') }}\n      </hl-button>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n  computed,\n  inject,\n  nextTick,\n  ref,\n  toRef,\n  useAttrs,\n  useSlots,\n  watch,\n} from 'vue'\nimport dayjs from 'dayjs'\nimport { ClickOutside as vClickOutside } from '@hongluan-ui/directives'\nimport { useLocale, useNamespace } from '@hongluan-ui/hooks'\nimport {\n  TimePickPanel,\n  extractDateFormat,\n  extractTimeFormat,\n} from '@hongluan-ui/components/time-picker'\nimport HlInput from '@hongluan-ui/components/input'\nimport HlButton from '@hongluan-ui/components/button'\nimport HlGroup from '@hongluan-ui/components/group'\nimport HlIcon from '@hongluan-ui/components/icon'\nimport { SystemCalendar, SystemClock, SystemArrowLeft, SystemArrowRight, SystemDoubleArrowLeft, SystemDoubleArrowRight } from '@hongluan-ui/components/system-icon'\nimport { isArray, isFunction } from '@hongluan-ui/utils'\nimport { EVENT_CODE } from '@hongluan-ui/constants'\nimport { TOOLTIP_INJECTION_KEY } from '@hongluan-ui/tokens'\nimport { panelDatePickProps } from '../props/panel-date-pick'\nimport { getValidDateOfMonth, getValidDateOfYear } from '../utils'\nimport DateTable from './basic-date-table.vue'\nimport MonthTable from './basic-month-table.vue'\nimport YearTable from './basic-year-table.vue'\n\nimport type { SetupContext } from 'vue'\nimport type { ConfigType, Dayjs } from 'dayjs'\nimport type { PanelDatePickProps } from '../props/panel-date-pick'\nimport type {\n  DateTableEmits,\n  DatesPickerEmits,\n  WeekPickerEmits,\n  YearsPickerEmits,\n  MonthsPickerEmits,\n} from '../props/basic-date-table'\n\ntype DatePickType = PanelDatePickProps['type']\n// todo\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nconst timeWithinRange = (_: ConfigType, __: any, ___: string) => true\nconst props = defineProps(panelDatePickProps)\nconst contextEmit = defineEmits(['pick', 'set-picker-option', 'panel-change'])\n\nconst attrs = useAttrs()\nconst slots = useSlots()\n\nconst { t, lang } = useLocale()\nconst { namespace } = useNamespace()\nconst pickerBase = inject('EP_PICKER_BASE') as any\nconst popper = inject(TOOLTIP_INJECTION_KEY)\nconst { shortcuts, disabledDate, cellClassName, defaultTime } =\n  pickerBase.props\nconst defaultValue = toRef(pickerBase.props, 'defaultValue')\n\nconst currentViewRef = ref<{ focus: () => void; }>()\n\nconst innerDate = ref(dayjs().locale(lang.value))\n\nconst isChangeToNow = ref(false)\n\nlet isShortcut = false\n\nconst defaultTimeD = computed(() => {\n  return dayjs(defaultTime).locale(lang.value)\n})\n\nconst month = computed(() => {\n  return innerDate.value.month()\n})\n\nconst year = computed(() => {\n  return innerDate.value.year()\n})\n\nconst selectableRange = ref([])\nconst userInputDate = ref<string | null>(null)\nconst userInputTime = ref<string | null>(null)\n// todo update to disableHour\nconst checkDateWithinRange = (date: ConfigType) => {\n  return selectableRange.value.length > 0\n    ? timeWithinRange(date, selectableRange.value, props.format || 'HH:mm:ss')\n    : true\n}\nconst formatEmit = (emitDayjs: Dayjs) => {\n  if (\n    defaultTime &&\n    !visibleTime.value &&\n    !isChangeToNow.value &&\n    !isShortcut\n  ) {\n    return defaultTimeD.value\n      .year(emitDayjs.year())\n      .month(emitDayjs.month())\n      .date(emitDayjs.date())\n  }\n  if (showTime.value) return emitDayjs.millisecond(0)\n  return emitDayjs.startOf('day')\n}\nconst emit = (value: Dayjs | Dayjs[], ...args: any[]) => {\n  if (!value) {\n    contextEmit('pick', value, ...args)\n  } else if (isArray(value)) {\n    const dates = value.map(formatEmit)\n    contextEmit('pick', dates, ...args)\n  } else {\n    contextEmit('pick', formatEmit(value), ...args)\n  }\n  userInputDate.value = null\n  userInputTime.value = null\n  isChangeToNow.value = false\n  isShortcut = false\n}\nconst handleDatePick = async (value: DateTableEmits, keepOpen?: boolean) => {\n  if (selectionMode.value === 'date') {\n    value = value as Dayjs\n    let newDate = props.parsedValue\n      ? (props.parsedValue as Dayjs)\n        .year(value.year())\n        .month(value.month())\n        .date(value.date())\n      : value\n    // change default time while out of selectableRange\n    if (!checkDateWithinRange(newDate)) {\n      newDate = (selectableRange.value[0][0] as Dayjs)\n        .year(value.year())\n        .month(value.month())\n        .date(value.date())\n    }\n    innerDate.value = newDate\n    emit(newDate, showTime.value || keepOpen)\n    // fix: https://github.com/element-plus/element-plus/issues/14728\n    if (props.type === 'datetime') {\n      await nextTick()\n      handleFocusPicker()\n    }\n  } else if (selectionMode.value === 'week') {\n    emit((value as WeekPickerEmits).date)\n  } else if (selectionMode.value === 'dates') {\n    emit(value as DatesPickerEmits, true) // set true to keep panel open\n  }\n}\n\nconst moveByMonth = (forward: boolean) => {\n  const action = forward ? 'add' : 'subtract'\n  innerDate.value = innerDate.value[action](1, 'month')\n  handlePanelChange('month')\n}\n\nconst moveByYear = (forward: boolean) => {\n  const currentDate = innerDate.value\n  const action = forward ? 'add' : 'subtract'\n\n  innerDate.value =\n    currentView.value === 'year'\n      ? currentDate[action](10, 'year')\n      : currentDate[action](1, 'year')\n\n  handlePanelChange('year')\n}\n\nconst currentView = ref('date')\n\nconst yearLabel = computed(() => {\n  const yearTranslation = t('hl.datepicker.year')\n  if (currentView.value === 'year') {\n    const startYear = Math.floor(year.value / 10) * 10\n    if (yearTranslation) {\n      return `${startYear} ${yearTranslation} - ${\n        startYear + 9\n      } ${yearTranslation}`\n    }\n    return `${startYear} - ${startYear + 9}`\n  }\n  return `${year.value} ${yearTranslation}`\n})\n\ntype Shortcut = {\n  value: (() => Dayjs) | Dayjs\n  onClick?: (ctx: Omit<SetupContext, 'expose'>) => void\n}\n\nconst handleShortcutClick = (shortcut: Shortcut) => {\n  const shortcutValue = isFunction(shortcut.value)\n    ? shortcut.value()\n    : shortcut.value\n  if (shortcutValue) {\n    isShortcut = true\n    emit(dayjs(shortcutValue).locale(lang.value))\n    return\n  }\n  if (shortcut.onClick) {\n    shortcut.onClick({\n      attrs,\n      slots,\n      emit: contextEmit as SetupContext['emit'],\n    })\n  }\n}\n\nconst selectionMode = computed<DatePickType>(() => {\n  const { type } = props\n  if (['week', 'month', 'months', 'year', 'years', 'dates'].includes(type))\n    return type\n  return 'date' as DatePickType\n})\nconst isMultipleType = computed(() => {\n  return (\n    selectionMode.value === 'dates' ||\n    selectionMode.value === 'months' ||\n    selectionMode.value === 'years'\n  )\n})\n\nconst keyboardMode = computed<string>(() => {\n  return selectionMode.value === 'date'\n    ? currentView.value\n    : selectionMode.value\n})\n\nconst hasShortcuts = computed(() => !!shortcuts.length)\n\nconst handleMonthPick = async (\n  month: number | MonthsPickerEmits,\n  keepOpen?: boolean,\n) => {\n  if (selectionMode.value === 'month') {\n    innerDate.value = getValidDateOfMonth(\n      innerDate.value.year(),\n      month as number,\n      lang.value,\n      disabledDate,\n    )\n    emit(innerDate.value, false)\n  } else if (selectionMode.value === 'months') {\n    emit(month as MonthsPickerEmits, keepOpen ?? true)\n  } else {\n    innerDate.value = getValidDateOfMonth(\n      innerDate.value.year(),\n      month as number,\n      lang.value,\n      disabledDate,\n    )\n    currentView.value = 'date'\n    if (['month', 'year', 'date', 'week'].includes(selectionMode.value)) {\n      emit(innerDate.value, true)\n      await nextTick()\n      handleFocusPicker()\n    }\n  }\n  handlePanelChange('month')\n}\n\nconst handleYearPick = async (\n  year: number | YearsPickerEmits,\n  keepOpen?: boolean,\n) => {\n  if (selectionMode.value === 'year') {\n    const data = innerDate.value.startOf('year').year(year as number)\n    innerDate.value = getValidDateOfYear(data, lang.value, disabledDate)\n    emit(innerDate.value, false)\n  } else if (selectionMode.value === 'years') {\n    emit(year as YearsPickerEmits, keepOpen ?? true)\n  } else {\n    const data = innerDate.value.year(year as number)\n    innerDate.value = getValidDateOfYear(data, lang.value, disabledDate)\n    currentView.value = 'month'\n    if (['month', 'year', 'date', 'week'].includes(selectionMode.value)) {\n      emit(innerDate.value, true)\n      await nextTick()\n      handleFocusPicker()\n    }\n  }\n  handlePanelChange('year')\n}\n\nconst showPicker = async (view: 'month' | 'year') => {\n  currentView.value = view\n  await nextTick()\n  handleFocusPicker()\n}\n\nconst showTime = computed(\n  () => props.type === 'datetime' || props.type === 'datetimerange',\n)\n\nconst footerVisible = computed(() => {\n  const showDateFooter = showTime.value || selectionMode.value === 'dates'\n  const showYearFooter = selectionMode.value === 'years'\n  const showMonthFooter = selectionMode.value === 'months'\n  const isDateView = currentView.value === 'date'\n  const isYearView = currentView.value === 'year'\n  const isMonthView = currentView.value === 'month'\n  return (\n    (showDateFooter && isDateView) ||\n    (showYearFooter && isYearView) ||\n    (showMonthFooter && isMonthView)\n  )\n})\n\nconst disabledConfirm = computed(() => {\n  if (!disabledDate) return false\n  if (!props.parsedValue) return true\n  if (isArray(props.parsedValue)) {\n    return disabledDate(props.parsedValue[0].toDate())\n  }\n  return disabledDate(props.parsedValue.toDate())\n})\nconst onConfirm = () => {\n  if (isMultipleType.value) {\n    emit(props.parsedValue as Dayjs[])\n  } else {\n    // deal with the scenario where: user opens the date time picker, then confirm without doing anything\n    let result = props.parsedValue as Dayjs\n    if (!result) {\n      const defaultTimeD = dayjs(defaultTime).locale(lang.value)\n      const defaultValueD = getDefaultValue()\n      result = defaultTimeD\n        .year(defaultValueD.year())\n        .month(defaultValueD.month())\n        .date(defaultValueD.date())\n    }\n    innerDate.value = result\n    emit(result)\n  }\n}\n\nconst disabledNow = computed(() => {\n  if (!disabledDate) return false\n  return disabledDate(dayjs().locale(lang.value).toDate())\n})\nconst changeToNow = () => {\n  // NOTE: not a permanent solution\n  //       consider disable \"now\" button in the future\n  const now = dayjs().locale(lang.value)\n  const nowDate = now.toDate()\n  isChangeToNow.value = true\n  if (\n    (!disabledDate || !disabledDate(nowDate)) &&\n    checkDateWithinRange(nowDate)\n  ) {\n    innerDate.value = dayjs().locale(lang.value)\n    emit(innerDate.value)\n  }\n}\n\nconst timeFormat = computed(() => {\n  return props.timeFormat || extractTimeFormat(props.format)\n})\n\nconst dateFormat = computed(() => {\n  return props.dateFormat || extractDateFormat(props.format)\n})\n\nconst visibleTime = computed(() => {\n  if (userInputTime.value) return userInputTime.value\n  if (!props.parsedValue && !defaultValue.value) return\n  return ((props.parsedValue || innerDate.value) as Dayjs).format(\n    timeFormat.value,\n  )\n})\n\nconst visibleDate = computed(() => {\n  if (userInputDate.value) return userInputDate.value\n  if (!props.parsedValue && !defaultValue.value) return\n  return ((props.parsedValue || innerDate.value) as Dayjs).format(\n    dateFormat.value,\n  )\n})\n\nconst timePickerVisible = ref(false)\nconst onTimePickerInputFocus = () => {\n  timePickerVisible.value = true\n}\nconst handleTimePickClose = () => {\n  timePickerVisible.value = false\n}\n\nconst getUnits = (date: Dayjs) => {\n  return {\n    hour: date.hour(),\n    minute: date.minute(),\n    second: date.second(),\n    year: date.year(),\n    month: date.month(),\n    date: date.date(),\n  }\n}\n\nconst handleTimePick = (value: Dayjs, visible: boolean, first: boolean) => {\n  const { hour, minute, second } = getUnits(value)\n  const newDate = props.parsedValue\n    ? (props.parsedValue as Dayjs).hour(hour).minute(minute).second(second)\n    : value\n  innerDate.value = newDate\n  emit(innerDate.value, true)\n  if (!first) {\n    timePickerVisible.value = visible\n  }\n}\n\nconst handleVisibleTimeChange = (value: string) => {\n  const newDate = dayjs(value, timeFormat.value).locale(lang.value)\n  if (newDate.isValid() && checkDateWithinRange(newDate)) {\n    const { year, month, date } = getUnits(innerDate.value)\n    innerDate.value = newDate.year(year).month(month).date(date)\n    userInputTime.value = null\n    timePickerVisible.value = false\n    emit(innerDate.value, true)\n  }\n}\n\nconst handleVisibleDateChange = (value: string) => {\n  const newDate = dayjs(value, dateFormat.value).locale(lang.value)\n  if (newDate.isValid()) {\n    if (disabledDate && disabledDate(newDate.toDate())) {\n      return\n    }\n    const { hour, minute, second } = getUnits(innerDate.value)\n    innerDate.value = newDate.hour(hour).minute(minute).second(second)\n    userInputDate.value = null\n    emit(innerDate.value, true)\n  }\n}\n\nconst isValidValue = (date: unknown) => {\n  return (\n    dayjs.isDayjs(date) &&\n    date.isValid() &&\n    (disabledDate ? !disabledDate(date.toDate()) : true)\n  )\n}\n\nconst formatToString = (value: Dayjs | Dayjs[]) => {\n  return isArray(value)\n    ? (value as Dayjs[]).map((_) => _.format(props.format))\n    : (value as Dayjs).format(props.format)\n}\n\nconst parseUserInput = (value: Dayjs) => {\n  return dayjs(value, props.format).locale(lang.value)\n}\n\nconst getDefaultValue = () => {\n  const parseDate = dayjs(defaultValue.value).locale(lang.value)\n  if (!defaultValue.value) {\n    const defaultTimeDValue = defaultTimeD.value\n    return dayjs()\n      .hour(defaultTimeDValue.hour())\n      .minute(defaultTimeDValue.minute())\n      .second(defaultTimeDValue.second())\n      .locale(lang.value)\n  }\n  return parseDate\n}\n\nconst handleFocusPicker = async () => {\n  if (['week', 'month', 'year', 'date'].includes(selectionMode.value)) {\n    currentViewRef.value?.focus()\n    if (selectionMode.value === 'week') {\n      handleKeyControl(EVENT_CODE.down)\n    }\n  }\n}\n\nconst handleKeydownTable = (event: KeyboardEvent) => {\n  const { code } = event\n  const validCode = [\n    EVENT_CODE.up,\n    EVENT_CODE.down,\n    EVENT_CODE.left,\n    EVENT_CODE.right,\n    EVENT_CODE.home,\n    EVENT_CODE.end,\n    EVENT_CODE.pageUp,\n    EVENT_CODE.pageDown,\n  ]\n  if (validCode.includes(code)) {\n    handleKeyControl(code)\n    event.stopPropagation()\n    event.preventDefault()\n  }\n  if (\n    [EVENT_CODE.enter, EVENT_CODE.space, EVENT_CODE.numpadEnter].includes(\n      code,\n    ) &&\n    userInputDate.value === null &&\n    userInputTime.value === null\n  ) {\n    event.preventDefault()\n    emit(innerDate.value, false)\n  }\n}\n\nconst handleKeyControl = (code: string) => {\n  type KeyControlMappingCallableOffset = (date: Date, step?: number) => number\n  type KeyControl = {\n    [key: string]:\n    | number\n    | KeyControlMappingCallableOffset\n    | ((date: Date, step: number) => any)\n    offset: (date: Date, step: number) => any\n  }\n  interface KeyControlMapping {\n    [key: string]: KeyControl\n  }\n\n  const { up, down, left, right, home, end, pageUp, pageDown } = EVENT_CODE\n  const mapping: KeyControlMapping = {\n    year: {\n      [up]: -4,\n      [down]: 4,\n      [left]: -1,\n      [right]: 1,\n      offset: (date: Date, step: number) =>\n        date.setFullYear(date.getFullYear() + step),\n    },\n    month: {\n      [up]: -4,\n      [down]: 4,\n      [left]: -1,\n      [right]: 1,\n      offset: (date: Date, step: number) =>\n        date.setMonth(date.getMonth() + step),\n    },\n    week: {\n      [up]: -1,\n      [down]: 1,\n      [left]: -1,\n      [right]: 1,\n      offset: (date: Date, step: number) =>\n        date.setDate(date.getDate() + step * 7),\n    },\n    date: {\n      [up]: -7,\n      [down]: 7,\n      [left]: -1,\n      [right]: 1,\n      [home]: (date: Date) => -date.getDay(),\n      [end]: (date: Date) => -date.getDay() + 6,\n      [pageUp]: (date: Date) =>\n        -new Date(date.getFullYear(), date.getMonth(), 0).getDate(),\n      [pageDown]: (date: Date) =>\n        new Date(date.getFullYear(), date.getMonth() + 1, 0).getDate(),\n      offset: (date: Date, step: number) => date.setDate(date.getDate() + step),\n    },\n  }\n\n  const newDate = innerDate.value.toDate()\n  while (Math.abs(innerDate.value.diff(newDate, 'year', true)) < 1) {\n    const map = mapping[keyboardMode.value]\n    if (!map) return\n    map.offset(\n      newDate,\n      isFunction(map[code])\n        ? (map[code] as unknown as KeyControlMappingCallableOffset)(newDate)\n        : (map[code] as number) ?? 0,\n    )\n    if (disabledDate && disabledDate(newDate)) {\n      break\n    }\n    const result = dayjs(newDate).locale(lang.value)\n    innerDate.value = result\n    contextEmit('pick', result, true)\n    break\n  }\n}\n\nconst handlePanelChange = (mode: 'month' | 'year') => {\n  contextEmit('panel-change', innerDate.value.toDate(), mode, currentView.value)\n}\n\nwatch(\n  () => selectionMode.value,\n  val => {\n    if (['month', 'year'].includes(val)) {\n      currentView.value = val\n      return\n    } else if (val === 'years') {\n      currentView.value = 'year'\n      return\n    } else if (val === 'months') {\n      currentView.value = 'month'\n      return\n    }\n    currentView.value = 'date'\n  },\n  { immediate: true },\n)\n\nwatch(\n  () => currentView.value,\n  () => {\n    popper?.updatePopper()\n  },\n)\n\nwatch(\n  () => defaultValue.value,\n  val => {\n    if (val) {\n      innerDate.value = getDefaultValue()\n    }\n  },\n  { immediate: true },\n)\n\nwatch(\n  () => props.parsedValue,\n  val => {\n    if (val) {\n      if (isMultipleType.value) return\n      if (Array.isArray(val)) return\n      innerDate.value = val\n    } else {\n      innerDate.value = getDefaultValue()\n    }\n  },\n  { immediate: true },\n)\n\ncontextEmit('set-picker-option', ['isValidValue', isValidValue])\ncontextEmit('set-picker-option', ['formatToString', formatToString])\ncontextEmit('set-picker-option', ['parseUserInput', parseUserInput])\ncontextEmit('set-picker-option', ['handleFocusPicker', handleFocusPicker])\n</script>\n\n"],"names":[],"mappings":"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"}