maz-ui/dist/chunks/MazPickerContainer.DmvGYSZC.js

A standalone components library for Vue.Js 3 & Nuxt.Js 3

import { defineComponent, defineAsyncComponent, ref, computed, createElementBlock, openBlock, normalizeClass, createBlock, createCommentVNode, createElementVNode, unref } from "vue";
import dayjs from "dayjs";
import { _ as _export_sfc } from "./_plugin-vue_export-helper.B--vMWp3.js";
import '../assets/MazPickerContainer.DmHuaFqE.css';const _hoisted_1 = { class: "m-date-picker-container__wrapper" }, _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "MazPickerContainer",
  props: {
    modelValue: {},
    calendarDate: {},
    color: {},
    locale: {},
    hideHeader: { type: Boolean },
    firstDayOfWeek: {},
    double: { type: Boolean },
    hasDate: { type: Boolean },
    minDate: {},
    maxDate: {},
    inline: { type: Boolean },
    shortcuts: { type: [Array, Boolean] },
    shortcut: {},
    hasTime: { type: Boolean },
    format: {},
    isHour12: { type: Boolean },
    formatterOptions: {},
    minuteInterval: {},
    disabled: { type: Boolean },
    disabledWeekly: {},
    disabledHours: {},
    disabledDates: {},
    range: { type: Boolean }
  },
  emits: ["update:model-value", "update:calendar-date", "close"],
  setup(__props, { emit: __emit }) {
    const emits = __emit, MazPickerCalendar = defineAsyncComponent(() => import("./MazPickerCalendar.8YBwJDcX.js")), MazPickerHeader = defineAsyncComponent(() => import("./MazPickerHeader.BF3xmBsl.js")), MazPickerTime = defineAsyncComponent(() => import("./MazPickerTime.jtmY7chR.js")), lastTimeValue = ref(typeof __props.modelValue == "string" && __props.hasTime ? dayjs(__props.modelValue).format("HH:mm") : "00:00");
    function saveLastTimeValue(value) {
      lastTimeValue.value = dayjs(value).format("HH:mm"), emits("update:model-value", value);
    }
    function emitDateValue(value) {
      if (__props.hasTime) {
        const date = dayjs(value).format("YYYY-MM-DD"), time = lastTimeValue.value || "00:00", timeEmitted = dayjs(`${date} ${time}`).format(__props.format);
        emits("update:model-value", timeEmitted);
      } else
        emits("update:model-value", value);
    }
    const currentDate = computed({
      get: () => __props.modelValue,
      set: (value) => emits("update:model-value", value)
    }), currentCalendarDate = computed({
      get: () => __props.calendarDate,
      set: (calendarDate) => emits("update:calendar-date", calendarDate)
    });
    return (_ctx, _cache) => (openBlock(), createElementBlock("div", {
      class: normalizeClass(["m-date-picker-container", {
        "--has-double": _ctx.double,
        "--is-inline": _ctx.inline,
        "--has-date": _ctx.hasDate
      }])
    }, [
      _ctx.hideHeader ? createCommentVNode("", !0) : (openBlock(), createBlock(unref(MazPickerHeader), {
        key: 0,
        color: _ctx.color,
        "has-time": _ctx.hasTime,
        "model-value": _ctx.modelValue,
        locale: _ctx.locale,
        "has-date": _ctx.hasDate,
        "formatter-options": _ctx.formatterOptions,
        double: _ctx.double,
        "hide-shortcuts": !_ctx.shortcuts,
        class: "m-date-picker-container__header"
      }, null, 8, ["color", "has-time", "model-value", "locale", "has-date", "formatter-options", "double", "hide-shortcuts"])),
      createElementVNode("div", _hoisted_1, [
        _ctx.hasDate ? (openBlock(), createBlock(unref(MazPickerCalendar), {
          key: 0,
          "calendar-date": currentCalendarDate.value,
          "onUpdate:calendarDate": _cache[0] || (_cache[0] = ($event) => currentCalendarDate.value = $event),
          "model-value": currentDate.value,
          color: _ctx.color,
          locale: _ctx.locale,
          "has-time": _ctx.hasTime,
          double: _ctx.double,
          "min-date": _ctx.minDate,
          "max-date": _ctx.maxDate,
          "first-day-of-week": _ctx.firstDayOfWeek,
          disabled: _ctx.disabled,
          "disabled-weekly": _ctx.disabledWeekly,
          "disabled-dates": _ctx.disabledDates,
          shortcuts: _ctx.shortcuts,
          shortcut: _ctx.shortcut,
          range: _ctx.range,
          class: "m-date-picker-container__calendar",
          "onUpdate:modelValue": emitDateValue
        }, null, 8, ["calendar-date", "model-value", "color", "locale", "has-time", "double", "min-date", "max-date", "first-day-of-week", "disabled", "disabled-weekly", "disabled-dates", "shortcuts", "shortcut", "range"])) : createCommentVNode("", !0),
        _ctx.hasTime ? (openBlock(), createBlock(unref(MazPickerTime), {
          key: 1,
          "model-value": currentDate.value,
          color: _ctx.color,
          locale: _ctx.locale,
          "min-date": _ctx.minDate,
          "max-date": _ctx.maxDate,
          "has-date": _ctx.hasDate,
          format: _ctx.format,
          disabled: _ctx.disabled,
          "disabled-hours": _ctx.disabledHours,
          "minute-interval": _ctx.minuteInterval,
          "formatter-options": _ctx.formatterOptions,
          "is-hour12": _ctx.isHour12,
          class: "m-date-picker-container__time",
          "onUpdate:modelValue": saveLastTimeValue
        }, null, 8, ["model-value", "color", "locale", "min-date", "max-date", "has-date", "format", "disabled", "disabled-hours", "minute-interval", "formatter-options", "is-hour12"])) : createCommentVNode("", !0)
      ])
    ], 2));
  }
}), MazPickerContainer = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-69e91845"]]);
export {
  MazPickerContainer as default
};