@extclp/vexip-ui
Version:
A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good
884 lines (883 loc) • 32.4 kB
JavaScript
import { defineComponent as Gt, useSlots as Jt, toRef as Qe, ref as y, computed as c, watch as g, reactive as ke, nextTick as ne, openBlock as M, createElementBlock as F, unref as r, normalizeClass as $, createElementVNode as $e, withKeys as Ge, withModifiers as re, normalizeStyle as Je, renderSlot as w, createVNode as m, withCtx as x, createCommentVNode as le, Fragment as Xt, mergeProps as oe, Transition as Zt, createSlots as _t, normalizeProps as Y, guardReactiveProps as W } from "vue";
import "../icon/index.mjs";
import "../popper/index.mjs";
import "../renderer/index.mjs";
import "../form/index.mjs";
import "./date-control.vue.mjs";
import "./date-panel.vue.mjs";
import { useNameHelper as ea, useProps as ta, createSizeProp as aa, createStateProp as na, createIconProp as xe, useLocale as Xe, useIcons as ra, useWordSpace as la, makeSentence as Ze, emitEvent as p } from "@vexip-ui/config";
import { placementWhileList as oa, useSetTimeout as sa, useClickOutside as ia, usePopper as ua, useHover as da } from "@vexip-ui/hooks";
import { toFalse as ca, mergeObjects as _e, isObject as fa, doubleDigits as ma, startOfMonth as pa, differenceDays as se, getTime as ie, toDate as va, format as ba, boundRange as ue, isLeapYear as ha, toAttrValue as et } from "@vexip-ui/utils";
import { datePickerProps as ya } from "./props.mjs";
import { useTimeBound as tt, useColumn as ga } from "./helper.mjs";
import { datePickerTypes as Ca, invalidDate as at } from "./symbol.mjs";
import { useFieldStore as Da } from "../form/helper.mjs";
import A from "../renderer/renderer.mjs";
import q from "../icon/icon.mjs";
import nt from "./date-control.vue2.mjs";
import Va from "../popper/popper.vue.mjs";
import ka from "./date-panel.vue2.mjs";
const $a = ["id", "aria-disabled", "aria-expanded", "aria-labelledby"], xa = ["onKeydown"], Ta = ["aria-label"], Ka = /* @__PURE__ */ Gt({
name: "DatePicker",
__name: "date-picker",
props: ya,
emits: ["update:value", "update:formatted-value", "update:visible"],
setup(rt, { expose: lt, emit: ot }) {
const {
idFor: Te,
labelId: K,
state: st,
disabled: it,
loading: ut,
size: dt,
validateField: ct,
clearField: ft,
getFieldValue: mt,
setFieldValue: pt
} = Da(() => {
var e;
return (e = P.value) == null ? void 0 : e.focus();
}), u = ea("date-picker"), t = ta("datePicker", rt, {
size: aa(dt),
state: na(st),
locale: null,
type: {
default: "date",
validator: (e) => Ca.includes(e)
},
visible: !1,
placement: {
default: "bottom-start",
validator: (e) => oa.includes(e)
},
transfer: !1,
value: {
default: () => mt(),
static: !0
},
format: "yMd Hms",
valueFormat: null,
filler: {
default: "-",
validator: (e) => e.length === 1
},
clearable: !1,
noAction: !1,
labels: () => ({}),
dateSeparator: "/",
timeSeparator: ":",
shortcuts: () => [],
disabledDate: {
default: ca,
isFunc: !0
},
steps: () => [1, 1, 1],
ctrlSteps: () => [5, 5, 5],
prefix: xe(),
prefixColor: "",
suffix: xe(),
suffixColor: "",
noSuffix: !1,
disabled: () => it.value,
transitionName: () => u.ns("drop"),
confirmText: null,
cancelText: null,
today: {
default: () => /* @__PURE__ */ new Date(),
validator: (e) => !Number.isNaN(new Date(e))
},
range: null,
loading: () => ut.value,
loadingIcon: xe(),
loadingLock: !1,
loadingEffect: null,
min: null,
max: null,
outsideClose: !0,
outsideCancel: !1,
placeholder: null,
unitReadonly: !1,
weekStart: null,
popperAlive: null,
shortcutsPlacement: "left",
slots: () => ({})
}), O = ot, vt = Jt(), bt = Xe("calendar"), ht = Xe("datePicker"), N = ra(), Se = la(), yt = Qe(t, "placement"), gt = Qe(t, "transfer"), v = y(t.visible), S = y(!1), s = Oe(), d = Oe(), b = y("start"), I = y(""), C = y(), we = y(/* @__PURE__ */ new Date()), L = y(!1), de = y([]), { timer: Ae } = sa(), B = ia(Kt), ce = y(), { reference: P, transferTo: Ne, updatePopper: Pe } = ua({
placement: yt,
transfer: gt,
wrapper: B,
popper: c(() => {
var e;
return (e = ce.value) == null ? void 0 : e.wrapper;
}),
isDrop: !0
}), { isHover: Me } = da(P), fe = y(), me = y(), Q = y(), G = c(() => {
const e = _e(bt.value, ht.value, !0);
return fa(t.locale) ? _e(e, t.locale) : e;
}), Ct = c(() => {
if (t.placeholder)
return Array.isArray(t.placeholder) ? t.placeholder[0] : t.placeholder;
const { select: e, start: a, [t.type]: n } = G.value.placeholder;
return Ze(t.range ? `${a} ${n}` : `${e} ${n}`, Se.value);
}), Dt = c(() => {
if (t.placeholder)
return Array.isArray(t.placeholder) ? t.placeholder[1] || t.placeholder[0] : t.placeholder;
const { end: e, [t.type]: a } = G.value.placeholder;
return Ze(`${e} ${a}`, Se.value);
}), Vt = c(() => [
u.b(),
u.ns("input-vars"),
u.bs("vars"),
u.bm(t.type),
{
[u.bm("inherit")]: t.inherit,
[u.bm("disabled")]: t.disabled,
[u.bm(t.size)]: t.size !== "default",
[u.bm("no-hour")]: !s.enabled.hour,
[u.bm("no-minute")]: !s.enabled.minute,
[u.bm("no-second")]: !s.enabled.second,
[u.bm("visible")]: v.value,
[u.bm(t.state)]: t.state !== "default",
[u.bm("is-range")]: t.range
}
]), j = c(() => t.loading && t.loadingLock), kt = c(() => {
const e = u.be("selector");
return {
[e]: !0,
[`${e}--disabled`]: t.disabled,
[`${e}--readonly`]: j.value,
[`${e}--loading`]: t.loading,
[`${e}--${t.size}`]: t.size !== "default",
[`${e}--focused`]: S.value,
[`${e}--${t.state}`]: t.state !== "default"
};
}), $t = c(() => !!(vt.prefix || t.prefix)), E = c(() => {
const e = [s, d].map((a) => {
const n = Object.values(a.dateValue).map(ma);
return `${n.slice(0, 3).join("-")} ${n.slice(3).join(":")}`;
});
return t.range ? e : e[0];
}), pe = c(() => {
if (!C.value) return !1;
const [e, a, n] = C.value, l = (/* @__PURE__ */ new Date(`${e}-${a}-${n}`)).getTime(), o = we.value.getTime();
return l < o;
}), Fe = c(() => !t.disabled && !j.value && t.clearable && Me.value && !!I.value), J = c(() => {
if (t.min) {
const e = be(t.min, at);
return Number.isNaN(+e) ? -1 / 0 : (e.setHours(0, 0, 0, 0), e.getTime());
}
return -1 / 0;
}), X = c(() => {
if (t.max) {
let e = be(t.max, at);
return Number.isNaN(+e) ? 1 / 0 : (t.type !== "datetime" && (e.setHours(23, 59, 59, 999), t.type === "year" ? (e.setMonth(11), e.setDate(31)) : t.type === "month" && (e.setMonth(e.getMonth() + 1), e = pa(e), e.setDate(e.getDate() - 1))), e.getTime());
}
return 1 / 0;
}), xt = c(() => Number.isNaN(J.value) || Number.isNaN(X.value) ? !1 : J.value > X.value), Tt = c(() => t.type === "datetime" && t.min && !se(t.min, s.getDate()) ? ie(t.min) : ""), St = c(() => t.type === "datetime" && t.max && !se(t.max, s.getDate()) ? ie(t.max) : ""), wt = c(() => t.type === "datetime" && t.range && t.min && !se(t.min, s.getDate()) ? ie(t.min) : ""), At = c(() => t.type === "datetime" && t.range && t.max && !se(t.max, s.getDate()) ? ie(t.max) : ""), Ie = c(() => {
if (!t.range) return !1;
const e = s.dateValue, a = d.dateValue;
let n;
t.type === "year" ? n = ["year"] : t.type === "month" ? n = ["year", "month"] : t.type === "date" ? n = ["year", "month", "date"] : n = ["year", "month", "date", "hour", "minute", "second"];
for (const l of n) {
if (e[l] < a[l]) return !1;
if (e[l] > a[l]) return !0;
}
return !1;
}), Ee = tt(Tt, St), Re = tt(wt, At), Nt = c(() => b.value === "start" ? Ee.isTimeDisabled : Re.isTimeDisabled), Z = c(() => {
const { hour: e, minute: a, second: n } = s.dateValue, { isTimeDisabled: l } = Ee;
return Ie.value || ge(s.getDate()) || l.hour(e) || l.minute(e, a) || l.second(e, a, n);
}), _ = c(() => {
if (!t.range) return !1;
const { hour: e, minute: a, second: n } = d.dateValue, { isTimeDisabled: l } = Re;
return Ie.value || ge(d.getDate()) || l.hour(e) || l.minute(e, a) || l.second(e, a, n);
}), ve = c(() => t.type !== "datetime" && t.noAction);
g(() => t.type, Le), g(
() => t.value,
(e) => {
z(e), I.value = (Array.isArray(e) ? e[0] || e[1] : e) ? ye() : "";
},
{ immediate: !0 }
), g(
() => t.type,
(e) => {
const a = e !== "year", n = a && e !== "month";
s.enabled.year = !0, d.enabled.year = !0, s.enabled.month = a, d.enabled.month = a, s.enabled.date = n, d.enabled.date = n;
},
{ immediate: !0 }
), g(() => t.format, Le, { immediate: !0 }), g(
() => t.visible,
(e) => {
v.value = e;
}
), g(v, (e) => {
e && Pe();
}), g(S, (e) => {
e ? p(t.onFocus) : p(t.onBlur);
}), g(b, (e) => {
!t.unitReadonly && v.value && p(t.onChangeCol, D().column, e);
}), g(
() => s.column,
(e) => {
!t.unitReadonly && v.value && b.value === "start" && p(t.onChangeCol, e, "start");
}
), g(
() => d.column,
(e) => {
!t.unitReadonly && v.value && b.value === "end" && p(t.onChangeCol, e, "end");
}
), g(
() => t.disabled,
(e) => {
e && (ee(!1), te());
}
), g(j, (e) => {
e && ee(!1);
}), lt({
idFor: Te,
currentVisible: v,
focused: S,
isHover: Me,
startState: s,
endState: d,
currentState: b,
startError: Z,
endError: _,
wrapper: B,
reference: P,
popper: ce,
start: fe,
end: me,
panel: Q,
updatePopper: Pe,
focus: (e) => {
var a;
return (a = P.value) == null ? void 0 : a.focus(e);
},
blur: () => {
var e;
return (e = P.value) == null ? void 0 : e.blur();
}
});
function Oe() {
const { currentColumn: e, enabled: a, resetColumn: n, enterColumn: l } = ga([
"year",
"month",
"date",
"hour",
"minute",
"second"
]), o = ke({
year: 1970,
month: 1,
// 1 ~ 12
date: 1,
hour: 0,
minute: 0,
second: 0
}), i = ke({
year: !1,
month: !1,
date: !1,
hour: !1,
minute: !1,
second: !1
});
let h = { ...o }, f = { ...i };
return ke({
column: e,
enabled: a,
activated: i,
dateValue: o,
resetColumn: n,
enterColumn: l,
setDate: (V, k = !0) => {
o.year = V.getFullYear(), o.month = V.getMonth() + 1, o.date = V.getDate(), k && (o.hour = V.getHours(), o.minute = V.getMinutes(), o.second = V.getSeconds());
},
getDate: () => new Date(
o.year,
o.month - 1,
o.date,
o.hour,
o.minute,
o.second
),
record() {
h = { ...o }, f = { ...i };
},
restore() {
Object.assign(o, h), Object.assign(i, f);
}
});
}
function D() {
return b.value === "start" ? s : d;
}
function be(e, a = new Date(t.today)) {
let n = va(e);
return Number.isNaN(n.getTime()) && (n = a), n;
}
function z(e) {
Array.isArray(e) || (e = [e, e]);
for (let a = 0; a < 2; ++a) {
const n = be(e[a] ?? "");
if ((a === 0 ? s : d).setDate(n), he(!!e[a], a === 0 ? "start" : "end"), !t.range) break;
}
}
function Pt() {
const e = /* @__PURE__ */ new Set();
let a = !1;
for (let n = 0, l = t.format.length; n < l; ++n) {
const o = t.format.charAt(n);
if (o === "'")
a = !a;
else if (!a)
switch (o) {
case "y":
e.add("year");
break;
case "M":
e.add("month");
break;
case "d":
e.add("date");
break;
}
}
de.value = [...e];
}
function Mt() {
const e = t.type === "datetime";
[s, d].forEach((a) => {
if (a.enabled.hour = !1, a.enabled.minute = !1, a.enabled.second = !1, e && t.format) {
let n = !1;
for (let l = 0, o = t.format.length; l < o; ++l) {
const i = t.format.charAt(l);
if (i === "'")
n = !n;
else if (!n)
switch (i) {
case "H":
a.enabled.hour = !0;
break;
case "m":
a.enabled.minute = !0;
break;
case "s":
a.enabled.second = !0;
break;
}
}
}
});
}
function Le() {
Pt(), Mt();
}
function he(e, a) {
(a ? a === "start" ? [s] : [d] : [s, d]).forEach((l) => {
Object.keys(l.activated).forEach((o) => {
l.activated[o] = e;
});
});
}
function ye() {
return Array.isArray(E.value) ? E.value.join("|") : E.value;
}
function ge(e) {
if (typeof t.disabledDate == "function" && t.disabledDate(e))
return !0;
const a = e.getTime();
if (xt.value) {
if (a > X.value && a < J.value)
return !0;
} else if (a < J.value || a > X.value)
return !0;
return !1;
}
function Ft() {
(Z.value || t.range && _.value) && z(t.value);
}
function ee(e) {
v.value !== e && (v.value = e, O("update:visible", e), p(t.onToggle, e));
}
function It() {
if (Ft(), I.value !== ye()) {
I.value = ye();
const e = Array.isArray(E.value) ? E.value : [E.value], a = [], n = [], l = t.valueFormat, o = typeof l == "function" ? l : l ? (f, V) => ba(
f,
Array.isArray(l) ? V === "start" ? l[0] : l[1] : l
) : (f) => f;
for (let f = 0; f < 2 && (t.type === "year" ? a[f] = new Date(
f === 0 ? s.dateValue.year : d.dateValue.year,
0
).getTime() : t.type !== "datetime" ? a[f] = (/* @__PURE__ */ new Date(e[f].split(" ")[0] + " 00:00:00")).getTime() : a[f] = new Date(e[f]).getTime(), n[f] = o(a[f], f === 0 ? "start" : "end"), !!t.range); ++f)
;
const i = t.range ? a : a[0], h = t.range ? n : n[0];
he(!0), O("update:value", i), O("update:formatted-value", h), pt(i), p(t.onChange, i), ct();
}
}
function H(e = !0) {
ee(!1), e && It(), s.resetColumn(), d.resetColumn();
}
function Be(e) {
const a = D().dateValue;
switch (e) {
case "year": {
a.year = ue(a.year, 1970, 9999);
break;
}
case "month": {
a.month = ue(a.month, 1, 12);
break;
}
case "date": {
const n = a.month;
let l;
n < 7 ? n !== 2 ? l = 30 + n % 2 : ha(a.year) ? l = 29 : l = 28 : l = 31 - n % 2, a.date = ue(a.date, 1, l);
break;
}
case "hour":
case "minute":
case "second":
a[e] = ue(a[e], 0, e === "hour" ? 23 : 59), a[e] = Math.round(a[e] / Ve(e)) * Ve(e);
}
}
function je() {
t.disabled || (S.value = !0, Ae.focus = setTimeout(() => {
var e, a;
S.value && (b.value === "start" ? (e = fe.value) == null || e.focus() : (a = me.value) == null || a.focus());
}, 120));
}
function te() {
var e, a;
clearTimeout(Ae.focus), S.value = !1, (e = fe.value) == null || e.blur(), (a = me.value) == null || a.blur();
}
function ze(e) {
if (t.disabled || j.value) return;
const a = e.target;
if (ee(!0), B.value && a) {
const n = Array.from(B.value.querySelectorAll(`.${u.be("unit")}`)), l = n.findIndex((o) => o === a || o.contains(a));
~l || (s.column = null, d.column = null), t.range && l >= n.length / 2 ? R("end") : R("start");
}
je();
}
function He(e) {
const a = D(), n = a.column;
n && (Et(n, e), (n === "year" ? a.dateValue.year >= 1e3 : a.dateValue[n] >= 10) && a.enterColumn("next", !1));
}
function Et(e, a) {
const n = D(), l = n.dateValue[e];
n.activated[e] && l > 0 && l < (e === "year" ? 1e3 : 10) ? n.dateValue[e] = l * 10 + a : (n.dateValue[e] = a, Rt(e)), e !== "year" && Be(e), p(t.onInput, e, n.dateValue[e]);
}
function Rt(e) {
const a = D().activated;
e === "date" ? (a.year = !0, a.month = !0) : e === "month" ? a.year = !0 : e === "minute" ? a.hour = !0 : e === "second" && (a.hour = !0, a.minute = !0), a[e] = !0;
}
function Ue(e) {
D().column = e;
}
function Ot(e) {
return ["hour", "minute", "second"].includes(e);
}
function Ye(e, a) {
var h;
const n = e === "plus", l = n ? 1 : -1, o = D(), i = o.column;
i && o.enabled[i] && (Ot(i) ? o.dateValue[i] += l * (a ? jt(i) : Ve(i)) : (a ? i === "year" ? o.dateValue.year += l * 10 : o.dateValue[i === "date" ? "month" : "year"] += l : o.dateValue[i] += l, Lt(), T(i)), Be(i), p(t[n ? "onPlus" : "onMinus"], i, o.dateValue[i]), (h = Q.value) == null || h.refreshCalendar(b.value));
}
function We(e) {
Ye("plus", e);
}
function qe(e) {
Ye("minus", e);
}
function Lt() {
const e = D().dateValue, a = new Date(e.year, e.month - 1, e.date);
e.year = a.getFullYear(), e.month = a.getMonth() + 1, e.date = a.getDate();
}
function Ce() {
requestAnimationFrame(() => {
var e;
te(), (e = P.value) == null || e.focus();
});
}
function U() {
Ce(), H(), p(t.onEnter);
}
function De() {
Ce(), z(I.value.split("|")), H(!1), p(t.onCancel);
}
function Ke(e = !0) {
t.disabled || j.value || t.clearable && ne(() => {
const a = t.range ? [] : null;
z(null), e && H(!1), O("update:value", a), O("update:formatted-value", t.range ? [] : null), p(t.onChange, a), p(t.onClear), ft(a), e && te(), I.value = "", ne(() => {
he(!1);
});
});
}
function Bt(e, a) {
Ce(), z(a), p(t.onShortcut, e, a), H();
}
function Ve(e) {
return t.steps[e === "hour" ? 0 : e === "minute" ? 1 : 2] || 1;
}
function jt(e) {
return t.ctrlSteps[e === "hour" ? 0 : e === "minute" ? 1 : 2] || 1;
}
function zt(e) {
if (t.range && e && (we.value = e, C.value)) {
const a = [e.getFullYear(), e.getMonth() + 1, e.getDate()], n = pe.value ? C.value : a, l = pe.value ? a : C.value;
let o;
t.type === "year" ? o = ["year"] : t.type === "month" ? o = ["year", "month"] : o = ["year", "month", "date"];
for (let i = 0, h = o.length; i < h; ++i)
s.dateValue[o[i]] = n[i], d.dateValue[o[i]] = l[i];
}
}
function Ht(e) {
let a;
if (t.type === "year" ? a = ["year"] : t.type === "month" ? a = ["year", "month"] : a = ["year", "month", "date"], !t.range) {
for (let n = 0, l = a.length; n < l; ++n)
s.dateValue[a[n]] = e[n], T(a[n], "start");
ve.value && U();
return;
}
if (C.value) {
const [n, l, o] = C.value, i = (/* @__PURE__ */ new Date(`${n}-${l}-${o}`)).getTime(), h = (/* @__PURE__ */ new Date(`${e[0]}-${e[1]}-${e[2]}`)).getTime(), f = i < h ? C.value : e, V = i < h ? e : C.value;
for (let k = 0, Qt = a.length; k < Qt; ++k)
s.dateValue[a[k]] = f[k], d.dateValue[a[k]] = V[k], T(a[k], "start"), T(a[k], "end");
Yt(), C.value = void 0, ve.value && U();
} else {
C.value = e;
for (let n = 0, l = a.length; n < l; ++n)
s.dateValue[a[n]] = e[n], d.dateValue[a[n]] = e[n], T(a[n], "start"), T(a[n], "end");
}
}
function Ut(e, a, n) {
const l = e === "start" ? s : d;
l.dateValue[a] = n, T("hour", e), T("minute", e), T("second", e);
}
function T(e, a) {
const n = a ? a === "start" ? s : d : D();
e === "month" ? n.activated.year = !0 : e === "date" && (n.activated.year = !0, n.activated.month = !0), n.activated[e] = !0;
}
function Yt() {
if (!t.range) return;
const e = s.getDate(), a = d.getDate();
e.getTime() > a.getTime() && (s.setDate(a), d.setDate(e));
}
function R(e) {
b.value = e;
}
function ae(e) {
if (t.range) {
e === "prev" && b.value === "start" && !s.column && R("end");
const a = D(), n = a.column;
if (a.enterColumn(e, !n), n === a.column) {
const l = b.value === "start";
(l ? d : s).resetColumn(e === "prev" ? "second" : "year", e === "prev"), R(l ? "end" : "start");
}
} else
s.enterColumn(e);
}
function Wt(e) {
R("start"), Ue(e), ne(() => {
var a;
(a = Q.value) == null || a.refreshCalendar("start");
});
}
function qt(e) {
R("end"), Ue(e), ne(() => {
var a;
(a = Q.value) == null || a.refreshCalendar("end");
});
}
function Kt() {
p(t.onClickOutside), t.outsideClose && v.value && (H(!ve.value && !t.outsideCancel), te(), p(t.onOutsideClose));
}
return (e, a) => (M(), F("div", {
id: r(Te),
ref_key: "wrapper",
ref: B,
class: $(Vt.value),
role: "group",
"aria-disabled": r(et)(r(t).disabled),
"aria-expanded": r(et)(v.value),
"aria-haspopup": "dialog",
"aria-labelledby": r(K),
onClick: ze
}, [
$e("div", {
ref_key: "reference",
ref: P,
class: $(kt.value),
tabindex: "0",
onKeydown: [
Ge(re(ze, ["prevent"]), ["space"]),
a[7] || (a[7] = Ge(re((n) => Ke(!1), ["prevent"]), ["backspace"]))
]
}, [
$t.value ? (M(), F("div", {
key: 0,
class: $([r(u).be("icon"), r(u).be("prefix")]),
style: Je({ color: r(t).prefixColor })
}, [
w(e.$slots, "prefix", {}, () => [
m(r(A), {
renderer: r(t).slots.prefix
}, {
default: x(() => [
m(r(q), {
icon: r(t).prefix
}, null, 8, ["icon"])
]),
_: 1
}, 8, ["renderer"])
])
], 6)) : le("", !0),
$e("div", {
class: $(r(u).be("control"))
}, [
m(nt, {
ref: "start",
"unit-type": b.value === "start" ? r(s).column : "",
enabled: r(s).enabled,
activated: r(s).activated,
"date-value": r(s).dateValue,
steps: r(t).steps,
"ctrl-steps": r(t).ctrlSteps,
focused: S.value,
visible: v.value,
"date-separator": r(t).dateSeparator,
"time-separator": r(t).timeSeparator,
filler: r(t).filler,
labels: r(t).labels,
"has-error": Z.value,
placeholder: Ct.value,
readonly: r(t).unitReadonly,
"labeled-by": r(K),
"date-unit-order": de.value,
onInput: He,
onPlus: We,
onMinus: qe,
onEnter: U,
onCancel: De,
onUnitFocus: Wt,
onPrevUnit: a[0] || (a[0] = (n) => ae("prev")),
onNextUnit: a[1] || (a[1] = (n) => ae("next")),
onBlur: a[2] || (a[2] = (n) => r(s).column = null)
}, null, 8, ["unit-type", "enabled", "activated", "date-value", "steps", "ctrl-steps", "focused", "visible", "date-separator", "time-separator", "filler", "labels", "has-error", "placeholder", "readonly", "labeled-by", "date-unit-order"]),
r(t).range ? (M(), F(Xt, { key: 0 }, [
$e("div", {
class: $(r(u).be("exchange"))
}, [
w(e.$slots, "exchange", {}, () => [
m(r(A), {
renderer: r(t).slots.exchange
}, {
default: x(() => [
m(r(q), oe(r(N).exchange, { style: { "padding-top": "1px" } }), null, 16)
]),
_: 1
}, 8, ["renderer"])
])
], 2),
m(nt, {
ref: "end",
"unit-type": b.value === "end" ? r(d).column : "",
enabled: r(d).enabled,
activated: r(d).activated,
"date-value": r(d).dateValue,
steps: r(t).steps,
"ctrl-steps": r(t).ctrlSteps,
focused: S.value,
visible: v.value,
"date-separator": r(t).dateSeparator,
"time-separator": r(t).timeSeparator,
filler: r(t).filler,
labels: r(t).labels,
"has-error": _.value,
placeholder: Dt.value,
readonly: r(t).unitReadonly,
"labeled-by": r(K),
"date-unit-order": de.value,
onInput: He,
onPlus: We,
onMinus: qe,
onEnter: U,
onCancel: De,
onUnitFocus: qt,
onPrevUnit: a[3] || (a[3] = (n) => ae("prev")),
onNextUnit: a[4] || (a[4] = (n) => ae("next")),
onBlur: a[5] || (a[5] = (n) => r(d).column = null)
}, null, 8, ["unit-type", "enabled", "activated", "date-value", "steps", "ctrl-steps", "focused", "visible", "date-separator", "time-separator", "filler", "labels", "has-error", "placeholder", "readonly", "labeled-by", "date-unit-order"])
], 64)) : le("", !0)
], 2),
r(t).noSuffix ? r(t).clearable || r(t).loading ? (M(), F("div", {
key: 2,
class: $([r(u).be("icon"), r(u).bem("icon", "placeholder"), r(u).be("suffix")])
}, null, 2)) : le("", !0) : (M(), F("div", {
key: 1,
class: $([r(u).be("icon"), r(u).be("suffix")]),
style: Je({
color: r(t).suffixColor,
opacity: Fe.value || r(t).loading ? "0%" : ""
})
}, [
w(e.$slots, "suffix", {}, () => [
m(r(A), {
renderer: r(t).slots.suffix
}, {
default: x(() => [
m(r(q), oe(r(N).calendar, {
icon: r(t).suffix || r(N).calendar.icon
}), null, 16, ["icon"])
]),
_: 1
}, 8, ["renderer"])
])
], 6)),
m(Zt, {
name: r(u).ns("fade"),
appear: ""
}, {
default: x(() => [
Fe.value ? (M(), F("button", {
key: 0,
class: $([r(u).be("icon"), r(u).be("clear")]),
type: "button",
tabindex: "-1",
"aria-label": G.value.ariaLabel.clear,
onClick: a[6] || (a[6] = re((n) => Ke(), ["stop"]))
}, [
m(r(q), oe(r(N).clear, { label: "clear" }), null, 16)
], 10, Ta)) : r(t).loading ? (M(), F("div", {
key: 1,
class: $([r(u).be("icon"), r(u).be("loading")])
}, [
m(r(q), oe(r(N).loading, {
effect: r(t).loadingEffect || r(N).loading.effect,
icon: r(t).loadingIcon || r(N).loading.icon,
label: "loading"
}), null, 16, ["effect", "icon"])
], 2)) : le("", !0)
]),
_: 1
}, 8, ["name"])
], 42, xa),
m(r(Va), {
ref_key: "popper",
ref: ce,
class: $([r(u).be("popper"), r(u).ns("calendar-vars"), r(u).ns("time-picker-vars"), r(u).bs("vars")]),
visible: v.value,
to: r(Ne),
transition: r(t).transitionName,
alive: r(t).popperAlive ?? !r(Ne),
onClick: re(je, ["stop"]),
onBeforeEnter: a[8] || (a[8] = (n) => L.value = !0),
onBeforeLeave: a[9] || (a[9] = (n) => L.value = !0),
onAfterEnter: a[10] || (a[10] = (n) => L.value = !1),
onAfterLeave: a[11] || (a[11] = (n) => L.value = !1)
}, {
default: x(() => [
m(ka, {
ref: "panel",
type: r(t).type,
"start-value": r(s).dateValue,
"end-value": r(d).dateValue,
"start-activated": r(s).activated,
"end-activated": r(d).activated,
"value-type": b.value,
shortcuts: r(t).shortcuts,
"confirm-text": r(t).confirmText,
"cancel-text": r(t).cancelText,
today: r(t).today,
"no-action": r(t).noAction,
steps: r(t).steps,
range: r(t).range,
min: r(t).min,
max: r(t).max,
"disabled-date": ge,
"disabled-time": Nt.value,
"has-error": Z.value || _.value,
"selecting-type": pe.value ? "end" : "start",
locale: G.value,
"week-start": r(t).weekStart,
"static-wheel": L.value,
"shortcuts-placement": r(t).shortcutsPlacement,
"labeled-by": r(K),
onShortcut: Bt,
onChange: Ht,
onConfirm: U,
onCancel: De,
onHover: zt,
onTimeChange: Ut
}, _t({ _: 2 }, [
e.$slots.panelTitle || r(t).slots.panelTitle ? {
name: "title",
fn: x((n) => [
w(e.$slots, "panelTitle", Y(W(n)), () => [
m(r(A), {
renderer: r(t).slots.panelTitle,
data: n
}, null, 8, ["renderer", "data"])
])
]),
key: "0"
} : void 0,
e.$slots.panelYear || r(t).slots.panelYear ? {
name: "year",
fn: x((n) => [
w(e.$slots, "panelYear", Y(W(n)), () => [
m(r(A), {
renderer: r(t).slots.panelYear,
data: n
}, null, 8, ["renderer", "data"])
])
]),
key: "1"
} : void 0,
e.$slots.panelMonth || r(t).slots.panelMonth ? {
name: "month",
fn: x((n) => [
w(e.$slots, "panelMonth", Y(W(n)), () => [
m(r(A), {
renderer: r(t).slots.panelMonth,
data: n
}, null, 8, ["renderer", "data"])
])
]),
key: "2"
} : void 0,
e.$slots.panelWeek || r(t).slots.panelWeek ? {
name: "week",
fn: x((n) => [
w(e.$slots, "panelWeek", Y(W(n)), () => [
m(r(A), {
renderer: r(t).slots.panelWeek,
data: n
}, null, 8, ["renderer", "data"])
])
]),
key: "3"
} : void 0,
e.$slots.panelDate || r(t).slots.panelDate ? {
name: "date",
fn: x((n) => [
w(e.$slots, "panelDate", Y(W(n)), () => [
m(r(A), {
renderer: r(t).slots.panelDate,
data: n
}, null, 8, ["renderer", "data"])
])
]),
key: "4"
} : void 0
]), 1032, ["type", "start-value", "end-value", "start-activated", "end-activated", "value-type", "shortcuts", "confirm-text", "cancel-text", "today", "no-action", "steps", "range", "min", "max", "disabled-time", "has-error", "selecting-type", "locale", "week-start", "static-wheel", "shortcuts-placement", "labeled-by"])
]),
_: 3
}, 8, ["class", "visible", "to", "transition", "alive"])
], 10, $a));
}
});
export {
Ka as default
};
//# sourceMappingURL=date-picker.vue2.mjs.map