maz-ui
Version:
A standalone components library for Vue.Js 3 & Nuxt.Js 3
112 lines (111 loc) • 6.21 kB
JavaScript
import { defineComponent, defineAsyncComponent, ref, computed, createElementBlock, openBlock, createBlock, createCommentVNode, createElementVNode, unref, normalizeClass, createVNode, Transition, withCtx, Fragment, renderList } from "vue";
import { _ as _export_sfc } from "./_plugin-vue_export-helper.B--vMWp3.js";
import '../assets/MazPickerCalendar.e-eF8E7m.css';const _hoisted_1 = { class: "maz-picker-calendar flex" }, _sfc_main = /* @__PURE__ */ defineComponent({
__name: "MazPickerCalendar",
props: {
modelValue: {},
calendarDate: {},
color: {},
locale: {},
firstDayOfWeek: {},
double: { type: Boolean },
minDate: {},
maxDate: {},
disabledWeekly: {},
disabledDates: {},
shortcuts: { type: [Array, Boolean] },
hasTime: { type: Boolean },
shortcut: {},
disabled: { type: Boolean },
range: { type: Boolean }
},
emits: ["update:model-value", "update:calendar-date"],
setup(__props, { emit: __emit }) {
const props = __props, emits = __emit, MazPickerCalendarMonth = defineAsyncComponent(() => import("./MazPickerCalendarMonth.KrWcUnl1.js")), MazPickerCalendarSwitcher = defineAsyncComponent(() => import("./MazPickerCalendarSwitcher.DBgPZB2r.js")), MazPickerMonthSwitcher = defineAsyncComponent(() => import("./MazPickerMonthSwitcher.lK0mMr_M.js")), MazPickerShortcuts = defineAsyncComponent(() => import("./MazPickerShortcuts.CMySiKny.js")), MazPickerYearSwitcher = defineAsyncComponent(() => import("./MazPickerYearSwitcher.D3uV7QqF.js")), hoverredDay = ref(), hasShortcuts = computed(
() => props.shortcuts && props.shortcuts.length > 0 && props.range
), monthSwitcherOpen = ref(!1), yearSwitcherOpen = ref(!1), currentValue = computed({
get: () => props.modelValue,
set: (value) => emits("update:model-value", value)
}), months = computed(() => Array.from({ length: props.double ? 2 : 1 }, (_v, i) => i)), calendarDate = computed({
get: () => props.calendarDate,
set: (calendarDate2) => emits("update:calendar-date", calendarDate2)
});
return (_ctx, _cache) => (openBlock(), createElementBlock("div", _hoisted_1, [
hasShortcuts.value ? (openBlock(), createBlock(unref(MazPickerShortcuts), {
key: 0,
modelValue: currentValue.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => currentValue.value = $event),
color: _ctx.color,
shortcuts: _ctx.shortcuts,
shortcut: _ctx.shortcut,
double: _ctx.double,
disabled: _ctx.disabled
}, null, 8, ["modelValue", "color", "shortcuts", "shortcut", "double", "disabled"])) : createCommentVNode("", !0),
createElementVNode("div", {
class: normalizeClass(["maz-picker-calendar__main", { "--has-double": _ctx.double }])
}, [
createVNode(unref(MazPickerCalendarSwitcher), {
"calendar-date": calendarDate.value,
"onUpdate:calendarDate": _cache[1] || (_cache[1] = ($event) => calendarDate.value = $event),
locale: _ctx.locale,
double: _ctx.double,
onOpenMonthSwitcher: _cache[2] || (_cache[2] = ($event) => monthSwitcherOpen.value = !0),
onOpenYearSwitcher: _cache[3] || (_cache[3] = ($event) => yearSwitcherOpen.value = !0)
}, null, 8, ["calendar-date", "locale", "double"]),
createVNode(Transition, { name: "maz-picker-slide" }, {
default: withCtx(() => [
monthSwitcherOpen.value ? (openBlock(), createBlock(unref(MazPickerMonthSwitcher), {
key: 0,
"calendar-date": calendarDate.value,
"onUpdate:calendarDate": _cache[4] || (_cache[4] = ($event) => calendarDate.value = $event),
color: _ctx.color,
double: _ctx.double,
locale: _ctx.locale,
onClose: _cache[5] || (_cache[5] = ($event) => monthSwitcherOpen.value = !1)
}, null, 8, ["calendar-date", "color", "double", "locale"])) : createCommentVNode("", !0)
]),
_: 1
}),
createVNode(Transition, { name: "maz-picker-slide" }, {
default: withCtx(() => [
yearSwitcherOpen.value ? (openBlock(), createBlock(unref(MazPickerYearSwitcher), {
key: 0,
"calendar-date": calendarDate.value,
"onUpdate:calendarDate": _cache[6] || (_cache[6] = ($event) => calendarDate.value = $event),
color: _ctx.color,
locale: _ctx.locale,
onClose: _cache[7] || (_cache[7] = ($event) => yearSwitcherOpen.value = !1)
}, null, 8, ["calendar-date", "color", "locale"])) : createCommentVNode("", !0)
]),
_: 1
}),
createElementVNode("div", {
class: normalizeClass(["maz-picker-calendar__months", { "--is-range": _ctx.range }])
}, [
(openBlock(!0), createElementBlock(Fragment, null, renderList(months.value, (month) => (openBlock(), createBlock(unref(MazPickerCalendarMonth), {
key: month,
modelValue: currentValue.value,
"onUpdate:modelValue": _cache[8] || (_cache[8] = ($event) => currentValue.value = $event),
"hoverred-day": hoverredDay.value,
"onUpdate:hoverredDay": _cache[9] || (_cache[9] = ($event) => hoverredDay.value = $event),
"calendar-date": calendarDate.value,
locale: _ctx.locale,
"has-time": _ctx.hasTime,
color: _ctx.color,
"offset-month": month,
"first-day-of-week": _ctx.firstDayOfWeek,
"min-date": _ctx.minDate,
"max-date": _ctx.maxDate,
disabled: _ctx.disabled,
"disabled-weekly": _ctx.disabledWeekly,
"disabled-dates": _ctx.disabledDates,
range: _ctx.range
}, null, 8, ["modelValue", "hoverred-day", "calendar-date", "locale", "has-time", "color", "offset-month", "first-day-of-week", "min-date", "max-date", "disabled", "disabled-weekly", "disabled-dates", "range"]))), 128))
], 2)
], 2)
]));
}
}), MazPickerCalendar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9e444411"]]);
export {
MazPickerCalendar as default
};