@featherk/composables 0.6.5 → 0.6.6

package/dist/featherk-composables.es.js

@@ -28,7 +28,7 @@ const We = (e) => {
         );
         if (p.length === 0) return;
         const A = p.findIndex(
-          (C) => C === document.activeElement
+          (I) => I === document.activeElement
         );
         let S;
         A === -1 ? S = 0 : o.shiftKey ? S = (A - 1 + p.length) % p.length : S = (A + 1) % p.length, o.preventDefault(), o.stopPropagation(), p[S]?.focus();
@@ -63,14 +63,14 @@ const We = (e) => {
                 y
               ), N(() => {
                 const S = () => {
-                  const C = Array.from(
+                  const I = Array.from(
                     i.querySelectorAll(
                       ".k-animation-container .k-popup .k-column-menu .k-columnmenu-item-wrapper .k-columnmenu-item"
                     )
                   );
-                  if (C.length === 1)
-                    C[0].focus(), C[0].click(), S.attempts = 0;
-                  else if (C.length > 1) {
+                  if (I.length === 1)
+                    I[0].focus(), I[0].click(), S.attempts = 0;
+                  else if (I.length > 1) {
                     S.attempts = 0;
                     return;
                   } else
@@ -148,15 +148,15 @@ const We = (e) => {
         if (l) {
           if (["ArrowDown", "ArrowUp"].includes(o.code)) {
             const i = (A, S) => {
-              let C = S === "next" ? A.nextElementSibling : A.previousElementSibling;
-              for (; C; ) {
-                const G = C;
+              let I = S === "next" ? A.nextElementSibling : A.previousElementSibling;
+              for (; I; ) {
+                const G = I;
                 try {
                   if (G.hasAttribute && G.classList.contains("k-table-row"))
                     return G;
                 } catch {
                 }
-                C = S === "next" ? C.nextElementSibling : C.previousElementSibling;
+                I = S === "next" ? I.nextElementSibling : I.previousElementSibling;
               }
               return null;
             }, p = o.code === "ArrowDown" ? i(l, "next") : i(l, "previous");
@@ -226,7 +226,7 @@ const We = (e) => {
       } catch (o) {
         console.error("Error setting up row navigation:", o);
       }
-  }, $ = () => {
+  }, C = () => {
     N(() => {
       const m = document.querySelectorAll(".k-grid-header .k-grid-header-menu.k-grid-column-menu");
       m && m.forEach((l) => {
@@ -263,16 +263,16 @@ const We = (e) => {
           A[i].sortable === !1 ? "false" : "true"
         );
       }
-      const S = l.dataset.featherKFilterable !== "false", C = l.dataset.featherKSortable !== "false";
-      p.setAttribute("tabindex", "-1"), S || C ? l.style.cursor = "pointer" : l.style.cursor = "default", S ? (l.setAttribute("tabindex", "0"), l.setAttribute("role", "button"), l.setAttribute("aria-haspopup", "menu")) : (l.setAttribute("tabindex", "0"), l.setAttribute("role", "columnheader"), l.removeAttribute("aria-haspopup"));
+      const S = l.dataset.featherKFilterable !== "false", I = l.dataset.featherKSortable !== "false";
+      p.setAttribute("tabindex", "-1"), S || I ? l.style.cursor = "pointer" : l.style.cursor = "default", S ? (l.setAttribute("tabindex", "0"), l.setAttribute("role", "button"), l.setAttribute("aria-haspopup", "menu")) : (l.setAttribute("tabindex", "0"), l.setAttribute("role", "columnheader"), l.removeAttribute("aria-haspopup"));
       const G = (H) => {
         H.target?.closest(".k-column-resizer") || (t.value = l, p.click());
       }, oe = (H) => {
         if (S)
           t.value = l, H.preventDefault(), H.stopPropagation(), G(H);
-        else if (C) {
+        else if (I) {
           t.value = l;
-          const J = new KeyboardEvent("keydown", {
+          const j = new KeyboardEvent("keydown", {
             key: "Enter",
             code: "Enter",
             keyCode: 13,
@@ -280,19 +280,19 @@ const We = (e) => {
             bubbles: !0,
             cancelable: !0
           });
-          l.dispatchEvent(J);
+          l.dispatchEvent(j);
         }
       };
       l.addEventListener("click", oe), V.push(() => {
         l.removeEventListener("click", oe);
       });
       const Q = (H) => {
-        if ((H.code === "Enter" || H.code === "Space") && (S || C)) {
+        if ((H.code === "Enter" || H.code === "Space") && (S || I)) {
           if (t.value = l, t.value.focus(), S)
             H.preventDefault(), H.stopPropagation(), G(H);
-          else if (C) {
-            const J = l.querySelector(".k-link");
-            J && J.click();
+          else if (I) {
+            const j = l.querySelector(".k-link");
+            j && j.click();
           }
         }
       };
@@ -322,7 +322,7 @@ const We = (e) => {
   }, g = function(o, m) {
     const l = o?.event.event.target, i = k();
     if (!l || !i) return;
-    const p = l.classList.contains("k-link"), A = l.classList.contains("k-columnmenu-item"), S = i.find((C) => C.field === o.event.field)?.sortable && !0;
+    const p = l.classList.contains("k-link"), A = l.classList.contains("k-columnmenu-item"), S = i.find((I) => I.field === o.event.field)?.sortable && !0;
     if (!p) {
       if (A && !S) {
         (o.event.sort && void 0)?.filter(
@@ -337,7 +337,7 @@ const We = (e) => {
   }, F = () => {
     if (!c)
       try {
-        D(), x(), $(), c = !0;
+        D(), x(), C(), c = !0;
       } catch (o) {
         console.error("initA11y failed:", o), R();
       }
@@ -361,7 +361,7 @@ function _e(e) {
   }), x = h(() => {
     const a = t.value && t.value.substring(6, 10).replace(/\D/g, "0") || "0";
     return parseInt(a).toString().padStart(4, "0");
-  }), $ = (a) => {
+  }), C = (a) => {
     if (y.value.length === 0) {
       e.onChange({ value: null, event: a });
       return;
@@ -371,75 +371,75 @@ function _e(e) {
       return;
     }
     if ((t.value ?? "").length === 10 && y.value.length === 8) {
-      const [d, I, te] = t.value.split("/"), r = parseInt(d), u = parseInt(I), v = parseInt(te);
+      const [d, M, ee] = t.value.split("/"), r = parseInt(d), u = parseInt(M), v = parseInt(ee);
       if (o(v, r, u)) {
-        const M = new Date(v, r - 1, u);
-        R(M) ? e.onChange({ value: M, event: a }) : e.onChange({ value: null, event: a });
+        const $ = new Date(v, r - 1, u);
+        R($) ? e.onChange({ value: $, event: a }) : e.onChange({ value: null, event: a });
       } else
         e.onChange({ value: null, event: a });
     }
   }, R = (a) => {
-    const d = e.min ?? void 0, I = e.max ?? void 0;
-    return !(d && a < d || I && a > I);
+    const d = e.min ?? void 0, M = e.max ?? void 0;
+    return !(d && a < d || M && a > M);
   }, f = h(() => {
     if ((t.value ?? "").length === 10 && y.value.length === 8) {
-      const [a, d, I] = (t.value ?? "").split("/"), te = parseInt(a), r = parseInt(d), u = parseInt(I);
-      if (o(u, te, r))
-        return new Date(u, te - 1, r);
+      const [a, d, M] = (t.value ?? "").split("/"), ee = parseInt(a), r = parseInt(d), u = parseInt(M);
+      if (o(u, ee, r))
+        return new Date(u, ee - 1, r);
     }
     return null;
-  }), g = h(() => (t.value ?? "").length === 10 && y.value.length === 8), F = (a, d) => new Date(a, d, 0).getDate(), o = (a, d, I) => d >= 1 && d <= 12 && a >= 1900 && I >= 1 && I <= F(a, d), m = (a) => {
+  }), g = h(() => (t.value ?? "").length === 10 && y.value.length === 8), F = (a, d) => new Date(a, d, 0).getDate(), o = (a, d, M) => d >= 1 && d <= 12 && a >= 1900 && M >= 1 && M <= F(a, d), m = (a) => {
     t.value = a.value;
     const d = a.event?.target;
-    c.value = d?.selectionStart ?? 0, $(a);
+    c.value = d?.selectionStart ?? 0, C(a);
   }, l = (a) => {
     c.value = a.target.selectionStart ?? 0;
-  }, i = (a, d, I) => {
-    const te = d?.selectionStart ?? c.value ?? 0;
-    c.value = te;
+  }, i = (a, d, M) => {
+    const ee = d?.selectionStart ?? c.value ?? 0;
+    c.value = ee;
     let r = parseInt(L.value), u = parseInt(D.value), v = parseInt(x.value);
     if (!(y.value.length >= 8) || !o(v, r, u)) {
-      const z = e.defaultValue ?? /* @__PURE__ */ new Date();
-      r = z.getMonth() + 1, u = z.getDate(), v = z.getFullYear(), t.value = `${String(r).padStart(2, "0")}/${String(u).padStart(
+      const X = e.defaultValue ?? /* @__PURE__ */ new Date();
+      r = X.getMonth() + 1, u = X.getDate(), v = X.getFullYear(), t.value = `${String(r).padStart(2, "0")}/${String(u).padStart(
         2,
         "0"
       )}/${String(v)}`;
       const O = new Date(v, r - 1, u);
-      e.onChange({ value: R(O) ? O : null, event: I }), N(() => {
+      e.onChange({ value: R(O) ? O : null, event: M }), N(() => {
         requestAnimationFrame(() => {
-          const X = document.getElementById(
+          const J = document.getElementById(
             e.id
           ), Z = c.value ?? 0;
-          X && (X.focus(), X.setSelectionRange(Z, Z));
+          J && (J.focus(), J.setSelectionRange(Z, Z));
         });
       });
       return;
     }
-    const U = w(te);
+    const U = w(ee);
     if (U === "mm")
       r = a === "ArrowUp" ? r < 12 ? r + 1 : 1 : r > 1 ? r - 1 : 12;
     else if (U === "dd") {
-      const z = new Date(v, r, 0).getDate();
-      u = a === "ArrowUp" ? u < z ? u + 1 : 1 : u > 1 ? u - 1 : z;
+      const X = new Date(v, r, 0).getDate();
+      u = a === "ArrowUp" ? u < X ? u + 1 : 1 : u > 1 ? u - 1 : X;
     } else U === "yyyy" && (v = a === "ArrowUp" ? v + 1 : Math.max(1, v - 1));
     t.value = `${String(r).padStart(2, "0")}/${String(u).padStart(
       2,
       "0"
     )}/${String(v)}`;
-    const [ae, j, Y] = t.value.split("/"), ie = new Date(
+    const [ae, z, Y] = t.value.split("/"), ie = new Date(
       parseInt(Y),
       parseInt(ae) - 1,
-      parseInt(j)
+      parseInt(z)
     );
     ie.toString() !== "Invalid Date" && parseInt(Y) >= 1e3 ? e.onChange({
       value: R(ie) ? ie : null,
-      event: I
-    }) : e.onChange({ value: null, event: I }), N(() => {
+      event: M
+    }) : e.onChange({ value: null, event: M }), N(() => {
       requestAnimationFrame(() => {
-        const z = document.getElementById(
+        const X = document.getElementById(
           e.id
         ), O = c.value ?? 0;
-        z && (z.focus(), z.setSelectionRange(O, O));
+        X && (X.focus(), X.setSelectionRange(O, O));
       });
     });
   }, p = (a) => {
@@ -463,7 +463,7 @@ function _e(e) {
       return;
     }
     k.includes(a.key) && (a.preventDefault(), c.value = d?.selectionStart ?? 0);
-  }, C = (a) => {
+  }, I = (a) => {
     W.value = !0, V.value && !e.defaultValue && e.externalValue && e.externalValue.value === void 0 && y.value.length === 0 && (e.externalValue.value = "");
     const d = a.target;
     d && (c.value = d.selectionStart ?? 0);
@@ -474,8 +474,8 @@ function _e(e) {
       if (a) {
         const d = new Date(a);
         if (d.toString() !== "Invalid Date") {
-          const I = (d.getMonth() + 1).toString().padStart(2, "0"), te = d.getDate().toString().padStart(2, "0"), r = d.getFullYear().toString();
-          t.value = `${I}/${te}/${r}`;
+          const M = (d.getMonth() + 1).toString().padStart(2, "0"), ee = d.getDate().toString().padStart(2, "0"), r = d.getFullYear().toString();
+          t.value = `${M}/${ee}/${r}`;
           return;
         }
       }
@@ -532,18 +532,18 @@ function _e(e) {
       year: "numeric",
       month: "2-digit",
       day: "2-digit"
-    }) : null, I = e.max ? e.max.toLocaleDateString("en-US", {
+    }) : null, M = e.max ? e.max.toLocaleDateString("en-US", {
       year: "numeric",
       month: "2-digit",
       day: "2-digit"
     }) : null;
     if (a === "out-of-bounds") {
-      if (d && I) return `Must be between ${d} and ${I}.`;
+      if (d && M) return `Must be between ${d} and ${M}.`;
       if (d) return `Must be on or after ${d}.`;
-      if (I) return `Must be on or before ${I}.`;
+      if (M) return `Must be on or before ${M}.`;
     }
     return "";
-  }), J = () => {
+  }), j = () => {
     N(() => {
       const a = document.getElementById(
         e.id
@@ -553,19 +553,23 @@ function _e(e) {
         return;
       }
       const d = a.closest(".k-datepicker");
-      if (d) {
-        const I = d.parentElement;
-        I ? I.classList.add("fk-datepicker") : console.warn(
-          `Parent of .k-datepicker not found for #${e.id} styling.`
-        );
-      } else {
+      if (!d) {
         console.warn(`.k-datepicker parent not found for #${e.id} styling.`);
         return;
       }
+      const M = d.parentElement;
+      if (M) {
+        if (M.classList.contains("fk-datepicker"))
+          return;
+        M.classList.add("fk-datepicker");
+      } else
+        console.warn(
+          `Parent of .k-datepicker not found for #${e.id} styling.`
+        );
     });
   };
   return xe(() => {
-    J();
+    j();
   }), {
     raw: t,
     cursorPos: c,
@@ -585,13 +589,15 @@ function _e(e) {
     handleWheel: A,
     handleKeyUp: S,
     handleClick: l,
-    handleBlur: C
+    handleBlur: I,
+    // Expose so consumers can re-run styling when needed
+    initStyling: j
   };
 }
 function Ge(e) {
   const t = _(""), c = _(void 0), P = _(!!e.debug), T = _(!1), W = 365 * (1440 * 60 * 1e3), k = /* @__PURE__ */ new Date(), b = new Date(k.getTime() - W), y = new Date(k.getTime() + W);
   e.min = e.min ?? b, e.max = e.max ?? y;
-  const w = h(() => (t.value ?? "").replace(/\D/g, "")), L = (n, s) => new Date(n, s, 0).getDate(), D = (n, s, E) => s >= 1 && s <= 12 && n >= 1e3 && E >= 1 && E <= L(n, s), x = (n) => Date.UTC(n.getFullYear(), n.getMonth(), n.getDate()), $ = (n) => {
+  const w = h(() => (t.value ?? "").replace(/\D/g, "")), L = (n, s) => new Date(n, s, 0).getDate(), D = (n, s, E) => s >= 1 && s <= 12 && n >= 1e3 && E >= 1 && E <= L(n, s), x = (n) => Date.UTC(n.getFullYear(), n.getMonth(), n.getDate()), C = (n) => {
     if (!n) return null;
     const s = e.min, E = e.max, q = x(n);
     return q < x(s) || q > x(E) ? null : n;
@@ -601,7 +607,7 @@ function Ge(e) {
     const s = n.substring(0, 10), E = n.substring(13, 23), [q, ne, le] = s.split("/").map((se) => parseInt(se || "0", 10)), [ye, de, fe] = E.split("/").map((se) => parseInt(se || "0", 10)), me = new Date(le, q - 1, ne), he = new Date(fe, ye - 1, de), we = D(le, q, ne) && me.toString() !== "Invalid Date", ke = D(fe, ye, de) && he.toString() !== "Invalid Date";
     return { start: we ? me : null, end: ke ? he : null };
   }, F = e.externalValid ?? _(!0), o = h(() => g(t.value)), m = h(() => {
-    const n = $(o.value.start), s = $(o.value.end);
+    const n = C(o.value.start), s = C(o.value.end);
     return { start: n, end: s };
   }), l = h(() => {
     if (!f.value) return;
@@ -641,10 +647,10 @@ function Ge(e) {
       default:
         return "";
     }
-  }), C = ["ArrowUp", "ArrowDown"], G = ["ArrowLeft", "ArrowRight"], oe = (n, s) => String(n).padStart(s, "0"), Q = (n) => `${oe(n.getMonth() + 1, 2)}/${oe(n.getDate(), 2)}/${oe(
+  }), I = ["ArrowUp", "ArrowDown"], G = ["ArrowLeft", "ArrowRight"], oe = (n, s) => String(n).padStart(s, "0"), Q = (n) => `${oe(n.getMonth() + 1, 2)}/${oe(n.getDate(), 2)}/${oe(
     n.getFullYear(),
     4
-  )}`, H = (n) => n <= 2 ? { side: "start", part: "mm" } : n <= 5 ? { side: "start", part: (n <= 3, "dd") } : n <= 11 ? { side: "start", part: "yyyy" } : n <= 15 ? { side: "end", part: "mm" } : n <= 18 ? { side: "end", part: "dd" } : { side: "end", part: "yyyy" }, J = (n, s, E) => {
+  )}`, H = (n) => n <= 2 ? { side: "start", part: "mm" } : n <= 5 ? { side: "start", part: (n <= 3, "dd") } : n <= 11 ? { side: "start", part: "yyyy" } : n <= 15 ? { side: "end", part: "mm" } : n <= 18 ? { side: "end", part: "dd" } : { side: "end", part: "yyyy" }, j = (n, s, E) => {
     const q = s?.selectionStart ?? c.value ?? 0;
     c.value = q;
     const { start: ne, end: le } = g(t.value);
@@ -652,10 +658,10 @@ function Ge(e) {
       const B = /* @__PURE__ */ new Date(), ue = Q(B);
       t.value = `${ue} - ${ue}`, e.onChange({ value: { start: B, end: B }, event: E }), N(() => {
         requestAnimationFrame(() => {
-          const ee = document.getElementById(
+          const te = document.getElementById(
             e.id
           ), re = c.value ?? 0;
-          ee && (ee.focus(), ee.setSelectionRange(re, re));
+          te && (te.focus(), te.setSelectionRange(re, re));
         });
       });
       return;
@@ -664,16 +670,16 @@ function Ge(e) {
     let fe = ne ? new Date(ne) : new Date(ye), me = le ? new Date(le) : new Date(ye);
     const he = (B, ue) => {
       if (ue === "mm") {
-        const ee = B.getMonth() + 1, re = n === "ArrowUp" ? ee < 12 ? ee + 1 : 1 : ee > 1 ? ee - 1 : 12;
+        const te = B.getMonth() + 1, re = n === "ArrowUp" ? te < 12 ? te + 1 : 1 : te > 1 ? te - 1 : 12;
         B.setMonth(re - 1);
         const be = L(B.getFullYear(), re);
         B.getDate() > be && B.setDate(be);
       } else if (ue === "dd") {
-        const ee = L(B.getFullYear(), B.getMonth() + 1), re = B.getDate(), be = n === "ArrowUp" ? re < ee ? re + 1 : 1 : re > 1 ? re - 1 : ee;
+        const te = L(B.getFullYear(), B.getMonth() + 1), re = B.getDate(), be = n === "ArrowUp" ? re < te ? re + 1 : 1 : re > 1 ? re - 1 : te;
         B.setDate(be);
       } else if (ue === "yyyy") {
-        const ee = B.getFullYear();
-        B.setFullYear(n === "ArrowUp" ? ee + 1 : Math.max(1, ee - 1));
+        const te = B.getFullYear();
+        B.setFullYear(n === "ArrowUp" ? te + 1 : Math.max(1, te - 1));
         const re = L(B.getFullYear(), B.getMonth() + 1);
         B.getDate() > re && B.setDate(re);
       }
@@ -681,7 +687,7 @@ function Ge(e) {
     de.side === "start" ? he(fe, de.part) : he(me, de.part);
     const we = Q(fe), ke = Q(me);
     t.value = `${we} - ${ke}`;
-    const se = $(fe), De = $(me);
+    const se = C(fe), De = C(me);
     se && De && R(se, De) ? e.onChange({ value: { start: se, end: De }, event: E }) : e.onChange({ value: null, event: E }), N(() => {
       requestAnimationFrame(() => {
         const B = document.getElementById(
@@ -696,7 +702,7 @@ function Ge(e) {
       e.onChange({ value: null, event: n });
       return;
     }
-    const q = $(s), ne = $(E);
+    const q = C(s), ne = C(E);
     if (!q || !ne) {
       e.onChange({ value: null, event: n });
       return;
@@ -715,9 +721,9 @@ function Ge(e) {
     t.value = s;
     const q = E?.target;
     c.value = q?.selectionStart ?? 0, a(n);
-  }, I = (n) => {
+  }, M = (n) => {
     c.value = n.target.selectionStart ?? 0;
-  }, te = (n) => {
+  }, ee = (n) => {
     if (n.code === "Space" || n.key === " ") {
       n.preventDefault(), e.onShowCalendar(n);
       return;
@@ -726,24 +732,24 @@ function Ge(e) {
       n.preventDefault(), e.onShowCalendar(n);
       return;
     }
-    if (C.includes(n.key)) {
+    if (I.includes(n.key)) {
       n.preventDefault();
       const s = n.target;
-      J(n.key, s, n);
+      j(n.key, s, n);
     }
   }, r = (n) => {
     n.preventDefault();
     const s = n.deltaY < 0 ? "ArrowUp" : "ArrowDown";
-    J(s, n.target, n);
+    j(s, n.target, n);
   }, u = (n) => {
-    if (G.includes(n.key) || C.includes(n.key)) {
+    if (G.includes(n.key) || I.includes(n.key)) {
       n.preventDefault();
       const s = n.target;
       c.value = s?.selectionStart ?? 0;
     }
   }, v = () => {
     A.value = p.value, (e.manageValid ?? !0) && (F.value = i.value);
-  }, M = (n) => {
+  }, $ = (n) => {
     v();
   }, U = (n) => {
     console.log("Clear event:", n), t.value = "", c.value = 0, e.onChange({ value: null, event: n }), v(), N(() => {
@@ -771,17 +777,17 @@ function Ge(e) {
   );
   const ae = h(
     () => t.value && t.value.substring(0, 2).replace(/\D/g, "0") || "0"
-  ), j = h(
+  ), z = h(
     () => t.value && t.value.substring(3, 5).replace(/\D/g, "0") || "0"
   ), Y = h(
     () => t.value && t.value.substring(6, 10).replace(/\D/g, "0") || "0"
   ), ie = h(
     () => t.value && t.value.substring(13, 15).replace(/\D/g, "0") || "0"
-  ), z = h(
+  ), X = h(
     () => t.value && t.value.substring(16, 18).replace(/\D/g, "0") || "0"
   ), O = h(
     () => t.value && t.value.substring(19, 23).replace(/\D/g, "0") || "0"
-  ), X = h(() => {
+  ), J = h(() => {
     const { start: n, end: s } = g(t.value);
     return [
       {
@@ -799,13 +805,13 @@ function Ge(e) {
       {
         label: "Start",
         value: `${String(ae.value).padStart(2, "0")} / ${String(
-          j.value
+          z.value
         ).padStart(2, "0")} / ${String(Y.value).padStart(4, "0")}`
       },
       {
         label: "End",
         value: `${String(ie.value).padStart(2, "0")} / ${String(
-          z.value
+          X.value
         ).padStart(2, "0")} / ${String(O.value).padStart(4, "0")}`
       },
       { label: "Digits only", value: w.value },
@@ -839,7 +845,11 @@ function Ge(e) {
         return;
       }
       const s = n.closest("div");
-      s ? s.classList.add("fk-daterangepicker") : console.warn(`Parent div of #${e.id} not found for styling.`);
+      if (!s) {
+        console.warn(`Parent div of #${e.id} not found for styling.`);
+        return;
+      }
+      s.classList.contains("fk-daterangepicker") || s.classList.add("fk-daterangepicker");
     });
   };
   xe(() => {
@@ -878,7 +888,7 @@ function Ge(e) {
     raw: t,
     cursorPos: c,
     debugEnabled: P,
-    debugLines: X,
+    debugLines: J,
     digitsOnly: w,
     valid: F,
     validComputed: K(i),
@@ -886,21 +896,22 @@ function Ge(e) {
     validationMessage: K(S),
     spanDays: K(l),
     month1: K(ae),
-    day1: K(j),
+    day1: K(z),
     year1: K(Y),
     month2: K(ie),
-    day2: K(z),
+    day2: K(X),
     year2: K(O),
     handleChange: d,
-    handleKeyDown: te,
+    handleKeyDown: ee,
     handleWheel: r,
     handleKeyUp: u,
-    handleClick: I,
-    handleBlur: M,
+    handleClick: M,
+    handleBlur: $,
     handleClear: U,
     onCalendarChange: () => {
       T.value = !0;
-    }
+    },
+    initStyling: Z
   };
 }
 function je(e) {
@@ -917,26 +928,26 @@ function je(e) {
   }), x = h(() => {
     const r = t.value && t.value.substring(3, 5).replace(/\D/g, "0") || "0", u = parseInt(r);
     return Math.min(Math.max(u, 0), 59);
-  }), $ = h(() => (t.value?.substring(6, 8) || "AM").toUpperCase().startsWith("P") ? "PM" : "AM"), R = h(() => {
-    const r = parseInt(t.value?.substring(0, 2).replace(/\D/g, "0") || "0"), u = $.value;
+  }), C = h(() => (t.value?.substring(6, 8) || "AM").toUpperCase().startsWith("P") ? "PM" : "AM"), R = h(() => {
+    const r = parseInt(t.value?.substring(0, 2).replace(/\D/g, "0") || "0"), u = C.value;
     return r === 12 ? u === "AM" ? 0 : 12 : u === "PM" ? r + 12 : r;
   }), f = h(() => g.value ? `${String(R.value).padStart(2, "0")}:${String(x.value).padStart(2, "0")}:00` : null), g = h(
     () => /^(\d{2}):(\d{2})\s([AP]M)$/i.test(t.value ?? "")
   ), F = (r, u, v) => {
-    let M = r % 12;
-    return M === 0 && (M = 12), `${String(M).padStart(2, "0")}:${String(u).padStart(
+    let $ = r % 12;
+    return $ === 0 && ($ = 12), `${String($).padStart(2, "0")}:${String(u).padStart(
       2,
       "0"
     )} ${v}`;
   }, o = (r) => {
     const u = r.match(/^(\d{2}):(\d{2})\s([AP]M)$/i);
     if (!u) return null;
-    const v = parseInt(u[1]), M = parseInt(u[2]), U = u[3].toUpperCase();
-    if (v < 1 || v > 12 || M < 0 || M > 59) return null;
+    const v = parseInt(u[1]), $ = parseInt(u[2]), U = u[3].toUpperCase();
+    if (v < 1 || v > 12 || $ < 0 || $ > 59) return null;
     let ae = v % 12;
     U === "PM" && (ae += 12);
-    const j = /* @__PURE__ */ new Date();
-    return j.setSeconds(0, 0), j.setHours(ae), j.setMinutes(M), j;
+    const z = /* @__PURE__ */ new Date();
+    return z.setSeconds(0, 0), z.setHours(ae), z.setMinutes($), z;
   }, m = (r) => {
     if (y.value.length === 0) {
       e.onChange({ value: null, event: r });
@@ -949,14 +960,14 @@ function je(e) {
     const u = o(t.value);
     u && i(u) ? e.onChange({ value: u, event: r }) : e.onChange({ value: null, event: r });
   }, l = (r) => r.getHours() * 60 + r.getMinutes(), i = (r) => {
-    const u = e.min ?? void 0, v = e.max ?? void 0, M = l(r);
+    const u = e.min ?? void 0, v = e.max ?? void 0, $ = l(r);
     if (u) {
       const U = l(u);
-      if (M < U) return !1;
+      if ($ < U) return !1;
     }
     if (v) {
       const U = l(v);
-      if (M > U) return !1;
+      if ($ > U) return !1;
     }
     return !0;
   }, p = (r) => {
@@ -966,15 +977,15 @@ function je(e) {
     try {
       const v = c.value ?? 0;
       if (L(v) === "ampm" && (t.value ?? "").length >= 8) {
-        const M = t.value.charAt(6);
-        /[Aa]/.test(M) ? (t.value = `${t.value.slice(0, 6)}AM${t.value.slice(8)}`, N(() => {
+        const $ = t.value.charAt(6);
+        /[Aa]/.test($) ? (t.value = `${t.value.slice(0, 6)}AM${t.value.slice(8)}`, N(() => {
           requestAnimationFrame(() => {
             const U = document.getElementById(
               e.id
             );
             U && (U.focus(), U.setSelectionRange(8, 8));
           });
-        })) : /[Pp]/.test(M) && (t.value = `${t.value.slice(0, 6)}PM${t.value.slice(8)}`, N(() => {
+        })) : /[Pp]/.test($) && (t.value = `${t.value.slice(0, 6)}PM${t.value.slice(8)}`, N(() => {
           requestAnimationFrame(() => {
             const U = document.getElementById(
               e.id
@@ -989,13 +1000,13 @@ function je(e) {
   }, A = (r) => {
     c.value = r.target.selectionStart ?? 0;
   }, S = (r, u, v) => {
-    const M = u?.selectionStart ?? c.value ?? 0;
-    c.value = M;
-    const U = L(M), ae = (t.value ?? "").match(/^(\d{2}):(\d{2})\s([AP]M)$/i);
+    const $ = u?.selectionStart ?? c.value ?? 0;
+    c.value = $;
+    const U = L($), ae = (t.value ?? "").match(/^(\d{2}):(\d{2})\s([AP]M)$/i);
     if (!ae) {
       if ((t.value ?? "").length === 0 || y.value.length === 0) {
-        const O = /* @__PURE__ */ new Date(), X = O.getHours(), Z = X >= 12 ? "PM" : "AM";
-        t.value = F(X, O.getMinutes(), Z);
+        const O = /* @__PURE__ */ new Date(), J = O.getHours(), Z = J >= 12 ? "PM" : "AM";
+        t.value = F(J, O.getMinutes(), Z);
         const ge = o(t.value);
         ge && i(ge) ? e.onChange({ value: ge, event: v }) : e.onChange({ value: null, event: v }), N(() => {
           requestAnimationFrame(() => {
@@ -1008,37 +1019,37 @@ function je(e) {
       }
       return;
     }
-    let j = parseInt(ae[1]), Y = parseInt(ae[2]), ie = ae[3].toUpperCase();
+    let z = parseInt(ae[1]), Y = parseInt(ae[2]), ie = ae[3].toUpperCase();
     if (U === "hh")
-      r === "ArrowUp" ? j = j < 12 ? j + 1 : 1 : j = j > 1 ? j - 1 : 12;
+      r === "ArrowUp" ? z = z < 12 ? z + 1 : 1 : z = z > 1 ? z - 1 : 12;
     else if (U === "mm") {
       const O = e.minuteStepRef?.value ?? e.minuteStep ?? 1;
       if (O === 1)
         r === "ArrowUp" ? Y = Y < 59 ? Y + 1 : 0 : Y = Y > 0 ? Y - 1 : 59;
       else if (r === "ArrowUp") {
-        const X = Y % O;
-        let Z = X === 0 ? Y + O : Y + (O - X);
+        const J = Y % O;
+        let Z = J === 0 ? Y + O : Y + (O - J);
         Z >= 60 && (Z = 0), Y = Z;
       } else {
-        const X = Y % O;
-        let Z = X === 0 ? Y - O : Y - X;
+        const J = Y % O;
+        let Z = J === 0 ? Y - O : Y - J;
         Z < 0 && (Z = 60 - O), Y = Z;
       }
     } else U === "ampm" && (ie = ie === "AM" ? "PM" : "AM");
-    t.value = `${String(j).padStart(2, "0")}:${String(Y).padStart(
+    t.value = `${String(z).padStart(2, "0")}:${String(Y).padStart(
       2,
       "0"
     )} ${ie}`;
-    const z = o(t.value);
-    z && i(z) ? e.onChange({ value: z, event: v }) : e.onChange({ value: null, event: v }), N(() => {
+    const X = o(t.value);
+    X && i(X) ? e.onChange({ value: X, event: v }) : e.onChange({ value: null, event: v }), N(() => {
       requestAnimationFrame(() => {
         const O = document.getElementById(
           e.id
-        ), X = c.value ?? 0;
-        O && (O.focus(), O.setSelectionRange(X, X));
+        ), J = c.value ?? 0;
+        O && (O.focus(), O.setSelectionRange(J, J));
       });
     });
-  }, C = (r) => {
+  }, I = (r) => {
     if (r.code === "Space" || r.key === " ") {
       e.onShowPicker(r);
       return;
@@ -1070,8 +1081,8 @@ function je(e) {
       if (r) {
         const u = new Date(r);
         if (u.toString() !== "Invalid Date") {
-          const v = u.getHours(), M = v >= 12 ? "PM" : "AM";
-          t.value = F(v, u.getMinutes(), M);
+          const v = u.getHours(), $ = v >= 12 ? "PM" : "AM";
+          t.value = F(v, u.getMinutes(), $);
           return;
         }
       }
@@ -1083,12 +1094,12 @@ function je(e) {
     ["Hour (12h)", D.value],
     ["Hour (24h)", R.value],
     ["Minute", x.value],
-    ["Period", $.value],
+    ["Period", C.value],
     ["Time (24h)", f.value ?? "--:--:--"],
     ["Digits only", y.value],
     [
       "Parsed Date",
-      J.value?.toLocaleDateString("en-US", {
+      j.value?.toLocaleDateString("en-US", {
         hour: "2-digit",
         minute: "2-digit"
       }) ?? null
@@ -1109,30 +1120,30 @@ function je(e) {
     ],
     ["valid", a.value],
     ["reason", d.value],
-    ["validationMessage", I.value]
-  ]), J = h(
+    ["validationMessage", M.value]
+  ]), j = h(
     () => o(t.value) ?? null
   ), a = h(() => {
     if (!V.value) {
       if (!g.value) return !0;
-      const u = J.value;
+      const u = j.value;
       return u ? i(u) : !1;
     }
     if (!W.value) return !0;
-    const r = J.value;
+    const r = j.value;
     return !g.value || !r ? !1 : i(r);
   }), d = h(() => {
     if (!V.value) {
       if (!g.value) return;
-      const u = J.value;
+      const u = j.value;
       return u ? i(u) ? "valid" : "out-of-bounds" : "invalid-time";
     }
     if (!W.value) return;
     if (y.value.length === 0 || !g.value)
       return "incomplete";
-    const r = J.value;
+    const r = j.value;
     return r ? i(r) ? "valid" : "out-of-bounds" : "invalid-time";
-  }), I = h(() => {
+  }), M = h(() => {
     const r = d.value;
     if (!r || r === "valid") return "";
     if (r === "incomplete")
@@ -1142,14 +1153,14 @@ function je(e) {
     const u = {
       hour: "2-digit",
       minute: "2-digit"
-    }, v = e.min ? e.min.toLocaleTimeString("en-US", u) : null, M = e.max ? e.max.toLocaleTimeString("en-US", u) : null;
+    }, v = e.min ? e.min.toLocaleTimeString("en-US", u) : null, $ = e.max ? e.max.toLocaleTimeString("en-US", u) : null;
     if (r === "out-of-bounds") {
-      if (v && M) return `Must be between ${v} and ${M}.`;
+      if (v && $) return `Must be between ${v} and ${$}.`;
       if (v) return `Must be ${v} or later.`;
-      if (M) return `Must be ${M} or earlier.`;
+      if ($) return `Must be ${$} or earlier.`;
     }
     return "";
-  }), te = () => {
+  }), ee = () => {
     N(() => {
       const r = document.getElementById(e.id);
       if (!r) {
@@ -1157,20 +1168,24 @@ function je(e) {
         return;
       }
       const u = r.closest(".k-timepicker");
-      if (!u)
+      if (!u) {
         console.warn(
           `.k-timepicker parent of #${e.id} not found for styling.`
         );
-      else {
-        const v = u.parentElement;
-        v ? v.classList.add("fk-timepicker") : console.warn(
+        return;
+      }
+      const v = u.parentElement;
+      if (!v) {
+        console.warn(
           `Parent of .k-timepicker not found for #${e.id} styling.`
         );
+        return;
       }
+      v.classList.contains("fk-timepicker") || v.classList.add("fk-timepicker");
     });
   };
   return xe(() => {
-    te();
+    ee();
   }), {
     raw: t,
     rules: w,
@@ -1179,22 +1194,24 @@ function je(e) {
     placeholder: T,
     isValid: a,
     reason: K(d),
-    validationMessage: I,
+    validationMessage: M,
     isComplete: g,
     inRangeTime: i,
     cursorPos: c,
     hour: K(D),
     hour24: K(R),
     minute: K(x),
-    period: K($),
+    period: K(C),
     time24: K(f),
-    parsedRawTime: K(J),
+    parsedRawTime: K(j),
     handleChange: p,
-    handleKeyDown: C,
+    handleKeyDown: I,
     handleKeyUp: oe,
     handleClick: A,
     handleWheel: G,
-    handleBlur: Q
+    handleBlur: Q,
+    // Expose so consumers can reapply theming when Kendo updates DOM
+    initStyling: ee
   };
 }
 function Fe(e) {
@@ -1251,7 +1268,7 @@ function Ee(...e) {
       t.push(
         ...k.flatMap(
           (D) => b.flatMap(
-            (x) => y.map(($) => P(D, x, $, L))
+            (x) => y.map((C) => P(D, x, C, L))
           )
         )
       );
@@ -1300,7 +1317,7 @@ function Ye(e, t, c = {}) {
     }
   };
   let x = !1;
-  const $ = [
+  const C = [
     Ee(P, "click", (f) => {
       x || (x = !0, setTimeout(() => {
         x = !1;
@@ -1317,7 +1334,7 @@ function Ye(e, t, c = {}) {
         ((g = P.document.activeElement) == null ? void 0 : g.tagName) === "IFRAME" && !F?.contains(P.document.activeElement) && t(f);
       }, 0);
     }, { passive: !0 })
-  ].filter(Boolean), R = () => $.forEach((f) => f());
+  ].filter(Boolean), R = () => C.forEach((f) => f());
   return k ? {
     stop: R,
     cancel: () => {
@@ -1347,12 +1364,12 @@ function ze(e) {
   const y = () => {
     if (e.resolvePopupEl) return e.resolvePopupEl();
     const w = (D, x) => {
-      const $ = Array.from(D.querySelectorAll(x));
-      if (!$.length) return null;
-      const R = $.filter(
+      const C = Array.from(D.querySelectorAll(x));
+      if (!C.length) return null;
+      const R = C.filter(
         (f) => f.offsetParent !== null || f.getClientRects().length > 0
       );
-      return R[R.length - 1] ?? $[$.length - 1] ?? null;
+      return R[R.length - 1] ?? C[C.length - 1] ?? null;
     }, L = e.triggerEl?.value?.closest?.(".k-animation-container") ?? document.body;
     for (const D of P) {
       const x = w(L, D);
@@ -1376,8 +1393,8 @@ function ze(e) {
         }, document.addEventListener("keydown", k, !0)));
       })) : (W(), k && (document.removeEventListener("keydown", k, !0), k = null), t.value = null, b.value === "outside" && N(() => {
         const L = () => {
-          const D = e.triggerEl?.value, x = D?.querySelector("input"), $ = document.activeElement;
-          $ && ($ === x || D && D.contains($)) && (x ?? D)?.blur?.();
+          const D = e.triggerEl?.value, x = D?.querySelector("input"), C = document.activeElement;
+          C && (C === x || D && D.contains(C)) && (x ?? D)?.blur?.();
         };
         requestAnimationFrame(() => setTimeout(L, 0));
       }), e.returnFocusToTrigger !== !1 && b.value === "escape" && e.triggerEl?.value && (console.log(