@opentiny/vue-renderless/month-range/vue.js

An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.

import "../chunk-G2ADBYYC.js";
import {
  resetView,
  isValidValue,
  handleConfirm,
  rightPrevYear,
  leftNextYear,
  rightNextYear,
  leftPrevYear,
  handleClear,
  watchValue,
  watchDefaultValue,
  handleChangeRange,
  handleRangePick,
  handleShortcutClick,
  doPick,
  watchModelValue
} from "./index";
import { nextYear } from "@opentiny/utils";
const api = [
  "state",
  "rightNextYear",
  "rightPrevYear",
  "handleRangePick",
  "handleShortcutClick",
  "handleChangeRange",
  "leftPrevYear",
  "leftNextYear",
  "isValidValue",
  "watchModelValue"
];
const initState = ({ reactive, computed, api: api2, props, t }) => {
  const state = reactive({
    popperClass: props.popperClass || "",
    value: props.modelValue || [],
    defaultValue: null,
    defaultTime: null,
    minDate: "",
    maxDate: "",
    leftDate: /* @__PURE__ */ new Date(),
    rightDate: nextYear(/* @__PURE__ */ new Date()),
    rangeState: { endDate: null, selecting: false, row: null, column: null },
    shortcuts: props.shortcuts || [],
    visible: "",
    disabledDate: props.disabledDate || null,
    format: props.format || "",
    arrowControl: false,
    unlinkPanels: props.unlinkPanels || false,
    btnDisabled: computed(
      () => !(state.minDate && state.maxDate && !state.selecting && api2.isValidValue([state.minDate, state.maxDate]))
    ),
    leftLabel: computed(() => state.leftDate.getFullYear() + " " + t("ui.datepicker.year")),
    rightLabel: computed(() => state.rightDate.getFullYear() + " " + t("ui.datepicker.year")),
    leftYear: computed(() => state.leftDate.getFullYear()),
    rightYear: computed(
      () => state.rightDate.getFullYear() === state.leftDate.getFullYear() ? state.leftDate.getFullYear() + 1 : state.rightDate.getFullYear()
    ),
    enableYearArrow: computed(() => state.unlinkPanels && state.rightYear > state.leftYear + 1)
  });
  return state;
};
const renderless = (props, { computed, reactive, watch }, { t, emit: $emit }) => {
  const api2 = {};
  const emit = props.emitter ? props.emitter.emit : $emit;
  const state = initState({ reactive, computed, api: api2, props, t });
  Object.assign(api2, {
    state,
    resetView: resetView(state),
    handleChangeRange: handleChangeRange(state, props),
    isValidValue: isValidValue(state),
    leftNextYear: leftNextYear(state),
    leftPrevYear: leftPrevYear(state),
    doPick: doPick(emit),
    rightNextYear: rightNextYear(state),
    rightPrevYear: rightPrevYear(state),
    watchValue: watchValue({ state }),
    handleClear: handleClear({ emit, state }),
    watchDefaultValue: watchDefaultValue({ state }),
    handleConfirm: handleConfirm({ api: api2, emit, state, props, t }),
    handleRangePick: handleRangePick({ api: api2, state, props, t }),
    handleShortcutClick: handleShortcutClick(state, api2, props),
    watchModelValue: watchModelValue({ state, api: api2 })
  });
  watch(() => props.modelValue, api2.watchModelValue, { immediate: true });
  watch(() => state.value, api2.watchValue);
  watch(() => state.defaultValue, api2.watchDefaultValue);
  return api2;
};
export {
  api,
  renderless
};