vuestic-ui
Version:
Vue 3 UI Framework
81 lines (80 loc) • 2.48 kB
JavaScript
import { ref, computed, watch } from "vue";
import { d as isDatesMonthEqual, e as isDatesDayEqual, f as isDatesYearEqual, b as isSingleDate, a as isDates, i as isRange } from "../utils/date-utils.mjs";
import { u as useDatePickerModelValue } from "./model-value-helper.mjs";
const getDateEqualFunction = (type) => {
return {
month: isDatesMonthEqual,
day: isDatesDayEqual,
year: isDatesYearEqual
}[type];
};
const useDatePicker = (type, dates, props, emit) => {
const datesEqual = getDateEqualFunction(type);
const isAllowedDate = props.allowedDays || props.allowedMonths || props.allowedYears;
const isDateDisabled = (date) => isAllowedDate === void 0 ? false : !isAllowedDate(date);
const hoveredIndex = ref(-1);
const hoveredValue = computed(() => dates.value[hoveredIndex.value]);
const { updateModelValue } = useDatePickerModelValue(
props,
emit,
datesEqual
);
const onClick = (date) => {
if (props.readonly || isDateDisabled(date)) {
return;
}
updateModelValue(date);
emit(`click:${type}`, date);
};
const isToday = (date) => {
const today = /* @__PURE__ */ new Date();
return datesEqual(today, date);
};
const isSelected = (date) => {
if (!props.modelValue) {
return false;
}
if (isSingleDate(props.modelValue)) {
return datesEqual(props.modelValue, date);
} else if (isDates(props.modelValue)) {
return !!props.modelValue.find((d) => datesEqual(d, date));
} else if (isRange(props.modelValue)) {
return datesEqual(props.modelValue.start, date) || datesEqual(props.modelValue.end, date);
}
return false;
};
const isInRange = (date) => {
if (!props.modelValue) {
return false;
}
if (!isRange(props.modelValue)) {
return false;
}
if (props.modelValue.start && props.modelValue.end) {
return props.modelValue.start < date && props.modelValue.end > date;
}
const selectedDate = props.modelValue.start || props.modelValue.end;
if (selectedDate) {
if (!hoveredValue.value) {
return false;
}
return selectedDate < date ? hoveredValue.value >= date : hoveredValue.value <= date;
}
return false;
};
watch(hoveredValue, (date) => {
emit(`hover:${type}`, date);
});
return {
hoveredIndex,
hoveredValue,
onClick,
isToday,
isSelected,
isInRange
};
};
export {
useDatePicker as u
};
//# sourceMappingURL=use-picker.mjs.map