hongluan-ui/es/components/calendar/src/calendar2.mjs.map

Hongluan Component Library for Vue 3

{"version":3,"file":"calendar2.mjs","sources":["../../../../../../packages/components/calendar/src/calendar.vue"],"sourcesContent":["<template>\n  <div :class=\"namespace\">\n    <div class=\"calendar-header\">\n      <slot name=\"header\" :date=\"i18nDate\">\n        <div class=\"calendar-title\">{{ i18nDate }}</div>\n        <hl-group v-if=\"validatedRange.length === 0\" indent merge class=\"calendar-button-group\">\n          <hl-button @click=\"selectDate('prev-month')\">\n            {{ t('hl.datepicker.prevMonth') }}\n          </hl-button>\n          <hl-button @click=\"selectDate('today')\">\n            {{ t('hl.datepicker.today') }}\n          </hl-button>\n          <hl-button @click=\"selectDate('next-month')\">\n            {{ t('hl.datepicker.nextMonth') }}\n          </hl-button>\n        </hl-group>\n      </slot>\n    </div>\n    <div v-if=\"validatedRange.length === 0\" class=\"calendar-body\">\n      <date-table\n        :date=\"date\"\n        :selected-day=\"realSelectedDay\"\n        @pick=\"pickDay\"\n      >\n        <template\n          v-if=\"$slots['date-cell'] || $slots.dateCell\"\n          #date-cell=\"data\"\n        >\n          <slot v-if=\"$slots['date-cell']\" name=\"date-cell\" v-bind=\"data\"></slot>\n          <slot v-else name=\"dateCell\" v-bind=\"data\"></slot>\n        </template>\n      </date-table>\n    </div>\n    <div v-else class=\"calendar-body\">\n      <date-table\n        v-for=\"(range_, index) in validatedRange\"\n        :key=\"index\"\n        :date=\"range_[0]\"\n        :selected-day=\"realSelectedDay\"\n        :range=\"range_\"\n        :hide-header=\"index !== 0\"\n        @pick=\"pickDay\"\n      >\n        <template\n          v-if=\"$slots['date-cell'] || $slots.dateCell\"\n          #date-cell=\"data\"\n        >\n          <slot v-if=\"$slots['date-cell']\" name=\"date-cell\" v-bind=\"data\"></slot>\n          <slot v-else name=\"dateCell\" v-bind=\"data\"></slot>\n        </template>\n      </date-table>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport HlButton from '@hongluan-ui/components/button'\nimport HlGroup from '@hongluan-ui/components/group'\nimport { useNamespace, useLocale } from '@hongluan-ui/hooks'\nimport DateTable from './date-table.vue'\nimport { useCalendar } from './use-calendar'\nimport { calendarEmits, calendarProps } from './calendar'\n\nconst COMPONENT_NAME = 'Calendar'\n\ndefineOptions({\n  name: COMPONENT_NAME,\n})\n\nconst props = defineProps(calendarProps)\nconst emit = defineEmits(calendarEmits)\n\nconst { namespace } = useNamespace('calendar')\nconst {\n  calculateValidatedDateRange,\n  date,\n  pickDay,\n  realSelectedDay,\n  selectDate,\n  validatedRange,\n} = useCalendar(props, emit, COMPONENT_NAME)\n\nconst { t } = useLocale()\n\nconst i18nDate = computed(() => {\n  const pickedMonth = `hl.datepicker.month${date.value.format('M')}`\n  return `${date.value.year()} ${t('hl.datepicker.year')} ${t(pickedMonth)}`\n})\n\ndefineExpose({\n  /** @description currently selected date */\n  selectedDay: realSelectedDay,\n  /** @description select a specific date */\n  pickDay,\n  /** @description select date */\n  selectDate,\n  /** @description Calculate the validate date range according to the start and end dates */\n  calculateValidatedDateRange,\n})\n</script>\n\n"],"names":[],"mappings":";;;;;;;;;;;oCAkEc;AAAA,EACZ,MAAM;AACR;;;;;;;AAKA,UAAM,EAAE,cAAc,aAAa,UAAU;AAC7C,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,QACE,YAAY,OAAO,MAAM,cAAc;AAE3C,UAAM,EAAE,MAAM;AAEd,UAAM,WAAW,SAAS,MAAM;AAC9B,YAAM,cAAc,sBAAsB,KAAK,MAAM,OAAO,GAAG;AAC/D,aAAO,GAAG,KAAK,MAAM,UAAU,EAAE,oBAAoB,KAAK,EAAE,WAAW;AAAA,KACxE;AAED,WAAa;AAAA,MAEX,aAAa;AAAA,MAEb;AAAA,MAEA;AAAA,MAEA;AAAA,KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}