@component-hook/picker 1.0.0 → 1.0.1-alpha.0

package/dist/vue/picker.es.js

@@ -1,107 +1,114 @@
-import "./index.css";
-import { defineComponent as L, watch as ce, openBlock as I, createBlock as E, Teleport as me, createVNode as Z, Transition as j, withCtx as H, withDirectives as q, createElementVNode as Y, vShow as J, renderSlot as R, ref as C, readonly as Q, isRef as W, toRef as de, createElementBlock as P, unref as v, normalizeStyle as ee, Fragment as z, renderList as ae, toDisplayString as A, computed as O, watchEffect as fe, withModifiers as pe, createCommentVNode as ve, nextTick as he } from "vue";
-const Te = Array.isArray;
-function ge(e, a) {
+import { defineComponent as B, watch as ce, openBlock as Y, createBlock as L, Teleport as me, createVNode as Z, Transition as j, withCtx as X, withDirectives as q, createElementVNode as I, vShow as J, renderSlot as R, ref as O, readonly as Q, isRef as W, toRef as de, createElementBlock as F, unref as M, normalizeStyle as ee, Fragment as z, renderList as ae, toDisplayString as A, computed as C, watchEffect as fe, withModifiers as pe, nextTick as ve } from "vue";
+const he = Array.isArray;
+function Te(e, r) {
   if (re(e)) return "multiple";
   const [n] = e;
-  return n[a.children] ? "cascade" : "single";
+  return n != null && n[r.children] ? "cascade" : "single";
 }
-function ke(e) {
+function ge(e) {
   return {
     children: (e == null ? void 0 : e.children) || "children",
     label: (e == null ? void 0 : e.label) || "label",
     value: (e == null ? void 0 : e.value) || "value"
   };
 }
-function Me(e, a, n) {
-  var p;
+function ke(e, r, n) {
+  var d;
   if (re(e)) return [];
-  const r = [];
-  let o = e, s = 0;
+  const l = [];
+  let o = e, a = 0;
   for (; o; ) {
-    const g = a[s];
-    let h = se(o, g, n);
-    h === -1 && (h = 0), r.push(o), s += 1, o = (p = o[h]) == null ? void 0 : p[n.children];
+    const f = r[a];
+    let h = se(o, f, n);
+    h === -1 && (h = 0), l.push(o), a += 1, o = (d = o[h]) == null ? void 0 : d[n.children];
   }
-  return r;
+  return l;
 }
-function Ve(e, a, n, r) {
+function Me(e, r, n, l) {
   const o = [...n];
-  let s = e, p = a + 1;
-  for (; s != null && s[r.children]; ) {
-    const g = s[r.children][0];
-    o[p] = g.value, s = g, p += 1;
+  let a = e, d = r + 1;
+  for (; a != null && a[l.children]; ) {
+    const f = a[l.children][0];
+    o[d] = f.value, a = f, d += 1;
   }
   return o;
 }
-function se(e, a, n) {
-  return e.findIndex((r) => r[n.value] === a);
+function se(e, r, n) {
+  return e.findIndex((l) => (l == null ? void 0 : l[n.value]) === r);
 }
 function re(e) {
-  const [a] = e;
-  return Te(a);
+  const [r] = e;
+  return he(r);
 }
-function ye(e, a) {
-  return e > a ? "horizontal" : a > e ? "vertical" : "";
+function Ve(e, r) {
+  return e > r ? "horizontal" : r > e ? "vertical" : "";
 }
-function F(e, a, n) {
-  const r = [];
-  for (let o = e; o <= a; o++) {
-    const s = n(`${o}`);
-    r.push({ label: s, value: o });
+function E(e, r, n) {
+  const l = [];
+  for (let o = e; o <= r; o++) {
+    const a = n(`${o}`);
+    l.push({ label: a, value: o });
   }
-  return r;
+  return l;
 }
-function te(e, a) {
-  return e === a.getFullYear();
+function te(e, r) {
+  return e === r.getFullYear();
 }
-function ne(e, a) {
-  return e === a.getFullYear();
+function ne(e, r) {
+  return e === r.getFullYear();
 }
-function we(e, a) {
-  return e === a.getMonth() + 1;
+function ye(e, r) {
+  return e === r.getMonth() + 1;
 }
-function Se(e, a) {
-  return e === a.getMonth() + 1;
+function we(e, r) {
+  return e === r.getMonth() + 1;
 }
-function De(e, a) {
-  return new Date(e, a, 0).getDate();
+function xe(e, r) {
+  return new Date(e, r, 0).getDate();
+}
+function De(e, r, n) {
+  const l = /* @__PURE__ */ new Date(), o = Date.now(), a = e.getTime(), d = r.getTime(), f = o >= a && o <= d;
+  return n === "year" ? f ? l.getFullYear() : e.getFullYear() : n === "month" ? f ? l.getMonth() + 1 : e.getMonth() + 1 : f ? l.getDate() : e.getDate();
 }
 function $(e) {
   return e;
 }
-function xe(e) {
+function Se(e) {
   return /^(?:[01]\d|2[0-3]):[0-5]\d:[0-5]\d$/.test(e);
 }
 function oe(e) {
-  if (!xe(e)) return null;
-  const [a, n, r] = e.split(":");
-  return { hour: Number(a), minute: Number(n), second: Number(r) };
+  if (!Se(e)) return null;
+  const [r, n, l] = e.split(":");
+  return { hour: Number(r), minute: Number(n), second: Number(l) };
 }
-function U(e) {
+function H(e) {
   return e.padStart(2, "0");
 }
-const be = { class: "chook-picker-container" }, Ie = /* @__PURE__ */ L({
+function be(e, r, n) {
+  const l = Date.now(), { hour: o, minute: a, second: d } = e, { hour: f, minute: h, second: c } = r, g = (/* @__PURE__ */ new Date()).setHours(o, a, d), T = (/* @__PURE__ */ new Date()).setHours(f, h, c), x = l >= g && l <= T;
+  return n === "hour" ? x ? (/* @__PURE__ */ new Date()).getHours() : o : n === "minute" ? x ? (/* @__PURE__ */ new Date()).getMinutes() : a : x ? (/* @__PURE__ */ new Date()).getSeconds() : d;
+}
+const Ye = { class: "chook-picker-container" }, Ie = /* @__PURE__ */ B({
   __name: "Popup",
   props: {
     teleport: { default: "body" },
     modelValue: { type: Boolean }
   },
   emits: ["update:modelValue", "open", "close", "closed"],
-  setup(e, { emit: a }) {
-    const n = e, r = a;
+  setup(e, { emit: r }) {
+    const n = e, l = r;
     return ce(
       () => n.modelValue,
       (o) => {
-        o ? (document.body.style.overflow = "hidden", r("open")) : (document.body.style.overflow = "", r("close"));
+        o ? (document.body.style.overflow = "hidden", l("open")) : (document.body.style.overflow = "", l("close"));
       },
       { immediate: !0 }
-    ), (o, s) => (I(), E(me, { to: o.teleport }, [
+    ), (o, a) => (Y(), L(me, { to: o.teleport }, [
       Z(j, { name: "chook-picker-fade" }, {
-        default: H(() => [
-          q(Y("div", {
+        default: X(() => [
+          q(I("div", {
             class: "chook-picker-mask",
-            onClick: s[0] || (s[0] = (p) => o.$emit("update:modelValue", !1))
+            onClick: a[0] || (a[0] = (d) => o.$emit("update:modelValue", !1))
           }, null, 512), [
             [J, o.modelValue]
           ])
@@ -110,10 +117,10 @@ const be = { class: "chook-picker-container" }, Ie = /* @__PURE__ */ L({
       }),
       Z(j, {
         name: "chook-picker-slide",
-        onAfterLeave: s[1] || (s[1] = (p) => o.$emit("closed"))
+        onAfterLeave: a[1] || (a[1] = (d) => o.$emit("closed"))
       }, {
-        default: H(() => [
-          q(Y("div", be, [
+        default: X(() => [
+          q(I("div", Ye, [
             R(o.$slots, "default")
           ], 512), [
             [J, o.modelValue]
@@ -123,8 +130,8 @@ const be = { class: "chook-picker-container" }, Ie = /* @__PURE__ */ L({
       })
     ], 8, ["to"]));
   }
-}), Ye = 16, _ = 48, Ce = 0.52, le = 150, X = 300, Oe = 15, Pe = 8e-3, ue = 5, Fe = "Select Date", Ee = ["year", "month", "day"], Le = "Select Time", Be = ["hour", "minute", "second"];
-function Ae() {
+}), Oe = 16, _ = 48, Ce = 0.52, le = 150, U = 300, Pe = 15, Fe = 8e-3, ue = 5, Ee = "Select Date", Le = ["year", "month", "day"], Be = "Select Time", Ae = ["hour", "minute", "second"];
+function Ne() {
   const e = {
     startX: 0,
     startY: 0,
@@ -133,88 +140,88 @@ function Ae() {
     offsetX: 0,
     offsetY: 0
   };
-  let a = "", n = !0;
-  const r = () => a === "vertical", o = () => a === "horizontal";
-  function s() {
-    e.deltaX = 0, e.deltaY = 0, e.offsetX = 0, e.offsetY = 0, a = "", n = !0;
+  let r = "", n = !0;
+  const l = () => r === "vertical", o = () => r === "horizontal";
+  function a() {
+    e.deltaX = 0, e.deltaY = 0, e.offsetX = 0, e.offsetY = 0, r = "", n = !0;
   }
-  function p(d) {
-    const k = "touches" in d ? d.touches[0] : d;
-    s(), e.startX = k.clientX, e.startY = k.clientY;
+  function d(c) {
+    const g = "touches" in c ? c.touches[0] : c;
+    a(), e.startX = g.clientX, e.startY = g.clientY;
   }
-  function g(d) {
+  function f(c) {
     if (!e.startX || !e.startY) return !0;
-    const k = "touches" in d ? d.touches[0] : d;
-    e.deltaX = Math.max(k.clientX, 0) - e.startX, e.deltaY = k.clientY - e.startY, e.offsetX = Math.abs(e.deltaX), e.offsetY = Math.abs(e.deltaY);
+    const g = "touches" in c ? c.touches[0] : c;
+    e.deltaX = Math.max(g.clientX, 0) - e.startX, e.deltaY = g.clientY - e.startY, e.offsetX = Math.abs(e.deltaX), e.offsetY = Math.abs(e.deltaY);
     const T = 10;
-    (!a || e.offsetX < T && e.offsetY < T) && (a = ye(e.offsetX, e.offsetY)), n && (e.offsetX > ue || e.offsetY > ue) && (n = !1);
+    (!r || e.offsetX < T && e.offsetY < T) && (r = Ve(e.offsetX, e.offsetY)), n && (e.offsetX > ue || e.offsetY > ue) && (n = !1);
   }
   function h() {
     e.startX = 0, e.startY = 0;
   }
   return {
     pointer: e,
-    move: g,
-    start: p,
+    move: f,
+    start: d,
     stop: h,
-    reset: s,
-    isVertical: r,
+    reset: a,
+    isVertical: l,
     isHorizontal: o
   };
 }
-function Ne({ column: e, onChange: a }) {
-  const r = Number.parseFloat(getComputedStyle(document.documentElement).fontSize) / Ye, o = C(0), s = C(0), { pointer: p, start: g, move: h, stop: d } = Ae();
-  let k = 0, T = 0, b = 0, M = !1, D = null;
-  function V(f) {
-    g(f), M = !0, s.value = 0, T = Date.now(), k = o.value, b = k, D = null;
+function $e({ column: e, onChange: r }) {
+  const l = Number.parseFloat(getComputedStyle(document.documentElement).fontSize) / Oe, o = O(0), a = O(0), { pointer: d, start: f, move: h, stop: c } = Ne();
+  let g = 0, T = 0, x = 0, y = !1, D = null;
+  function w(v) {
+    f(v), y = !0, a.value = 0, T = Date.now(), g = o.value, x = g, D = null;
   }
-  function l(f) {
-    if (h(f)) return;
-    const S = W(e) ? e.value.length : e.length, B = k + p.deltaY, N = y((S - 1) * -48), G = Math.min(Math.max(B, N), 0), K = Date.now();
-    o.value = G, !(K - T <= X) && (T = K, b = G);
+  function s(v) {
+    if (h(v)) return;
+    const b = W(e) ? e.value.length : e.length, P = g + d.deltaY, N = p((b - 1) * -48), G = Math.min(Math.max(P, N), 0), K = Date.now();
+    o.value = G, !(K - T <= U) && (T = K, x = G);
   }
   function i() {
-    d();
-    const f = o.value - b, w = Date.now() - T;
-    if (w < X && Math.abs(f) > Oe) {
-      t(f, w);
+    c();
+    const v = o.value - x, k = Date.now() - T;
+    if (k < U && Math.abs(v) > Pe) {
+      t(v, k);
       return;
     }
-    const S = m(o.value);
-    s.value = le, c(S), M = !1;
+    const b = V(o.value);
+    a.value = le, m(b), y = !1;
   }
-  function t(f, w) {
-    const S = Math.abs(f / w), B = o.value + S / Pe * (f < 0 ? -1 : 1), N = m(B);
-    s.value = X, c(N);
+  function t(v, k) {
+    const b = Math.abs(v / k), P = o.value + b / Fe * (v < 0 ? -1 : 1), N = V(P);
+    a.value = U, m(N);
   }
   function u() {
-    s.value = 0, M = !1, D && (D(), D = null);
+    a.value = 0, y = !1, D && (D(), D = null);
   }
-  function c(f) {
-    const w = -f * y(_), S = () => a == null ? void 0 : a(f);
-    M && w !== o.value ? D = S : S(), o.value = w;
+  function m(v) {
+    const k = -v * p(_), b = () => r == null ? void 0 : r(v);
+    y && k !== o.value ? D = b : b(), o.value = k;
   }
-  function m(f) {
-    const w = W(e) ? e.value.length : e.length, S = Math.round(-f / y(_));
-    return S < 0 ? 0 : S >= w ? w - 1 : S;
+  function V(v) {
+    const k = W(e) ? e.value.length : e.length, b = Math.round(-v / p(_));
+    return b < 0 ? 0 : b >= k ? k - 1 : b;
   }
-  function y(f) {
-    return f * r;
+  function p(v) {
+    return v * l;
   }
-  function x(f, w = "auto") {
-    M && w === "smooth" || (D = null, M = w === "smooth", s.value = w === "smooth" ? le : 0, c(f));
+  function S(v, k = "auto") {
+    y && k === "smooth" || (D = null, y = k === "smooth", a.value = k === "smooth" ? le : 0, m(v));
   }
   return {
     offsetY: Q(o),
-    transitionDuration: Q(s),
-    onPointerDown: V,
-    onPointerMove: l,
+    transitionDuration: Q(a),
+    onPointerDown: w,
+    onPointerMove: s,
     onPointerUp: i,
     stopInertialSliding: u,
-    scrollToIndex: x
+    scrollToIndex: S
   };
 }
-const $e = ["onClick"], Ue = /* @__PURE__ */ L({
+const He = ["onClick"], Ue = /* @__PURE__ */ B({
   __name: "PickerColumn",
   props: {
     column: {},
@@ -222,68 +229,68 @@ const $e = ["onClick"], Ue = /* @__PURE__ */ L({
     selectedIndex: { default: 0 }
   },
   emits: ["change"],
-  setup(e, { expose: a, emit: n }) {
-    const r = e, o = n, { offsetY: s, transitionDuration: p, onPointerDown: g, onPointerMove: h, onPointerUp: d, stopInertialSliding: k, scrollToIndex: T } = Ne({
-      column: de(r, "column"),
-      onChange: b
+  setup(e, { expose: r, emit: n }) {
+    const l = e, o = n, { offsetY: a, transitionDuration: d, onPointerDown: f, onPointerMove: h, onPointerUp: c, stopInertialSliding: g, scrollToIndex: T } = $e({
+      column: de(l, "column"),
+      onChange: x
     });
-    function b(V) {
-      V !== r.selectedIndex && o("change", V);
+    function x(w) {
+      w !== l.selectedIndex && o("change", w);
     }
-    function M(V = r.selectedIndex, l) {
-      T(V, l);
+    function y(w = l.selectedIndex, s) {
+      T(w, s);
     }
-    function D(V) {
-      V !== r.selectedIndex && M(V, "smooth");
+    function D(w) {
+      w !== l.selectedIndex && y(w, "smooth");
     }
-    return a({ scrollToSelected: M }), (V, l) => (I(), P("div", {
+    return r({ scrollToSelected: y }), (w, s) => (Y(), F("div", {
       class: "chook-picker-column",
-      onTouchstartPassive: l[1] || (l[1] = //@ts-ignore
-      (...i) => v(g) && v(g)(...i)),
-      onTouchmovePassive: l[2] || (l[2] = //@ts-ignore
-      (...i) => v(h) && v(h)(...i)),
-      onTouchendPassive: l[3] || (l[3] = //@ts-ignore
-      (...i) => v(d) && v(d)(...i)),
-      onTouchcancel: l[4] || (l[4] = //@ts-ignore
-      (...i) => v(d) && v(d)(...i)),
-      onMousedownPassive: l[5] || (l[5] = //@ts-ignore
-      (...i) => v(g) && v(g)(...i)),
-      onMousemovePassive: l[6] || (l[6] = //@ts-ignore
-      (...i) => v(h) && v(h)(...i)),
-      onMouseupPassive: l[7] || (l[7] = //@ts-ignore
-      (...i) => v(d) && v(d)(...i))
+      onTouchstartPassive: s[1] || (s[1] = //@ts-ignore
+      (...i) => M(f) && M(f)(...i)),
+      onTouchmovePassive: s[2] || (s[2] = //@ts-ignore
+      (...i) => M(h) && M(h)(...i)),
+      onTouchendPassive: s[3] || (s[3] = //@ts-ignore
+      (...i) => M(c) && M(c)(...i)),
+      onTouchcancel: s[4] || (s[4] = //@ts-ignore
+      (...i) => M(c) && M(c)(...i)),
+      onMousedownPassive: s[5] || (s[5] = //@ts-ignore
+      (...i) => M(f) && M(f)(...i)),
+      onMousemovePassive: s[6] || (s[6] = //@ts-ignore
+      (...i) => M(h) && M(h)(...i)),
+      onMouseupPassive: s[7] || (s[7] = //@ts-ignore
+      (...i) => M(c) && M(c)(...i))
     }, [
-      Y("ul", {
+      I("ul", {
         style: ee({
           overflowY: "hidden",
-          transform: `translate3d(0, ${v(s)}px, 0)`,
-          transitionDuration: `${v(p)}ms`,
-          transitionProperty: v(p) ? "all" : "none"
+          transform: `translate3d(0, ${M(a)}px, 0)`,
+          transitionDuration: `${M(d)}ms`,
+          transitionProperty: M(d) ? "all" : "none"
         }),
-        onTransitionend: l[0] || (l[0] = //@ts-ignore
-        (...i) => v(k) && v(k)(...i))
+        onTransitionend: s[0] || (s[0] = //@ts-ignore
+        (...i) => M(g) && M(g)(...i))
       }, [
-        (I(!0), P(z, null, ae(V.column, (i, t) => (I(), P("li", {
-          key: i[V.fields.value],
+        (Y(!0), F(z, null, ae(w.column, (i, t) => (Y(), F("li", {
+          key: i == null ? void 0 : i[w.fields.value],
           class: "chook-picker-column-item",
           role: "button",
           tabindex: "0",
           onClick: (u) => D(t)
         }, [
-          Y("p", {
+          I("p", {
             class: "chook-picker-column-label",
             style: ee({
-              transform: `rotate3d(1, 0, 0, ${(t * v(_) + v(s)) * v(Ce)}deg)`
+              transform: `rotate3d(1, 0, 0, ${(t * M(_) + M(a)) * M(Ce)}deg)`
             })
-          }, A(i[V.fields.label]), 5)
-        ], 8, $e))), 128))
+          }, A(i == null ? void 0 : i[w.fields.label]), 5)
+        ], 8, He))), 128))
       ], 36)
     ], 32));
   }
-}), Xe = { class: "chook-picker-header" }, He = { class: "chook-picker-title" }, Re = {
-  key: 0,
-  class: "chook-picker-loading"
-}, ie = /* @__PURE__ */ L({
+}), Xe = { class: "chook-picker-header" }, Re = { class: "chook-picker-title" }, ze = { class: "chook-picker-loading" }, _e = {
+  key: 1,
+  class: "chook-picker-columns"
+}, ie = /* @__PURE__ */ B({
   __name: "Picker",
   props: {
     show: { type: Boolean },
@@ -298,105 +305,109 @@ const $e = ["onClick"], Ue = /* @__PURE__ */ L({
     columnsFieldNames: {}
   },
   emits: ["update:show", "update:modelValue", "confirm", "cancel", "open", "closed"],
-  setup(e, { emit: a }) {
-    const n = e, r = a, o = C([]), s = C([]), p = C([]), g = C(null), h = O({
+  setup(e, { emit: r }) {
+    const n = e, l = r, o = O([]), a = O([]), d = O([]), f = O(null), h = C({
       get: () => n.show,
-      set: (t) => r("update:show", t)
-    }), d = O(() => ke(n.columnsFieldNames)), k = O(() => ge(n.columns, d.value)), T = O(() => {
+      set: (t) => l("update:show", t)
+    }), c = C(() => ge(n.columnsFieldNames)), g = C(() => Te(n.columns, c.value)), T = C(() => {
       const { columns: t } = n;
-      return k.value === "single" ? [t] : k.value === "multiple" ? t : Me(t, s.value, d.value);
+      return g.value === "single" ? [t] : g.value === "multiple" ? t : ke(t, a.value, c.value);
     });
-    function b(t, u) {
-      const c = T.value[t], m = c[u][d.value.value], y = s.value[t];
-      if (m === y) return;
-      const x = [...s.value];
-      if (x[t] = m, k.value === "cascade") {
-        const f = c[u];
-        s.value = Ve(f, t, x, d.value);
+    function x(t, u) {
+      var v;
+      const m = T.value[t], V = (v = m[u]) == null ? void 0 : v[c.value.value], p = a.value[t];
+      if (V === p) return;
+      const S = [...a.value];
+      if (S[t] = V, g.value === "cascade") {
+        const k = m[u];
+        a.value = Me(k, t, S, c.value);
       } else
-        s.value = x;
-      n.linkage && M();
+        a.value = S;
+      n.linkage && y();
     }
-    function M() {
-      r("update:modelValue", s.value), o.value = s.value;
+    function y() {
+      l("update:modelValue", a.value), o.value = a.value;
     }
     function D() {
-      r("update:show", !1);
+      l("update:show", !1);
     }
-    async function V() {
-      r("open"), await he(), s.value = n.modelValue ? [...n.modelValue] : [...o.value];
+    async function w() {
+      l("open"), await ve(), a.value = n.modelValue ? [...n.modelValue] : [...o.value];
     }
-    function l() {
-      n.linkage || M(), D(), r("confirm", s.value);
+    function s() {
+      n.linkage || y(), D(), l("confirm", a.value);
     }
     function i() {
-      D(), r("cancel");
+      D(), l("cancel");
     }
     return fe(() => {
-      var c;
+      var m, V;
       const t = T.value.length, u = [];
-      for (let m = 0; m < t; m++) {
-        const y = T.value[m], x = s.value[m], f = se(y, x, d.value);
-        if (f === -1) {
-          const S = (p.value[m] ?? 0) >= y.length ? y.length - 1 : 0;
-          s.value[m] = y[S][d.value.value], u[m] = S;
+      for (let p = 0; p < t; p++) {
+        const S = T.value[p], v = a.value[p], k = se(S, v, c.value);
+        if (k === -1) {
+          const P = (d.value[p] ?? 0) >= S.length ? Math.max(S.length - 1, 0) : 0;
+          a.value[p] = (m = S[P]) == null ? void 0 : m[c.value.value], u[p] = P;
         } else
-          u[m] = f;
-        u[m] !== p.value[m] && ((c = g.value) == null || c[m].scrollToSelected(u[m]));
+          u[p] = k;
+        u[p] !== d.value[p] && ((V = f.value) == null || V[p].scrollToSelected(u[p]));
       }
-      p.value = u;
-    }), (t, u) => (I(), E(Ie, {
+      d.value = u;
+    }), (t, u) => (Y(), L(Ie, {
       modelValue: h.value,
-      "onUpdate:modelValue": u[1] || (u[1] = (c) => h.value = c),
+      "onUpdate:modelValue": u[1] || (u[1] = (m) => h.value = m),
       teleport: t.teleport,
-      onOpen: V,
-      onClosed: u[2] || (u[2] = (c) => t.$emit("closed"))
+      onOpen: w,
+      onClosed: u[2] || (u[2] = (m) => t.$emit("closed"))
     }, {
-      default: H(() => [
-        Y("div", Xe, [
-          Y("button", {
+      default: X(() => [
+        I("div", Xe, [
+          I("button", {
             class: "chook-picker-cancel",
             onClick: i
           }, A(t.cancelButtonText), 1),
-          Y("p", He, A(t.title), 1),
-          Y("button", {
+          I("p", Re, A(t.title), 1),
+          I("button", {
             class: "chook-picker-confirm",
-            onClick: l
+            onClick: s
           }, A(t.confirmButtonText), 1)
         ]),
-        Y("div", {
+        t.loading ? (Y(), F(z, { key: 0 }, [
+          I("div", ze, [
+            R(t.$slots, "loading")
+          ]),
+          u[3] || (u[3] = I("div", { class: "chook-picker-columns" }, null, -1))
+        ], 64)) : t.columns.length ? (Y(), F("div", {
+          key: 2,
           class: "chook-picker-columns chook-picker-columns-backdrop",
           onTouchmove: u[0] || (u[0] = pe(() => {
           }, ["stop"]))
         }, [
-          !t.loading && !t.columns.length ? R(t.$slots, "empty", { key: 0 }) : (I(), P(z, { key: 1 }, [
-            (I(!0), P(z, null, ae(T.value, (c, m) => (I(), E(Ue, {
-              key: m,
-              ref_for: !0,
-              ref_key: "columnsRef",
-              ref: g,
-              column: c,
-              fields: d.value,
-              "selected-index": p.value[m],
-              onChange: (y) => b(m, y)
-            }, null, 8, ["column", "fields", "selected-index", "onChange"]))), 128)),
-            u[3] || (u[3] = Y("div", { class: "chook-picker-mask-backdrop" }, null, -1))
-          ], 64))
-        ], 32),
-        t.loading ? (I(), P("div", Re, [
-          R(t.$slots, "loading")
-        ])) : ve("", !0)
+          (Y(!0), F(z, null, ae(T.value, (m, V) => (Y(), L(Ue, {
+            key: V,
+            ref_for: !0,
+            ref_key: "columnsRef",
+            ref: f,
+            column: m,
+            fields: c.value,
+            "selected-index": d.value[V],
+            onChange: (p) => x(V, p)
+          }, null, 8, ["column", "fields", "selected-index", "onChange"]))), 128)),
+          u[4] || (u[4] = I("div", { class: "chook-picker-mask-backdrop" }, null, -1))
+        ], 32)) : (Y(), F("div", _e, [
+          R(t.$slots, "empty")
+        ]))
       ]),
       _: 3
     }, 8, ["modelValue", "teleport"]));
   }
-}), _e = /* @__PURE__ */ L({
+}), Ke = /* @__PURE__ */ B({
   __name: "DatePicker",
   props: {
     show: { type: Boolean },
     modelValue: {},
-    title: { default: Fe },
-    columnsType: { default: () => Ee },
+    title: { default: Ee },
+    columnsType: { default: () => Le },
     minDate: { default: () => new Date((/* @__PURE__ */ new Date()).getFullYear() - 10, 0, 1) },
     maxDate: { default: () => new Date((/* @__PURE__ */ new Date()).getFullYear() + 10, 11, 31) },
     teleport: {},
@@ -407,150 +418,150 @@ const $e = ["onClick"], Ue = /* @__PURE__ */ L({
     formatDayLabel: { type: Function, default: $ }
   },
   emits: ["update:show", "update:modelValue", "confirm", "cancel", "open", "closed"],
-  setup(e, { emit: a }) {
-    const n = e, r = a, o = C([]), s = C([]), p = O({
+  setup(e, { emit: r }) {
+    const n = e, l = r, o = O([]), a = O([]), d = C({
       get: () => n.show,
-      set: (l) => r("update:show", l)
-    }), g = O(() => {
-      const { columnsType: l, minDate: i, maxDate: t } = n, u = {
+      set: (s) => l("update:show", s)
+    }), f = C(() => {
+      const { columnsType: s, minDate: i, maxDate: t } = n, u = {
         year: h,
-        month: d,
-        day: k
+        month: c,
+        day: g
       };
-      return l.map((c) => u[c](i, t));
+      return s.map((m) => u[m](i, t));
     });
-    function h(l, i) {
-      const t = l.getFullYear(), u = i.getFullYear();
-      return F(t, u, n.formatYearLabel);
+    function h(s, i) {
+      const t = s.getFullYear(), u = i.getFullYear();
+      return E(t, u, n.formatYearLabel);
     }
-    function d(l, i) {
-      const t = T("year"), u = te(t, l) ? l.getMonth() + 1 : 1, c = ne(t, i) ? i.getMonth() + 1 : 12;
-      return F(u, c, n.formatMonthLabel);
+    function c(s, i) {
+      const t = T("year"), u = te(t, s) ? s.getMonth() + 1 : 1, m = ne(t, i) ? i.getMonth() + 1 : 12;
+      return E(u, m, n.formatMonthLabel);
     }
-    function k(l, i) {
-      const t = T("year"), u = T("month"), c = te(t, l) && we(u, l), m = ne(t, i) && Se(u, i), y = c ? l.getDate() : 1, x = m ? i.getDate() : De(t, u);
-      return F(y, x, n.formatDayLabel);
+    function g(s, i) {
+      const t = T("year"), u = T("month"), m = te(t, s) && ye(u, s), V = ne(t, i) && we(u, i), p = m ? s.getDate() : 1, S = V ? i.getDate() : xe(t, u);
+      return E(p, S, n.formatDayLabel);
     }
-    function T(l) {
-      const { columnsType: i } = n, t = i.indexOf(l), u = o.value[t];
-      return u ? Number(u) : l === "year" ? (/* @__PURE__ */ new Date()).getFullYear() : l === "month" ? (/* @__PURE__ */ new Date()).getMonth() + 1 : (/* @__PURE__ */ new Date()).getDate();
+    function T(s) {
+      const { columnsType: i } = n, t = i.indexOf(s), u = o.value[t];
+      return u ? Number(u) : De(n.minDate, n.maxDate, s);
     }
-    function b(l) {
-      r("update:modelValue", l), s.value = l, r("confirm", l);
+    function x(s) {
+      l("update:modelValue", s), a.value = s, l("confirm", s);
     }
-    function M() {
-      r("cancel");
+    function y() {
+      l("cancel");
     }
     function D() {
-      if (r("open"), n.modelValue && n.modelValue.length) {
+      if (l("open"), n.modelValue && n.modelValue.length) {
         o.value = [...n.modelValue];
         return;
       }
-      const { columnsType: l } = n;
-      o.value = l.map((i) => T(i));
+      const { columnsType: s } = n;
+      o.value = s.map((i) => T(i));
     }
-    function V() {
-      o.value = n.modelValue ? [...n.modelValue] : [...s.value], r("closed");
+    function w() {
+      o.value = n.modelValue ? [...n.modelValue] : [...a.value], l("closed");
     }
-    return (l, i) => (I(), E(ie, {
+    return (s, i) => (Y(), L(ie, {
       modelValue: o.value,
       "onUpdate:modelValue": i[0] || (i[0] = (t) => o.value = t),
-      show: p.value,
-      "onUpdate:show": i[1] || (i[1] = (t) => p.value = t),
-      title: l.title,
-      columns: g.value,
-      teleport: l.teleport,
-      "confirm-button-text": l.confirmButtonText,
-      "cancel-button-text": l.cancelButtonText,
+      show: d.value,
+      "onUpdate:show": i[1] || (i[1] = (t) => d.value = t),
+      title: s.title,
+      columns: f.value,
+      teleport: s.teleport,
+      "confirm-button-text": s.confirmButtonText,
+      "cancel-button-text": s.cancelButtonText,
       linkage: "",
-      onConfirm: b,
-      onCancel: M,
+      onConfirm: x,
+      onCancel: y,
       onOpen: D,
-      onClosed: V
+      onClosed: w
     }, null, 8, ["modelValue", "show", "title", "columns", "teleport", "confirm-button-text", "cancel-button-text"]));
   }
-}), Ge = /* @__PURE__ */ L({
+}), Ze = /* @__PURE__ */ B({
   __name: "TimePicker",
   props: {
     show: { type: Boolean },
     modelValue: {},
-    title: { default: Le },
-    columnsType: { default: () => Be },
+    title: { default: Be },
+    columnsType: { default: () => Ae },
     minTime: {},
     maxTime: {},
     teleport: {},
     confirmButtonText: {},
     cancelButtonText: {},
-    formatHourLabel: { type: Function, default: U },
-    formatMinuteLabel: { type: Function, default: U },
-    formatSecondLabel: { type: Function, default: U }
+    formatHourLabel: { type: Function, default: H },
+    formatMinuteLabel: { type: Function, default: H },
+    formatSecondLabel: { type: Function, default: H }
   },
   emits: ["update:show", "update:modelValue", "confirm", "cancel", "open", "closed"],
-  setup(e, { emit: a }) {
-    const n = e, r = a, o = C([]), s = C([]), p = O({
+  setup(e, { emit: r }) {
+    const n = e, l = r, o = O([]), a = O([]), d = C({
       get: () => n.show,
-      set: (t) => r("update:show", t)
-    }), g = O(() => {
+      set: (t) => l("update:show", t)
+    }), f = C(() => {
       const { columnsType: t } = n, u = {
-        hour: k,
+        hour: g,
         minute: T,
-        second: b
+        second: x
       };
-      return t.map((c) => u[c]());
-    }), h = O(() => oe(n.minTime ?? "") ?? { hour: 0, minute: 0, second: 0 }), d = O(() => oe(n.maxTime ?? "") ?? { hour: 23, minute: 59, second: 59 });
-    function k() {
-      const t = h.value.hour, u = d.value.hour;
-      return F(t, u, n.formatHourLabel);
+      return t.map((m) => u[m]());
+    }), h = C(() => oe(n.minTime ?? "") ?? { hour: 0, minute: 0, second: 0 }), c = C(() => oe(n.maxTime ?? "") ?? { hour: 23, minute: 59, second: 59 });
+    function g() {
+      const t = h.value.hour, u = c.value.hour;
+      return E(t, u, n.formatHourLabel);
     }
     function T() {
-      const t = M("hour"), { hour: u, minute: c } = h.value, { hour: m, minute: y } = d.value;
-      return F(t === u ? c : 0, t === m ? y : 59, n.formatMinuteLabel);
+      const t = y("hour"), { hour: u, minute: m } = h.value, { hour: V, minute: p } = c.value;
+      return E(t === u ? m : 0, t === V ? p : 59, n.formatMinuteLabel);
     }
-    function b() {
-      const t = M("hour"), u = M("minute"), { hour: c, minute: m, second: y } = h.value, { hour: x, minute: f, second: w } = d.value;
-      return F(t === c && u === m ? y : 0, t === x && u === f ? w : 59, n.formatSecondLabel);
+    function x() {
+      const t = y("hour"), u = y("minute"), { hour: m, minute: V, second: p } = h.value, { hour: S, minute: v, second: k } = c.value;
+      return E(t === m && u === V ? p : 0, t === S && u === v ? k : 59, n.formatSecondLabel);
     }
-    function M(t) {
-      const { columnsType: u } = n, c = u.indexOf(t), m = o.value[c];
-      return m !== void 0 ? Number(m) : t === "hour" ? (/* @__PURE__ */ new Date()).getHours() : t === "minute" ? (/* @__PURE__ */ new Date()).getMinutes() : (/* @__PURE__ */ new Date()).getSeconds();
+    function y(t) {
+      const { columnsType: u } = n, m = u.indexOf(t), V = o.value[m];
+      return V !== void 0 ? Number(V) : be(h.value, c.value, t);
     }
     function D(t) {
-      r("update:modelValue", t), s.value = t, r("confirm", t);
+      l("update:modelValue", t), a.value = t, l("confirm", t);
     }
-    function V() {
-      r("cancel");
+    function w() {
+      l("cancel");
     }
-    function l() {
-      if (r("open"), n.modelValue && n.modelValue.length) {
+    function s() {
+      if (l("open"), n.modelValue && n.modelValue.length) {
         o.value = [...n.modelValue];
         return;
       }
       const { columnsType: t } = n;
-      o.value = t.map((u) => M(u));
+      o.value = t.map((u) => y(u));
     }
     function i() {
-      o.value = n.modelValue ? [...n.modelValue] : [...s.value], r("closed");
+      o.value = n.modelValue ? [...n.modelValue] : [...a.value], l("closed");
     }
-    return (t, u) => (I(), E(ie, {
+    return (t, u) => (Y(), L(ie, {
       modelValue: o.value,
-      "onUpdate:modelValue": u[0] || (u[0] = (c) => o.value = c),
-      show: p.value,
-      "onUpdate:show": u[1] || (u[1] = (c) => p.value = c),
+      "onUpdate:modelValue": u[0] || (u[0] = (m) => o.value = m),
+      show: d.value,
+      "onUpdate:show": u[1] || (u[1] = (m) => d.value = m),
       title: t.title,
-      columns: g.value,
+      columns: f.value,
       teleport: t.teleport,
       "confirm-button-text": t.confirmButtonText,
       "cancel-button-text": t.cancelButtonText,
       linkage: "",
       onConfirm: D,
-      onCancel: V,
-      onOpen: l,
+      onCancel: w,
+      onOpen: s,
       onClosed: i
     }, null, 8, ["modelValue", "show", "title", "columns", "teleport", "confirm-button-text", "cancel-button-text"]));
   }
 });
 export {
-  _e as DatePicker,
+  Ke as DatePicker,
   ie as Picker,
-  Ge as TimePicker
+  Ze as TimePicker
 };