dhx-react-suite 1.1.7 → 1.1.9

package/dist/dhx-react-suite.js

@@ -1,6 +1,6 @@
-import { jsxs as y, jsx as t, Fragment as Oe } from "react/jsx-runtime";
-import { useEffect as O, useRef as ne, useCallback as oe, useState as I, useMemo as le, createContext as Qe, useContext as Ze } from "react";
-import { Tooltip as et, Legend as tt, CartesianGrid as nt, XAxis as Ne, YAxis as Ee, BarChart as rt, Bar as ot, LineChart as it, Line as lt, AreaChart as st, Area as at, PieChart as dt, Pie as ct, Cell as ut, RadarChart as pt, PolarGrid as ht, PolarAngleAxis as ft, PolarRadiusAxis as xt, Radar as gt, ScatterChart as yt, Scatter as bt, ResponsiveContainer as mt, Treemap as vt } from "recharts";
+import { jsxs as g, jsx as t, Fragment as Ye } from "react/jsx-runtime";
+import { useEffect as J, useRef as le, useCallback as ae, useState as B, useMemo as ue, createContext as Qe, useContext as Ze } from "react";
+import { Tooltip as et, Legend as tt, CartesianGrid as nt, XAxis as Ne, YAxis as Ee, BarChart as rt, Bar as ot, LineChart as it, Line as lt, AreaChart as st, Area as at, PieChart as dt, Pie as ct, Cell as ut, RadarChart as pt, PolarGrid as ht, PolarAngleAxis as ft, PolarRadiusAxis as gt, Radar as xt, ScatterChart as yt, Scatter as bt, ResponsiveContainer as mt, Treemap as vt } from "recharts";
 const e = {
   primary: "#0288d1",
   primaryDk: "#01579b",
@@ -20,11 +20,11 @@ const e = {
   r: "4px",
   rMd: "8px",
   font: "'Segoe UI', system-ui, -apple-system, sans-serif"
-}, Re = "dhx-react-styles";
-function _() {
-  if (typeof document > "u" || document.getElementById(Re)) return;
+}, We = "dhx-react-styles";
+function Q() {
+  if (typeof document > "u" || document.getElementById(We)) return;
   const n = document.createElement("style");
-  n.id = Re, n.textContent = `
+  n.id = We, n.textContent = `
     *,*::before,*::after{box-sizing:border-box}
     .dhx{font-family:${e.font};font-size:14px;color:${e.text}}
     .dhx *{box-sizing:border-box}
@@ -66,112 +66,112 @@ function _() {
     .dhx-tag-warning{background:#fff3e0;color:#e65100}
   `, document.head.appendChild(n);
 }
-const kt = {
+const St = {
   sm: { height: 24, padding: "0 8px", fontSize: 12 },
   md: {},
   lg: { height: 38, padding: "0 18px", fontSize: 14 }
 };
-function Ot({
+function Xt({
   children: n,
-  variant: o = "primary",
+  variant: i = "primary",
   size: d = "md",
-  icon: s,
-  disabled: f,
-  onClick: a,
-  style: h,
-  className: u = ""
+  icon: l,
+  disabled: u,
+  onClick: s,
+  style: f,
+  className: p = ""
 }) {
-  return O(_, []), /* @__PURE__ */ y(
+  return J(Q, []), /* @__PURE__ */ g(
     "button",
     {
-      className: `dhx dhx-btn dhx-btn-${o} ${u}`,
-      style: { ...kt[d], ...h },
-      disabled: f,
-      onClick: a,
+      className: `dhx dhx-btn dhx-btn-${i} ${p}`,
+      style: { ...St[d], ...f },
+      disabled: u,
+      onClick: s,
       children: [
-        s && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: s }),
+        l && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: l }),
         n
       ]
     }
   );
 }
-function fe(n, o) {
-  O(() => {
-    const d = (s) => {
-      n.current && !n.current.contains(s.target) && o(s);
+function xe(n, i) {
+  J(() => {
+    const d = (l) => {
+      n.current && !n.current.contains(l.target) && i(l);
     };
     return document.addEventListener("mousedown", d), () => document.removeEventListener("mousedown", d);
-  }, [n, o]);
+  }, [n, i]);
 }
-function St(n) {
-  const o = ne(!1), d = ne({ x: 0, y: 0, ox: 0, oy: 0 });
-  return oe(
-    (s, f = 0, a = 0) => {
-      o.current = !0, d.current = { x: s.clientX, y: s.clientY, ox: f, oy: a };
-      const h = (g) => {
-        if (!o.current) return;
-        const { x: S, y: r, ox: i, oy: c } = d.current;
-        n(i + g.clientX - S, c + g.clientY - r);
-      }, u = () => {
-        o.current = !1, document.removeEventListener("mousemove", h), document.removeEventListener("mouseup", u);
+function kt(n) {
+  const i = le(!1), d = le({ x: 0, y: 0, ox: 0, oy: 0 });
+  return ae(
+    (l, u = 0, s = 0) => {
+      i.current = !0, d.current = { x: l.clientX, y: l.clientY, ox: u, oy: s };
+      const f = (x) => {
+        if (!i.current) return;
+        const { x: z, y: r, ox: b, oy: h } = d.current;
+        n(b + x.clientX - z, h + x.clientY - r);
+      }, p = () => {
+        i.current = !1, document.removeEventListener("mousemove", f), document.removeEventListener("mouseup", p);
       };
-      document.addEventListener("mousemove", h), document.addEventListener("mouseup", u), s.preventDefault();
+      document.addEventListener("mousemove", f), document.addEventListener("mouseup", p), l.preventDefault();
     },
     [n]
   );
 }
-function ge({ items: n, onSelect: o, style: d }) {
-  const [s, f] = I(null);
-  return /* @__PURE__ */ t("div", { className: "dhx dhx-anim-fade", style: { position: "absolute", top: "calc(100% + 4px)", left: 0, minWidth: 180, background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.r, boxShadow: e.shadowLg, zIndex: 200, padding: "4px 0", ...d }, children: n.map((a, h) => {
-    var g, S;
-    if (a.type === "separator") return /* @__PURE__ */ t("div", { style: { height: 1, background: e.border, margin: "4px 0" } }, h);
-    const u = s === h;
-    return /* @__PURE__ */ y("div", { style: { position: "relative" }, onMouseEnter: () => f(h), onMouseLeave: () => f(null), children: [
-      /* @__PURE__ */ y(
+function ge({ items: n, onSelect: i, style: d }) {
+  const [l, u] = B(null);
+  return /* @__PURE__ */ t("div", { className: "dhx dhx-anim-fade", style: { position: "absolute", top: "calc(100% + 4px)", left: 0, minWidth: 180, background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.r, boxShadow: e.shadowLg, zIndex: 200, padding: "4px 0", ...d }, children: n.map((s, f) => {
+    var x, z;
+    if (s.type === "separator") return /* @__PURE__ */ t("div", { style: { height: 1, background: e.border, margin: "4px 0" } }, f);
+    const p = l === f;
+    return /* @__PURE__ */ g("div", { style: { position: "relative" }, onMouseEnter: () => u(f), onMouseLeave: () => u(null), children: [
+      /* @__PURE__ */ g(
         "div",
         {
           onClick: () => {
             var r;
-            return !a.disabled && !((r = a.items) != null && r.length) && o(a);
+            return !s.disabled && !((r = s.items) != null && r.length) && i(s);
           },
-          style: { display: "flex", alignItems: "center", gap: 8, padding: "8px 14px", cursor: a.disabled ? "not-allowed" : "pointer", fontSize: 13, color: a.disabled ? e.textMut : e.text, background: u && !a.disabled ? e.bg : "transparent", opacity: a.disabled ? 0.5 : 1 },
+          style: { display: "flex", alignItems: "center", gap: 8, padding: "8px 14px", cursor: s.disabled ? "not-allowed" : "pointer", fontSize: 13, color: s.disabled ? e.textMut : e.text, background: p && !s.disabled ? e.bg : "transparent", opacity: s.disabled ? 0.5 : 1 },
           children: [
-            a.icon && /* @__PURE__ */ t("span", { style: { fontSize: 15, width: 18, textAlign: "center" }, children: a.icon }),
-            /* @__PURE__ */ t("span", { style: { flex: 1 }, children: a.value || a.id }),
-            a.hotkey && /* @__PURE__ */ t("span", { style: { fontSize: 11, color: e.textMut }, children: a.hotkey }),
-            (g = a.items) != null && g.length ? /* @__PURE__ */ t("span", { style: { fontSize: 10, color: e.textMut }, children: "▶" }) : null
+            s.icon && /* @__PURE__ */ t("span", { style: { fontSize: 15, width: 18, textAlign: "center" }, children: s.icon }),
+            /* @__PURE__ */ t("span", { style: { flex: 1 }, children: s.value || s.id }),
+            s.hotkey && /* @__PURE__ */ t("span", { style: { fontSize: 11, color: e.textMut }, children: s.hotkey }),
+            (x = s.items) != null && x.length ? /* @__PURE__ */ t("span", { style: { fontSize: 10, color: e.textMut }, children: "▶" }) : null
           ]
         }
       ),
-      u && ((S = a.items) != null && S.length) ? /* @__PURE__ */ t(ge, { items: a.items, onSelect: o, style: { position: "absolute", left: "100%", top: -4 } }) : null
-    ] }, a.id || h);
+      p && ((z = s.items) != null && z.length) ? /* @__PURE__ */ t(ge, { items: s.items, onSelect: i, style: { position: "absolute", left: "100%", top: -4 } }) : null
+    ] }, s.id || f);
   }) });
 }
-function Yt({ items: n = [], label: o = "Menu", onSelect: d, style: s }) {
-  const [f, a] = I(!1), h = ne(null);
-  return O(_, []), fe(h, oe(() => a(!1), [])), /* @__PURE__ */ y("div", { ref: h, className: "dhx", style: { position: "relative", display: "inline-block", ...s }, children: [
-    /* @__PURE__ */ y("button", { className: "dhx dhx-btn dhx-btn-secondary", onClick: () => a((u) => !u), children: [
-      o,
+function qt({ items: n = [], label: i = "Menu", onSelect: d, style: l }) {
+  const [u, s] = B(!1), f = le(null);
+  return J(Q, []), xe(f, ae(() => s(!1), [])), /* @__PURE__ */ g("div", { ref: f, className: "dhx", style: { position: "relative", display: "inline-block", ...l }, children: [
+    /* @__PURE__ */ g("button", { className: "dhx dhx-btn dhx-btn-secondary", onClick: () => s((p) => !p), children: [
+      i,
       " ",
-      /* @__PURE__ */ t("span", { style: { fontSize: 10 }, children: f ? "▲" : "▼" })
+      /* @__PURE__ */ t("span", { style: { fontSize: 10 }, children: u ? "▲" : "▼" })
     ] }),
-    f && /* @__PURE__ */ t(ge, { items: n, onSelect: (u) => {
-      d == null || d(u), a(!1);
+    u && /* @__PURE__ */ t(ge, { items: n, onSelect: (p) => {
+      d == null || d(p), s(!1);
     } })
   ] });
 }
-function Kt({ items: n = [], onSelect: o, children: d }) {
-  const [s, f] = I(null), a = ne(null);
-  return O(_, []), fe(a, oe(() => f(null), [])), /* @__PURE__ */ y("div", { ref: a, onContextMenu: (u) => {
-    u.preventDefault(), f({ x: u.clientX, y: u.clientY });
+function Gt({ items: n = [], onSelect: i, children: d }) {
+  const [l, u] = B(null), s = le(null);
+  return J(Q, []), xe(s, ae(() => u(null), [])), /* @__PURE__ */ g("div", { ref: s, onContextMenu: (p) => {
+    p.preventDefault(), u({ x: p.clientX, y: p.clientY });
   }, style: { position: "relative", display: "contents" }, children: [
     d,
-    s && /* @__PURE__ */ t("div", { style: { position: "fixed", left: s.x, top: s.y, zIndex: 9999 }, children: /* @__PURE__ */ t(ge, { items: n, onSelect: (u) => {
-      o == null || o(u), f(null);
+    l && /* @__PURE__ */ t("div", { style: { position: "fixed", left: l.x, top: l.y, zIndex: 9999 }, children: /* @__PURE__ */ t(ge, { items: n, onSelect: (p) => {
+      i == null || i(p), u(null);
     } }) })
   ] });
 }
-function We({ count: n }) {
+function Be({ count: n }) {
   return /* @__PURE__ */ t("span", { style: {
     position: "absolute",
     top: 2,
@@ -191,36 +191,36 @@ function We({ count: n }) {
     pointerEvents: "none"
   }, children: n });
 }
-function _t({ items: n = [], onAction: o, style: d }) {
-  const [s, f] = I(null), [a, h] = I(() => {
+function Jt({ items: n = [], onAction: i, style: d }) {
+  const [l, u] = B(null), [s, f] = B(() => {
     const r = {};
-    return n.forEach((i) => {
-      i.id && (i.twoState || i.group) && i.active && (r[i.id] = !0);
+    return n.forEach((b) => {
+      b.id && (b.twoState || b.group) && b.active && (r[b.id] = !0);
     }), r;
-  }), u = ne(null);
-  O(_, []), fe(u, oe(() => f(null), []));
-  const g = (r, i) => {
-    var c, m;
+  }), p = le(null);
+  J(Q, []), xe(p, ae(() => u(null), []));
+  const x = (r, b) => {
+    var h, M;
     if (!r.disabled) {
-      if (r.twoState && r.id && h((v) => ({ ...v, [r.id]: !v[r.id] })), r.group && r.id && h((v) => {
-        const l = { ...v };
-        return n.forEach((x) => {
-          x.group === r.group && x.id && (l[x.id] = !1);
-        }), l[r.id] = !0, l;
-      }), (c = r.items) != null && c.length) {
-        f((v) => v === i ? null : i);
+      if (r.twoState && r.id && f((R) => ({ ...R, [r.id]: !R[r.id] })), r.group && r.id && f((R) => {
+        const a = { ...R };
+        return n.forEach((k) => {
+          k.group === r.group && k.id && (a[k.id] = !1);
+        }), a[r.id] = !0, a;
+      }), (h = r.items) != null && h.length) {
+        u((R) => R === b ? null : b);
         return;
       }
-      (m = r.onClick) == null || m.call(r, r.id || ""), o == null || o(r.id || "");
+      (M = r.onClick) == null || M.call(r, r.id || ""), i == null || i(r.id || "");
     }
-  }, S = (r, i) => {
-    var l, x;
+  }, z = (r, b) => {
+    var a, k;
     if (r.hidden) return null;
-    if (r.type === "separator") return /* @__PURE__ */ t("div", { style: { width: 1, background: e.border, margin: "6px 4px", alignSelf: "stretch" } }, i);
-    if (r.type === "spacer") return /* @__PURE__ */ t("div", { style: { flex: 1 } }, i);
-    if (r.type === "input") return /* @__PURE__ */ y("div", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
+    if (r.type === "separator") return /* @__PURE__ */ t("div", { style: { width: 1, background: e.border, margin: "6px 4px", alignSelf: "stretch" } }, b);
+    if (r.type === "spacer") return /* @__PURE__ */ t("div", { style: { flex: 1 } }, b);
+    if (r.type === "input") return /* @__PURE__ */ g("div", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
       r.label && /* @__PURE__ */ t("span", { style: { fontSize: 12, color: e.textSec, fontWeight: 500 }, children: r.label }),
-      /* @__PURE__ */ y("div", { style: { position: "relative", display: "flex", alignItems: "center" }, children: [
+      /* @__PURE__ */ g("div", { style: { position: "relative", display: "flex", alignItems: "center" }, children: [
         r.icon && /* @__PURE__ */ t("span", { style: { position: "absolute", left: 8, color: e.textMut, fontSize: 15, pointerEvents: "none", zIndex: 1 }, children: r.icon }),
         /* @__PURE__ */ t(
           "input",
@@ -229,15 +229,15 @@ function _t({ items: n = [], onAction: o, style: d }) {
             style: { width: r.width || 140, height: 28, paddingLeft: r.icon ? 30 : void 0 },
             placeholder: r.placeholder,
             defaultValue: r.value,
-            onChange: (w) => {
-              var z;
-              return (z = r.onChange) == null ? void 0 : z.call(r, w.target.value);
+            onChange: (C) => {
+              var L;
+              return (L = r.onChange) == null ? void 0 : L.call(r, C.target.value);
             }
           }
         )
       ] })
-    ] }, i);
-    if (r.type === "select") return /* @__PURE__ */ y("div", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
+    ] }, b);
+    if (r.type === "select") return /* @__PURE__ */ g("div", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
       r.label && /* @__PURE__ */ t("span", { style: { fontSize: 12, color: e.textSec, fontWeight: 500 }, children: r.label }),
       /* @__PURE__ */ t(
         "select",
@@ -245,15 +245,15 @@ function _t({ items: n = [], onAction: o, style: d }) {
           className: "dhx dhx-input",
           style: { width: r.width || 100, height: 28, cursor: "pointer" },
           defaultValue: r.value,
-          onChange: (w) => {
-            var z;
-            return (z = r.onChange) == null ? void 0 : z.call(r, w.target.value);
+          onChange: (C) => {
+            var L;
+            return (L = r.onChange) == null ? void 0 : L.call(r, C.target.value);
           },
-          children: (l = r.options) == null ? void 0 : l.map((w) => /* @__PURE__ */ t("option", { value: w.value, children: w.label }, w.value))
+          children: (a = r.options) == null ? void 0 : a.map((C) => /* @__PURE__ */ t("option", { value: C.value, children: C.label }, C.value))
         }
       )
-    ] }, i);
-    if (r.type === "imageButton") return /* @__PURE__ */ y(
+    ] }, b);
+    if (r.type === "imageButton") return /* @__PURE__ */ g(
       "button",
       {
         title: r.tooltip,
@@ -270,17 +270,17 @@ function _t({ items: n = [], onAction: o, style: d }) {
           background: "transparent",
           flexShrink: 0
         },
-        onClick: () => g(r, i),
+        onClick: () => x(r, b),
         children: [
           r.src && /* @__PURE__ */ t("img", { src: r.src, alt: r.value || "", style: { width: "100%", height: "100%", objectFit: "cover", borderRadius: "50%" } }),
-          r.count !== void 0 && /* @__PURE__ */ t(We, { count: r.count })
+          r.count !== void 0 && /* @__PURE__ */ t(Be, { count: r.count })
         ]
       },
-      i
+      b
     );
-    const c = !!(r.id && a[r.id]), m = r.value ?? r.text, v = !!((x = r.items) != null && x.length);
-    return /* @__PURE__ */ y("div", { style: { position: "relative" }, children: [
-      /* @__PURE__ */ y(
+    const h = !!(r.id && s[r.id]), M = r.value ?? r.text, R = !!((k = r.items) != null && k.length);
+    return /* @__PURE__ */ g("div", { style: { position: "relative" }, children: [
+      /* @__PURE__ */ g(
         "button",
         {
           className: "dhx dhx-btn dhx-btn-ghost",
@@ -290,34 +290,34 @@ function _t({ items: n = [], onAction: o, style: d }) {
             height: 32,
             gap: 4,
             position: "relative",
-            background: c ? e.primaryLt : "transparent",
-            color: c ? e.primary : r.disabled ? e.textMut : e.text,
+            background: h ? e.primaryLt : "transparent",
+            color: h ? e.primary : r.disabled ? e.textMut : e.text,
             opacity: r.disabled ? 0.55 : 1,
             cursor: r.disabled ? "not-allowed" : "pointer"
           },
-          onClick: () => g(r, i),
+          onClick: () => x(r, b),
           children: [
             r.icon && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: r.icon }),
-            m && /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: m }),
-            v && /* @__PURE__ */ t("span", { style: { fontSize: 9, opacity: 0.55, marginLeft: 2 }, children: "▼" }),
-            r.count !== void 0 && /* @__PURE__ */ t(We, { count: r.count })
+            M && /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: M }),
+            R && /* @__PURE__ */ t("span", { style: { fontSize: 9, opacity: 0.55, marginLeft: 2 }, children: "▼" }),
+            r.count !== void 0 && /* @__PURE__ */ t(Be, { count: r.count })
           ]
         }
       ),
-      v && s === i && /* @__PURE__ */ t(
+      R && l === b && /* @__PURE__ */ t(
         ge,
         {
           items: r.items,
-          onSelect: () => f(null),
+          onSelect: () => u(null),
           style: { top: "100%", left: 0 }
         }
       )
-    ] }, i);
+    ] }, b);
   };
   return /* @__PURE__ */ t(
     "div",
     {
-      ref: u,
+      ref: p,
       className: "dhx",
       style: {
         display: "flex",
@@ -330,50 +330,262 @@ function _t({ items: n = [], onAction: o, style: d }) {
         flexWrap: "wrap",
         ...d
       },
-      children: n.map(S)
+      children: n.map(z)
     }
   );
 }
-function Vt({ items: n = [], width: o = 240, collapsed: d, onSelect: s, header: f, footer: a, style: h }) {
-  const [u, g] = I(d ?? !1), [S, r] = I(null), [i, c] = I({});
-  O(_, []);
-  const m = u ? 56 : o, v = (x) => {
-    r(x.id), s == null || s(x);
-  }, l = (x, w = 0) => {
-    var $;
-    if (x.type === "separator") return /* @__PURE__ */ t("div", { style: { height: 1, background: e.border, margin: "6px 8px" } }, x.id);
-    if (x.type === "customHTML") return /* @__PURE__ */ t("div", { style: { padding: "8px 12px" }, dangerouslySetInnerHTML: { __html: x.html || "" } }, x.id);
-    const z = ((($ = x.items) == null ? void 0 : $.length) ?? 0) > 0, N = i[x.id], k = S === x.id;
-    return /* @__PURE__ */ y("div", { children: [
-      /* @__PURE__ */ y(
+function wt(n) {
+  return n === "primary" ? e.primary : n === "success" ? "#43a047" : n === "secondary" ? "#9e9e9e" : "#e53935";
+}
+function zt(n, i) {
+  const d = [], l = (u) => {
+    var s;
+    u.id && u.group === i && d.push(u.id), (s = u.items) == null || s.forEach(l);
+  };
+  return n.forEach(l), d;
+}
+function Mt(n) {
+  const i = {}, d = (l) => {
+    var u;
+    l.id && l.twoState && l.active && (i[l.id] = !0), (u = l.items) == null || u.forEach(d);
+  };
+  return n.forEach(d), i;
+}
+function Ut({
+  items: n = [],
+  width: i = 240,
+  minWidth: d = 64,
+  header: l,
+  footer: u,
+  collapsed: s,
+  defaultCollapsed: f,
+  selected: p,
+  defaultSelected: x,
+  onSelect: z,
+  onCollapse: r,
+  onExpand: b,
+  onBeforeCollapse: h,
+  onBeforeExpand: M,
+  onToggleItem: R,
+  style: a
+}) {
+  const k = s !== void 0, C = p !== void 0, [L, H] = B(f ?? !1), [$, D] = B(x ?? null), [K, c] = B({}), [N, A] = B(() => Mt(n));
+  J(Q, []);
+  const S = k ? s : L, U = C ? p ?? null : $, Z = S ? d : i, o = () => {
+    if (S) {
+      if ((M == null ? void 0 : M()) === !1) return;
+      k || H(!1), b == null || b();
+    } else {
+      if ((h == null ? void 0 : h()) === !1) return;
+      k || H(!0), r == null || r();
+    }
+  }, E = (m) => {
+    C || D(m.id ?? null), z == null || z(m), m.id && m.onClick && m.onClick(m.id);
+  }, _ = (m) => {
+    if (!m.id) return;
+    const j = !N[m.id];
+    let Y = { ...N, [m.id]: j };
+    m.group && j && zt(n, m.group).forEach((G) => {
+      G !== m.id && (Y[G] = !1);
+    }), A(Y), R == null || R(m.id, j);
+  }, w = (m, j) => {
+    if (m.count === void 0) return null;
+    const Y = wt(m.countColor), G = m.count > 99 ? "99+" : String(m.count);
+    return j ? /* @__PURE__ */ t("span", { style: {
+      position: "absolute",
+      top: 1,
+      right: 1,
+      background: Y,
+      color: "#fff",
+      borderRadius: 8,
+      fontSize: 9,
+      fontWeight: 700,
+      padding: "0 3px",
+      minWidth: 14,
+      textAlign: "center",
+      lineHeight: "14px",
+      pointerEvents: "none"
+    }, children: G }) : /* @__PURE__ */ t("span", { style: {
+      background: Y,
+      color: "#fff",
+      borderRadius: 10,
+      padding: "1px 6px",
+      fontSize: 11,
+      fontWeight: 700,
+      flexShrink: 0
+    }, children: G });
+  }, v = (m, j, Y) => {
+    var ce;
+    if (m.hidden) return null;
+    const G = m.id ?? `${m.type ?? "navItem"}-${j}-${Y}`, V = m.type ?? "navItem";
+    if (V === "separator") return /* @__PURE__ */ t("div", { style: { height: 1, background: e.border, margin: "6px 8px", flexShrink: 0 } }, G);
+    if (V === "spacer") return /* @__PURE__ */ t("div", { style: { flex: 1 } }, G);
+    if (V === "title")
+      return S ? null : /* @__PURE__ */ t("div", { style: {
+        padding: "10px 14px 4px",
+        fontSize: 10,
+        fontWeight: 700,
+        textTransform: "uppercase",
+        letterSpacing: 1,
+        color: e.textMut,
+        flexShrink: 0
+      }, children: m.value }, G);
+    if (V === "customHTML") return /* @__PURE__ */ t(
+      "div",
+      {
+        dangerouslySetInnerHTML: { __html: m.html ?? "" },
+        style: { padding: "8px 12px", flexShrink: 0 }
+      },
+      G
+    );
+    const q = (((ce = m.items) == null ? void 0 : ce.length) ?? 0) > 0, ee = !!K[m.id ?? ""], te = m.twoState ? !!N[m.id ?? ""] : !1, ne = !m.twoState && U === m.id || te, P = !!m.disabled, de = S ? 0 : 12 + j * 16, ve = () => {
+      P || (m.twoState ? (_(m), E(m)) : (q && c((se) => ({ ...se, [m.id ?? ""]: !se[m.id ?? ""] })), E(m)));
+    };
+    return /* @__PURE__ */ g("div", { style: { flexShrink: 0 }, children: [
+      /* @__PURE__ */ g(
         "div",
         {
-          onClick: () => {
-            z && c((W) => ({ ...W, [x.id]: !W[x.id] })), v(x);
+          title: m.tooltip,
+          onClick: ve,
+          style: {
+            display: "flex",
+            alignItems: "center",
+            gap: S ? 0 : 8,
+            justifyContent: S ? "center" : "flex-start",
+            paddingTop: 8,
+            paddingBottom: 8,
+            paddingLeft: S ? 0 : de,
+            paddingRight: S ? 0 : 10,
+            borderRadius: e.r,
+            margin: "1px 6px",
+            cursor: P ? "not-allowed" : "pointer",
+            userSelect: "none",
+            transition: "background .15s",
+            background: ne ? e.primaryLt : "transparent",
+            color: P ? e.textMut : ne ? e.primary : e.text,
+            opacity: P ? 0.55 : 1
+          },
+          onMouseEnter: (se) => {
+            !ne && !P && (se.currentTarget.style.background = e.bg);
+          },
+          onMouseLeave: (se) => {
+            !ne && !P && (se.currentTarget.style.background = "transparent");
           },
-          style: { display: "flex", alignItems: "center", gap: 10, padding: `8px ${u ? "0px" : `${12 + w * 16}px`}`, cursor: "pointer", borderRadius: e.r, margin: "1px 6px", justifyContent: u ? "center" : "flex-start", transition: "all .15s", background: k ? e.primaryLt : "transparent", color: k ? e.primary : e.text, userSelect: "none" },
-          onMouseEnter: (W) => !k && (W.currentTarget.style.background = e.bg),
-          onMouseLeave: (W) => !k && (W.currentTarget.style.background = "transparent"),
           children: [
-            x.icon && /* @__PURE__ */ t("span", { style: { fontSize: 18, minWidth: 22, textAlign: "center" }, children: x.icon }),
-            !u && /* @__PURE__ */ t("span", { style: { flex: 1, fontSize: 13, fontWeight: k ? 600 : 400 }, children: x.value }),
-            !u && x.count !== void 0 && /* @__PURE__ */ t("span", { style: { background: e.primary, color: "#fff", borderRadius: 10, padding: "1px 6px", fontSize: 11, fontWeight: 700 }, children: x.count }),
-            !u && z && /* @__PURE__ */ t("span", { style: { fontSize: 12, color: e.textMut, transition: "transform .15s", transform: N ? "rotate(90deg)" : "rotate(0deg)" }, children: "▶" })
+            /* @__PURE__ */ g("span", { style: {
+              position: "relative",
+              minWidth: 22,
+              textAlign: "center",
+              fontSize: 18,
+              flexShrink: 0,
+              lineHeight: 1
+            }, children: [
+              m.icon ?? (m.value && !m.icon, null),
+              S && w(m, !0)
+            ] }),
+            !S && /* @__PURE__ */ t("span", { style: {
+              flex: 1,
+              fontSize: 13,
+              fontWeight: ne ? 600 : 400,
+              overflow: "hidden",
+              textOverflow: "ellipsis",
+              whiteSpace: "nowrap"
+            }, children: m.value }),
+            !S && w(m, !1),
+            !S && m.twoState && /* @__PURE__ */ t("span", { style: {
+              width: 14,
+              height: 14,
+              borderRadius: 2,
+              border: `2px solid ${ne ? e.primary : e.borderDk}`,
+              background: ne ? e.primary : "transparent",
+              flexShrink: 0,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center"
+            }, children: ne && /* @__PURE__ */ t("span", { style: { color: "#fff", fontSize: 8, fontWeight: 700, lineHeight: 1 }, children: "✓" }) }),
+            !S && q && !m.twoState && /* @__PURE__ */ t("span", { style: {
+              fontSize: 11,
+              color: e.textMut,
+              flexShrink: 0,
+              transition: "transform .2s",
+              transform: ee ? "rotate(90deg)" : "rotate(0deg)",
+              display: "inline-block"
+            }, children: "▶" })
           ]
         }
       ),
-      z && N && !u && x.items.map((W) => l(W, w + 1))
-    ] }, x.id);
-  };
-  return /* @__PURE__ */ y("div", { className: "dhx", style: { width: m, minWidth: m, background: e.surface, borderRight: `1px solid ${e.border}`, display: "flex", flexDirection: "column", transition: "width .2s ease", overflow: "hidden", ...h }, children: [
-    f && !u && /* @__PURE__ */ t("div", { style: { padding: "12px 14px", borderBottom: `1px solid ${e.border}`, fontWeight: 700, fontSize: 15 }, children: f }),
-    /* @__PURE__ */ t("button", { onClick: () => g((x) => !x), style: { margin: "8px 6px", background: "transparent", border: "none", cursor: "pointer", display: "flex", alignItems: "center", justifyContent: u ? "center" : "flex-end", padding: "4px 6px", borderRadius: e.r, color: e.textSec }, children: /* @__PURE__ */ t("span", { style: { fontSize: 18 }, children: u ? "☰" : "✕" }) }),
-    /* @__PURE__ */ t("div", { className: "dhx-scroll", style: { flex: 1, overflowY: "auto", overflowX: "hidden" }, children: n.map((x) => l(x)) }),
-    a && !u && /* @__PURE__ */ t("div", { style: { padding: "10px 14px", borderTop: `1px solid ${e.border}` }, children: a })
-  ] });
+      q && ee && !S && /* @__PURE__ */ t("div", { children: m.items.map((se, be) => v(se, j + 1, be)) })
+    ] }, G);
+  }, T = /* @__PURE__ */ g(
+    "div",
+    {
+      onClick: o,
+      style: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: S ? "center" : "flex-start",
+        gap: 8,
+        padding: S ? "8px 0" : "8px 14px",
+        margin: "4px 6px",
+        borderRadius: e.r,
+        cursor: "pointer",
+        color: e.textMut,
+        fontSize: 13,
+        userSelect: "none",
+        transition: "background .15s",
+        flexShrink: 0
+      },
+      onMouseEnter: (m) => m.currentTarget.style.background = e.bg,
+      onMouseLeave: (m) => m.currentTarget.style.background = "transparent",
+      children: [
+        /* @__PURE__ */ t("span", { style: { fontSize: 16, fontWeight: 700, lineHeight: 1 }, children: S ? "›" : "‹" }),
+        !S && /* @__PURE__ */ t("span", { children: "Collapse" })
+      ]
+    }
+  );
+  return /* @__PURE__ */ g(
+    "div",
+    {
+      className: "dhx",
+      style: {
+        width: Z,
+        minWidth: Z,
+        background: e.surface,
+        borderRight: `1px solid ${e.border}`,
+        display: "flex",
+        flexDirection: "column",
+        transition: "width .2s ease, min-width .2s ease",
+        overflow: "hidden",
+        ...a
+      },
+      children: [
+        l && /* @__PURE__ */ t("div", { style: {
+          padding: S ? "12px 0" : "12px 14px",
+          borderBottom: `1px solid ${e.border}`,
+          fontWeight: 700,
+          fontSize: 15,
+          display: "flex",
+          alignItems: "center",
+          justifyContent: S ? "center" : "flex-start",
+          overflow: "hidden",
+          flexShrink: 0
+        }, children: l }),
+        /* @__PURE__ */ t(
+          "div",
+          {
+            className: "dhx-scroll",
+            style: { flex: 1, overflowY: "auto", overflowX: "hidden", display: "flex", flexDirection: "column" },
+            children: n.map((m, j) => v(m, 0, j))
+          }
+        ),
+        T,
+        u && !S && /* @__PURE__ */ t("div", { style: { padding: "10px 14px", borderTop: `1px solid ${e.border}`, flexShrink: 0 }, children: u })
+      ]
+    }
+  );
 }
-function wt({ config: n }) {
-  const [o, d] = I(!1), s = {
+function $t({ config: n }) {
+  const [i, d] = B(!1), l = {
     position: "relative",
     background: e.surface,
     border: `1px solid ${e.border}`,
@@ -381,121 +593,121 @@ function wt({ config: n }) {
     overflow: "hidden",
     ...n.width ? { width: n.width, minWidth: n.width } : { flex: 1 },
     ...n.height ? { height: n.height, minHeight: n.height } : { minHeight: 40 },
-    ...o ? { flex: "0 0 auto" } : {}
+    ...i ? { flex: "0 0 auto" } : {}
   };
-  return /* @__PURE__ */ y("div", { style: s, children: [
-    n.header && /* @__PURE__ */ y("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", padding: "6px 12px", background: e.bg, borderBottom: `1px solid ${e.border}`, fontSize: 12, fontWeight: 600, color: e.textSec, userSelect: "none" }, children: [
+  return /* @__PURE__ */ g("div", { style: l, children: [
+    n.header && /* @__PURE__ */ g("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", padding: "6px 12px", background: e.bg, borderBottom: `1px solid ${e.border}`, fontSize: 12, fontWeight: 600, color: e.textSec, userSelect: "none" }, children: [
       /* @__PURE__ */ t("span", { children: n.header }),
-      n.collapsable && /* @__PURE__ */ t("button", { onClick: () => d((f) => !f), style: { background: "none", border: "none", cursor: "pointer", color: e.textMut, fontSize: 16, lineHeight: 1 }, children: o ? "▼" : "▲" })
+      n.collapsable && /* @__PURE__ */ t("button", { onClick: () => d((u) => !u), style: { background: "none", border: "none", cursor: "pointer", color: e.textMut, fontSize: 16, lineHeight: 1 }, children: i ? "▼" : "▲" })
     ] }),
-    !o && /* @__PURE__ */ y("div", { style: { padding: n.padding || 0, height: n.header ? "calc(100% - 33px)" : "100%", overflow: "auto" }, children: [
+    !i && /* @__PURE__ */ g("div", { style: { padding: n.padding || 0, height: n.header ? "calc(100% - 33px)" : "100%", overflow: "auto" }, children: [
       n.html ? /* @__PURE__ */ t("div", { dangerouslySetInnerHTML: { __html: n.html } }) : n.content,
-      (n.rows || n.cols) && /* @__PURE__ */ t(zt, { rows: n.rows, cols: n.cols, style: { height: "100%" } })
+      (n.rows || n.cols) && /* @__PURE__ */ t(Ct, { rows: n.rows, cols: n.cols, style: { height: "100%" } })
     ] })
   ] });
 }
-function zt({ rows: n, cols: o, type: d = "line", style: s, children: f }) {
-  O(_, []);
-  const a = d === "space" ? 12 : d === "wide" ? 8 : 1, h = n || o, u = !!n;
-  return h ? /* @__PURE__ */ t("div", { className: "dhx", style: { display: "flex", flexDirection: u ? "column" : "row", gap: a, width: "100%", height: "100%", ...s }, children: h.map((g, S) => /* @__PURE__ */ t(wt, { config: g }, g.id || S)) }) : /* @__PURE__ */ t("div", { className: "dhx", style: { width: "100%", height: "100%", ...s }, children: f });
+function Ct({ rows: n, cols: i, type: d = "line", style: l, children: u }) {
+  J(Q, []);
+  const s = d === "space" ? 12 : d === "wide" ? 8 : 1, f = n || i, p = !!n;
+  return f ? /* @__PURE__ */ t("div", { className: "dhx", style: { display: "flex", flexDirection: p ? "column" : "row", gap: s, width: "100%", height: "100%", ...l }, children: f.map((x, z) => /* @__PURE__ */ t($t, { config: x }, x.id || z)) }) : /* @__PURE__ */ t("div", { className: "dhx", style: { width: "100%", height: "100%", ...l }, children: u });
 }
-function Xt({ views: n = [], mode: o = "top", tabAlign: d = "left", closable: s = [], disabled: f = [], defaultActive: a, onBeforeChange: h, onChange: u, style: g }) {
-  var k;
-  const [S, r] = I(a || ((k = n[0]) == null ? void 0 : k.id)), [i, c] = I(n.map(($) => $.id));
-  O(_, []);
-  const m = ($, W) => {
-    $.stopPropagation(), c((p) => p.filter((T) => T !== W)), S === W && r(i.find((p) => p !== W) ?? "");
-  }, v = ($) => {
-    f.includes($) || h && h($) === !1 || (r($), u == null || u($));
-  }, l = o === "left" || o === "right", x = n.filter(($) => i.includes($.id)), w = /* @__PURE__ */ t("div", { style: { display: "flex", flexDirection: l ? "column" : "row", justifyContent: d === "center" ? "center" : d === "right" ? "flex-end" : "flex-start", background: e.surface, borderBottom: !l && o !== "bottom" ? `2px solid ${e.border}` : "none", borderTop: o === "bottom" ? `2px solid ${e.border}` : "none", borderRight: o === "left" ? `2px solid ${e.border}` : "none", borderLeft: o === "right" ? `2px solid ${e.border}` : "none", overflowX: "auto", flexShrink: 0 }, children: x.map(($) => {
-    const W = S === $.id, p = f.includes($.id), T = o === "bottom" ? { borderTop: `2px solid ${e.primary}`, color: e.primary, fontWeight: 600 } : l ? { color: e.primary, fontWeight: 600, background: e.primaryLt, [o === "left" ? "borderRight" : "borderLeft"]: `2px solid ${e.primary}` } : { borderBottom: `2px solid ${e.primary}`, color: e.primary, fontWeight: 600 };
-    return /* @__PURE__ */ y(
+function Qt({ views: n = [], mode: i = "top", tabAlign: d = "left", closable: l = [], disabled: u = [], defaultActive: s, onBeforeChange: f, onChange: p, style: x }) {
+  var $;
+  const [z, r] = B(s || (($ = n[0]) == null ? void 0 : $.id)), [b, h] = B(n.map((D) => D.id));
+  J(Q, []);
+  const M = (D, K) => {
+    D.stopPropagation(), h((c) => c.filter((N) => N !== K)), z === K && r(b.find((c) => c !== K) ?? "");
+  }, R = (D) => {
+    u.includes(D) || f && f(D) === !1 || (r(D), p == null || p(D));
+  }, a = i === "left" || i === "right", k = n.filter((D) => b.includes(D.id)), C = /* @__PURE__ */ t("div", { style: { display: "flex", flexDirection: a ? "column" : "row", justifyContent: d === "center" ? "center" : d === "right" ? "flex-end" : "flex-start", background: e.surface, borderBottom: !a && i !== "bottom" ? `2px solid ${e.border}` : "none", borderTop: i === "bottom" ? `2px solid ${e.border}` : "none", borderRight: i === "left" ? `2px solid ${e.border}` : "none", borderLeft: i === "right" ? `2px solid ${e.border}` : "none", overflowX: "auto", flexShrink: 0 }, children: k.map((D) => {
+    const K = z === D.id, c = u.includes(D.id), N = i === "bottom" ? { borderTop: `2px solid ${e.primary}`, color: e.primary, fontWeight: 600 } : a ? { color: e.primary, fontWeight: 600, background: e.primaryLt, [i === "left" ? "borderRight" : "borderLeft"]: `2px solid ${e.primary}` } : { borderBottom: `2px solid ${e.primary}`, color: e.primary, fontWeight: 600 };
+    return /* @__PURE__ */ g(
       "div",
       {
-        onClick: () => v($.id),
-        style: { display: "flex", alignItems: "center", gap: 6, padding: "10px 16px", cursor: p ? "not-allowed" : "pointer", whiteSpace: "nowrap", fontSize: 13, transition: "color .15s", userSelect: "none", minWidth: l ? 120 : "auto", ...W ? T : { color: p ? e.textMut : e.textSec } },
+        onClick: () => R(D.id),
+        style: { display: "flex", alignItems: "center", gap: 6, padding: "10px 16px", cursor: c ? "not-allowed" : "pointer", whiteSpace: "nowrap", fontSize: 13, transition: "color .15s", userSelect: "none", minWidth: a ? 120 : "auto", ...K ? N : { color: c ? e.textMut : e.textSec } },
         children: [
-          $.icon && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: $.icon }),
-          /* @__PURE__ */ t("span", { children: $.tab }),
-          s.includes($.id) && /* @__PURE__ */ t("span", { onClick: (R) => m(R, $.id), style: { marginLeft: 4, opacity: 0.6, fontSize: 12, cursor: "pointer" }, children: "✕" })
+          D.icon && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: D.icon }),
+          /* @__PURE__ */ t("span", { children: D.tab }),
+          l.includes(D.id) && /* @__PURE__ */ t("span", { onClick: (A) => M(A, D.id), style: { marginLeft: 4, opacity: 0.6, fontSize: 12, cursor: "pointer" }, children: "✕" })
         ]
       },
-      $.id
+      D.id
     );
-  }) }), z = x.find(($) => $.id === S), N = /* @__PURE__ */ y("div", { className: "dhx-scroll", style: { flex: 1, overflow: "auto" }, children: [
-    z == null ? void 0 : z.content,
-    (z == null ? void 0 : z.html) && /* @__PURE__ */ t("div", { dangerouslySetInnerHTML: { __html: z.html }, style: { padding: 16 } })
+  }) }), L = k.find((D) => D.id === z), H = /* @__PURE__ */ g("div", { className: "dhx-scroll", style: { flex: 1, overflow: "auto" }, children: [
+    L == null ? void 0 : L.content,
+    (L == null ? void 0 : L.html) && /* @__PURE__ */ t("div", { dangerouslySetInnerHTML: { __html: L.html }, style: { padding: 16 } })
   ] });
-  return /* @__PURE__ */ y("div", { className: "dhx", style: { display: "flex", flexDirection: o === "top" ? "column" : o === "bottom" ? "column-reverse" : o === "left" ? "row" : "row-reverse", width: "100%", height: "100%", background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.r, overflow: "hidden", ...g }, children: [
-    w,
-    N
+  return /* @__PURE__ */ g("div", { className: "dhx", style: { display: "flex", flexDirection: i === "top" ? "column" : i === "bottom" ? "column-reverse" : i === "left" ? "row" : "row-reverse", width: "100%", height: "100%", background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.r, overflow: "hidden", ...x }, children: [
+    C,
+    H
   ] });
 }
-const ce = `1px solid ${e.border}`;
-function Mt({ active: n, dir: o }) {
-  return /* @__PURE__ */ y("span", { style: { display: "inline-flex", flexDirection: "column", gap: 1, flexShrink: 0, marginLeft: 4 }, children: [
-    /* @__PURE__ */ t("svg", { width: "7", height: "4", viewBox: "0 0 7 4", children: /* @__PURE__ */ t("path", { d: "M3.5 0L7 4H0z", fill: n && o === "asc" ? e.primary : e.borderDk }) }),
-    /* @__PURE__ */ t("svg", { width: "7", height: "4", viewBox: "0 0 7 4", children: /* @__PURE__ */ t("path", { d: "M3.5 4L0 0H7z", fill: n && o === "desc" ? e.primary : e.borderDk }) })
+const fe = `1px solid ${e.border}`;
+function Dt({ active: n, dir: i }) {
+  return /* @__PURE__ */ g("span", { style: { display: "inline-flex", flexDirection: "column", gap: 1, flexShrink: 0, marginLeft: 4 }, children: [
+    /* @__PURE__ */ t("svg", { width: "7", height: "4", viewBox: "0 0 7 4", children: /* @__PURE__ */ t("path", { d: "M3.5 0L7 4H0z", fill: n && i === "asc" ? e.primary : e.borderDk }) }),
+    /* @__PURE__ */ t("svg", { width: "7", height: "4", viewBox: "0 0 7 4", children: /* @__PURE__ */ t("path", { d: "M3.5 4L0 0H7z", fill: n && i === "desc" ? e.primary : e.borderDk }) })
   ] });
 }
-function $t({ options: n, value: o, onChange: d, onCommit: s, onCancel: f }) {
-  const [a, h] = I(o), [u, g] = I(!0), S = ne(null);
-  O(() => {
-    const i = (c) => {
-      S.current && !S.current.contains(c.target) && s();
+function Lt({ options: n, value: i, onChange: d, onCommit: l, onCancel: u }) {
+  const [s, f] = B(i), [p, x] = B(!0), z = le(null);
+  J(() => {
+    const b = (h) => {
+      z.current && !z.current.contains(h.target) && l();
     };
-    return document.addEventListener("mousedown", i), () => document.removeEventListener("mousedown", i);
-  }, [s]);
-  const r = n.filter((i) => !a || i.toLowerCase().includes(a.toLowerCase()));
-  return /* @__PURE__ */ y("div", { ref: S, style: { width: "100%", position: "relative" }, children: [
+    return document.addEventListener("mousedown", b), () => document.removeEventListener("mousedown", b);
+  }, [l]);
+  const r = n.filter((b) => !s || b.toLowerCase().includes(s.toLowerCase()));
+  return /* @__PURE__ */ g("div", { ref: z, style: { width: "100%", position: "relative" }, children: [
     /* @__PURE__ */ t(
       "input",
       {
         autoFocus: !0,
-        value: a,
-        onChange: (i) => {
-          h(i.target.value), d(i.target.value), g(!0);
+        value: s,
+        onChange: (b) => {
+          f(b.target.value), d(b.target.value), x(!0);
         },
-        onKeyDown: (i) => {
-          i.key === "Enter" && s(), i.key === "Escape" && f();
+        onKeyDown: (b) => {
+          b.key === "Enter" && l(), b.key === "Escape" && u();
         },
-        onClick: (i) => i.stopPropagation(),
+        onClick: (b) => b.stopPropagation(),
         style: { width: "100%", border: "none", outline: `2px solid ${e.primary}`, borderRadius: 2, fontSize: 13, padding: "2px 4px", background: e.surface, color: e.text }
       }
     ),
-    u && r.length > 0 && /* @__PURE__ */ t("div", { style: { position: "absolute", top: "100%", left: 0, right: 0, zIndex: 50, background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.r, boxShadow: e.shadowLg, maxHeight: 160, overflowY: "auto" }, children: r.map((i) => /* @__PURE__ */ t(
+    p && r.length > 0 && /* @__PURE__ */ t("div", { style: { position: "absolute", top: "100%", left: 0, right: 0, zIndex: 50, background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.r, boxShadow: e.shadowLg, maxHeight: 160, overflowY: "auto" }, children: r.map((b) => /* @__PURE__ */ t(
       "div",
       {
-        onMouseDown: (c) => {
-          c.preventDefault(), d(i), h(i), g(!1), s();
+        onMouseDown: (h) => {
+          h.preventDefault(), d(b), f(b), x(!1), l();
         },
         style: { padding: "6px 10px", cursor: "pointer", fontSize: 13, color: e.text },
-        onMouseEnter: (c) => c.currentTarget.style.background = e.bg,
-        onMouseLeave: (c) => c.currentTarget.style.background = e.surface,
-        children: i
+        onMouseEnter: (h) => h.currentTarget.style.background = e.bg,
+        onMouseLeave: (h) => h.currentTarget.style.background = e.surface,
+        children: b
       },
-      i
+      b
     )) })
   ] });
 }
-function Dt(n, o) {
+function Tt(n, i) {
   if (n == null) return "";
-  if (o === "number") return typeof n == "number" ? n.toLocaleString() : String(n);
-  if (o === "date") {
+  if (i === "number") return typeof n == "number" ? n.toLocaleString() : String(n);
+  if (i === "date") {
     const d = n instanceof Date ? n : new Date(String(n));
     return isNaN(d.getTime()) ? String(n) : d.toLocaleDateString();
   }
   return String(n);
 }
-function Ct(n, o, d) {
-  return n == null ? 1 : o == null ? -1 : d === "date" ? new Date(String(n)).getTime() - new Date(String(o)).getTime() : d === "number" ? Number(n) - Number(o) : String(n) < String(o) ? -1 : String(n) > String(o) ? 1 : 0;
+function It(n, i, d) {
+  return n == null ? 1 : i == null ? -1 : d === "date" ? new Date(String(n)).getTime() - new Date(String(i)).getTime() : d === "number" ? Number(n) - Number(i) : String(n) < String(i) ? -1 : String(n) > String(i) ? 1 : 0;
 }
-function ve(n) {
-  var o;
-  return Array.isArray(n.header) && ((o = n.header[1]) == null ? void 0 : o.content) != null ? n.header[1].content : n.filterable ? n.filterType === "select" ? "selectFilter" : "inputFilter" : null;
+function we(n) {
+  var i;
+  return Array.isArray(n.header) && ((i = n.header[1]) == null ? void 0 : i.content) != null ? n.header[1].content : n.filterable ? n.filterType === "select" ? "selectFilter" : "inputFilter" : null;
 }
-function Lt(n, o, d, s, f) {
-  const a = {
+function Rt(n, i, d, l, u) {
+  const s = {
     width: "100%",
     border: "none",
     outline: `2px solid ${e.primary}`,
@@ -504,540 +716,540 @@ function Lt(n, o, d, s, f) {
     padding: "2px 4px",
     background: e.surface,
     color: e.text
-  }, h = n.editorType ?? "input";
-  if (h === "select") return /* @__PURE__ */ t(
+  }, f = n.editorType ?? "input";
+  if (f === "select") return /* @__PURE__ */ t(
     "select",
     {
       autoFocus: !0,
-      value: o,
-      onChange: (g) => d(g.target.value),
-      onBlur: s,
-      onKeyDown: (g) => {
-        g.key === "Enter" && s(), g.key === "Escape" && f();
+      value: i,
+      onChange: (x) => d(x.target.value),
+      onBlur: l,
+      onKeyDown: (x) => {
+        x.key === "Enter" && l(), x.key === "Escape" && u();
       },
-      onClick: (g) => g.stopPropagation(),
-      style: { ...a, cursor: "pointer" },
-      children: (n.options ?? []).map((g) => /* @__PURE__ */ t("option", { value: g, children: g }, g))
+      onClick: (x) => x.stopPropagation(),
+      style: { ...s, cursor: "pointer" },
+      children: (n.options ?? []).map((x) => /* @__PURE__ */ t("option", { value: x, children: x }, x))
     }
   );
-  if (h === "combobox") return /* @__PURE__ */ t(
-    $t,
+  if (f === "combobox") return /* @__PURE__ */ t(
+    Lt,
     {
       options: n.options ?? [],
-      value: o,
+      value: i,
       onChange: d,
-      onCommit: s,
-      onCancel: f
+      onCommit: l,
+      onCancel: u
     }
   );
-  const u = n.type === "number" ? "number" : n.type === "date" ? "date" : "text";
+  const p = n.type === "number" ? "number" : n.type === "date" ? "date" : "text";
   return /* @__PURE__ */ t(
     "input",
     {
       autoFocus: !0,
-      type: u,
-      value: o,
-      onChange: (g) => d(g.target.value),
-      onBlur: s,
-      onKeyDown: (g) => {
-        g.key === "Enter" && s(), g.key === "Escape" && f();
+      type: p,
+      value: i,
+      onChange: (x) => d(x.target.value),
+      onBlur: l,
+      onKeyDown: (x) => {
+        x.key === "Enter" && l(), x.key === "Escape" && u();
       },
-      onClick: (g) => g.stopPropagation(),
-      style: a
+      onClick: (x) => x.stopPropagation(),
+      style: s
     }
   );
 }
-function qt({
+function Zt({
   columns: n,
-  data: o = [],
+  data: i = [],
   height: d = 400,
-  rowHeight: s = 40,
-  headerRowHeight: f = 40,
-  footerRowHeight: a = 40,
-  sortable: h = !0,
-  resizable: u = !0,
-  editable: g = !1,
-  stripe: S = !1,
+  rowHeight: l = 40,
+  headerRowHeight: u = 40,
+  footerRowHeight: s = 40,
+  sortable: f = !0,
+  resizable: p = !0,
+  editable: x = !1,
+  stripe: z = !1,
   autoWidth: r = !1,
-  keyNavigation: i = !1,
-  selection: c,
-  multiselect: m,
-  leftSplit: v = 0,
-  onSelect: l,
-  onChange: x,
-  style: w
+  keyNavigation: b = !1,
+  selection: h,
+  multiselect: M,
+  leftSplit: R = 0,
+  onSelect: a,
+  onChange: k,
+  style: C
 }) {
   var De;
-  const [z, N] = I(null), [k, $] = I("asc"), [W, p] = I({}), [T, R] = I(/* @__PURE__ */ new Set()), [C, X] = I(-1), [G, se] = I(
-    () => Object.fromEntries(n.map((b) => [b.id, b.width ?? b.minWidth ?? 150]))
-  ), [Q, ie] = I(null), [E, M] = I(""), [H, P] = I({}), Y = ne(null), [K, re] = I(0);
-  O(_, []), O(() => {
-    if (!r || !Y.current) return;
-    const b = new ResizeObserver(() => {
-      var D;
-      return re(((D = Y.current) == null ? void 0 : D.offsetWidth) ?? 0);
+  const [L, H] = B(null), [$, D] = B("asc"), [K, c] = B({}), [N, A] = B(/* @__PURE__ */ new Set()), [S, U] = B(-1), [Z, o] = B(
+    () => Object.fromEntries(n.map((y) => [y.id, y.width ?? y.minWidth ?? 150]))
+  ), [E, _] = B(null), [w, v] = B(""), [T, m] = B({}), j = le(null), [Y, G] = B(0);
+  J(Q, []), J(() => {
+    if (!r || !j.current) return;
+    const y = new ResizeObserver(() => {
+      var I;
+      return G(((I = j.current) == null ? void 0 : I.offsetWidth) ?? 0);
     });
-    return b.observe(Y.current), () => b.disconnect();
+    return y.observe(j.current), () => y.disconnect();
   }, [r]);
-  const V = le(
+  const V = ue(
     () => n.map(
-      (b) => b.summary && (!b.footer || b.footer.length === 0) ? { ...b, footer: [{ summary: b.summary }] } : b
+      (y) => y.summary && (!y.footer || y.footer.length === 0) ? { ...y, footer: [{ summary: y.summary }] } : y
     ),
     [n]
-  ), q = le(
-    () => V.filter((b) => !b.hidden),
+  ), q = ue(
+    () => V.filter((y) => !y.hidden),
     [V]
-  ), ee = le(() => {
-    if (!r || K === 0) return G;
-    const b = q.reduce((L, A) => L + (G[A.id] ?? 150), 0);
-    if (K <= b) return G;
-    const D = (K - b) / q.length;
-    return Object.fromEntries(q.map((L) => [L.id, (G[L.id] ?? 150) + D]));
-  }, [r, K, G, q]), Z = le(() => {
-    let b = o.map((D, L) => {
-      const A = String(D.id ?? L);
-      return H[A] ? { ...D, ...H[A] } : D;
+  ), ee = ue(() => {
+    if (!r || Y === 0) return Z;
+    const y = q.reduce((W, F) => W + (Z[F.id] ?? 150), 0);
+    if (Y <= y) return Z;
+    const I = (Y - y) / q.length;
+    return Object.fromEntries(q.map((W) => [W.id, (Z[W.id] ?? 150) + I]));
+  }, [r, Y, Z, q]), te = ue(() => {
+    let y = i.map((I, W) => {
+      const F = String(I.id ?? W);
+      return T[F] ? { ...I, ...T[F] } : I;
     }).filter(
-      (D) => Object.entries(W).every(
-        ([L, A]) => !A || String(D[L] ?? "").toLowerCase().includes(A.toLowerCase())
+      (I) => Object.entries(K).every(
+        ([W, F]) => !F || String(I[W] ?? "").toLowerCase().includes(F.toLowerCase())
       )
     );
-    if (z) {
-      const D = V.find((L) => L.id === z);
-      b = [...b].sort((L, A) => {
-        const j = Ct(L[z], A[z], D == null ? void 0 : D.type);
-        return k === "asc" ? j : -j;
+    if (L) {
+      const I = V.find((W) => W.id === L);
+      y = [...y].sort((W, F) => {
+        const X = It(W[L], F[L], I == null ? void 0 : I.type);
+        return $ === "asc" ? X : -X;
       });
     }
-    return b;
-  }, [o, z, k, W, H, V]), xe = le(() => {
-    const b = {};
-    return V.forEach((D) => {
-      var L;
-      if ((L = D.footer) != null && L.some((A) => A.summary)) {
-        const A = Z.map((B) => Number(B[D.id])).filter((B) => !isNaN(B)), j = A.reduce((B, J) => B + J, 0);
-        b[D.id] = { sum: j, avg: A.length ? j / A.length : 0, count: Z.length, min: A.length ? Math.min(...A) : 0, max: A.length ? Math.max(...A) : 0 };
+    return y;
+  }, [i, L, $, K, T, V]), pe = ue(() => {
+    const y = {};
+    return V.forEach((I) => {
+      var W;
+      if ((W = I.footer) != null && W.some((F) => F.summary)) {
+        const F = te.map((O) => Number(O[I.id])).filter((O) => !isNaN(O)), X = F.reduce((O, re) => O + re, 0);
+        y[I.id] = { sum: X, avg: F.length ? X / F.length : 0, count: te.length, min: F.length ? Math.min(...F) : 0, max: F.length ? Math.max(...F) : 0 };
       }
-    }), b;
-  }, [Z, V]), ue = le(() => {
-    const b = {};
-    return q.filter((D) => {
-      const L = ve(D);
-      return L === "selectFilter" || L === "comboFilter";
-    }).forEach((D) => {
-      b[D.id] = [...new Set(o.map((L) => String(L[D.id] ?? "")))].sort();
-    }), b;
-  }, [o, q]), F = q.some((b) => ve(b) !== null), de = V.some((b) => {
-    var D;
-    return (D = b.footer) == null ? void 0 : D.length;
-  }), Ve = q.reduce((b, D) => b + (ee[D.id] ?? 150), 0), pe = le(() => {
-    if (!v) return {};
-    let b = 0;
-    const D = {};
-    return q.forEach((L, A) => {
-      A < v && (D[L.id] = b, b += ee[L.id] ?? 150);
-    }), D;
-  }, [v, q, ee]), $e = v > 0 ? (De = q[v - 1]) == null ? void 0 : De.id : null, ye = (b, D) => b.id ?? D, Xe = (b) => {
-    !h || b.sortable === !1 || ($((D) => z === b.id && D === "asc" ? "desc" : "asc"), N(b.id));
-  }, be = (b, D) => {
-    if (!c) return;
-    const L = ye(b, D);
-    X(D), R((A) => {
-      const j = m ? new Set(A) : /* @__PURE__ */ new Set();
-      return j.has(L) ? j.delete(L) : j.add(L), j;
-    }), l == null || l(b);
+    }), y;
+  }, [te, V]), ne = ue(() => {
+    const y = {};
+    return q.filter((I) => {
+      const W = we(I);
+      return W === "selectFilter" || W === "comboFilter";
+    }).forEach((I) => {
+      y[I.id] = [...new Set(i.map((W) => String(W[I.id] ?? "")))].sort();
+    }), y;
+  }, [i, q]), P = q.some((y) => we(y) !== null), de = V.some((y) => {
+    var I;
+    return (I = y.footer) == null ? void 0 : I.length;
+  }), ve = q.reduce((y, I) => y + (ee[I.id] ?? 150), 0), ce = ue(() => {
+    if (!R) return {};
+    let y = 0;
+    const I = {};
+    return q.forEach((W, F) => {
+      F < R && (I[W.id] = y, y += ee[W.id] ?? 150);
+    }), I;
+  }, [R, q, ee]), se = R > 0 ? (De = q[R - 1]) == null ? void 0 : De.id : null, be = (y, I) => y.id ?? I, Xe = (y) => {
+    !f || y.sortable === !1 || (D((I) => L === y.id && I === "asc" ? "desc" : "asc"), H(y.id));
+  }, Se = (y, I) => {
+    if (!h) return;
+    const W = be(y, I);
+    U(I), A((F) => {
+      const X = M ? new Set(F) : /* @__PURE__ */ new Set();
+      return X.has(W) ? X.delete(W) : X.add(W), X;
+    }), a == null || a(y);
   }, qe = () => {
-    if (!Q) return;
-    const { key: b, colId: D } = Q;
-    P((A) => ({ ...A, [String(b)]: { ...A[String(b)] || {}, [D]: E } }));
-    const L = Z.find((A, j) => ye(A, j) === b);
-    L && (x == null || x(L, D, E)), ie(null);
-  }, Ge = (b) => {
-    if (Q && b.key === "Escape") {
-      ie(null);
+    if (!E) return;
+    const { key: y, colId: I } = E;
+    m((F) => ({ ...F, [String(y)]: { ...F[String(y)] || {}, [I]: w } }));
+    const W = te.find((F, X) => be(F, X) === y);
+    W && (k == null || k(W, I, w)), _(null);
+  }, Ge = (y) => {
+    if (E && y.key === "Escape") {
+      _(null);
       return;
     }
-    if (!(!i || !c)) {
-      if (b.key === "ArrowDown") {
-        b.preventDefault();
-        const D = Math.min(C + 1, Z.length - 1);
-        D >= 0 && be(Z[D], D);
-      } else if (b.key === "ArrowUp") {
-        b.preventDefault();
-        const D = Math.max(C - 1, 0);
-        D >= 0 && be(Z[D], D);
+    if (!(!b || !h)) {
+      if (y.key === "ArrowDown") {
+        y.preventDefault();
+        const I = Math.min(S + 1, te.length - 1);
+        I >= 0 && Se(te[I], I);
+      } else if (y.key === "ArrowUp") {
+        y.preventDefault();
+        const I = Math.max(S - 1, 0);
+        I >= 0 && Se(te[I], I);
       }
     }
-  }, Je = (b, D) => {
-    b.preventDefault(), b.stopPropagation();
-    const L = b.clientX, A = G[D] ?? 150, j = n.find((U) => U.id === D), B = (U) => se((ae) => ({
-      ...ae,
-      [D]: Math.max((j == null ? void 0 : j.minWidth) || 50, A + U.clientX - L)
-    })), J = () => {
-      document.removeEventListener("mousemove", B), document.removeEventListener("mouseup", J);
+  }, Je = (y, I) => {
+    y.preventDefault(), y.stopPropagation();
+    const W = y.clientX, F = Z[I] ?? 150, X = n.find((oe) => oe.id === I), O = (oe) => o((he) => ({
+      ...he,
+      [I]: Math.max((X == null ? void 0 : X.minWidth) || 50, F + oe.clientX - W)
+    })), re = () => {
+      document.removeEventListener("mousemove", O), document.removeEventListener("mouseup", re);
     };
-    document.addEventListener("mousemove", B), document.addEventListener("mouseup", J);
-  }, me = (b, D, L, A, j, B = "hidden") => {
-    const J = b in pe;
+    document.addEventListener("mousemove", O), document.addEventListener("mouseup", re);
+  }, ke = (y, I, W, F, X, O = "hidden") => {
+    const re = y in ce;
     return {
-      width: D,
-      minWidth: D,
+      width: I,
+      minWidth: I,
       flexShrink: 0,
       boxSizing: "border-box",
       padding: "0 12px",
-      height: j,
+      height: X,
       display: "flex",
       alignItems: "center",
-      overflow: B,
+      overflow: O,
       textOverflow: "ellipsis",
       whiteSpace: "nowrap",
       fontSize: 13,
-      textAlign: L,
-      justifyContent: L === "center" ? "center" : L === "right" ? "flex-end" : "flex-start",
-      borderLeft: A ? "none" : ce,
-      position: J ? "sticky" : "relative",
-      ...J ? {
-        left: pe[b],
+      textAlign: W,
+      justifyContent: W === "center" ? "center" : W === "right" ? "flex-end" : "flex-start",
+      borderLeft: F ? "none" : fe,
+      position: re ? "sticky" : "relative",
+      ...re ? {
+        left: ce[y],
         zIndex: 1,
-        boxShadow: b === $e ? "2px 0 6px rgba(0,0,0,0.1)" : void 0
+        boxShadow: y === se ? "2px 0 6px rgba(0,0,0,0.1)" : void 0
       } : {}
     };
   };
   return /* @__PURE__ */ t(
     "div",
     {
-      ref: Y,
+      ref: j,
       className: "dhx",
-      tabIndex: i ? 0 : void 0,
+      tabIndex: b ? 0 : void 0,
       onKeyDown: Ge,
-      style: { width: "100%", height: d, display: "flex", flexDirection: "column", border: ce, borderRadius: e.r, overflow: "hidden", outline: "none", ...w },
-      children: /* @__PURE__ */ t("div", { className: "dhx-scroll", style: { overflow: "auto", flex: 1 }, children: /* @__PURE__ */ y("div", { style: { minWidth: Ve, display: "flex", flexDirection: "column", minHeight: "100%" }, children: [
-        /* @__PURE__ */ t("div", { style: { display: "flex", background: e.bg, borderBottom: ce, flexShrink: 0, position: "sticky", top: 0, zIndex: 3 }, children: q.map((b, D) => {
-          const L = Array.isArray(b.header) ? b.header[0] : null, A = (L == null ? void 0 : L.text) ?? (typeof b.header == "string" ? b.header : b.id), j = (L == null ? void 0 : L.align) ?? b.align, B = ee[b.id] ?? 150, J = b.id in pe;
-          return /* @__PURE__ */ y(
+      style: { width: "100%", height: d, display: "flex", flexDirection: "column", border: fe, borderRadius: e.r, overflow: "hidden", outline: "none", ...C },
+      children: /* @__PURE__ */ t("div", { className: "dhx-scroll", style: { overflow: "auto", flex: 1 }, children: /* @__PURE__ */ g("div", { style: { minWidth: ve, display: "flex", flexDirection: "column", minHeight: "100%" }, children: [
+        /* @__PURE__ */ t("div", { style: { display: "flex", background: e.bg, borderBottom: fe, flexShrink: 0, position: "sticky", top: 0, zIndex: 3 }, children: q.map((y, I) => {
+          const W = Array.isArray(y.header) ? y.header[0] : null, F = (W == null ? void 0 : W.text) ?? (typeof y.header == "string" ? y.header : y.id), X = (W == null ? void 0 : W.align) ?? y.align, O = ee[y.id] ?? 150, re = y.id in ce;
+          return /* @__PURE__ */ g(
             "div",
             {
-              onClick: () => Xe(b),
+              onClick: () => Xe(y),
               style: {
-                ...me(b.id, B, j, D === 0, f),
+                ...ke(y.id, O, X, I === 0, u),
                 fontWeight: 500,
                 color: e.text,
                 background: e.bg,
-                cursor: h && b.sortable !== !1 ? "pointer" : "default",
+                cursor: f && y.sortable !== !1 ? "pointer" : "default",
                 userSelect: "none",
-                ...J ? { zIndex: 4 } : {}
+                ...re ? { zIndex: 4 } : {}
               },
               children: [
-                L != null && L.htmlEnable ? /* @__PURE__ */ t("span", { style: { flex: 1, overflow: "hidden" }, dangerouslySetInnerHTML: { __html: A } }) : /* @__PURE__ */ t("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: A }),
-                h && b.sortable !== !1 && /* @__PURE__ */ t(Mt, { active: z === b.id, dir: k }),
-                u && b.resizable !== !1 && D < q.length - 1 && /* @__PURE__ */ t(
+                W != null && W.htmlEnable ? /* @__PURE__ */ t("span", { style: { flex: 1, overflow: "hidden" }, dangerouslySetInnerHTML: { __html: F } }) : /* @__PURE__ */ t("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: F }),
+                f && y.sortable !== !1 && /* @__PURE__ */ t(Dt, { active: L === y.id, dir: $ }),
+                p && y.resizable !== !1 && I < q.length - 1 && /* @__PURE__ */ t(
                   "div",
                   {
-                    onMouseDown: (U) => Je(U, b.id),
-                    onClick: (U) => U.stopPropagation(),
+                    onMouseDown: (oe) => Je(oe, y.id),
+                    onClick: (oe) => oe.stopPropagation(),
                     style: { position: "absolute", right: 0, top: 0, bottom: 0, width: 4, cursor: "col-resize", zIndex: 1 },
-                    onMouseEnter: (U) => U.currentTarget.style.background = e.primary + "55",
-                    onMouseLeave: (U) => U.currentTarget.style.background = "transparent"
+                    onMouseEnter: (oe) => oe.currentTarget.style.background = e.primary + "55",
+                    onMouseLeave: (oe) => oe.currentTarget.style.background = "transparent"
                   }
                 )
               ]
             },
-            b.id
+            y.id
           );
         }) }),
-        F && /* @__PURE__ */ t("div", { style: {
+        P && /* @__PURE__ */ t("div", { style: {
           display: "flex",
-          borderBottom: ce,
+          borderBottom: fe,
           background: e.surface,
           flexShrink: 0,
-          ...v ? { position: "sticky", top: f, zIndex: 3 } : {}
-        }, children: q.map((b, D) => {
-          const L = ve(b), A = ee[b.id] ?? 150, j = b.id in pe;
+          ...R ? { position: "sticky", top: u, zIndex: 3 } : {}
+        }, children: q.map((y, I) => {
+          const W = we(y), F = ee[y.id] ?? 150, X = y.id in ce;
           return /* @__PURE__ */ t("div", { style: {
-            width: A,
-            minWidth: A,
+            width: F,
+            minWidth: F,
             flexShrink: 0,
             padding: "4px 6px",
             boxSizing: "border-box",
-            borderLeft: D === 0 ? "none" : ce,
+            borderLeft: I === 0 ? "none" : fe,
             background: e.surface,
-            ...j ? {
+            ...X ? {
               position: "sticky",
-              left: pe[b.id],
+              left: ce[y.id],
               zIndex: 4,
-              boxShadow: b.id === $e ? "2px 0 6px rgba(0,0,0,0.1)" : void 0
+              boxShadow: y.id === se ? "2px 0 6px rgba(0,0,0,0.1)" : void 0
             } : {}
-          }, children: L === "selectFilter" || L === "comboFilter" ? /* @__PURE__ */ y(
+          }, children: W === "selectFilter" || W === "comboFilter" ? /* @__PURE__ */ g(
             "select",
             {
               className: "dhx dhx-input",
               style: { height: 26, fontSize: 12, padding: "0 4px" },
-              value: W[b.id] || "",
-              onChange: (B) => p((J) => ({ ...J, [b.id]: B.target.value })),
+              value: K[y.id] || "",
+              onChange: (O) => c((re) => ({ ...re, [y.id]: O.target.value })),
               children: [
                 /* @__PURE__ */ t("option", { value: "", children: "All" }),
-                (ue[b.id] || []).map((B) => /* @__PURE__ */ t("option", { value: B, children: B }, B))
+                (ne[y.id] || []).map((O) => /* @__PURE__ */ t("option", { value: O, children: O }, O))
               ]
             }
-          ) : L === "inputFilter" ? /* @__PURE__ */ t(
+          ) : W === "inputFilter" ? /* @__PURE__ */ t(
             "input",
             {
               className: "dhx dhx-input",
               style: { height: 26, fontSize: 12 },
               placeholder: "Filter...",
-              value: W[b.id] || "",
-              onChange: (B) => p((J) => ({ ...J, [b.id]: B.target.value }))
+              value: K[y.id] || "",
+              onChange: (O) => c((re) => ({ ...re, [y.id]: O.target.value }))
             }
-          ) : null }, b.id);
+          ) : null }, y.id);
         }) }),
-        /* @__PURE__ */ y("div", { style: { flex: 1 }, children: [
-          Z.map((b, D) => {
-            const L = ye(b, D), A = T.has(L), j = A ? e.primaryLt : S && D % 2 !== 0 ? e.bg : e.surface;
+        /* @__PURE__ */ g("div", { style: { flex: 1 }, children: [
+          te.map((y, I) => {
+            const W = be(y, I), F = N.has(W), X = F ? e.primaryLt : z && I % 2 !== 0 ? e.bg : e.surface;
             return /* @__PURE__ */ t(
               "div",
               {
-                style: { display: "flex", height: s, borderBottom: ce, flexShrink: 0, background: j, transition: "background .1s", cursor: c ? "pointer" : "default" },
-                onMouseEnter: (B) => !A && (B.currentTarget.style.background = e.primaryLt + "80"),
-                onMouseLeave: (B) => !A && (B.currentTarget.style.background = j),
-                children: q.map((B, J) => {
-                  const U = (Q == null ? void 0 : Q.key) === L && (Q == null ? void 0 : Q.colId) === B.id, ae = b[B.id], Ue = ee[B.id] ?? 150, Ce = (g || B.editable) && B.editable !== !1;
-                  let he;
-                  return U ? he = Lt(B, E, M, qe, () => ie(null)) : B.template ? he = B.template(ae, b) : B.htmlEnable ? he = /* @__PURE__ */ t("span", { dangerouslySetInnerHTML: { __html: String(ae ?? "") } }) : B.type === "boolean" ? he = /* @__PURE__ */ t(
+                style: { display: "flex", height: l, borderBottom: fe, flexShrink: 0, background: X, transition: "background .1s", cursor: h ? "pointer" : "default" },
+                onMouseEnter: (O) => !F && (O.currentTarget.style.background = e.primaryLt + "80"),
+                onMouseLeave: (O) => !F && (O.currentTarget.style.background = X),
+                children: q.map((O, re) => {
+                  const oe = (E == null ? void 0 : E.key) === W && (E == null ? void 0 : E.colId) === O.id, he = y[O.id], Ue = ee[O.id] ?? 150, Le = (x || O.editable) && O.editable !== !1;
+                  let ye;
+                  return oe ? ye = Rt(O, w, v, qe, () => _(null)) : O.template ? ye = O.template(he, y) : O.htmlEnable ? ye = /* @__PURE__ */ t("span", { dangerouslySetInnerHTML: { __html: String(he ?? "") } }) : O.type === "boolean" ? ye = /* @__PURE__ */ t(
                     "input",
                     {
                       type: "checkbox",
                       readOnly: !0,
-                      checked: !!ae,
-                      style: { width: 16, height: 16, accentColor: e.primary, cursor: Ce ? "pointer" : "default" }
+                      checked: !!he,
+                      style: { width: 16, height: 16, accentColor: e.primary, cursor: Le ? "pointer" : "default" }
                     }
-                  ) : he = Dt(ae, B.type), /* @__PURE__ */ t(
+                  ) : ye = Tt(he, O.type), /* @__PURE__ */ t(
                     "div",
                     {
                       onClick: () => {
-                        if (be(b, D), !!Ce)
-                          if (B.type === "boolean") {
-                            const Le = !ae, Ie = String(L);
-                            P((Te) => ({ ...Te, [Ie]: { ...Te[Ie] || {}, [B.id]: Le } })), x == null || x(b, B.id, Le);
+                        if (Se(y, I), !!Le)
+                          if (O.type === "boolean") {
+                            const Te = !he, Ie = String(W);
+                            m((Re) => ({ ...Re, [Ie]: { ...Re[Ie] || {}, [O.id]: Te } })), k == null || k(y, O.id, Te);
                           } else
-                            ie({ key: L, colId: B.id }), M(String(ae ?? ""));
+                            _({ key: W, colId: O.id }), v(String(he ?? ""));
                       },
-                      style: { ...me(B.id, Ue, B.align, J === 0, s, U ? "visible" : "hidden"), background: j },
-                      children: he
+                      style: { ...ke(O.id, Ue, O.align, re === 0, l, oe ? "visible" : "hidden"), background: X },
+                      children: ye
                     },
-                    B.id
+                    O.id
                   );
                 })
               },
-              String(L)
+              String(W)
             );
           }),
-          Z.length === 0 && /* @__PURE__ */ t("div", { style: { textAlign: "center", padding: 40, color: e.textMut, fontSize: 13 }, children: "No data" })
+          te.length === 0 && /* @__PURE__ */ t("div", { style: { textAlign: "center", padding: 40, color: e.textMut, fontSize: 13 }, children: "No data" })
         ] }),
-        de && /* @__PURE__ */ t("div", { style: { display: "flex", borderTop: ce, background: e.bg, flexShrink: 0, position: "sticky", bottom: 0, zIndex: 2 }, children: q.map((b, D) => {
-          var U;
-          const L = (U = b.footer) == null ? void 0 : U[0], A = xe[b.id] ?? { sum: 0, avg: 0, count: 0, min: 0, max: 0 };
-          let j = "";
-          L && (typeof L.text == "function" ? j = L.text(A) : L.text ? j = L.text : L.summary && (j = String(Math.round(A[L.summary] * 100) / 100)));
-          const B = ee[b.id] ?? 150, J = b.id in pe;
+        de && /* @__PURE__ */ t("div", { style: { display: "flex", borderTop: fe, background: e.bg, flexShrink: 0, position: "sticky", bottom: 0, zIndex: 2 }, children: q.map((y, I) => {
+          var oe;
+          const W = (oe = y.footer) == null ? void 0 : oe[0], F = pe[y.id] ?? { sum: 0, avg: 0, count: 0, min: 0, max: 0 };
+          let X = "";
+          W && (typeof W.text == "function" ? X = W.text(F) : W.text ? X = W.text : W.summary && (X = String(Math.round(F[W.summary] * 100) / 100)));
+          const O = ee[y.id] ?? 150, re = y.id in ce;
           return /* @__PURE__ */ t("div", { style: {
-            ...me(b.id, B, b.align, D === 0, a),
+            ...ke(y.id, O, y.align, I === 0, s),
             fontWeight: 600,
             color: e.text,
             background: e.bg,
-            ...J ? { zIndex: 3 } : {}
-          }, children: j }, b.id);
+            ...re ? { zIndex: 3 } : {}
+          }, children: X }, y.id);
         }) })
       ] }) })
     }
   );
 }
-const te = ["#0288d1", "#43a047", "#f57c00", "#e53935", "#8e24aa", "#00838f", "#ef6c00", "#2e7d32"];
-function It(n, o, d) {
-  const s = n.filter((a) => !a.parent), f = n.filter((a) => !!a.parent);
-  return s.map((a) => ({
-    name: a[d],
-    children: f.filter((h) => h.parent === a.id).map((h) => ({ name: h[d], value: Number(h[o] ?? 0) }))
+const ie = ["#0288d1", "#43a047", "#f57c00", "#e53935", "#8e24aa", "#00838f", "#ef6c00", "#2e7d32"];
+function Nt(n, i, d) {
+  const l = n.filter((s) => !s.parent), u = n.filter((s) => !!s.parent);
+  return l.map((s) => ({
+    name: s[d],
+    children: u.filter((f) => f.parent === s.id).map((f) => ({ name: f[d], value: Number(f[i] ?? 0) }))
   }));
 }
-function Gt({
+function en({
   type: n = "bar",
-  data: o = [],
+  data: i = [],
   series: d = [],
-  scales: s = {},
-  legend: f,
-  height: a = 280,
-  style: h
+  scales: l = {},
+  legend: u,
+  height: s = 280,
+  style: f
 }) {
-  var x, w, z, N, k, $, W, p, T, R, C, X, G, se, Q, ie;
-  O(_, []);
-  const u = ((x = s.bottom) == null ? void 0 : x.text) || o[0] && Object.keys(o[0])[0] || "x", g = /* @__PURE__ */ t(
+  var k, C, L, H, $, D, K, c, N, A, S, U, Z, o, E, _;
+  J(Q, []);
+  const p = ((k = l.bottom) == null ? void 0 : k.text) || i[0] && Object.keys(i[0])[0] || "x", x = /* @__PURE__ */ t(
     et,
     {
       contentStyle: { fontSize: 12, borderRadius: e.r, border: `1px solid ${e.border}` }
     }
-  ), S = f ? /* @__PURE__ */ t(
+  ), z = u ? /* @__PURE__ */ t(
     tt,
     {
       iconSize: 10,
       wrapperStyle: { fontSize: 12 },
-      verticalAlign: f.valign === "bottom" ? "bottom" : f.valign === "middle" ? "middle" : "top",
-      align: f.halign ?? "center"
+      verticalAlign: u.valign === "bottom" ? "bottom" : u.valign === "middle" ? "middle" : "top",
+      align: u.halign ?? "center"
     }
-  ) : null, r = /* @__PURE__ */ t(nt, { strokeDasharray: "3 3", stroke: e.border }), i = /* @__PURE__ */ t(
+  ) : null, r = /* @__PURE__ */ t(nt, { strokeDasharray: "3 3", stroke: e.border }), b = /* @__PURE__ */ t(
     Ne,
     {
-      dataKey: u,
+      dataKey: p,
       tick: { fontSize: 11, fill: e.textSec },
       axisLine: { stroke: e.border },
       tickLine: !1,
-      label: (w = s.bottom) != null && w.title ? { value: s.bottom.title, position: "insideBottom", offset: -4, fontSize: 11 } : void 0
+      label: (C = l.bottom) != null && C.title ? { value: l.bottom.title, position: "insideBottom", offset: -4, fontSize: 11 } : void 0
     }
-  ), c = /* @__PURE__ */ t(
+  ), h = /* @__PURE__ */ t(
     Ee,
     {
       tick: { fontSize: 11, fill: e.textSec },
       axisLine: !1,
       tickLine: !1,
-      domain: [((z = s.left) == null ? void 0 : z.min) ?? "auto", ((N = s.left) == null ? void 0 : N.max) ?? "auto"],
-      tickCount: (k = s.left) == null ? void 0 : k.maxTicks,
-      label: ($ = s.left) != null && $.title ? { value: s.left.title, angle: -90, position: "insideLeft", fontSize: 11 } : void 0
+      domain: [((L = l.left) == null ? void 0 : L.min) ?? "auto", ((H = l.left) == null ? void 0 : H.max) ?? "auto"],
+      tickCount: ($ = l.left) == null ? void 0 : $.maxTicks,
+      label: (D = l.left) != null && D.title ? { value: l.left.title, angle: -90, position: "insideLeft", fontSize: 11 } : void 0
     }
-  ), m = {
+  ), M = {
     top: 10,
     right: 20,
     left: 0,
-    bottom: (W = s.bottom) != null && W.title ? 20 : 0
-  }, v = { data: o, margin: m };
-  let l;
+    bottom: (K = l.bottom) != null && K.title ? 20 : 0
+  }, R = { data: i, margin: M };
+  let a;
   if (n === "bar")
-    l = /* @__PURE__ */ y(rt, { ...v, children: [
+    a = /* @__PURE__ */ g(rt, { ...R, children: [
       r,
-      i,
-      c,
-      g,
-      S,
-      d.map((E, M) => /* @__PURE__ */ t(
+      b,
+      h,
+      x,
+      z,
+      d.map((w, v) => /* @__PURE__ */ t(
         ot,
         {
-          dataKey: E.value || E.id || "",
-          name: E.label || E.id,
-          fill: E.fill || E.color || te[M % te.length],
+          dataKey: w.value || w.id || "",
+          name: w.label || w.id,
+          fill: w.fill || w.color || ie[v % ie.length],
           radius: [3, 3, 0, 0]
         },
-        E.id ?? M
+        w.id ?? v
       ))
     ] });
   else if (n === "line")
-    l = /* @__PURE__ */ y(it, { ...v, children: [
+    a = /* @__PURE__ */ g(it, { ...R, children: [
       r,
-      i,
-      c,
-      g,
-      S,
-      d.map((E, M) => {
-        const H = E.color || te[M % te.length];
+      b,
+      h,
+      x,
+      z,
+      d.map((w, v) => {
+        const T = w.color || ie[v % ie.length];
         return /* @__PURE__ */ t(
           lt,
           {
             type: "monotone",
-            dataKey: E.value || E.id || "",
-            name: E.label || E.id,
-            stroke: H,
-            strokeWidth: E.strokeWidth ?? 2,
-            dot: { r: 3, fill: H }
+            dataKey: w.value || w.id || "",
+            name: w.label || w.id,
+            stroke: T,
+            strokeWidth: w.strokeWidth ?? 2,
+            dot: { r: 3, fill: T }
           },
-          E.id ?? M
+          w.id ?? v
         );
       })
     ] });
   else if (n === "area")
-    l = /* @__PURE__ */ y(st, { ...v, children: [
+    a = /* @__PURE__ */ g(st, { ...R, children: [
       r,
-      i,
-      c,
-      g,
-      S,
-      d.map((E, M) => {
-        const H = E.color || te[M % te.length];
+      b,
+      h,
+      x,
+      z,
+      d.map((w, v) => {
+        const T = w.color || ie[v % ie.length];
         return /* @__PURE__ */ t(
           at,
           {
             type: "monotone",
-            dataKey: E.value || E.id || "",
-            name: E.label || E.id,
-            stroke: H,
-            fill: (E.fill || H) + "33",
-            strokeWidth: E.strokeWidth ?? 2
+            dataKey: w.value || w.id || "",
+            name: w.label || w.id,
+            stroke: T,
+            fill: (w.fill || T) + "33",
+            strokeWidth: w.strokeWidth ?? 2
           },
-          E.id ?? M
+          w.id ?? v
         );
       })
     ] });
   else if (n === "pie" || n === "donut") {
-    const E = d[0] || {}, M = E.value || "value", H = E.text || "name", P = E.color && o[0] && E.color in o[0] ? E.color : null;
-    l = /* @__PURE__ */ y(dt, { children: [
+    const w = d[0] || {}, v = w.value || "value", T = w.text || "name", m = w.color && i[0] && w.color in i[0] ? w.color : null;
+    a = /* @__PURE__ */ g(dt, { children: [
       /* @__PURE__ */ t(
         ct,
         {
-          data: o,
+          data: i,
           cx: "50%",
           cy: "50%",
           outerRadius: n === "donut" ? "70%" : "80%",
           innerRadius: n === "donut" ? "40%" : 0,
-          dataKey: M,
-          nameKey: H,
-          stroke: E.stroke || "none",
-          strokeWidth: E.strokeWidth ?? 0,
-          label: ({ name: Y, percent: K }) => `${Y ?? ""} ${((K ?? 0) * 100).toFixed(0)}%`,
+          dataKey: v,
+          nameKey: T,
+          stroke: w.stroke || "none",
+          strokeWidth: w.strokeWidth ?? 0,
+          label: ({ name: j, percent: Y }) => `${j ?? ""} ${((Y ?? 0) * 100).toFixed(0)}%`,
           labelLine: !0,
           paddingAngle: 2,
-          children: o.map((Y, K) => /* @__PURE__ */ t(
+          children: i.map((j, Y) => /* @__PURE__ */ t(
             ut,
             {
-              fill: P ? Y[P] : te[K % te.length]
+              fill: m ? j[m] : ie[Y % ie.length]
             },
-            K
+            Y
           ))
         }
       ),
-      g,
-      S
+      x,
+      z
     ] });
   } else if (n === "radar") {
-    const E = ((p = s.radial) == null ? void 0 : p.value) || u;
-    l = /* @__PURE__ */ y(pt, { ...v, cx: "50%", cy: "50%", children: [
+    const w = ((c = l.radial) == null ? void 0 : c.value) || p;
+    a = /* @__PURE__ */ g(pt, { ...R, cx: "50%", cy: "50%", children: [
       /* @__PURE__ */ t(ht, {}),
-      /* @__PURE__ */ t(ft, { dataKey: E, tick: { fontSize: 11 } }),
-      /* @__PURE__ */ t(xt, { tick: { fontSize: 9, fill: e.textMut }, axisLine: !1 }),
-      d.map((M, H) => {
-        const P = M.color || M.pointColor || te[H % te.length];
+      /* @__PURE__ */ t(ft, { dataKey: w, tick: { fontSize: 11 } }),
+      /* @__PURE__ */ t(gt, { tick: { fontSize: 9, fill: e.textMut }, axisLine: !1 }),
+      d.map((v, T) => {
+        const m = v.color || v.pointColor || ie[T % ie.length];
         return /* @__PURE__ */ t(
-          gt,
+          xt,
           {
-            dataKey: M.value || M.id || "",
-            name: M.label || M.id,
-            stroke: P,
-            fill: P + "44"
+            dataKey: v.value || v.id || "",
+            name: v.label || v.id,
+            stroke: m,
+            fill: m + "44"
           },
-          M.id ?? H
+          v.id ?? T
         );
       }),
-      g,
-      S
+      x,
+      z
     ] });
   } else if (n === "scatter")
-    l = /* @__PURE__ */ y(yt, { margin: m, children: [
+    a = /* @__PURE__ */ g(yt, { margin: M, children: [
       r,
       /* @__PURE__ */ t(
         Ne,
         {
           type: "number",
           dataKey: "x",
-          name: ((T = s.bottom) == null ? void 0 : T.title) || "x",
+          name: ((N = l.bottom) == null ? void 0 : N.title) || "x",
           tick: { fontSize: 11, fill: e.textSec },
           tickLine: !1,
-          domain: [((R = s.bottom) == null ? void 0 : R.min) ?? "auto", ((C = s.bottom) == null ? void 0 : C.max) ?? "auto"],
-          label: (X = s.bottom) != null && X.title ? { value: s.bottom.title, position: "insideBottom", offset: -4, fontSize: 11 } : void 0
+          domain: [((A = l.bottom) == null ? void 0 : A.min) ?? "auto", ((S = l.bottom) == null ? void 0 : S.max) ?? "auto"],
+          label: (U = l.bottom) != null && U.title ? { value: l.bottom.title, position: "insideBottom", offset: -4, fontSize: 11 } : void 0
         }
       ),
       /* @__PURE__ */ t(
@@ -1045,70 +1257,70 @@ function Gt({
         {
           type: "number",
           dataKey: "y",
-          name: ((G = s.left) == null ? void 0 : G.title) || "y",
+          name: ((Z = l.left) == null ? void 0 : Z.title) || "y",
           tick: { fontSize: 11, fill: e.textSec },
           tickLine: !1,
           axisLine: !1,
-          domain: [((se = s.left) == null ? void 0 : se.min) ?? "auto", ((Q = s.left) == null ? void 0 : Q.max) ?? "auto"],
-          label: (ie = s.left) != null && ie.title ? { value: s.left.title, angle: -90, position: "insideLeft", fontSize: 11 } : void 0
+          domain: [((o = l.left) == null ? void 0 : o.min) ?? "auto", ((E = l.left) == null ? void 0 : E.max) ?? "auto"],
+          label: (_ = l.left) != null && _.title ? { value: l.left.title, angle: -90, position: "insideLeft", fontSize: 11 } : void 0
         }
       ),
-      g,
-      S,
-      d.map((E, M) => {
-        const H = E.value || "x", P = E.valueY || "y", Y = (E.data || o).map((K) => ({
-          x: K[H],
-          y: K[P]
+      x,
+      z,
+      d.map((w, v) => {
+        const T = w.value || "x", m = w.valueY || "y", j = (w.data || i).map((Y) => ({
+          x: Y[T],
+          y: Y[m]
         }));
         return /* @__PURE__ */ t(
           bt,
           {
-            data: Y,
-            name: E.label || E.id,
-            fill: E.color || te[M % te.length]
+            data: j,
+            name: w.label || w.id,
+            fill: w.color || ie[v % ie.length]
           },
-          E.id ?? M
+          w.id ?? v
         );
       })
     ] });
   else if (n === "treeMap") {
-    const E = d[0] || {}, M = E.value || "value", H = E.text || "name", P = It(o, M, H), Y = E.stroke || e.surface, K = E.strokeWidth ?? 2;
-    l = /* @__PURE__ */ t(
+    const w = d[0] || {}, v = w.value || "value", T = w.text || "name", m = Nt(i, v, T), j = w.stroke || e.surface, Y = w.strokeWidth ?? 2;
+    a = /* @__PURE__ */ t(
       vt,
       {
-        data: P,
+        data: m,
         dataKey: "value",
         aspectRatio: 4 / 3,
-        stroke: Y,
-        content: (re) => {
-          const { x: V, y: q, width: ee, height: Z, depth: xe, index: ue, name: F } = re;
-          if (xe === 0) return null;
-          const de = te[ue % te.length];
-          return /* @__PURE__ */ y("g", { children: [
+        stroke: j,
+        content: (G) => {
+          const { x: V, y: q, width: ee, height: te, depth: pe, index: ne, name: P } = G;
+          if (pe === 0) return null;
+          const de = ie[ne % ie.length];
+          return /* @__PURE__ */ g("g", { children: [
             /* @__PURE__ */ t(
               "rect",
               {
                 x: V,
                 y: q,
                 width: ee,
-                height: Z,
+                height: te,
                 fill: de,
-                stroke: Y,
-                strokeWidth: K,
+                stroke: j,
+                strokeWidth: Y,
                 style: { borderRadius: 3 }
               }
             ),
-            ee > 40 && Z > 20 && /* @__PURE__ */ t(
+            ee > 40 && te > 20 && /* @__PURE__ */ t(
               "text",
               {
                 x: V + ee / 2,
-                y: q + Z / 2,
+                y: q + te / 2,
                 textAnchor: "middle",
                 dominantBaseline: "middle",
                 fill: "#fff",
                 fontSize: 11,
                 pointerEvents: "none",
-                children: F
+                children: P
               }
             )
           ] });
@@ -1120,195 +1332,195 @@ function Gt({
     "div",
     {
       className: "dhx",
-      style: { width: "100%", height: a, padding: 12, background: e.surface, borderRadius: e.rMd, ...h },
-      children: /* @__PURE__ */ t(mt, { width: "100%", height: "100%", children: l })
+      style: { width: "100%", height: s, padding: 12, background: e.surface, borderRadius: e.rMd, ...f },
+      children: /* @__PURE__ */ t(mt, { width: "100%", height: "100%", children: a })
     }
   );
 }
-const Tt = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"], Nt = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
-function Jt({ value: n, range: o = !1, timepicker: d = !1, onChange: s, style: f }) {
-  const a = /* @__PURE__ */ new Date(), h = n ? new Date(Array.isArray(n) ? n[0] : n) : a, [u, g] = I(h), [S, r] = I(n ?? (o ? [null, null] : null)), [i, c] = I(null), [m, v] = I({ h: 0, m: 0 });
-  O(_, []);
-  const l = u.getFullYear(), x = u.getMonth(), w = new Date(l, x, 1).getDay(), z = new Date(l, x + 1, 0).getDate(), N = [];
-  for (let p = 0; p < w; p++) N.push(null);
-  for (let p = 1; p <= z; p++) N.push(new Date(l, x, p));
-  const k = (p) => p.toDateString() === a.toDateString(), $ = (p) => {
-    if (!S) return !1;
-    if (o && Array.isArray(S)) {
-      const [T, R] = S;
-      if (!T) return !1;
-      const C = p.getTime();
-      return R ? C >= T.getTime() && C <= R.getTime() : p.toDateString() === T.toDateString();
+const Et = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"], Wt = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
+function tn({ value: n, range: i = !1, timepicker: d = !1, onChange: l, style: u }) {
+  const s = /* @__PURE__ */ new Date(), f = n ? new Date(Array.isArray(n) ? n[0] : n) : s, [p, x] = B(f), [z, r] = B(n ?? (i ? [null, null] : null)), [b, h] = B(null), [M, R] = B({ h: 0, m: 0 });
+  J(Q, []);
+  const a = p.getFullYear(), k = p.getMonth(), C = new Date(a, k, 1).getDay(), L = new Date(a, k + 1, 0).getDate(), H = [];
+  for (let c = 0; c < C; c++) H.push(null);
+  for (let c = 1; c <= L; c++) H.push(new Date(a, k, c));
+  const $ = (c) => c.toDateString() === s.toDateString(), D = (c) => {
+    if (!z) return !1;
+    if (i && Array.isArray(z)) {
+      const [N, A] = z;
+      if (!N) return !1;
+      const S = c.getTime();
+      return A ? S >= N.getTime() && S <= A.getTime() : c.toDateString() === N.toDateString();
     }
-    return p.toDateString() === S.toDateString();
-  }, W = (p) => {
-    if (o) {
-      const [T, R] = Array.isArray(S) ? S : [null, null];
-      if (!T || R)
-        r([p, null]);
+    return c.toDateString() === z.toDateString();
+  }, K = (c) => {
+    if (i) {
+      const [N, A] = Array.isArray(z) ? z : [null, null];
+      if (!N || A)
+        r([c, null]);
       else {
-        const C = p < T ? [p, T] : [T, p];
-        r(C), s == null || s(C);
+        const S = c < N ? [c, N] : [N, c];
+        r(S), l == null || l(S);
       }
     } else
-      r(p), s == null || s(p);
+      r(c), l == null || l(c);
   };
-  return /* @__PURE__ */ y("div", { className: "dhx", style: { background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.rMd, padding: 16, display: "inline-block", boxShadow: e.shadow, ...f }, children: [
-    /* @__PURE__ */ y("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", marginBottom: 12 }, children: [
-      /* @__PURE__ */ t("button", { onClick: () => g((p) => new Date(p.getFullYear(), p.getMonth() - 1, 1)), className: "dhx dhx-btn dhx-btn-ghost", style: { height: 28, padding: "0 8px", fontSize: 16 }, children: "‹" }),
-      /* @__PURE__ */ y("div", { style: { fontWeight: 700, fontSize: 14 }, children: [
-        Tt[x],
+  return /* @__PURE__ */ g("div", { className: "dhx", style: { background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.rMd, padding: 16, display: "inline-block", boxShadow: e.shadow, ...u }, children: [
+    /* @__PURE__ */ g("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", marginBottom: 12 }, children: [
+      /* @__PURE__ */ t("button", { onClick: () => x((c) => new Date(c.getFullYear(), c.getMonth() - 1, 1)), className: "dhx dhx-btn dhx-btn-ghost", style: { height: 28, padding: "0 8px", fontSize: 16 }, children: "‹" }),
+      /* @__PURE__ */ g("div", { style: { fontWeight: 700, fontSize: 14 }, children: [
+        Et[k],
         " ",
-        l
+        a
       ] }),
-      /* @__PURE__ */ t("button", { onClick: () => g((p) => new Date(p.getFullYear(), p.getMonth() + 1, 1)), className: "dhx dhx-btn dhx-btn-ghost", style: { height: 28, padding: "0 8px", fontSize: 16 }, children: "›" })
+      /* @__PURE__ */ t("button", { onClick: () => x((c) => new Date(c.getFullYear(), c.getMonth() + 1, 1)), className: "dhx dhx-btn dhx-btn-ghost", style: { height: 28, padding: "0 8px", fontSize: 16 }, children: "›" })
     ] }),
-    /* @__PURE__ */ y("div", { style: { display: "grid", gridTemplateColumns: "repeat(7, 32px)", gap: 2 }, children: [
-      Nt.map((p) => /* @__PURE__ */ t("div", { style: { textAlign: "center", fontSize: 11, fontWeight: 600, color: e.textMut, paddingBottom: 4 }, children: p }, p)),
-      N.map((p, T) => {
-        const R = p ? $(p) : !1, C = p && i && p.toDateString() === i.toDateString();
+    /* @__PURE__ */ g("div", { style: { display: "grid", gridTemplateColumns: "repeat(7, 32px)", gap: 2 }, children: [
+      Wt.map((c) => /* @__PURE__ */ t("div", { style: { textAlign: "center", fontSize: 11, fontWeight: 600, color: e.textMut, paddingBottom: 4 }, children: c }, c)),
+      H.map((c, N) => {
+        const A = c ? D(c) : !1, S = c && b && c.toDateString() === b.toDateString();
         return /* @__PURE__ */ t(
           "div",
           {
-            onClick: () => p && W(p),
-            onMouseEnter: () => p && c(p),
-            onMouseLeave: () => c(null),
-            style: { width: 32, height: 32, display: "flex", alignItems: "center", justifyContent: "center", borderRadius: e.r, cursor: p ? "pointer" : "default", fontSize: 12, fontWeight: p && k(p) ? 700 : 400, background: R ? e.primary : C ? e.bg : "transparent", color: R ? "#fff" : p && k(p) ? e.primary : p ? e.text : "transparent", border: p && k(p) && !R ? `1px solid ${e.primary}` : "1px solid transparent", transition: "all .1s" },
-            children: p == null ? void 0 : p.getDate()
+            onClick: () => c && K(c),
+            onMouseEnter: () => c && h(c),
+            onMouseLeave: () => h(null),
+            style: { width: 32, height: 32, display: "flex", alignItems: "center", justifyContent: "center", borderRadius: e.r, cursor: c ? "pointer" : "default", fontSize: 12, fontWeight: c && $(c) ? 700 : 400, background: A ? e.primary : S ? e.bg : "transparent", color: A ? "#fff" : c && $(c) ? e.primary : c ? e.text : "transparent", border: c && $(c) && !A ? `1px solid ${e.primary}` : "1px solid transparent", transition: "all .1s" },
+            children: c == null ? void 0 : c.getDate()
           },
-          T
+          N
         );
       })
     ] }),
-    d && /* @__PURE__ */ y("div", { style: { borderTop: `1px solid ${e.border}`, marginTop: 12, paddingTop: 12, display: "flex", alignItems: "center", justifyContent: "center", gap: 8 }, children: [
-      /* @__PURE__ */ t("input", { type: "number", min: 0, max: 23, value: m.h, onChange: (p) => v((T) => ({ ...T, h: +p.target.value })), className: "dhx dhx-input", style: { width: 50, textAlign: "center" } }),
+    d && /* @__PURE__ */ g("div", { style: { borderTop: `1px solid ${e.border}`, marginTop: 12, paddingTop: 12, display: "flex", alignItems: "center", justifyContent: "center", gap: 8 }, children: [
+      /* @__PURE__ */ t("input", { type: "number", min: 0, max: 23, value: M.h, onChange: (c) => R((N) => ({ ...N, h: +c.target.value })), className: "dhx dhx-input", style: { width: 50, textAlign: "center" } }),
       /* @__PURE__ */ t("span", { style: { fontWeight: 700, color: e.textSec }, children: ":" }),
-      /* @__PURE__ */ t("input", { type: "number", min: 0, max: 59, value: m.m, onChange: (p) => v((T) => ({ ...T, m: +p.target.value })), className: "dhx dhx-input", style: { width: 50, textAlign: "center" } })
+      /* @__PURE__ */ t("input", { type: "number", min: 0, max: 59, value: M.m, onChange: (c) => R((N) => ({ ...N, m: +c.target.value })), className: "dhx dhx-input", style: { width: 50, textAlign: "center" } })
     ] })
   ] });
 }
-function Et({ value: n, onChange: o, timeFormat: d = 12, controls: s = !1, minuteStep: f = 5, style: a }) {
-  const [h, u] = I((n == null ? void 0 : n.h) ?? (d === 24 ? 0 : 12)), [g, S] = I((n == null ? void 0 : n.m) ?? 0), [r, i] = I((n == null ? void 0 : n.ampm) ?? "AM"), [c, m] = I(null);
-  O(_, []);
-  const v = d === 24 ? Array.from({ length: 24 }, (k, $) => $) : Array.from({ length: 12 }, (k, $) => $ + 1), l = Array.from({ length: Math.ceil(60 / f) }, (k, $) => $ * f), x = (k, $, W) => {
-    const p = d === 24 ? { h: k, m: $ } : { h: k, m: $, ampm: W };
-    s ? m(p) : o == null || o(p);
-  }, w = () => {
-    m(null), u((n == null ? void 0 : n.h) ?? (d === 24 ? 0 : 12)), S((n == null ? void 0 : n.m) ?? 0), i((n == null ? void 0 : n.ampm) ?? "AM");
-  }, z = { display: "flex", flexDirection: "column", alignItems: "center", gap: 4 }, N = (k) => ({
+function Bt({ value: n, onChange: i, timeFormat: d = 12, controls: l = !1, minuteStep: u = 5, style: s }) {
+  const [f, p] = B((n == null ? void 0 : n.h) ?? (d === 24 ? 0 : 12)), [x, z] = B((n == null ? void 0 : n.m) ?? 0), [r, b] = B((n == null ? void 0 : n.ampm) ?? "AM"), [h, M] = B(null);
+  J(Q, []);
+  const R = d === 24 ? Array.from({ length: 24 }, ($, D) => D) : Array.from({ length: 12 }, ($, D) => D + 1), a = Array.from({ length: Math.ceil(60 / u) }, ($, D) => D * u), k = ($, D, K) => {
+    const c = d === 24 ? { h: $, m: D } : { h: $, m: D, ampm: K };
+    l ? M(c) : i == null || i(c);
+  }, C = () => {
+    M(null), p((n == null ? void 0 : n.h) ?? (d === 24 ? 0 : 12)), z((n == null ? void 0 : n.m) ?? 0), b((n == null ? void 0 : n.ampm) ?? "AM");
+  }, L = { display: "flex", flexDirection: "column", alignItems: "center", gap: 4 }, H = ($) => ({
     height: 32,
     display: "flex",
     alignItems: "center",
     justifyContent: "center",
     cursor: "pointer",
     fontSize: 13,
-    fontWeight: k ? 700 : 400,
-    background: k ? e.primaryLt : "transparent",
-    color: k ? e.primary : e.text
+    fontWeight: $ ? 700 : 400,
+    background: $ ? e.primaryLt : "transparent",
+    color: $ ? e.primary : e.text
   });
-  return /* @__PURE__ */ y("div", { className: "dhx", style: { background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.rMd, padding: 16, display: "inline-block", boxShadow: e.shadow, ...a }, children: [
-    /* @__PURE__ */ y("div", { style: { display: "flex", gap: 8, alignItems: "stretch" }, children: [
-      /* @__PURE__ */ y("div", { style: z, children: [
+  return /* @__PURE__ */ g("div", { className: "dhx", style: { background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.rMd, padding: 16, display: "inline-block", boxShadow: e.shadow, ...s }, children: [
+    /* @__PURE__ */ g("div", { style: { display: "flex", gap: 8, alignItems: "stretch" }, children: [
+      /* @__PURE__ */ g("div", { style: L, children: [
         /* @__PURE__ */ t("span", { style: { fontSize: 11, fontWeight: 600, color: e.textMut }, children: "Hours" }),
-        /* @__PURE__ */ t("div", { className: "dhx-scroll", style: { height: 160, overflowY: "auto", width: 48, border: `1px solid ${e.border}`, borderRadius: e.r }, children: v.map((k) => /* @__PURE__ */ t(
+        /* @__PURE__ */ t("div", { className: "dhx-scroll", style: { height: 160, overflowY: "auto", width: 48, border: `1px solid ${e.border}`, borderRadius: e.r }, children: R.map(($) => /* @__PURE__ */ t(
           "div",
           {
             onClick: () => {
-              u(k), x(k, g, r);
+              p($), k($, x, r);
             },
-            style: N(h === k),
-            onMouseEnter: ($) => h !== k && ($.currentTarget.style.background = e.bg),
-            onMouseLeave: ($) => h !== k && ($.currentTarget.style.background = "transparent"),
-            children: String(k).padStart(2, "0")
+            style: H(f === $),
+            onMouseEnter: (D) => f !== $ && (D.currentTarget.style.background = e.bg),
+            onMouseLeave: (D) => f !== $ && (D.currentTarget.style.background = "transparent"),
+            children: String($).padStart(2, "0")
           },
-          k
+          $
         )) })
       ] }),
-      /* @__PURE__ */ y("div", { style: z, children: [
+      /* @__PURE__ */ g("div", { style: L, children: [
         /* @__PURE__ */ t("span", { style: { fontSize: 11, fontWeight: 600, color: e.textMut }, children: "Minutes" }),
-        /* @__PURE__ */ t("div", { className: "dhx-scroll", style: { height: 160, overflowY: "auto", width: 48, border: `1px solid ${e.border}`, borderRadius: e.r }, children: l.map((k) => /* @__PURE__ */ t(
+        /* @__PURE__ */ t("div", { className: "dhx-scroll", style: { height: 160, overflowY: "auto", width: 48, border: `1px solid ${e.border}`, borderRadius: e.r }, children: a.map(($) => /* @__PURE__ */ t(
           "div",
           {
             onClick: () => {
-              S(k), x(h, k, r);
+              z($), k(f, $, r);
             },
-            style: N(g === k),
-            onMouseEnter: ($) => g !== k && ($.currentTarget.style.background = e.bg),
-            onMouseLeave: ($) => g !== k && ($.currentTarget.style.background = "transparent"),
-            children: String(k).padStart(2, "0")
+            style: H(x === $),
+            onMouseEnter: (D) => x !== $ && (D.currentTarget.style.background = e.bg),
+            onMouseLeave: (D) => x !== $ && (D.currentTarget.style.background = "transparent"),
+            children: String($).padStart(2, "0")
           },
-          k
+          $
         )) })
       ] }),
-      d === 12 && /* @__PURE__ */ y("div", { style: z, children: [
+      d === 12 && /* @__PURE__ */ g("div", { style: L, children: [
         /* @__PURE__ */ t("span", { style: { fontSize: 11, fontWeight: 600, color: e.textMut }, children: "AM/PM" }),
-        /* @__PURE__ */ t("div", { style: { display: "flex", flexDirection: "column", border: `1px solid ${e.border}`, borderRadius: e.r, overflow: "hidden" }, children: ["AM", "PM"].map((k) => /* @__PURE__ */ t(
+        /* @__PURE__ */ t("div", { style: { display: "flex", flexDirection: "column", border: `1px solid ${e.border}`, borderRadius: e.r, overflow: "hidden" }, children: ["AM", "PM"].map(($) => /* @__PURE__ */ t(
           "div",
           {
             onClick: () => {
-              i(k), x(h, g, k);
+              b($), k(f, x, $);
             },
-            style: { height: 40, display: "flex", alignItems: "center", justifyContent: "center", cursor: "pointer", padding: "0 12px", fontSize: 13, fontWeight: r === k ? 700 : 400, background: r === k ? e.primary : e.surface, color: r === k ? "#fff" : e.text },
-            children: k
+            style: { height: 40, display: "flex", alignItems: "center", justifyContent: "center", cursor: "pointer", padding: "0 12px", fontSize: 13, fontWeight: r === $ ? 700 : 400, background: r === $ ? e.primary : e.surface, color: r === $ ? "#fff" : e.text },
+            children: $
           },
-          k
+          $
         )) })
       ] })
     ] }),
-    /* @__PURE__ */ y("div", { style: { textAlign: "center", marginTop: 12, fontSize: 22, fontWeight: 700, color: e.primary, letterSpacing: 2 }, children: [
-      String(h).padStart(2, "0"),
+    /* @__PURE__ */ g("div", { style: { textAlign: "center", marginTop: 12, fontSize: 22, fontWeight: 700, color: e.primary, letterSpacing: 2 }, children: [
+      String(f).padStart(2, "0"),
       ":",
-      String(g).padStart(2, "0"),
+      String(x).padStart(2, "0"),
       d === 12 ? ` ${r}` : ""
     ] }),
-    s && /* @__PURE__ */ y("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end", marginTop: 12 }, children: [
-      /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-secondary", onClick: w, children: "Cancel" }),
+    l && /* @__PURE__ */ g("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end", marginTop: 12 }, children: [
+      /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-secondary", onClick: C, children: "Cancel" }),
       /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-primary", onClick: () => {
-        const k = c ?? (d === 24 ? { h, m: g } : { h, m: g, ampm: r });
-        o == null || o(k);
+        const $ = h ?? (d === 24 ? { h: f, m: x } : { h: f, m: x, ampm: r });
+        i == null || i($);
       }, children: "Apply" })
     ] })
   ] });
 }
-const Rt = ({ open: n }) => /* @__PURE__ */ t("svg", { width: "12", height: "12", viewBox: "0 0 12 12", style: { flexShrink: 0, transition: "transform .15s", transform: n ? "rotate(180deg)" : "rotate(0deg)" }, children: /* @__PURE__ */ t("path", { d: "M2 4l4 4 4-4", stroke: e.textMut, strokeWidth: "1.5", fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }) });
-function Ae({ data: n = [], value: o, placeholder: d = "Select or type...", multiselection: s = !1, label: f, onChange: a, style: h }) {
-  var W;
-  const [u, g] = I(!1), [S, r] = I(""), [i, c] = I(
-    s ? o ? [].concat(o) : [] : o || null
-  ), m = ne(null), v = ne(null);
-  O(_, []), fe(m, oe(() => {
-    g(!1), r("");
+const Ht = ({ open: n }) => /* @__PURE__ */ t("svg", { width: "12", height: "12", viewBox: "0 0 12 12", style: { flexShrink: 0, transition: "transform .15s", transform: n ? "rotate(180deg)" : "rotate(0deg)" }, children: /* @__PURE__ */ t("path", { d: "M2 4l4 4 4-4", stroke: e.textMut, strokeWidth: "1.5", fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }) });
+function He({ data: n = [], value: i, placeholder: d = "Select or type...", multiselection: l = !1, label: u, onChange: s, style: f }) {
+  var K;
+  const [p, x] = B(!1), [z, r] = B(""), [b, h] = B(
+    l ? i ? [].concat(i) : [] : i || null
+  ), M = le(null), R = le(null);
+  J(Q, []), xe(M, ae(() => {
+    x(!1), r("");
   }, []));
-  const l = le(
-    () => n.filter((p) => !S || p.value.toLowerCase().includes(S.toLowerCase())),
-    [n, S]
-  ), x = (p) => s ? (i || []).includes(p) : i === p, w = (p) => {
-    const T = p.id || p.value;
-    if (s) {
-      const R = x(T) ? i.filter((C) => C !== T) : [...i || [], T];
-      c(R), a == null || a(R);
+  const a = ue(
+    () => n.filter((c) => !z || c.value.toLowerCase().includes(z.toLowerCase())),
+    [n, z]
+  ), k = (c) => l ? (b || []).includes(c) : b === c, C = (c) => {
+    const N = c.id || c.value;
+    if (l) {
+      const A = k(N) ? b.filter((S) => S !== N) : [...b || [], N];
+      h(A), s == null || s(A);
     } else
-      c(T), r(""), g(!1), a == null || a(T);
-  }, z = (p) => {
-    const T = i.filter((R) => R !== p);
-    c(T), a == null || a(T);
-  }, N = () => {
-    g(!0), setTimeout(() => {
-      var p;
-      return (p = v.current) == null ? void 0 : p.focus();
+      h(N), r(""), x(!1), s == null || s(N);
+  }, L = (c) => {
+    const N = b.filter((A) => A !== c);
+    h(N), s == null || s(N);
+  }, H = () => {
+    x(!0), setTimeout(() => {
+      var c;
+      return (c = R.current) == null ? void 0 : c.focus();
     }, 0);
-  }, k = ((W = n.find((p) => (p.id || p.value) === i)) == null ? void 0 : W.value) || "", $ = s ? i || [] : [];
-  return /* @__PURE__ */ y("div", { ref: m, className: "dhx", style: { position: "relative", ...h }, children: [
-    f && /* @__PURE__ */ t("label", { className: "dhx dhx-label", children: f }),
-    /* @__PURE__ */ y(
+  }, $ = ((K = n.find((c) => (c.id || c.value) === b)) == null ? void 0 : K.value) || "", D = l ? b || [] : [];
+  return /* @__PURE__ */ g("div", { ref: M, className: "dhx", style: { position: "relative", ...f }, children: [
+    u && /* @__PURE__ */ t("label", { className: "dhx dhx-label", children: u }),
+    /* @__PURE__ */ g(
       "div",
       {
-        onClick: N,
+        onClick: H,
         style: {
           display: "flex",
           alignItems: "center",
-          flexWrap: s ? "wrap" : "nowrap",
-          border: `1px solid ${u ? e.primary : e.border}`,
+          flexWrap: l ? "wrap" : "nowrap",
+          border: `1px solid ${p ? e.primary : e.border}`,
           borderRadius: e.r,
           minHeight: 34,
           padding: "4px 8px",
@@ -1316,13 +1528,13 @@ function Ae({ data: n = [], value: o, placeholder: d = "Select or type...", mult
           background: e.surface,
           gap: 4,
           transition: "border-color .15s",
-          boxShadow: u ? `0 0 0 3px ${e.primary}22` : "none"
+          boxShadow: p ? `0 0 0 3px ${e.primary}22` : "none"
         },
         children: [
-          s && /* @__PURE__ */ y(Oe, { children: [
-            $.map((p) => {
-              var T;
-              return /* @__PURE__ */ y("span", { style: {
+          l && /* @__PURE__ */ g(Ye, { children: [
+            D.map((c) => {
+              var N;
+              return /* @__PURE__ */ g("span", { style: {
                 display: "inline-flex",
                 alignItems: "center",
                 gap: 4,
@@ -1334,55 +1546,55 @@ function Ae({ data: n = [], value: o, placeholder: d = "Select or type...", mult
                 lineHeight: 1.5,
                 whiteSpace: "nowrap"
               }, children: [
-                ((T = n.find((R) => (R.id || R.value) === p)) == null ? void 0 : T.value) || p,
+                ((N = n.find((A) => (A.id || A.value) === c)) == null ? void 0 : N.value) || c,
                 /* @__PURE__ */ t(
                   "span",
                   {
-                    onClick: (R) => {
-                      R.stopPropagation(), z(p);
+                    onClick: (A) => {
+                      A.stopPropagation(), L(c);
                     },
                     style: { cursor: "pointer", fontSize: 15, lineHeight: 1, opacity: 0.75, marginLeft: 2 },
                     children: "×"
                   }
                 )
-              ] }, p);
+              ] }, c);
             }),
             /* @__PURE__ */ t(
               "input",
               {
-                ref: v,
-                value: S,
-                onChange: (p) => {
-                  r(p.target.value), g(!0);
+                ref: R,
+                value: z,
+                onChange: (c) => {
+                  r(c.target.value), x(!0);
                 },
-                onFocus: () => g(!0),
-                onClick: (p) => p.stopPropagation(),
-                placeholder: $.length ? "" : d,
+                onFocus: () => x(!0),
+                onClick: (c) => c.stopPropagation(),
+                placeholder: D.length ? "" : d,
                 style: { flex: 1, minWidth: 60, border: "none", outline: "none", fontSize: 13, background: "transparent", color: e.text, padding: 0 }
               }
             )
           ] }),
-          !s && /* @__PURE__ */ t(
+          !l && /* @__PURE__ */ t(
             "input",
             {
-              ref: v,
-              value: u ? S : k,
-              onChange: (p) => {
-                r(p.target.value), g(!0);
+              ref: R,
+              value: p ? z : $,
+              onChange: (c) => {
+                r(c.target.value), x(!0);
               },
               onFocus: () => {
-                g(!0), r("");
+                x(!0), r("");
               },
-              onClick: (p) => p.stopPropagation(),
+              onClick: (c) => c.stopPropagation(),
               placeholder: d,
               style: { flex: 1, border: "none", outline: "none", fontSize: 13, background: "transparent", color: e.text, padding: 0 }
             }
           ),
-          /* @__PURE__ */ t(Rt, { open: u })
+          /* @__PURE__ */ t(Ht, { open: p })
         ]
       }
     ),
-    u && /* @__PURE__ */ t("div", { className: "dhx dhx-anim-fade", style: {
+    p && /* @__PURE__ */ t("div", { className: "dhx dhx-anim-fade", style: {
       position: "absolute",
       top: "calc(100% + 4px)",
       left: 0,
@@ -1392,13 +1604,13 @@ function Ae({ data: n = [], value: o, placeholder: d = "Select or type...", mult
       borderRadius: e.r,
       boxShadow: e.shadowLg,
       zIndex: 100
-    }, children: /* @__PURE__ */ y("div", { className: "dhx-scroll", style: { maxHeight: 220, overflowY: "auto" }, children: [
-      l.map((p) => {
-        const T = p.id || p.value, R = x(T);
-        return /* @__PURE__ */ y(
+    }, children: /* @__PURE__ */ g("div", { className: "dhx-scroll", style: { maxHeight: 220, overflowY: "auto" }, children: [
+      a.map((c) => {
+        const N = c.id || c.value, A = k(N);
+        return /* @__PURE__ */ g(
           "div",
           {
-            onClick: () => w(p),
+            onClick: () => C(c),
             style: {
               padding: "8px 12px",
               cursor: "pointer",
@@ -1406,277 +1618,277 @@ function Ae({ data: n = [], value: o, placeholder: d = "Select or type...", mult
               alignItems: "center",
               gap: 8,
               fontSize: 13,
-              background: R ? e.primaryLt : "transparent",
-              color: R ? e.primary : e.text
+              background: A ? e.primaryLt : "transparent",
+              color: A ? e.primary : e.text
             },
-            onMouseEnter: (C) => !R && (C.currentTarget.style.background = e.bg),
-            onMouseLeave: (C) => !R && (C.currentTarget.style.background = "transparent"),
+            onMouseEnter: (S) => !A && (S.currentTarget.style.background = e.bg),
+            onMouseLeave: (S) => !A && (S.currentTarget.style.background = "transparent"),
             children: [
-              s && /* @__PURE__ */ t("span", { style: {
+              l && /* @__PURE__ */ t("span", { style: {
                 width: 14,
                 height: 14,
                 flexShrink: 0,
-                border: `2px solid ${R ? e.primary : e.borderDk}`,
+                border: `2px solid ${A ? e.primary : e.borderDk}`,
                 borderRadius: 3,
                 display: "flex",
                 alignItems: "center",
                 justifyContent: "center",
-                background: R ? e.primary : "transparent"
-              }, children: R && /* @__PURE__ */ t("span", { style: { color: "#fff", fontSize: 9, lineHeight: 1 }, children: "✓" }) }),
-              /* @__PURE__ */ t("span", { style: { flex: 1 }, children: p.value }),
-              !s && R && /* @__PURE__ */ t("span", { style: { color: e.primary, fontSize: 12, fontWeight: 700 }, children: "✓" }),
-              p.count !== void 0 && /* @__PURE__ */ y("span", { style: { fontSize: 11, color: e.textMut }, children: [
+                background: A ? e.primary : "transparent"
+              }, children: A && /* @__PURE__ */ t("span", { style: { color: "#fff", fontSize: 9, lineHeight: 1 }, children: "✓" }) }),
+              /* @__PURE__ */ t("span", { style: { flex: 1 }, children: c.value }),
+              !l && A && /* @__PURE__ */ t("span", { style: { color: e.primary, fontSize: 12, fontWeight: 700 }, children: "✓" }),
+              c.count !== void 0 && /* @__PURE__ */ g("span", { style: { fontSize: 11, color: e.textMut }, children: [
                 "(",
-                p.count,
+                c.count,
                 ")"
               ] })
             ]
           },
-          T
+          N
         );
       }),
-      l.length === 0 && /* @__PURE__ */ t("div", { style: { padding: 16, textAlign: "center", color: e.textMut, fontSize: 13 }, children: "No matches" })
+      a.length === 0 && /* @__PURE__ */ t("div", { style: { padding: 16, textAlign: "center", color: e.textMut, fontSize: 13 }, children: "No matches" })
     ] }) })
   ] });
 }
-function Be({ min: n = 0, max: o = 100, step: d = 1, value: s, range: f = !1, label: a, tick: h, disabled: u = !1, onChange: g, style: S }) {
-  const [r, i] = I(s ?? (f ? [n, o] : n));
-  O(_, []);
-  const c = (w, z) => {
-    if (!u)
-      if (f) {
-        const N = [...r];
-        N[w] = z, i(N), g == null || g(N);
+function Ae({ min: n = 0, max: i = 100, step: d = 1, value: l, range: u = !1, label: s, tick: f, disabled: p = !1, onChange: x, style: z }) {
+  const [r, b] = B(l ?? (u ? [n, i] : n));
+  J(Q, []);
+  const h = (C, L) => {
+    if (!p)
+      if (u) {
+        const H = [...r];
+        H[C] = L, b(H), x == null || x(H);
       } else
-        i(z), g == null || g(z);
-  }, m = (w) => (w - n) / (o - n) * 100, v = f ? r : [r], l = f ? { left: `${m(v[0])}%`, width: `${m(v[1]) - m(v[0])}%` } : { left: 0, width: `${m(v[0])}%` }, x = u ? e.border : e.primary;
-  return /* @__PURE__ */ y("div", { className: "dhx", style: { width: "100%", opacity: u ? 0.5 : 1, ...S }, children: [
-    a && /* @__PURE__ */ t("label", { className: "dhx dhx-label", children: a }),
-    /* @__PURE__ */ t("div", { style: { position: "relative", height: 36, display: "flex", alignItems: "center" }, children: /* @__PURE__ */ y("div", { style: { position: "relative", flex: 1, height: 4, background: e.border, borderRadius: 2 }, children: [
-      /* @__PURE__ */ t("div", { style: { position: "absolute", ...l, height: "100%", background: x, borderRadius: 2 } }),
-      v.map((w, z) => /* @__PURE__ */ t(
+        b(L), x == null || x(L);
+  }, M = (C) => (C - n) / (i - n) * 100, R = u ? r : [r], a = u ? { left: `${M(R[0])}%`, width: `${M(R[1]) - M(R[0])}%` } : { left: 0, width: `${M(R[0])}%` }, k = p ? e.border : e.primary;
+  return /* @__PURE__ */ g("div", { className: "dhx", style: { width: "100%", opacity: p ? 0.5 : 1, ...z }, children: [
+    s && /* @__PURE__ */ t("label", { className: "dhx dhx-label", children: s }),
+    /* @__PURE__ */ t("div", { style: { position: "relative", height: 36, display: "flex", alignItems: "center" }, children: /* @__PURE__ */ g("div", { style: { position: "relative", flex: 1, height: 4, background: e.border, borderRadius: 2 }, children: [
+      /* @__PURE__ */ t("div", { style: { position: "absolute", ...a, height: "100%", background: k, borderRadius: 2 } }),
+      R.map((C, L) => /* @__PURE__ */ t(
         "input",
         {
           type: "range",
           min: n,
-          max: o,
+          max: i,
           step: d,
-          value: w,
-          disabled: u,
-          onChange: (N) => {
-            const k = +N.target.value;
-            f && z === 0 && k >= r[1] || f && z === 1 && k <= r[0] || c(z, k);
+          value: C,
+          disabled: p,
+          onChange: (H) => {
+            const $ = +H.target.value;
+            u && L === 0 && $ >= r[1] || u && L === 1 && $ <= r[0] || h(L, $);
           },
-          style: { position: "absolute", width: "100%", height: "100%", opacity: 0, cursor: u ? "not-allowed" : "pointer", top: 0, left: 0, margin: 0 }
+          style: { position: "absolute", width: "100%", height: "100%", opacity: 0, cursor: p ? "not-allowed" : "pointer", top: 0, left: 0, margin: 0 }
         },
-        z
+        L
       )),
-      v.map((w, z) => /* @__PURE__ */ t("div", { style: { position: "absolute", left: `${m(w)}%`, top: "50%", transform: "translate(-50%, -50%)", width: 16, height: 16, borderRadius: "50%", background: e.surface, border: `2px solid ${x}`, boxShadow: "0 1px 4px rgba(0,0,0,.2)", pointerEvents: "none" }, children: /* @__PURE__ */ t("div", { style: { position: "absolute", bottom: "calc(100% + 6px)", left: "50%", transform: "translateX(-50%)", background: u ? e.textMut : e.primaryDk, color: "#fff", padding: "2px 6px", borderRadius: e.r, fontSize: 11, fontWeight: 700, whiteSpace: "nowrap" }, children: w }) }, z))
+      R.map((C, L) => /* @__PURE__ */ t("div", { style: { position: "absolute", left: `${M(C)}%`, top: "50%", transform: "translate(-50%, -50%)", width: 16, height: 16, borderRadius: "50%", background: e.surface, border: `2px solid ${k}`, boxShadow: "0 1px 4px rgba(0,0,0,.2)", pointerEvents: "none" }, children: /* @__PURE__ */ t("div", { style: { position: "absolute", bottom: "calc(100% + 6px)", left: "50%", transform: "translateX(-50%)", background: p ? e.textMut : e.primaryDk, color: "#fff", padding: "2px 6px", borderRadius: e.r, fontSize: 11, fontWeight: 700, whiteSpace: "nowrap" }, children: C }) }, L))
     ] }) }),
-    h && /* @__PURE__ */ t("div", { style: { display: "flex", justifyContent: "space-between", marginTop: 2 }, children: [n, Math.round((o + n) / 2), o].map((w) => /* @__PURE__ */ t("span", { style: { fontSize: 10, color: e.textMut }, children: w }, w)) })
+    f && /* @__PURE__ */ t("div", { style: { display: "flex", justifyContent: "space-between", marginTop: 2 }, children: [n, Math.round((i + n) / 2), i].map((C) => /* @__PURE__ */ t("span", { style: { fontSize: 10, color: e.textMut }, children: C }, C)) })
   ] });
 }
-const Wt = ["#f44336", "#e91e63", "#9c27b0", "#673ab7", "#3f51b5", "#2196f3", "#03a9f4", "#00bcd4", "#009688", "#4caf50", "#8bc34a", "#cddc39", "#ffeb3b", "#ffc107", "#ff9800", "#ff5722", "#795548", "#607d8b", "#9e9e9e", "#000000", "#ffffff", "#0288d1", "#01579b", "#43a047", "#e53935", "#f57c00"];
-function ke(n) {
-  const o = parseInt(n.slice(1, 3), 16) / 255, d = parseInt(n.slice(3, 5), 16) / 255, s = parseInt(n.slice(5, 7), 16) / 255, f = Math.max(o, d, s), a = Math.min(o, d, s);
-  let h = 0, u = 0;
-  const g = (f + a) / 2;
-  if (f !== a) {
-    const S = f - a;
-    u = g > 0.5 ? S / (2 - f - a) : S / (f + a), h = f === o ? ((d - s) / S + (d < s ? 6 : 0)) / 6 : f === d ? ((s - o) / S + 2) / 6 : ((o - d) / S + 4) / 6;
+const At = ["#f44336", "#e91e63", "#9c27b0", "#673ab7", "#3f51b5", "#2196f3", "#03a9f4", "#00bcd4", "#009688", "#4caf50", "#8bc34a", "#cddc39", "#ffeb3b", "#ffc107", "#ff9800", "#ff5722", "#795548", "#607d8b", "#9e9e9e", "#000000", "#ffffff", "#0288d1", "#01579b", "#43a047", "#e53935", "#f57c00"];
+function ze(n) {
+  const i = parseInt(n.slice(1, 3), 16) / 255, d = parseInt(n.slice(3, 5), 16) / 255, l = parseInt(n.slice(5, 7), 16) / 255, u = Math.max(i, d, l), s = Math.min(i, d, l);
+  let f = 0, p = 0;
+  const x = (u + s) / 2;
+  if (u !== s) {
+    const z = u - s;
+    p = x > 0.5 ? z / (2 - u - s) : z / (u + s), f = u === i ? ((d - l) / z + (d < l ? 6 : 0)) / 6 : u === d ? ((l - i) / z + 2) / 6 : ((i - d) / z + 4) / 6;
   }
-  return [Math.round(h * 360), Math.round(u * 100), Math.round(g * 100)];
+  return [Math.round(f * 360), Math.round(p * 100), Math.round(x * 100)];
 }
-function He(n, o, d) {
-  o /= 100, d /= 100;
-  const s = o * Math.min(d, 1 - d), f = (a) => {
-    const h = (a + n / 30) % 12, u = d - s * Math.max(Math.min(h - 3, 9 - h, 1), -1);
-    return Math.round(255 * u).toString(16).padStart(2, "0");
+function je(n, i, d) {
+  i /= 100, d /= 100;
+  const l = i * Math.min(d, 1 - d), u = (s) => {
+    const f = (s + n / 30) % 12, p = d - l * Math.max(Math.min(f - 3, 9 - f, 1), -1);
+    return Math.round(255 * p).toString(16).padStart(2, "0");
   };
-  return "#" + f(0) + f(8) + f(4);
+  return "#" + u(0) + u(8) + u(4);
 }
-function Ut({ value: n = "#0288d1", onChange: o, style: d }) {
-  const [s, f] = I(() => ke(n)), a = He(...s);
-  O(_, []);
-  const h = (u) => {
-    f(u), o == null || o(He(...u));
+function nn({ value: n = "#0288d1", onChange: i, style: d }) {
+  const [l, u] = B(() => ze(n)), s = je(...l);
+  J(Q, []);
+  const f = (p) => {
+    u(p), i == null || i(je(...p));
   };
-  return /* @__PURE__ */ y("div", { className: "dhx", style: { background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.rMd, padding: 16, display: "inline-block", boxShadow: e.shadow, ...d }, children: [
-    /* @__PURE__ */ t("div", { style: { width: 200, height: 120, borderRadius: e.r, marginBottom: 12, background: `linear-gradient(to bottom, transparent, black), linear-gradient(to right, white, hsl(${s[0]},100%,50%))`, cursor: "crosshair" } }),
-    [["Hue", 0, 360, s[0]], ["Saturation", 0, 100, s[1]], ["Lightness", 0, 100, s[2]]].map(([u, g, S, r], i) => /* @__PURE__ */ y("div", { style: { marginBottom: i < 2 ? 8 : 12 }, children: [
-      /* @__PURE__ */ y("div", { className: "dhx dhx-label", children: [
-        u,
-        i > 0 ? ` (${r}%)` : ""
+  return /* @__PURE__ */ g("div", { className: "dhx", style: { background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.rMd, padding: 16, display: "inline-block", boxShadow: e.shadow, ...d }, children: [
+    /* @__PURE__ */ t("div", { style: { width: 200, height: 120, borderRadius: e.r, marginBottom: 12, background: `linear-gradient(to bottom, transparent, black), linear-gradient(to right, white, hsl(${l[0]},100%,50%))`, cursor: "crosshair" } }),
+    [["Hue", 0, 360, l[0]], ["Saturation", 0, 100, l[1]], ["Lightness", 0, 100, l[2]]].map(([p, x, z, r], b) => /* @__PURE__ */ g("div", { style: { marginBottom: b < 2 ? 8 : 12 }, children: [
+      /* @__PURE__ */ g("div", { className: "dhx dhx-label", children: [
+        p,
+        b > 0 ? ` (${r}%)` : ""
       ] }),
-      /* @__PURE__ */ t("input", { type: "range", min: g, max: S, value: r, onChange: (c) => {
-        const m = [...s];
-        m[i] = +c.target.value, h(m);
+      /* @__PURE__ */ t("input", { type: "range", min: x, max: z, value: r, onChange: (h) => {
+        const M = [...l];
+        M[b] = +h.target.value, f(M);
       }, style: { width: "100%", accentColor: e.primary } })
-    ] }, u)),
-    /* @__PURE__ */ y("div", { style: { display: "flex", alignItems: "center", gap: 8, marginBottom: 12 }, children: [
-      /* @__PURE__ */ t("div", { style: { width: 36, height: 36, borderRadius: e.r, background: a, border: `1px solid ${e.border}`, flexShrink: 0 } }),
+    ] }, p)),
+    /* @__PURE__ */ g("div", { style: { display: "flex", alignItems: "center", gap: 8, marginBottom: 12 }, children: [
+      /* @__PURE__ */ t("div", { style: { width: 36, height: 36, borderRadius: e.r, background: s, border: `1px solid ${e.border}`, flexShrink: 0 } }),
       /* @__PURE__ */ t(
         "input",
         {
           className: "dhx dhx-input",
           style: { flex: 1, fontFamily: "monospace", fontSize: 12 },
-          value: a,
-          onChange: (u) => {
+          value: s,
+          onChange: (p) => {
             try {
-              h(ke(u.target.value)), o == null || o(u.target.value);
+              f(ze(p.target.value)), i == null || i(p.target.value);
             } catch {
             }
           }
         }
       )
     ] }),
-    /* @__PURE__ */ t("div", { style: { display: "grid", gridTemplateColumns: "repeat(13, 1fr)", gap: 3 }, children: Wt.map((u) => /* @__PURE__ */ t(
+    /* @__PURE__ */ t("div", { style: { display: "grid", gridTemplateColumns: "repeat(13, 1fr)", gap: 3 }, children: At.map((p) => /* @__PURE__ */ t(
       "div",
       {
         onClick: () => {
-          f(ke(u)), o == null || o(u);
+          u(ze(p)), i == null || i(p);
         },
-        style: { width: 14, height: 14, borderRadius: 2, background: u, cursor: "pointer", border: a === u ? `2px solid ${e.text}` : "1px solid rgba(0,0,0,.15)", transition: "transform .1s" },
-        onMouseEnter: (g) => g.currentTarget.style.transform = "scale(1.3)",
-        onMouseLeave: (g) => g.currentTarget.style.transform = "scale(1)"
+        style: { width: 14, height: 14, borderRadius: 2, background: p, cursor: "pointer", border: s === p ? `2px solid ${e.text}` : "1px solid rgba(0,0,0,.15)", transition: "transform .1s" },
+        onMouseEnter: (x) => x.currentTarget.style.transform = "scale(1.3)",
+        onMouseLeave: (x) => x.currentTarget.style.transform = "scale(1)"
       },
-      u
+      p
     )) })
   ] });
 }
-function Qt({ trigger: n, children: o, placement: d = "bottom-start", style: s }) {
-  const [f, a] = I(!1), [h, u] = I({ top: "100%", left: 0 }), g = ne(null), S = ne(null);
-  return O(_, []), fe(g, oe(() => a(!1), [])), /* @__PURE__ */ y("div", { ref: g, className: "dhx", style: { position: "relative", display: "inline-block" }, children: [
-    /* @__PURE__ */ t("div", { ref: S, onClick: () => {
-      a((i) => {
-        if (!i && S.current) {
-          const c = S.current.getBoundingClientRect(), m = {
-            "bottom-start": { top: c.height + 4, left: 0 },
-            "bottom-end": { top: c.height + 4, right: 0, left: "auto" },
-            "top-start": { bottom: c.height + 4, top: "auto", left: 0 }
+function rn({ trigger: n, children: i, placement: d = "bottom-start", style: l }) {
+  const [u, s] = B(!1), [f, p] = B({ top: "100%", left: 0 }), x = le(null), z = le(null);
+  return J(Q, []), xe(x, ae(() => s(!1), [])), /* @__PURE__ */ g("div", { ref: x, className: "dhx", style: { position: "relative", display: "inline-block" }, children: [
+    /* @__PURE__ */ t("div", { ref: z, onClick: () => {
+      s((b) => {
+        if (!b && z.current) {
+          const h = z.current.getBoundingClientRect(), M = {
+            "bottom-start": { top: h.height + 4, left: 0 },
+            "bottom-end": { top: h.height + 4, right: 0, left: "auto" },
+            "top-start": { bottom: h.height + 4, top: "auto", left: 0 }
           };
-          u(m[d] || m["bottom-start"]);
+          p(M[d] || M["bottom-start"]);
         }
-        return !i;
+        return !b;
       });
     }, children: n }),
-    f && /* @__PURE__ */ t("div", { className: "dhx dhx-anim-fade", style: { position: "absolute", ...h, zIndex: 200, background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.rMd, boxShadow: e.shadowLg, ...s }, children: o })
+    u && /* @__PURE__ */ t("div", { className: "dhx dhx-anim-fade", style: { position: "absolute", ...f, zIndex: 200, background: e.surface, border: `1px solid ${e.border}`, borderRadius: e.rMd, boxShadow: e.shadowLg, ...l }, children: i })
   ] });
 }
-function Zt({ title: n, children: o, width: d = 480, height: s, closable: f = !0, movable: a = !0, modal: h = !1, defaultOpen: u = !0, footer: g, onClose: S, style: r }) {
-  const [i, c] = I(u), [m, v] = I({ x: 0, y: 0 });
-  O(_, []);
-  const l = St(oe((w, z) => a && v({ x: w, y: z }), [a])), x = () => {
-    c(!1), S == null || S();
+function on({ title: n, children: i, width: d = 480, height: l, closable: u = !0, movable: s = !0, modal: f = !1, defaultOpen: p = !0, footer: x, onClose: z, style: r }) {
+  const [b, h] = B(p), [M, R] = B({ x: 0, y: 0 });
+  J(Q, []);
+  const a = kt(ae((C, L) => s && R({ x: C, y: L }), [s])), k = () => {
+    h(!1), z == null || z();
   };
-  return i ? /* @__PURE__ */ y(Oe, { children: [
-    h && /* @__PURE__ */ t("div", { style: { position: "fixed", inset: 0, background: "rgba(0,0,0,.45)", zIndex: 900 }, onClick: f ? x : void 0 }),
-    /* @__PURE__ */ y("div", { className: "dhx", style: { position: h ? "fixed" : "absolute", left: "50%", top: "50%", transform: `translate(calc(-50% + ${m.x}px), calc(-50% + ${m.y}px))`, width: d, ...s ? { height: s } : {}, background: e.surface, borderRadius: e.rMd, boxShadow: e.shadowLg, zIndex: 901, display: "flex", flexDirection: "column", overflow: "hidden", ...r }, children: [
-      /* @__PURE__ */ y("div", { onMouseDown: (w) => l(w, m.x, m.y), style: { display: "flex", alignItems: "center", padding: "12px 16px", borderBottom: `1px solid ${e.border}`, cursor: a ? "grab" : "default", background: e.bg, gap: 8, userSelect: "none" }, children: [
+  return b ? /* @__PURE__ */ g(Ye, { children: [
+    f && /* @__PURE__ */ t("div", { style: { position: "fixed", inset: 0, background: "rgba(0,0,0,.45)", zIndex: 900 }, onClick: u ? k : void 0 }),
+    /* @__PURE__ */ g("div", { className: "dhx", style: { position: f ? "fixed" : "absolute", left: "50%", top: "50%", transform: `translate(calc(-50% + ${M.x}px), calc(-50% + ${M.y}px))`, width: d, ...l ? { height: l } : {}, background: e.surface, borderRadius: e.rMd, boxShadow: e.shadowLg, zIndex: 901, display: "flex", flexDirection: "column", overflow: "hidden", ...r }, children: [
+      /* @__PURE__ */ g("div", { onMouseDown: (C) => a(C, M.x, M.y), style: { display: "flex", alignItems: "center", padding: "12px 16px", borderBottom: `1px solid ${e.border}`, cursor: s ? "grab" : "default", background: e.bg, gap: 8, userSelect: "none" }, children: [
         /* @__PURE__ */ t("span", { style: { flex: 1, fontWeight: 700, fontSize: 15 }, children: n }),
-        f && /* @__PURE__ */ t(
+        u && /* @__PURE__ */ t(
           "button",
           {
-            onClick: x,
+            onClick: k,
             style: { background: "none", border: "none", cursor: "pointer", width: 28, height: 28, borderRadius: e.r, display: "flex", alignItems: "center", justifyContent: "center", fontSize: 18, color: e.textSec },
-            onMouseEnter: (w) => w.currentTarget.style.background = e.border,
-            onMouseLeave: (w) => w.currentTarget.style.background = "none",
+            onMouseEnter: (C) => C.currentTarget.style.background = e.border,
+            onMouseLeave: (C) => C.currentTarget.style.background = "none",
             children: "×"
           }
         )
       ] }),
-      /* @__PURE__ */ t("div", { className: "dhx-scroll", style: { flex: 1, minHeight: 0, padding: 20, overflowY: "auto" }, children: o }),
-      g && /* @__PURE__ */ t("div", { style: { padding: "12px 16px", borderTop: `1px solid ${e.border}`, display: "flex", justifyContent: "flex-end", gap: 8, background: e.bg }, children: g })
+      /* @__PURE__ */ t("div", { className: "dhx-scroll", style: { flex: 1, minHeight: 0, padding: 20, overflowY: "auto" }, children: i }),
+      x && /* @__PURE__ */ t("div", { style: { padding: "12px 16px", borderTop: `1px solid ${e.border}`, display: "flex", justifyContent: "flex-end", gap: 8, background: e.bg }, children: x })
     ] })
   ] }) : null;
 }
-const Ye = Qe(null), At = { success: "✓", error: "✕", warning: "⚠", info: "ℹ" }, Fe = { success: e.success, error: e.danger, warning: e.warning, info: e.primary };
-function en({ children: n }) {
-  const [o, d] = I([]);
-  O(_, []);
-  const s = oe((h) => d((u) => u.filter((g) => g.id !== h)), []), f = oe((h) => {
-    const u = Date.now();
-    return d((g) => [...g, { id: u, ...h }]), h.duration !== 0 && setTimeout(() => s(u), h.duration || 4e3), u;
-  }, [s]), a = {
-    message: f,
-    alert: (h, u) => f({ type: "info", title: h, ...u }),
-    confirm: (h, u, g) => f({ type: "warning", title: h, confirm: u, ...g })
+const Ke = Qe(null), jt = { success: "✓", error: "✕", warning: "⚠", info: "ℹ" }, Pe = { success: e.success, error: e.danger, warning: e.warning, info: e.primary };
+function ln({ children: n }) {
+  const [i, d] = B([]);
+  J(Q, []);
+  const l = ae((f) => d((p) => p.filter((x) => x.id !== f)), []), u = ae((f) => {
+    const p = Date.now();
+    return d((x) => [...x, { id: p, ...f }]), f.duration !== 0 && setTimeout(() => l(p), f.duration || 4e3), p;
+  }, [l]), s = {
+    message: u,
+    alert: (f, p) => u({ type: "info", title: f, ...p }),
+    confirm: (f, p, x) => u({ type: "warning", title: f, confirm: p, ...x })
   };
-  return /* @__PURE__ */ y(Ye.Provider, { value: a, children: [
+  return /* @__PURE__ */ g(Ke.Provider, { value: s, children: [
     n,
-    /* @__PURE__ */ t("div", { style: { position: "fixed", top: 20, right: 20, zIndex: 9999, display: "flex", flexDirection: "column", gap: 8, pointerEvents: "none" }, children: o.map((h) => {
-      const u = h.type || "info";
-      return /* @__PURE__ */ y("div", { style: { background: e.surface, border: `1px solid ${e.border}`, borderLeft: `4px solid ${Fe[u]}`, borderRadius: e.r, boxShadow: e.shadowLg, padding: "12px 16px", minWidth: 280, maxWidth: 380, pointerEvents: "all", display: "flex", gap: 10, alignItems: "flex-start", animation: "dhx-toast .3s ease" }, children: [
-        /* @__PURE__ */ t("span", { style: { fontSize: 18, color: Fe[u], lineHeight: 1 }, children: At[u] }),
-        /* @__PURE__ */ y("div", { style: { flex: 1 }, children: [
-          h.title && /* @__PURE__ */ t("div", { style: { fontWeight: 600, fontSize: 13, marginBottom: h.text ? 3 : 0 }, children: h.title }),
-          h.text && /* @__PURE__ */ t("div", { style: { fontSize: 12, color: e.textSec, lineHeight: 1.5 }, children: h.text }),
-          h.confirm && /* @__PURE__ */ y("div", { style: { display: "flex", gap: 6, marginTop: 8 }, children: [
+    /* @__PURE__ */ t("div", { style: { position: "fixed", top: 20, right: 20, zIndex: 9999, display: "flex", flexDirection: "column", gap: 8, pointerEvents: "none" }, children: i.map((f) => {
+      const p = f.type || "info";
+      return /* @__PURE__ */ g("div", { style: { background: e.surface, border: `1px solid ${e.border}`, borderLeft: `4px solid ${Pe[p]}`, borderRadius: e.r, boxShadow: e.shadowLg, padding: "12px 16px", minWidth: 280, maxWidth: 380, pointerEvents: "all", display: "flex", gap: 10, alignItems: "flex-start", animation: "dhx-toast .3s ease" }, children: [
+        /* @__PURE__ */ t("span", { style: { fontSize: 18, color: Pe[p], lineHeight: 1 }, children: jt[p] }),
+        /* @__PURE__ */ g("div", { style: { flex: 1 }, children: [
+          f.title && /* @__PURE__ */ t("div", { style: { fontWeight: 600, fontSize: 13, marginBottom: f.text ? 3 : 0 }, children: f.title }),
+          f.text && /* @__PURE__ */ t("div", { style: { fontSize: 12, color: e.textSec, lineHeight: 1.5 }, children: f.text }),
+          f.confirm && /* @__PURE__ */ g("div", { style: { display: "flex", gap: 6, marginTop: 8 }, children: [
             /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-primary", style: { height: 26, fontSize: 12 }, onClick: () => {
-              h.confirm(!0), s(h.id);
+              f.confirm(!0), l(f.id);
             }, children: "Confirm" }),
             /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-secondary", style: { height: 26, fontSize: 12 }, onClick: () => {
-              h.confirm(!1), s(h.id);
+              f.confirm(!1), l(f.id);
             }, children: "Cancel" })
           ] })
         ] }),
-        /* @__PURE__ */ t("button", { onClick: () => s(h.id), style: { background: "none", border: "none", cursor: "pointer", color: e.textMut, fontSize: 14, lineHeight: 1, padding: 0 }, children: "×" })
-      ] }, h.id);
+        /* @__PURE__ */ t("button", { onClick: () => l(f.id), style: { background: "none", border: "none", cursor: "pointer", color: e.textMut, fontSize: 14, lineHeight: 1, padding: 0 }, children: "×" })
+      ] }, f.id);
     }) })
   ] });
 }
-function tn() {
-  const n = Ze(Ye);
+function sn() {
+  const n = Ze(Ke);
   if (!n) throw new Error("useMessage must be used inside <MessageProvider>");
   return n;
 }
-function nn({ data: n = [], template: o, keyNavigation: d = !0, multiselection: s = !1, editable: f = !1, height: a = 400, onSelect: h, onEdit: u, style: g }) {
-  const [S, r] = I(/* @__PURE__ */ new Set()), [i, c] = I(null), [m, v] = I(""), [l, x] = I(null);
-  O(_, []);
-  const w = (N, k) => {
-    const $ = N.id ?? k;
-    r((W) => {
-      const p = s ? new Set(W) : /* @__PURE__ */ new Set();
-      return p.has($) ? p.delete($) : p.add($), p;
-    }), x(k), h == null || h(N);
-  }, z = (N, k) => {
-    u == null || u({ ...N, value: m }, k), c(null);
+function an({ data: n = [], template: i, keyNavigation: d = !0, multiselection: l = !1, editable: u = !1, height: s = 400, onSelect: f, onEdit: p, style: x }) {
+  const [z, r] = B(/* @__PURE__ */ new Set()), [b, h] = B(null), [M, R] = B(""), [a, k] = B(null);
+  J(Q, []);
+  const C = (H, $) => {
+    const D = H.id ?? $;
+    r((K) => {
+      const c = l ? new Set(K) : /* @__PURE__ */ new Set();
+      return c.has(D) ? c.delete(D) : c.add(D), c;
+    }), k($), f == null || f(H);
+  }, L = (H, $) => {
+    p == null || p({ ...H, value: M }, $), h(null);
   };
-  return /* @__PURE__ */ y(
+  return /* @__PURE__ */ g(
     "div",
     {
       className: "dhx dhx-scroll",
-      style: { height: a, overflowY: "auto", border: `1px solid ${e.border}`, borderRadius: e.r, background: e.surface, ...g },
+      style: { height: s, overflowY: "auto", border: `1px solid ${e.border}`, borderRadius: e.r, background: e.surface, ...x },
       tabIndex: 0,
-      onKeyDown: (N) => {
-        d && (N.key === "ArrowDown" && x((k) => Math.min((k ?? -1) + 1, n.length - 1)), N.key === "ArrowUp" && x((k) => Math.max((k ?? 1) - 1, 0)));
+      onKeyDown: (H) => {
+        d && (H.key === "ArrowDown" && k(($) => Math.min(($ ?? -1) + 1, n.length - 1)), H.key === "ArrowUp" && k(($) => Math.max(($ ?? 1) - 1, 0)));
       },
       children: [
-        n.map((N, k) => {
-          const $ = N.id ?? k, W = S.has($), p = l === k;
+        n.map((H, $) => {
+          const D = H.id ?? $, K = z.has(D), c = a === $;
           return /* @__PURE__ */ t(
             "div",
             {
-              onClick: () => w(N, k),
-              onDoubleClick: () => f && (c(k), v(String(N.value || ""))),
-              style: { display: "flex", alignItems: "center", padding: "0 12px", height: 40, cursor: "pointer", fontSize: 13, borderBottom: `1px solid ${e.border}`, background: W ? e.primaryLt : p ? e.bg : e.surface, color: W ? e.primary : e.text, outline: p ? `2px solid ${e.primary}44` : "none", transition: "background .1s" },
-              children: i === k ? /* @__PURE__ */ t(
+              onClick: () => C(H, $),
+              onDoubleClick: () => u && (h($), R(String(H.value || ""))),
+              style: { display: "flex", alignItems: "center", padding: "0 12px", height: 40, cursor: "pointer", fontSize: 13, borderBottom: `1px solid ${e.border}`, background: K ? e.primaryLt : c ? e.bg : e.surface, color: K ? e.primary : e.text, outline: c ? `2px solid ${e.primary}44` : "none", transition: "background .1s" },
+              children: b === $ ? /* @__PURE__ */ t(
                 "input",
                 {
                   autoFocus: !0,
                   className: "dhx dhx-input",
                   style: { height: 28, flex: 1 },
-                  value: m,
-                  onChange: (T) => v(T.target.value),
-                  onBlur: () => z(N, k),
-                  onKeyDown: (T) => {
-                    T.key === "Enter" && z(N, k), T.key === "Escape" && c(null);
+                  value: M,
+                  onChange: (N) => R(N.target.value),
+                  onBlur: () => L(H, $),
+                  onKeyDown: (N) => {
+                    N.key === "Enter" && L(H, $), N.key === "Escape" && h(null);
                   },
-                  onClick: (T) => T.stopPropagation()
+                  onClick: (N) => N.stopPropagation()
                 }
-              ) : o ? /* @__PURE__ */ t("div", { dangerouslySetInnerHTML: { __html: o(N) }, style: { flex: 1 } }) : /* @__PURE__ */ t("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: String(N.value ?? "") })
+              ) : i ? /* @__PURE__ */ t("div", { dangerouslySetInnerHTML: { __html: i(H) }, style: { flex: 1 } }) : /* @__PURE__ */ t("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: String(H.value ?? "") })
             },
-            String($)
+            String(D)
           );
         }),
         n.length === 0 && /* @__PURE__ */ t("div", { style: { padding: 24, textAlign: "center", color: e.textMut }, children: "No items" })
@@ -1684,684 +1896,855 @@ function nn({ data: n = [], template: o, keyNavigation: d = !0, multiselection:
     }
   );
 }
-function rn({ data: n = [], template: o, itemsInRow: d = 3, gap: s = 12, multiselection: f = !1, onSelect: a, style: h }) {
-  const [u, g] = I(/* @__PURE__ */ new Set());
-  O(_, []);
-  const S = (r) => {
-    const i = r.id ?? String(r.title);
-    g((c) => {
-      const m = f ? new Set(c) : /* @__PURE__ */ new Set();
-      return m.has(i) ? m.delete(i) : m.add(i), m;
-    }), a == null || a(r);
+function dn({ data: n = [], template: i, itemsInRow: d = 3, gap: l = 12, multiselection: u = !1, onSelect: s, style: f }) {
+  const [p, x] = B(/* @__PURE__ */ new Set());
+  J(Q, []);
+  const z = (r) => {
+    const b = r.id ?? String(r.title);
+    x((h) => {
+      const M = u ? new Set(h) : /* @__PURE__ */ new Set();
+      return M.has(b) ? M.delete(b) : M.add(b), M;
+    }), s == null || s(r);
   };
-  return /* @__PURE__ */ t("div", { className: "dhx", style: { display: "grid", gridTemplateColumns: `repeat(${d}, 1fr)`, gap: s, padding: s, ...h }, children: n.map((r, i) => {
-    const c = r.id ?? i, m = u.has(c);
+  return /* @__PURE__ */ t("div", { className: "dhx", style: { display: "grid", gridTemplateColumns: `repeat(${d}, 1fr)`, gap: l, padding: l, ...f }, children: n.map((r, b) => {
+    const h = r.id ?? b, M = p.has(h);
     return /* @__PURE__ */ t(
       "div",
       {
-        onClick: () => S(r),
-        style: { background: e.surface, border: `2px solid ${m ? e.primary : e.border}`, borderRadius: e.rMd, overflow: "hidden", cursor: "pointer", transition: "all .15s", boxShadow: m ? `0 0 0 3px ${e.primary}33` : e.shadow, transform: m ? "translateY(-2px)" : "none" },
-        onMouseEnter: (v) => {
-          v.currentTarget.style.boxShadow = e.shadowLg, v.currentTarget.style.transform = "translateY(-2px)";
+        onClick: () => z(r),
+        style: { background: e.surface, border: `2px solid ${M ? e.primary : e.border}`, borderRadius: e.rMd, overflow: "hidden", cursor: "pointer", transition: "all .15s", boxShadow: M ? `0 0 0 3px ${e.primary}33` : e.shadow, transform: M ? "translateY(-2px)" : "none" },
+        onMouseEnter: (R) => {
+          R.currentTarget.style.boxShadow = e.shadowLg, R.currentTarget.style.transform = "translateY(-2px)";
         },
-        onMouseLeave: (v) => {
-          v.currentTarget.style.boxShadow = m ? `0 0 0 3px ${e.primary}33` : e.shadow, v.currentTarget.style.transform = m ? "translateY(-2px)" : "none";
+        onMouseLeave: (R) => {
+          R.currentTarget.style.boxShadow = M ? `0 0 0 3px ${e.primary}33` : e.shadow, R.currentTarget.style.transform = M ? "translateY(-2px)" : "none";
         },
-        children: o ? /* @__PURE__ */ t("div", { dangerouslySetInnerHTML: { __html: o(r) } }) : /* @__PURE__ */ y("div", { style: { padding: 16 }, children: [
+        children: i ? /* @__PURE__ */ t("div", { dangerouslySetInnerHTML: { __html: i(r) } }) : /* @__PURE__ */ g("div", { style: { padding: 16 }, children: [
           r.img && /* @__PURE__ */ t("img", { src: r.img, alt: r.title || "", style: { width: "100%", borderRadius: e.r, marginBottom: 8, display: "block" } }),
           /* @__PURE__ */ t("div", { style: { fontWeight: 600, fontSize: 14, marginBottom: 4 }, children: r.title || r.value }),
           r.subtitle && /* @__PURE__ */ t("div", { style: { fontSize: 12, color: e.textSec }, children: r.subtitle })
         ] })
       },
-      String(c)
+      String(h)
     );
   }) });
 }
-function Se(n) {
-  return n.map((o) => ({ ...o, items: o.items ? Se(o.items) : void 0 }));
+function Me(n) {
+  return n.map((i) => ({ ...i, items: i.items ? Me(i.items) : void 0 }));
 }
-function we(n, o = {}) {
+function $e(n, i = {}) {
   return n.forEach((d) => {
-    d.opened && (o[d.id] = !0), d.items && we(d.items, o);
-  }), o;
+    d.opened && (i[d.id] = !0), d.items && $e(d.items, i);
+  }), i;
 }
-function Ke(n, o) {
+function _e(n, i) {
   let d = null;
-  return [n.filter((f) => f.id === o ? (d = f, !1) : !0).map((f) => {
-    if (f.items) {
-      const [a, h] = Ke(f.items, o);
-      return h && (d = h), { ...f, items: a };
+  return [n.filter((u) => u.id === i ? (d = u, !1) : !0).map((u) => {
+    if (u.items) {
+      const [s, f] = _e(u.items, i);
+      return f && (d = f), { ...u, items: s };
     }
-    return f;
+    return u;
   }), d];
 }
-function ze(n, o, d, s) {
-  if (s === "inside")
-    return n.map((a) => a.id === o ? { ...a, items: [...a.items || [], d] } : a.items ? { ...a, items: ze(a.items, o, d, s) } : a);
-  if (n.some((a) => a.id === o)) {
-    const a = [];
-    for (const h of n)
-      h.id === o ? s === "before" ? (a.push(d), a.push(h)) : (a.push(h), a.push(d)) : a.push(h);
-    return a;
+function Ce(n, i, d, l) {
+  if (l === "inside")
+    return n.map((s) => s.id === i ? { ...s, items: [...s.items || [], d] } : s.items ? { ...s, items: Ce(s.items, i, d, l) } : s);
+  if (n.some((s) => s.id === i)) {
+    const s = [];
+    for (const f of n)
+      f.id === i ? l === "before" ? (s.push(d), s.push(f)) : (s.push(f), s.push(d)) : s.push(f);
+    return s;
   }
-  return n.map((a) => a.items ? { ...a, items: ze(a.items, o, d, s) } : a);
+  return n.map((s) => s.items ? { ...s, items: Ce(s.items, i, d, l) } : s);
 }
-function Bt(n, o, d) {
-  function s(f) {
-    var a, h;
-    if (f.id === o) {
-      const u = (g) => {
-        var S;
-        return g.id === d || (((S = g.items) == null ? void 0 : S.some(u)) ?? !1);
+function Pt(n, i, d) {
+  function l(u) {
+    var s, f;
+    if (u.id === i) {
+      const p = (x) => {
+        var z;
+        return x.id === d || (((z = x.items) == null ? void 0 : z.some(p)) ?? !1);
       };
-      return ((a = f.items) == null ? void 0 : a.some(u)) ?? !1;
+      return ((s = u.items) == null ? void 0 : s.some(p)) ?? !1;
     }
-    return ((h = f.items) == null ? void 0 : h.some(s)) ?? !1;
+    return ((f = u.items) == null ? void 0 : f.some(l)) ?? !1;
   }
-  return n.some(s);
+  return n.some(l);
 }
-function _e(n, o, d) {
+function Ve(n, i, d) {
   return n.map(
-    (s) => s.id === o ? { ...s, value: d } : { ...s, items: s.items ? _e(s.items, o, d) : void 0 }
+    (l) => l.id === i ? { ...l, value: d } : { ...l, items: l.items ? Ve(l.items, i, d) : void 0 }
   );
 }
-function Ht(n, o) {
-  var a;
-  let d = 0, s = 0;
-  const f = (h) => {
-    var u;
-    d++, o[h.id] && s++, (u = h.items) == null || u.forEach(f);
+function Ft(n, i) {
+  var s;
+  let d = 0, l = 0;
+  const u = (f) => {
+    var p;
+    d++, i[f.id] && l++, (p = f.items) == null || p.forEach(u);
   };
-  return (a = n.items) == null || a.forEach(f), { total: d, checkedCount: s };
+  return (s = n.items) == null || s.forEach(u), { total: d, checkedCount: l };
 }
-function on({
+function cn({
   data: n = [],
-  checkbox: o = !1,
+  checkbox: i = !1,
   editable: d = !1,
-  dragMode: s,
-  tooltip: f,
-  onSelect: a,
-  onCheck: h,
-  onChange: u,
-  style: g
+  dragMode: l,
+  tooltip: u,
+  onSelect: s,
+  onCheck: f,
+  onChange: p,
+  style: x
 }) {
-  const [S, r] = I(() => Se(n)), [i, c] = I(() => we(n)), [m, v] = I(null), [l, x] = I({}), [w, z] = I(null), [N, k] = I(""), [$, W] = I(null), [p, T] = I(null);
-  O(_, []), O(() => {
-    r(Se(n)), c((M) => ({ ...we(n), ...M }));
+  const [z, r] = B(() => Me(n)), [b, h] = B(() => $e(n)), [M, R] = B(null), [a, k] = B({}), [C, L] = B(null), [H, $] = B(""), [D, K] = B(null), [c, N] = B(null);
+  J(Q, []), J(() => {
+    r(Me(n)), h((v) => ({ ...$e(n), ...v }));
   }, [n]);
-  const R = (M) => c((H) => ({ ...H, [M]: !H[M] })), C = (M, H) => {
-    x((P) => ({ ...P, [M]: H })), h == null || h(M, H);
-  }, X = () => {
-    if (!w) return;
-    const M = w, H = N;
-    z(null), r((P) => {
-      const Y = _e(P, M, H);
-      return u == null || u(Y), Y;
+  const A = (v) => h((T) => ({ ...T, [v]: !T[v] })), S = (v, T) => {
+    k((m) => ({ ...m, [v]: T })), f == null || f(v, T);
+  }, U = () => {
+    if (!C) return;
+    const v = C, T = H;
+    L(null), r((m) => {
+      const j = Ve(m, v, T);
+      return p == null || p(j), j;
     });
-  }, G = (M, H) => {
-    M.dataTransfer.effectAllowed = "move", W(H);
-  }, se = (M, H) => {
-    if (!$ || $ === H || Bt(S, $, H)) return;
-    M.preventDefault();
-    const P = M.currentTarget.getBoundingClientRect(), Y = M.clientY - P.top, K = P.height, re = Y < K * 0.25 ? "before" : Y > K * 0.75 ? "after" : "inside";
-    T((V) => (V == null ? void 0 : V.id) === H && (V == null ? void 0 : V.pos) === re ? V : { id: H, pos: re });
-  }, Q = (M, H) => {
-    if (M.preventDefault(), !$ || !p || $ === H) {
-      T(null), W(null);
+  }, Z = (v, T) => {
+    v.dataTransfer.effectAllowed = "move", K(T);
+  }, o = (v, T) => {
+    if (!D || D === T || Pt(z, D, T)) return;
+    v.preventDefault();
+    const m = v.currentTarget.getBoundingClientRect(), j = v.clientY - m.top, Y = m.height, G = j < Y * 0.25 ? "before" : j > Y * 0.75 ? "after" : "inside";
+    N((V) => (V == null ? void 0 : V.id) === T && (V == null ? void 0 : V.pos) === G ? V : { id: T, pos: G });
+  }, E = (v, T) => {
+    if (v.preventDefault(), !D || !c || D === T) {
+      N(null), K(null);
       return;
     }
-    r((P) => {
-      const [Y, K] = Ke(P, $);
-      if (!K) return P;
-      const re = ze(Y, H, K, p.pos);
-      return u == null || u(re), re;
-    }), p.pos === "inside" && c((P) => ({ ...P, [H]: !0 })), T(null), W(null);
-  }, ie = () => {
-    W(null), T(null);
-  }, E = (M, H = 0) => {
-    var ue;
-    const P = (((ue = M.items) == null ? void 0 : ue.length) ?? 0) > 0, Y = i[M.id], K = m === M.id, re = $ === M.id, V = (p == null ? void 0 : p.id) === M.id;
-    let q = !!l[M.id], ee = !1;
-    if (o && P) {
-      const { total: F, checkedCount: de } = Ht(M, l);
-      de > 0 && de < F ? ee = !0 : F > 0 && de === F && (q = !0);
+    r((m) => {
+      const [j, Y] = _e(m, D);
+      if (!Y) return m;
+      const G = Ce(j, T, Y, c.pos);
+      return p == null || p(G), G;
+    }), c.pos === "inside" && h((m) => ({ ...m, [T]: !0 })), N(null), K(null);
+  }, _ = () => {
+    K(null), N(null);
+  }, w = (v, T = 0) => {
+    var ne;
+    const m = (((ne = v.items) == null ? void 0 : ne.length) ?? 0) > 0, j = b[v.id], Y = M === v.id, G = D === v.id, V = (c == null ? void 0 : c.id) === v.id;
+    let q = !!a[v.id], ee = !1;
+    if (i && m) {
+      const { total: P, checkedCount: de } = Ft(v, a);
+      de > 0 && de < P ? ee = !0 : P > 0 && de === P && (q = !0);
     }
-    const Z = V && p.pos !== "inside" ? { boxShadow: p.pos === "before" ? `inset 0 2px 0 0 ${e.primary}` : `inset 0 -2px 0 0 ${e.primary}` } : {}, xe = V && p.pos === "inside" || K ? e.primaryLt : "transparent";
-    return /* @__PURE__ */ y("div", { style: { opacity: re ? 0.4 : 1 }, children: [
-      /* @__PURE__ */ y(
+    const te = V && c.pos !== "inside" ? { boxShadow: c.pos === "before" ? `inset 0 2px 0 0 ${e.primary}` : `inset 0 -2px 0 0 ${e.primary}` } : {}, pe = V && c.pos === "inside" || Y ? e.primaryLt : "transparent";
+    return /* @__PURE__ */ g("div", { style: { opacity: G ? 0.4 : 1 }, children: [
+      /* @__PURE__ */ g(
         "div",
         {
-          draggable: !!s,
-          onDragStart: s ? (F) => G(F, M.id) : void 0,
-          onDragOver: s ? (F) => se(F, M.id) : void 0,
-          onDrop: s ? (F) => Q(F, M.id) : void 0,
-          onDragEnd: s ? ie : void 0,
-          title: f == null ? void 0 : f(M),
+          draggable: !!l,
+          onDragStart: l ? (P) => Z(P, v.id) : void 0,
+          onDragOver: l ? (P) => o(P, v.id) : void 0,
+          onDrop: l ? (P) => E(P, v.id) : void 0,
+          onDragEnd: l ? _ : void 0,
+          title: u == null ? void 0 : u(v),
           onClick: () => {
-            v(M.id), a == null || a(M), P && R(M.id);
+            R(v.id), s == null || s(v), m && A(v.id);
           },
           onDoubleClick: () => {
-            d && (z(M.id), k(M.value || ""));
+            d && (L(v.id), $(v.value || ""));
           },
           style: {
             display: "flex",
             alignItems: "center",
             gap: 4,
-            padding: `5px 8px 5px ${12 + H * 18}px`,
-            cursor: s ? "grab" : "pointer",
+            padding: `5px 8px 5px ${12 + T * 18}px`,
+            cursor: l ? "grab" : "pointer",
             borderRadius: e.r,
             margin: "1px 4px",
-            background: xe,
-            color: K ? e.primary : e.text,
+            background: pe,
+            color: Y ? e.primary : e.text,
             userSelect: "none",
             fontSize: 13,
-            ...Z
+            ...te
           },
-          onMouseEnter: (F) => !K && !V && (F.currentTarget.style.background = e.bg),
-          onMouseLeave: (F) => !K && !V && (F.currentTarget.style.background = "transparent"),
+          onMouseEnter: (P) => !Y && !V && (P.currentTarget.style.background = e.bg),
+          onMouseLeave: (P) => !Y && !V && (P.currentTarget.style.background = "transparent"),
           children: [
             /* @__PURE__ */ t(
               "span",
               {
                 style: { width: 16, textAlign: "center", fontSize: 11, color: e.textMut, flexShrink: 0 },
-                onClick: (F) => {
-                  F.stopPropagation(), P && R(M.id);
+                onClick: (P) => {
+                  P.stopPropagation(), m && A(v.id);
                 },
-                children: P ? Y ? "▾" : "▸" : ""
+                children: m ? j ? "▾" : "▸" : ""
               }
             ),
-            /* @__PURE__ */ t("span", { style: { fontSize: 15, flexShrink: 0 }, children: P ? Y ? "📂" : "📁" : "📄" }),
-            o && /* @__PURE__ */ t(
+            /* @__PURE__ */ t("span", { style: { fontSize: 15, flexShrink: 0 }, children: m ? j ? "📂" : "📁" : "📄" }),
+            i && /* @__PURE__ */ t(
               "input",
               {
-                ref: (F) => {
-                  F && (F.indeterminate = ee);
+                ref: (P) => {
+                  P && (P.indeterminate = ee);
                 },
                 type: "checkbox",
                 checked: q,
-                onChange: (F) => {
-                  F.stopPropagation(), C(M.id, F.target.checked);
+                onChange: (P) => {
+                  P.stopPropagation(), S(v.id, P.target.checked);
                 },
                 style: { cursor: "pointer", accentColor: e.primary, flexShrink: 0 },
-                onClick: (F) => F.stopPropagation()
+                onClick: (P) => P.stopPropagation()
               }
             ),
-            w === M.id ? /* @__PURE__ */ t(
+            C === v.id ? /* @__PURE__ */ t(
               "input",
               {
                 autoFocus: !0,
                 className: "dhx dhx-input",
                 style: { height: 24, fontSize: 12, flex: 1 },
-                value: N,
-                onChange: (F) => k(F.target.value),
-                onBlur: X,
-                onKeyDown: (F) => {
-                  F.key === "Enter" && X(), F.key === "Escape" && z(null);
+                value: H,
+                onChange: (P) => $(P.target.value),
+                onBlur: U,
+                onKeyDown: (P) => {
+                  P.key === "Enter" && U(), P.key === "Escape" && L(null);
                 },
-                onClick: (F) => F.stopPropagation()
+                onClick: (P) => P.stopPropagation()
               }
-            ) : /* @__PURE__ */ t("span", { style: { flex: 1 }, children: M.value }),
-            M.count !== void 0 && /* @__PURE__ */ y("span", { style: { fontSize: 11, color: e.textMut }, children: [
+            ) : /* @__PURE__ */ t("span", { style: { flex: 1 }, children: v.value }),
+            v.count !== void 0 && /* @__PURE__ */ g("span", { style: { fontSize: 11, color: e.textMut }, children: [
               "(",
-              M.count,
+              v.count,
               ")"
             ] })
           ]
         }
       ),
-      P && Y && /* @__PURE__ */ t("div", { children: M.items.map((F) => E(F, H + 1)) })
-    ] }, M.id);
+      m && j && /* @__PURE__ */ t("div", { children: v.items.map((P) => w(P, T + 1)) })
+    ] }, v.id);
   };
   return /* @__PURE__ */ t(
     "div",
     {
       className: "dhx dhx-scroll",
-      style: { overflowY: "auto", ...g },
-      onDragOver: s ? (M) => M.preventDefault() : void 0,
-      onDrop: s ? (M) => {
-        M.preventDefault(), T(null), W(null);
+      style: { overflowY: "auto", ...x },
+      onDragOver: l ? (v) => v.preventDefault() : void 0,
+      onDrop: l ? (v) => {
+        v.preventDefault(), N(null), K(null);
       } : void 0,
-      children: S.map((M) => E(M))
+      children: z.map((v) => w(v))
     }
   );
 }
-function ln({ total: n, pageSize: o = 10, page: d, onChange: s, style: f }) {
-  const [a, h] = I(d || 1), u = Math.ceil(n / o);
-  O(_, []);
-  const g = (r) => {
-    const i = Math.min(Math.max(1, r), u);
-    h(i), s == null || s(i);
-  }, S = le(() => {
+function un({ total: n, pageSize: i = 10, page: d, onChange: l, style: u }) {
+  const [s, f] = B(d || 1), p = Math.ceil(n / i);
+  J(Q, []);
+  const x = (r) => {
+    const b = Math.min(Math.max(1, r), p);
+    f(b), l == null || l(b);
+  }, z = ue(() => {
     const r = [];
-    for (let c = Math.max(1, a - 2); c <= Math.min(u, a + 2); c++) r.push(c);
-    return r[0] > 1 && (r[0] > 2 && r.unshift("..."), r.unshift(1)), r[r.length - 1] < u && (r[r.length - 1] < u - 1 && r.push("..."), r.push(u)), r;
-  }, [a, u]);
-  return /* @__PURE__ */ y("div", { className: "dhx", style: { display: "flex", alignItems: "center", gap: 4, padding: "8px 12px", ...f }, children: [
-    /* @__PURE__ */ y("span", { style: { fontSize: 12, color: e.textSec, marginRight: 8 }, children: [
-      (a - 1) * o + 1,
+    for (let h = Math.max(1, s - 2); h <= Math.min(p, s + 2); h++) r.push(h);
+    return r[0] > 1 && (r[0] > 2 && r.unshift("..."), r.unshift(1)), r[r.length - 1] < p && (r[r.length - 1] < p - 1 && r.push("..."), r.push(p)), r;
+  }, [s, p]);
+  return /* @__PURE__ */ g("div", { className: "dhx", style: { display: "flex", alignItems: "center", gap: 4, padding: "8px 12px", ...u }, children: [
+    /* @__PURE__ */ g("span", { style: { fontSize: 12, color: e.textSec, marginRight: 8 }, children: [
+      (s - 1) * i + 1,
       "–",
-      Math.min(a * o, n),
+      Math.min(s * i, n),
       " of ",
       n
     ] }),
-    [["«", 1], ["‹", a - 1]].map(([r, i]) => /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-ghost", style: { height: 30, padding: "0 8px", fontSize: 14 }, disabled: a === 1, onClick: () => g(i), children: r }, r)),
-    S.map((r, i) => /* @__PURE__ */ t("button", { onClick: () => typeof r == "number" && g(r), className: `dhx dhx-btn ${r === a ? "dhx-btn-primary" : "dhx-btn-ghost"}`, style: { height: 30, minWidth: 30, padding: "0 8px", fontSize: 13 }, disabled: r === "...", children: r }, i)),
-    [["›", a + 1], ["»", u]].map(([r, i]) => /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-ghost", style: { height: 30, padding: "0 8px", fontSize: 14 }, disabled: a === u, onClick: () => g(i), children: r }, r))
+    [["«", 1], ["‹", s - 1]].map(([r, b]) => /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-ghost", style: { height: 30, padding: "0 8px", fontSize: 14 }, disabled: s === 1, onClick: () => x(b), children: r }, r)),
+    z.map((r, b) => /* @__PURE__ */ t("button", { onClick: () => typeof r == "number" && x(r), className: `dhx dhx-btn ${r === s ? "dhx-btn-primary" : "dhx-btn-ghost"}`, style: { height: 30, minWidth: 30, padding: "0 8px", fontSize: 13 }, disabled: r === "...", children: r }, b)),
+    [["›", s + 1], ["»", p]].map(([r, b]) => /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-ghost", style: { height: 30, padding: "0 8px", fontSize: 14 }, disabled: s === p, onClick: () => x(b), children: r }, r))
   ] });
 }
-function sn({ config: n = {}, defaultValues: o = {}, onSubmit: d, style: s }) {
-  const [f, a] = I(o), [h, u] = I({}), [g, S] = I(null);
-  O(_, []);
-  const r = (l, x) => {
-    a((w) => ({ ...w, [l]: x })), u((w) => ({ ...w, [l]: null }));
-  }, i = (l) => {
-    const x = [];
-    return l.flat().forEach((w) => {
-      !w || typeof w != "object" || !("name" in w) || (x.push(w), w.type === "fieldset" && w.rows && x.push(...i(w.rows)));
-    }), x;
-  }, c = () => {
-    const l = {};
-    return i(n.rows || []).forEach((x) => {
-      x.required && !f[x.name] && (l[x.name] = `${x.label || x.name} is required`);
-    }), u(l), Object.keys(l).length === 0;
-  }, m = (l) => {
-    const x = f[l.name] ?? l.value ?? "", w = h[l.name], z = l.labelWidth ?? n.labelWidth, N = z !== void 0 || l.labelPosition === "left";
-    if (l.type === "fieldset") return /* @__PURE__ */ y("fieldset", { style: { border: `1px solid ${e.border}`, borderRadius: e.r, padding: "12px 16px", marginBottom: 14 }, children: [
-      /* @__PURE__ */ t("legend", { style: { fontSize: 12, fontWeight: 700, color: e.textSec, padding: "0 6px" }, children: l.label }),
-      (l.rows || []).map((C) => m(C))
-    ] }, l.name);
-    if (l.type === "spacer") return /* @__PURE__ */ t("div", { style: { height: l.height || 16 } }, l.name);
-    const k = z ? { minWidth: z, width: z, flexShrink: 0, paddingTop: 8, boxSizing: "border-box" } : {}, $ = l.label ? /* @__PURE__ */ y("label", { className: "dhx dhx-label", style: { display: "flex", gap: 4, ...k }, children: [
-      l.label,
-      l.required && /* @__PURE__ */ t("span", { style: { color: e.danger }, children: "*" })
-    ] }, "lbl") : null, W = w ? /* @__PURE__ */ t("div", { style: { fontSize: 11, color: e.danger, marginTop: 3 }, children: w }) : null, p = l.helpMessage ? /* @__PURE__ */ y("div", { style: { fontSize: 11, color: e.textMut, marginTop: 3 }, children: [
+function pn({ config: n = {}, defaultValues: i = {}, onSubmit: d, style: l }) {
+  const [u, s] = B(i), [f, p] = B({}), [x, z] = B(null);
+  J(Q, []);
+  const r = (a, k) => {
+    s((C) => ({ ...C, [a]: k })), p((C) => ({ ...C, [a]: null }));
+  }, b = (a) => {
+    const k = [];
+    return a.flat().forEach((C) => {
+      !C || typeof C != "object" || !("name" in C) || (k.push(C), C.type === "fieldset" && C.rows && k.push(...b(C.rows)));
+    }), k;
+  }, h = () => {
+    const a = {};
+    return b(n.rows || []).forEach((k) => {
+      k.required && !u[k.name] && (a[k.name] = `${k.label || k.name} is required`);
+    }), p(a), Object.keys(a).length === 0;
+  }, M = (a) => {
+    const k = u[a.name] ?? a.value ?? "", C = f[a.name], L = a.labelWidth ?? n.labelWidth, H = L !== void 0 || a.labelPosition === "left";
+    if (a.type === "fieldset") return /* @__PURE__ */ g("fieldset", { style: { border: `1px solid ${e.border}`, borderRadius: e.r, padding: "12px 16px", marginBottom: 14 }, children: [
+      /* @__PURE__ */ t("legend", { style: { fontSize: 12, fontWeight: 700, color: e.textSec, padding: "0 6px" }, children: a.label }),
+      (a.rows || []).map((S) => M(S))
+    ] }, a.name);
+    if (a.type === "spacer") return /* @__PURE__ */ t("div", { style: { height: a.height || 16 } }, a.name);
+    const $ = L ? { minWidth: L, width: L, flexShrink: 0, paddingTop: 8, boxSizing: "border-box" } : {}, D = a.label ? /* @__PURE__ */ g("label", { className: "dhx dhx-label", style: { display: "flex", gap: 4, ...$ }, children: [
+      a.label,
+      a.required && /* @__PURE__ */ t("span", { style: { color: e.danger }, children: "*" })
+    ] }, "lbl") : null, K = C ? /* @__PURE__ */ t("div", { style: { fontSize: 11, color: e.danger, marginTop: 3 }, children: C }) : null, c = a.helpMessage ? /* @__PURE__ */ g("div", { style: { fontSize: 11, color: e.textMut, marginTop: 3 }, children: [
       "ⓘ ",
-      l.helpMessage
-    ] }) : null, T = { key: l.name, className: "dhx-form-group" }, R = (C) => N ? /* @__PURE__ */ y("div", { ...T, style: { display: "flex", alignItems: "flex-start", gap: 8 }, children: [
-      $,
-      /* @__PURE__ */ y("div", { style: { flex: 1, minWidth: 0 }, children: [
-        C,
-        W,
-        p
+      a.helpMessage
+    ] }) : null, N = { key: a.name, className: "dhx-form-group" }, A = (S) => H ? /* @__PURE__ */ g("div", { ...N, style: { display: "flex", alignItems: "flex-start", gap: 8 }, children: [
+      D,
+      /* @__PURE__ */ g("div", { style: { flex: 1, minWidth: 0 }, children: [
+        S,
+        K,
+        c
       ] })
-    ] }) : /* @__PURE__ */ y("div", { ...T, children: [
-      $,
-      C,
-      W,
-      p
+    ] }) : /* @__PURE__ */ g("div", { ...N, children: [
+      D,
+      S,
+      K,
+      c
     ] });
-    if (!l.type || l.type === "input") return R(
-      /* @__PURE__ */ y("div", { className: "dhx-input-wrap", children: [
-        l.icon && /* @__PURE__ */ t("span", { className: "dhx-input-icon", children: l.icon }),
+    if (!a.type || a.type === "input") return A(
+      /* @__PURE__ */ g("div", { className: "dhx-input-wrap", children: [
+        a.icon && /* @__PURE__ */ t("span", { className: "dhx-input-icon", children: a.icon }),
         /* @__PURE__ */ t(
           "input",
           {
-            className: `dhx dhx-input${l.icon ? " dhx-input--with-icon" : ""}`,
-            style: { borderColor: w ? e.danger : void 0 },
-            type: l.inputType || "text",
-            placeholder: l.placeholder,
-            value: x,
-            onChange: (C) => r(l.name, C.target.value),
-            disabled: l.disabled
+            className: `dhx dhx-input${a.icon ? " dhx-input--with-icon" : ""}`,
+            style: { borderColor: C ? e.danger : void 0 },
+            type: a.inputType || "text",
+            placeholder: a.placeholder,
+            value: k,
+            onChange: (S) => r(a.name, S.target.value),
+            disabled: a.disabled
           }
         )
       ] })
     );
-    if (l.type === "textarea") return R(
+    if (a.type === "textarea") return A(
       /* @__PURE__ */ t(
         "textarea",
         {
           className: "dhx dhx-input",
           style: { height: 80, resize: "vertical", padding: "8px 10px" },
-          placeholder: l.placeholder,
-          value: x,
-          onChange: (C) => r(l.name, C.target.value)
+          placeholder: a.placeholder,
+          value: k,
+          onChange: (S) => r(a.name, S.target.value)
         }
       )
     );
-    if (l.type === "select") return R(
-      /* @__PURE__ */ y("select", { className: "dhx dhx-input", value: x, onChange: (C) => r(l.name, C.target.value), style: { cursor: "pointer" }, children: [
+    if (a.type === "select") return A(
+      /* @__PURE__ */ g("select", { className: "dhx dhx-input", value: k, onChange: (S) => r(a.name, S.target.value), style: { cursor: "pointer" }, children: [
         /* @__PURE__ */ t("option", { value: "", children: "— Select —" }),
-        (l.options || []).map((C) => /* @__PURE__ */ t("option", { value: C.value, children: C.label || C.value }, C.value))
+        (a.options || []).map((S) => /* @__PURE__ */ t("option", { value: S.value, children: S.label || S.value }, S.value))
       ] })
     );
-    if (l.type === "datepicker") return R(
-      /* @__PURE__ */ t("input", { type: "date", className: "dhx dhx-input", value: x, onChange: (C) => r(l.name, C.target.value) })
+    if (a.type === "datepicker") return A(
+      /* @__PURE__ */ t("input", { type: "date", className: "dhx dhx-input", value: k, onChange: (S) => r(a.name, S.target.value) })
     );
-    if (l.type === "timepicker") {
-      const C = f[l.name] ?? { h: 12, m: 0, ampm: "AM" }, X = !!f[l.name], G = X ? `${String(C.h).padStart(2, "0")}:${String(C.m).padStart(2, "0")}${C.ampm ? " " + C.ampm : ""}` : l.placeholder || "Click to select", se = /* @__PURE__ */ y("div", { style: { position: "relative" }, children: [
-        /* @__PURE__ */ y(
+    if (a.type === "timepicker") {
+      const S = u[a.name] ?? { h: 12, m: 0, ampm: "AM" }, U = !!u[a.name], Z = U ? `${String(S.h).padStart(2, "0")}:${String(S.m).padStart(2, "0")}${S.ampm ? " " + S.ampm : ""}` : a.placeholder || "Click to select", o = /* @__PURE__ */ g("div", { style: { position: "relative" }, children: [
+        /* @__PURE__ */ g(
           "div",
           {
             className: "dhx dhx-input",
             style: { cursor: "pointer", display: "flex", alignItems: "center", justifyContent: "space-between" },
-            onClick: () => S(g === l.name ? null : l.name),
+            onClick: () => z(x === a.name ? null : a.name),
             children: [
-              /* @__PURE__ */ t("span", { style: { color: X ? e.text : e.textMut }, children: G }),
+              /* @__PURE__ */ t("span", { style: { color: U ? e.text : e.textMut }, children: Z }),
               /* @__PURE__ */ t("span", { style: { fontSize: 13, color: e.textSec }, children: "🕐" })
             ]
           }
         ),
-        g === l.name && /* @__PURE__ */ t("div", { style: { position: "absolute", zIndex: 100, top: "calc(100% + 4px)", left: 0 }, children: /* @__PURE__ */ t(Et, { value: C, controls: !0, onChange: (Q) => {
-          r(l.name, Q), S(null);
+        x === a.name && /* @__PURE__ */ t("div", { style: { position: "absolute", zIndex: 100, top: "calc(100% + 4px)", left: 0 }, children: /* @__PURE__ */ t(Bt, { value: S, controls: !0, onChange: (E) => {
+          r(a.name, E), z(null);
         } }) })
       ] });
-      return R(se);
+      return A(o);
     }
-    if (l.type === "colorpicker") return R(
-      /* @__PURE__ */ y("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
+    if (a.type === "colorpicker") return A(
+      /* @__PURE__ */ g("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
         /* @__PURE__ */ t(
           "input",
           {
             type: "color",
-            value: x || "#000000",
-            onChange: (C) => r(l.name, C.target.value),
+            value: k || "#000000",
+            onChange: (S) => r(a.name, S.target.value),
             style: { width: 36, height: 36, padding: 2, border: `1px solid ${e.border}`, borderRadius: e.r, cursor: "pointer", background: "none" }
           }
         ),
-        /* @__PURE__ */ t("span", { style: { fontSize: 12, color: e.textSec, fontFamily: "monospace" }, children: x || "#000000" })
+        /* @__PURE__ */ t("span", { style: { fontSize: 12, color: e.textSec, fontFamily: "monospace" }, children: k || "#000000" })
       ] })
     );
-    if (l.type === "text") return R(
-      /* @__PURE__ */ t("p", { style: { margin: "6px 0", fontSize: 13, color: e.text }, children: l.value })
+    if (a.type === "text") return A(
+      /* @__PURE__ */ t("p", { style: { margin: "6px 0", fontSize: 13, color: e.text }, children: a.value })
     );
-    if (l.type === "checkbox") return /* @__PURE__ */ y("div", { ...T, children: [
-      N ? /* @__PURE__ */ y("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
-        z && /* @__PURE__ */ t("div", { style: { width: z, flexShrink: 0 } }),
-        /* @__PURE__ */ y("label", { style: { display: "flex", alignItems: "center", gap: 8, cursor: "pointer" }, children: [
-          /* @__PURE__ */ t("input", { type: "checkbox", checked: !!x, onChange: (C) => r(l.name, C.target.checked), style: { width: 16, height: 16, accentColor: e.primary, cursor: "pointer" } }),
-          /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: l.label })
+    if (a.type === "checkbox") return /* @__PURE__ */ g("div", { ...N, children: [
+      H ? /* @__PURE__ */ g("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
+        L && /* @__PURE__ */ t("div", { style: { width: L, flexShrink: 0 } }),
+        /* @__PURE__ */ g("label", { style: { display: "flex", alignItems: "center", gap: 8, cursor: "pointer" }, children: [
+          /* @__PURE__ */ t("input", { type: "checkbox", checked: !!k, onChange: (S) => r(a.name, S.target.checked), style: { width: 16, height: 16, accentColor: e.primary, cursor: "pointer" } }),
+          /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: a.label })
         ] })
-      ] }) : /* @__PURE__ */ y("label", { style: { display: "flex", alignItems: "center", gap: 8, cursor: "pointer" }, children: [
-        /* @__PURE__ */ t("input", { type: "checkbox", checked: !!x, onChange: (C) => r(l.name, C.target.checked), style: { width: 16, height: 16, accentColor: e.primary, cursor: "pointer" } }),
-        /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: l.label })
+      ] }) : /* @__PURE__ */ g("label", { style: { display: "flex", alignItems: "center", gap: 8, cursor: "pointer" }, children: [
+        /* @__PURE__ */ t("input", { type: "checkbox", checked: !!k, onChange: (S) => r(a.name, S.target.checked), style: { width: 16, height: 16, accentColor: e.primary, cursor: "pointer" } }),
+        /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: a.label })
       ] }),
-      p
+      c
     ] });
-    if (l.type === "radio") {
-      const C = (l.options || []).map((X) => /* @__PURE__ */ y("label", { style: { display: "flex", alignItems: "center", gap: 6, cursor: "pointer", fontSize: 13 }, children: [
+    if (a.type === "radio") {
+      const S = (a.options || []).map((U) => /* @__PURE__ */ g("label", { style: { display: "flex", alignItems: "center", gap: 6, cursor: "pointer", fontSize: 13 }, children: [
         /* @__PURE__ */ t(
           "input",
           {
             type: "radio",
-            name: l.name,
-            value: X.value,
-            checked: x === X.value,
-            onChange: () => r(l.name, X.value),
+            name: a.name,
+            value: U.value,
+            checked: k === U.value,
+            onChange: () => r(a.name, U.value),
             style: { accentColor: e.primary, cursor: "pointer" }
           }
         ),
-        X.label || X.value
-      ] }, X.value));
-      return R(
-        /* @__PURE__ */ t("div", { style: { display: "flex", gap: 16, flexWrap: "wrap", paddingTop: 8 }, children: C })
+        U.label || U.value
+      ] }, U.value));
+      return A(
+        /* @__PURE__ */ t("div", { style: { display: "flex", gap: 16, flexWrap: "wrap", paddingTop: 8 }, children: S })
       );
     }
-    if (l.type === "slider") return N ? /* @__PURE__ */ y("div", { ...T, style: { display: "flex", alignItems: "flex-start", gap: 8 }, children: [
-      $,
-      /* @__PURE__ */ y("div", { style: { flex: 1 }, children: [
+    if (a.type === "slider") return H ? /* @__PURE__ */ g("div", { ...N, style: { display: "flex", alignItems: "flex-start", gap: 8 }, children: [
+      D,
+      /* @__PURE__ */ g("div", { style: { flex: 1 }, children: [
         /* @__PURE__ */ t(
-          Be,
+          Ae,
           {
-            min: l.min,
-            max: l.max,
-            step: l.step,
-            value: x || l.min,
-            range: l.range,
-            onChange: (C) => r(l.name, C)
+            min: a.min,
+            max: a.max,
+            step: a.step,
+            value: k || a.min,
+            range: a.range,
+            onChange: (S) => r(a.name, S)
           }
         ),
-        p
+        c
       ] })
-    ] }) : /* @__PURE__ */ y("div", { ...T, children: [
+    ] }) : /* @__PURE__ */ g("div", { ...N, children: [
       /* @__PURE__ */ t(
-        Be,
+        Ae,
         {
-          label: l.label,
-          min: l.min,
-          max: l.max,
-          step: l.step,
-          value: x || l.min,
-          range: l.range,
-          onChange: (C) => r(l.name, C)
+          label: a.label,
+          min: a.min,
+          max: a.max,
+          step: a.step,
+          value: k || a.min,
+          range: a.range,
+          onChange: (S) => r(a.name, S)
         }
       ),
-      p
+      c
     ] });
-    if (l.type === "combo") return N ? /* @__PURE__ */ y("div", { ...T, style: { display: "flex", alignItems: "flex-start", gap: 8 }, children: [
-      $,
-      /* @__PURE__ */ y("div", { style: { flex: 1 }, children: [
+    if (a.type === "combo") return H ? /* @__PURE__ */ g("div", { ...N, style: { display: "flex", alignItems: "flex-start", gap: 8 }, children: [
+      D,
+      /* @__PURE__ */ g("div", { style: { flex: 1 }, children: [
         /* @__PURE__ */ t(
-          Ae,
+          He,
           {
-            data: l.data || [],
-            multiselection: l.multiselection,
-            placeholder: l.placeholder || "Select...",
-            value: x || (l.multiselection ? [] : null),
-            onChange: (C) => r(l.name, C)
+            data: a.data || [],
+            multiselection: a.multiselection,
+            placeholder: a.placeholder || "Select...",
+            value: k || (a.multiselection ? [] : null),
+            onChange: (S) => r(a.name, S)
           }
         ),
-        W,
-        p
+        K,
+        c
       ] })
-    ] }) : /* @__PURE__ */ y("div", { ...T, children: [
+    ] }) : /* @__PURE__ */ g("div", { ...N, children: [
       /* @__PURE__ */ t(
-        Ae,
+        He,
         {
-          label: l.label,
-          data: l.data || [],
-          multiselection: l.multiselection,
-          placeholder: l.placeholder || "Select...",
-          value: x || (l.multiselection ? [] : null),
-          onChange: (C) => r(l.name, C)
+          label: a.label,
+          data: a.data || [],
+          multiselection: a.multiselection,
+          placeholder: a.placeholder || "Select...",
+          value: k || (a.multiselection ? [] : null),
+          onChange: (S) => r(a.name, S)
         }
       ),
-      W,
-      p
+      K,
+      c
     ] });
-    if (l.type === "toggle") {
-      const C = !!x, X = C ? l.icon : l.offIcon || l.icon, G = C ? l.text || l.label : l.offText || l.text || l.label;
-      return /* @__PURE__ */ y("div", { ...T, children: [
-        N && z && /* @__PURE__ */ y("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
-          /* @__PURE__ */ t("div", { style: { width: z, flexShrink: 0 } }),
-          /* @__PURE__ */ y("label", { style: { display: "flex", alignItems: "center", gap: 8, cursor: "pointer" }, children: [
-            /* @__PURE__ */ t(Pe, { on: C, onClick: () => r(l.name, !x) }),
-            X && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: X }),
-            G && /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: G })
+    if (a.type === "toggle") {
+      const S = !!k, U = S ? a.icon : a.offIcon || a.icon, Z = S ? a.text || a.label : a.offText || a.text || a.label;
+      return /* @__PURE__ */ g("div", { ...N, children: [
+        H && L && /* @__PURE__ */ g("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
+          /* @__PURE__ */ t("div", { style: { width: L, flexShrink: 0 } }),
+          /* @__PURE__ */ g("label", { style: { display: "flex", alignItems: "center", gap: 8, cursor: "pointer" }, children: [
+            /* @__PURE__ */ t(Fe, { on: S, onClick: () => r(a.name, !k) }),
+            U && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: U }),
+            Z && /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: Z })
           ] })
         ] }),
-        !N && /* @__PURE__ */ y("label", { style: { display: "flex", alignItems: "center", gap: 10, cursor: "pointer" }, children: [
-          /* @__PURE__ */ t(Pe, { on: C, onClick: () => r(l.name, !x) }),
-          X && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: X }),
-          G && /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: G })
+        !H && /* @__PURE__ */ g("label", { style: { display: "flex", alignItems: "center", gap: 10, cursor: "pointer" }, children: [
+          /* @__PURE__ */ t(Fe, { on: S, onClick: () => r(a.name, !k) }),
+          U && /* @__PURE__ */ t("span", { style: { fontSize: 16 }, children: U }),
+          Z && /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: Z })
         ] }),
-        p
+        c
       ] });
     }
     return null;
-  }, v = (l) => l.map(
-    (x, w) => Array.isArray(x) ? /* @__PURE__ */ t("div", { style: { display: "flex", gap: 12, alignItems: "flex-start" }, children: x.map(m) }, w) : m(x)
+  }, R = (a) => a.map(
+    (k, C) => Array.isArray(k) ? /* @__PURE__ */ t("div", { style: { display: "flex", gap: 12, alignItems: "flex-start" }, children: k.map(M) }, C) : M(k)
   );
-  return /* @__PURE__ */ y("div", { className: "dhx", style: { padding: n.padding || 0, width: n.width || "100%", ...s }, children: [
-    v(n.rows || []),
-    (n.buttons || d) && /* @__PURE__ */ y("div", { style: { display: "flex", gap: 8, justifyContent: n.buttonAlign || "flex-start", marginTop: 8 }, children: [
-      /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-primary", onClick: () => c() && (d == null ? void 0 : d(f)), children: n.submitText || "Submit" }),
+  return /* @__PURE__ */ g("div", { className: "dhx", style: { padding: n.padding || 0, width: n.width || "100%", ...l }, children: [
+    R(n.rows || []),
+    (n.buttons || d) && /* @__PURE__ */ g("div", { style: { display: "flex", gap: 8, justifyContent: n.buttonAlign || "flex-start", marginTop: 8 }, children: [
+      /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-primary", onClick: () => h() && (d == null ? void 0 : d(u)), children: n.submitText || "Submit" }),
       n.resetButton !== !1 && /* @__PURE__ */ t("button", { className: "dhx dhx-btn dhx-btn-secondary", onClick: () => {
-        a(o), u({});
+        s(i), p({});
       }, children: n.resetText || "Reset" })
     ] })
   ] });
 }
-function Pe({ on: n, onClick: o }) {
-  return /* @__PURE__ */ y("div", { style: { position: "relative", width: 40, height: 22, flexShrink: 0 }, onClick: o, children: [
+function Fe({ on: n, onClick: i }) {
+  return /* @__PURE__ */ g("div", { style: { position: "relative", width: 40, height: 22, flexShrink: 0 }, onClick: i, children: [
     /* @__PURE__ */ t("div", { style: { width: 40, height: 22, borderRadius: 11, background: n ? e.primary : e.border, transition: "background 0.2s" } }),
     /* @__PURE__ */ t("div", { style: { position: "absolute", top: 3, left: n ? 21 : 3, width: 16, height: 16, borderRadius: "50%", background: "#fff", transition: "left 0.2s", boxShadow: "0 1px 3px rgba(0,0,0,.3)" } })
   ] });
 }
-function Me(n) {
-  const o = [];
+function me(n) {
+  const i = [];
   for (const d of n)
-    d.type === "block" ? o.push(...Me(d.items || [])) : o.push(d);
-  return o;
+    d.type === "block" ? i.push(...me(d.items || [])) : i.push(d);
+  return i;
+}
+function Ot(n) {
+  return n === "primary" ? e.primary : n === "success" ? e.success : n === "secondary" ? e.borderDk : e.danger;
+}
+function Yt(n, i) {
+  switch (n) {
+    case "primary":
+      return { background: e.primary, color: "#fff", borderColor: e.primary };
+    case "danger":
+      return { background: e.danger, color: "#fff", borderColor: e.danger };
+    case "success":
+      return { background: e.success, color: "#fff", borderColor: e.success };
+    case "secondary":
+      return { background: e.bg, color: e.text, borderColor: e.border };
+    default:
+      return i ? { background: e.primaryLt, color: e.primary } : {};
+  }
 }
-function an({ items: n = [], onAction: o, style: d }) {
-  O(_, []);
-  const [s, f] = I(() => {
-    const i = {};
-    for (const c of Me(n))
-      c.id && (i[c.id] = !!c.active);
-    return i;
-  }), a = Me(n), h = (i) => {
-    var c;
-    if (!i.disabled) {
-      if (i.id)
-        if (i.group) {
-          const m = a.filter((v) => v.group === i.group && v.id);
-          f((v) => {
-            const l = { ...v };
-            for (const x of m) l[x.id] = !1;
-            return l[i.id] = !0, l;
+function hn({
+  items: n = [],
+  css: i,
+  menuCss: d,
+  style: l,
+  onAction: u,
+  onInputChange: s,
+  onInputBlur: f,
+  onInputFocus: p,
+  onOpenMenu: x
+}) {
+  J(Q, []);
+  const [z, r] = B(() => {
+    const o = {};
+    for (const E of me(n))
+      E.id && (o[E.id] = !!E.active);
+    return o;
+  }), [b, h] = B(null), [M, R] = B(() => {
+    const o = {};
+    for (const E of me(n))
+      E.type === "selectButton" && E.id && E.value && (o[E.id] = E.value);
+    return o;
+  }), a = me(n), k = le(null);
+  xe(k, ae(() => h(null), []));
+  const C = (o) => {
+    var E, _;
+    if (!o.disabled) {
+      if (o.id) {
+        if (o.group) {
+          const w = a.filter((v) => v.group === o.group && v.id);
+          r((v) => {
+            const T = { ...v };
+            for (const m of w) T[m.id] = !1;
+            return T[o.id] = !0, T;
           });
-        } else i.twoState && f((m) => ({ ...m, [i.id]: !m[i.id] }));
-      (c = i.onClick) == null || c.call(i, i), i.id && (o == null || o(i.id, i));
+        } else o.twoState && r((w) => ({ ...w, [o.id]: !w[o.id] }));
+        if ((E = o.items) != null && E.length) {
+          const w = o.id;
+          h((v) => v === w ? null : w), x == null || x(o.id);
+          return;
+        }
+      }
+      (_ = o.onClick) == null || _.call(o, o), o.id && (u == null || u(o.id, o));
     }
-  }, u = (i, c) => {
-    var x;
-    if (i.hidden) return null;
-    const m = i.value ?? i.text, v = i.size === "auto", l = i.id !== void 0 ? s[i.id] ?? !!i.active : !!i.active;
-    return i.type === "separator" || i.type === "sep" ? /* @__PURE__ */ t("div", { style: { width: 1, background: e.border, margin: "4px 2px", alignSelf: "stretch" } }, c) : i.type === "input" ? /* @__PURE__ */ y("div", { style: { display: "flex", flexDirection: "column", alignItems: "flex-start", justifyContent: "center", padding: "2px 4px", gap: 2 }, children: [
-      i.label && /* @__PURE__ */ t("span", { style: { fontSize: 10, color: e.textMut }, children: i.label }),
-      /* @__PURE__ */ y("div", { style: { position: "relative", display: "flex", alignItems: "center" }, children: [
-        i.icon && /* @__PURE__ */ t("span", { style: { position: "absolute", left: 6, fontSize: 13, color: e.textMut, pointerEvents: "none", zIndex: 1 }, children: i.icon }),
-        /* @__PURE__ */ t(
-          "input",
-          {
-            className: "dhx dhx-input",
-            style: { width: i.width || 110, height: 26, fontSize: 12, paddingLeft: i.icon ? 24 : void 0 },
-            placeholder: i.placeholder,
-            defaultValue: i.value,
-            onChange: (w) => {
-              var z;
-              return (z = i.onChange) == null ? void 0 : z.call(i, w.target.value);
-            }
-          }
-        )
-      ] })
-    ] }, c) : i.type === "selectButton" ? /* @__PURE__ */ t(
-      "select",
-      {
-        className: "dhx dhx-input",
-        style: { height: 26, fontSize: 12, cursor: "pointer", margin: 2, width: i.width },
-        defaultValue: i.value,
-        onChange: (w) => {
-          var z;
-          return (z = i.onChange) == null ? void 0 : z.call(i, w.target.value);
-        },
-        children: (x = i.items) == null ? void 0 : x.map((w) => /* @__PURE__ */ t("option", { value: w.value, children: w.value }, w.value))
-      },
-      c
-    ) : /* @__PURE__ */ y(
+  }, L = ({ count: o, color: E }) => /* @__PURE__ */ t("span", { style: {
+    position: "absolute",
+    top: 2,
+    right: 2,
+    minWidth: 14,
+    height: 14,
+    background: Ot(E),
+    color: "#fff",
+    borderRadius: 7,
+    fontSize: 9,
+    fontWeight: 700,
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    padding: "0 2px",
+    pointerEvents: "none"
+  }, children: o > 99 ? "99+" : o }), H = (o, E) => {
+    var ne;
+    const _ = o.id !== void 0 ? z[o.id] ?? !!o.active : !!o.active, w = o.value ?? o.text, v = o.size ?? "medium", T = v === "auto", m = v === "small", j = !!((ne = o.items) != null && ne.length), Y = o.id !== void 0 && b === o.id, G = Yt(o.color, _ && !o.color), V = T ? void 0 : m ? 26 : 32, q = T ? 22 : m ? 13 : 16, ee = [o.tooltip, o.hotkey ? `(${o.hotkey})` : ""].filter(Boolean).join(" "), te = o.circle ? { borderRadius: "50%", padding: T ? "8px" : "0", aspectRatio: "1", justifyContent: "center" } : {}, pe = o.view === "link" ? { background: "transparent", border: "none", textDecoration: "underline", padding: "0 4px" } : o.view === "flat" ? { borderRadius: 0 } : {};
+    return /* @__PURE__ */ g("div", { style: { position: "relative", display: "flex" }, children: [
+      /* @__PURE__ */ g(
+        "button",
+        {
+          title: ee || void 0,
+          disabled: o.disabled,
+          className: "dhx dhx-btn dhx-btn-ghost",
+          style: {
+            flexDirection: T ? "column" : "row",
+            alignSelf: T ? "stretch" : "center",
+            justifyContent: "center",
+            minHeight: T ? 56 : V,
+            height: T ? void 0 : V,
+            padding: T ? "6px 10px" : m ? "0 6px" : "0 8px",
+            gap: 4,
+            position: "relative",
+            background: _ && !o.color ? e.primaryLt : "transparent",
+            color: _ && !o.color ? e.primary : o.disabled ? e.textMut : e.text,
+            opacity: o.disabled ? 0.55 : 1,
+            cursor: o.disabled ? "not-allowed" : "pointer",
+            borderColor: Y ? e.primary : void 0,
+            ...G,
+            ...te,
+            ...pe
+          },
+          onClick: () => C(o),
+          children: [
+            o.loading ? /* @__PURE__ */ t("span", { style: {
+              fontSize: q,
+              lineHeight: 1,
+              flexShrink: 0,
+              display: "inline-block",
+              animation: "dhx-spin 1s linear infinite"
+            }, children: "⟳" }) : o.icon && /* @__PURE__ */ t("span", { style: { fontSize: q, lineHeight: 1, flexShrink: 0 }, children: o.icon }),
+            w && !o.html && /* @__PURE__ */ t("span", { style: {
+              fontSize: T ? 10 : m ? 11 : 12,
+              maxWidth: T ? 64 : void 0,
+              textAlign: T ? "center" : "left",
+              lineHeight: T ? 1.2 : 1,
+              whiteSpace: T ? "normal" : "nowrap"
+            }, children: w }),
+            o.html && /* @__PURE__ */ t("span", { dangerouslySetInnerHTML: { __html: o.html } }),
+            j && /* @__PURE__ */ t("span", { style: { fontSize: 8, opacity: 0.6, marginLeft: 1 }, children: "▼" }),
+            o.hotkey && T && /* @__PURE__ */ t("span", { style: { fontSize: 9, color: e.textMut, lineHeight: 1 }, children: o.hotkey }),
+            o.count !== void 0 && /* @__PURE__ */ t(L, { count: o.count, color: o.countColor })
+          ]
+        }
+      ),
+      j && Y && /* @__PURE__ */ t(
+        ge,
+        {
+          items: o.items,
+          onSelect: (P) => {
+            h(null), P.id && (u == null || u(String(P.id), o));
+          },
+          style: { top: "100%", left: 0, minWidth: 160 }
+        }
+      )
+    ] }, E);
+  }, $ = (o, E) => {
+    const _ = o.size ?? "medium", w = _ === "auto" ? 48 : _ === "small" ? 28 : 36, v = o.id !== void 0 ? z[o.id] ?? !!o.active : !!o.active;
+    return /* @__PURE__ */ t("div", { style: { position: "relative", display: "flex", alignSelf: "center" }, children: /* @__PURE__ */ g(
       "button",
       {
-        title: i.tooltip,
-        disabled: i.disabled,
-        className: "dhx dhx-btn dhx-btn-ghost",
+        title: o.tooltip,
+        disabled: o.disabled,
         style: {
-          flexDirection: v ? "column" : "row",
-          alignSelf: v ? "stretch" : "center",
-          justifyContent: "center",
-          minHeight: v ? 48 : 26,
-          padding: v ? "6px 10px" : "0 8px",
-          gap: v ? 4 : 5,
-          position: "relative",
-          background: l ? e.primaryLt : "transparent",
-          color: l ? e.primary : i.disabled ? e.textMut : e.text,
-          opacity: i.disabled ? 0.55 : 1,
-          cursor: i.disabled ? "not-allowed" : "pointer"
+          width: w,
+          height: w,
+          padding: 2,
+          border: v ? `2px solid ${e.primary}` : "2px solid transparent",
+          borderRadius: "50%",
+          overflow: "hidden",
+          cursor: o.disabled ? "not-allowed" : "pointer",
+          background: "transparent",
+          flexShrink: 0,
+          opacity: o.disabled ? 0.55 : 1
         },
-        onClick: () => h(i),
+        onClick: () => C(o),
         children: [
-          i.icon && /* @__PURE__ */ t("span", { style: { fontSize: v ? 22 : 15, lineHeight: 1, flexShrink: 0 }, children: i.icon }),
-          m && /* @__PURE__ */ t("span", { style: {
-            fontSize: 10,
-            maxWidth: v ? 64 : void 0,
-            textAlign: v ? "center" : "left",
-            lineHeight: 1.2,
-            whiteSpace: v ? "normal" : "nowrap"
-          }, children: m }),
-          i.count !== void 0 && /* @__PURE__ */ t("span", { style: {
-            position: "absolute",
-            top: 2,
-            right: 2,
-            minWidth: 14,
-            height: 14,
-            background: e.danger,
-            color: "#fff",
-            borderRadius: 7,
-            fontSize: 9,
-            fontWeight: 700,
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            padding: "0 2px",
-            pointerEvents: "none"
-          }, children: i.count })
+          o.src && /* @__PURE__ */ t(
+            "img",
+            {
+              src: o.src,
+              alt: o.value || "",
+              style: { width: "100%", height: "100%", objectFit: "cover", borderRadius: "50%" }
+            }
+          ),
+          o.count !== void 0 && /* @__PURE__ */ t(L, { count: o.count, color: o.countColor })
         ]
-      },
-      c
-    );
-  }, g = (i, c) => {
-    var m;
+      }
+    ) }, E);
+  }, D = (o, E) => {
+    var T, m;
+    const _ = o.id !== void 0 && b === `sel:${o.id}`, w = (o.id && M[o.id]) ?? o.value ?? ((m = (T = o.items) == null ? void 0 : T[0]) == null ? void 0 : m.value) ?? "", v = (o.items ?? []).map((j) => ({
+      id: j.value,
+      value: j.value,
+      icon: j.icon
+    }));
+    return /* @__PURE__ */ g("div", { style: { position: "relative", alignSelf: "center" }, children: [
+      /* @__PURE__ */ g(
+        "button",
+        {
+          title: o.tooltip,
+          disabled: o.disabled,
+          className: "dhx dhx-btn dhx-btn-ghost",
+          style: {
+            height: 28,
+            gap: 4,
+            padding: "0 8px",
+            opacity: o.disabled ? 0.55 : 1,
+            cursor: o.disabled ? "not-allowed" : "pointer",
+            borderColor: _ ? e.primary : void 0
+          },
+          onClick: () => {
+            if (o.disabled || !o.id) return;
+            const j = `sel:${o.id}`;
+            h((Y) => Y === j ? null : j);
+          },
+          children: [
+            o.icon && /* @__PURE__ */ t("span", { style: { fontSize: 14 }, children: o.icon }),
+            /* @__PURE__ */ t("span", { style: { fontSize: 12 }, children: w }),
+            /* @__PURE__ */ t("span", { style: { fontSize: 8, opacity: 0.6 }, children: "▼" })
+          ]
+        }
+      ),
+      _ && /* @__PURE__ */ t(
+        ge,
+        {
+          items: v,
+          onSelect: (j) => {
+            var G;
+            const Y = String(j.value ?? j.id ?? "");
+            o.id && R((V) => ({ ...V, [o.id]: Y })), h(null), (G = o.onChange) == null || G.call(o, Y), o.id && (u == null || u(o.id, o));
+          },
+          style: { top: "100%", left: 0, minWidth: 100 }
+        }
+      )
+    ] }, E);
+  }, K = (o, E) => /* @__PURE__ */ g("div", { style: { display: "flex", flexDirection: "column", alignItems: "flex-start", justifyContent: "center", padding: "2px 4px", gap: 2 }, children: [
+    o.label && /* @__PURE__ */ t("span", { style: { fontSize: 10, color: e.textMut }, children: o.label }),
+    /* @__PURE__ */ g("div", { style: { position: "relative", display: "flex", alignItems: "center" }, children: [
+      o.icon && /* @__PURE__ */ t("span", { style: { position: "absolute", left: 6, fontSize: 13, color: e.textMut, pointerEvents: "none", zIndex: 1 }, children: o.icon }),
+      /* @__PURE__ */ t(
+        "input",
+        {
+          className: "dhx dhx-input",
+          disabled: o.disabled,
+          style: { width: o.width || 110, height: 26, fontSize: 12, paddingLeft: o.icon ? 24 : void 0 },
+          placeholder: o.placeholder,
+          defaultValue: o.value,
+          onChange: (_) => {
+            var w;
+            (w = o.onChange) == null || w.call(o, _.target.value), o.id && (s == null || s(o.id, _.target.value));
+          },
+          onBlur: (_) => {
+            var w;
+            (w = o.onBlur) == null || w.call(o, _.target.value), o.id && (f == null || f(o.id, _.target.value));
+          },
+          onFocus: (_) => {
+            var w;
+            (w = o.onFocus) == null || w.call(o, _.target.value), o.id && (p == null || p(o.id, _.target.value));
+          }
+        }
+      )
+    ] })
+  ] }, E), c = (o, E) => o.hidden ? null : /* @__PURE__ */ t("div", { title: o.tooltip, style: {
+    padding: "2px 6px",
+    fontSize: 11,
+    color: o.disabled ? e.textMut : e.textSec,
+    display: "flex",
+    alignItems: "center",
+    alignSelf: "center",
+    userSelect: "none",
+    opacity: o.disabled ? 0.5 : 1
+  }, children: o.html ? /* @__PURE__ */ t("span", { dangerouslySetInnerHTML: { __html: o.html } }) : o.value }, E), N = (o, E) => o.hidden ? null : /* @__PURE__ */ t(
+    "div",
+    {
+      style: { display: "flex", alignItems: "center", alignSelf: "center", padding: "0 4px" },
+      dangerouslySetInnerHTML: { __html: o.html ?? "" }
+    },
+    E
+  ), A = (o, E) => o.hidden ? null : o.type === "separator" || o.type === "sep" ? /* @__PURE__ */ t("div", { style: { width: 1, background: e.border, margin: "4px 2px", alignSelf: "stretch" } }, E) : o.type === "spacer" ? /* @__PURE__ */ t("div", { style: { flex: 1 } }, E) : o.type === "title" ? c(o, E) : o.type === "customHTML" ? N(o, E) : o.type === "imageButton" ? $(o, E) : o.type === "input" ? K(o, E) : o.type === "selectButton" ? D(o, E) : H(o, E), S = (o, E, _) => {
+    var v;
+    if (o.hidden) return null;
+    const w = _ || o.disabled;
     return /* @__PURE__ */ t("div", { style: {
       display: "flex",
-      flexDirection: i.direction === "col" ? "column" : "row",
-      alignItems: i.direction === "col" ? "flex-start" : "center",
-      gap: 2
-    }, children: (m = i.items) == null ? void 0 : m.map(
-      (v, l) => v.type === "block" ? g(v, `${c}-${l}`) : u(v, `${c}-${l}`)
-    ) }, c);
-  }, S = (i, c) => {
-    var v;
-    const m = i.title || i.label;
-    return /* @__PURE__ */ y("div", { style: {
+      flexDirection: o.direction === "col" ? "column" : "row",
+      alignItems: o.direction === "col" ? "flex-start" : "center",
+      gap: 2,
+      opacity: o.disabled && !_ ? 0.55 : 1,
+      pointerEvents: w ? "none" : void 0
+    }, children: (v = o.items) == null ? void 0 : v.map(
+      (T, m) => T.type === "block" ? S(T, `${E}-${m}`, w) : A(T, `${E}-${m}`)
+    ) }, E);
+  }, U = (o, E) => {
+    var w;
+    if (o.hidden) return null;
+    const _ = o.title || o.label;
+    return /* @__PURE__ */ g("div", { style: {
       display: "flex",
       flexDirection: "column",
       alignItems: "stretch",
       borderRight: `1px solid ${e.border}`,
       padding: "4px 6px 0",
-      minWidth: 40
+      minWidth: 40,
+      opacity: o.disabled ? 0.55 : 1,
+      pointerEvents: o.disabled ? "none" : void 0
     }, children: [
       /* @__PURE__ */ t("div", { style: {
         display: "flex",
-        flexDirection: i.direction === "col" ? "column" : "row",
-        alignItems: i.direction === "col" ? "stretch" : "center",
+        flexDirection: o.direction === "col" ? "column" : "row",
+        alignItems: o.direction === "col" ? "stretch" : "center",
         gap: 2,
         flex: 1
-      }, children: (v = i.items) == null ? void 0 : v.map(
-        (l, x) => l.type === "block" ? g(l, x) : u(l, x)
+      }, children: (w = o.items) == null ? void 0 : w.map(
+        (v, T) => v.type === "block" ? S(v, T, o.disabled) : A(v, T)
       ) }),
-      m && /* @__PURE__ */ t("div", { style: {
+      _ && /* @__PURE__ */ t("div", { style: {
         fontSize: 10,
         color: e.textMut,
         textAlign: "center",
         padding: "3px 0 4px",
         marginTop: 2,
         borderTop: `1px solid ${e.border}`
-      }, children: m })
-    ] }, c);
-  }, r = (i, c) => i.type === "block" ? S(i, c) : u(i, c);
-  return /* @__PURE__ */ t("div", { className: "dhx", style: {
-    display: "flex",
-    alignItems: "stretch",
-    background: e.surface,
-    borderBottom: `1px solid ${e.border}`,
-    overflowX: "auto",
-    gap: 0,
-    minHeight: 72,
-    ...d
-  }, children: n.map(r) });
+      }, children: _ })
+    ] }, E);
+  }, Z = (o, E) => o.type === "block" ? U(o, E) : A(o, E);
+  return /* @__PURE__ */ t(
+    "div",
+    {
+      ref: k,
+      className: ["dhx", i].filter(Boolean).join(" "),
+      style: {
+        display: "flex",
+        alignItems: "stretch",
+        background: e.surface,
+        borderBottom: `1px solid ${e.border}`,
+        overflowX: "auto",
+        gap: 0,
+        minHeight: 72,
+        ...l
+      },
+      children: n.map(Z)
+    }
+  );
 }
-function je({ count: n }) {
+function Oe({ count: n }) {
   return /* @__PURE__ */ t("span", { style: {
     position: "absolute",
     top: 3,
@@ -2381,53 +2764,53 @@ function je({ count: n }) {
     pointerEvents: "none"
   }, children: n });
 }
-function dn({ logo: n, items: o = [], vertical: d = !1, onAction: s, style: f }) {
-  const [a, h] = I(null), [u, g] = I(() => {
-    const c = {};
-    return o.forEach((m) => {
-      m.id && m.twoState && m.active && (c[m.id] = !0);
-    }), c;
-  }), S = ne(null);
-  O(_, []), fe(S, oe(() => h(null), []));
-  const r = (c, m) => {
-    var v, l;
-    if (!c.disabled) {
-      if (c.twoState && c.id && g((x) => ({ ...x, [c.id]: !x[c.id] })), (v = c.items) != null && v.length) {
-        h((x) => x === m ? null : m);
+function fn({ logo: n, items: i = [], vertical: d = !1, onAction: l, style: u }) {
+  const [s, f] = B(null), [p, x] = B(() => {
+    const h = {};
+    return i.forEach((M) => {
+      M.id && M.twoState && M.active && (h[M.id] = !0);
+    }), h;
+  }), z = le(null);
+  J(Q, []), xe(z, ae(() => f(null), []));
+  const r = (h, M) => {
+    var R, a;
+    if (!h.disabled) {
+      if (h.twoState && h.id && x((k) => ({ ...k, [h.id]: !k[h.id] })), (R = h.items) != null && R.length) {
+        f((k) => k === M ? null : M);
         return;
       }
-      (l = c.onClick) == null || l.call(c, c.id || ""), s == null || s(c.id || "");
+      (a = h.onClick) == null || a.call(h, h.id || ""), l == null || l(h.id || "");
     }
-  }, i = (c, m) => {
-    var w;
-    if (c.hidden) return null;
-    if (c.type === "separator") return /* @__PURE__ */ t("div", { style: {
+  }, b = (h, M) => {
+    var C;
+    if (h.hidden) return null;
+    if (h.type === "separator") return /* @__PURE__ */ t("div", { style: {
       [d ? "height" : "width"]: 1,
       background: e.border,
       margin: d ? "4px 8px" : "0 6px",
       alignSelf: "stretch"
-    } }, m);
-    if (c.type === "spacer") return /* @__PURE__ */ t("div", { style: { flex: 1 } }, m);
-    if (c.type === "input") return /* @__PURE__ */ y("div", { style: { position: "relative", display: "flex", alignItems: "center", margin: "0 4px" }, children: [
-      c.icon && /* @__PURE__ */ t("span", { style: { position: "absolute", left: 8, color: e.textMut, fontSize: 15, pointerEvents: "none", zIndex: 1 }, children: c.icon }),
+    } }, M);
+    if (h.type === "spacer") return /* @__PURE__ */ t("div", { style: { flex: 1 } }, M);
+    if (h.type === "input") return /* @__PURE__ */ g("div", { style: { position: "relative", display: "flex", alignItems: "center", margin: "0 4px" }, children: [
+      h.icon && /* @__PURE__ */ t("span", { style: { position: "absolute", left: 8, color: e.textMut, fontSize: 15, pointerEvents: "none", zIndex: 1 }, children: h.icon }),
       /* @__PURE__ */ t(
         "input",
         {
           className: "dhx dhx-input",
-          style: { width: c.width || 200, height: 28, paddingLeft: c.icon ? 30 : void 0 },
-          placeholder: c.placeholder,
-          onChange: (z) => {
-            var N;
-            return (N = c.onChange) == null ? void 0 : N.call(c, z.target.value);
+          style: { width: h.width || 200, height: 28, paddingLeft: h.icon ? 30 : void 0 },
+          placeholder: h.placeholder,
+          onChange: (L) => {
+            var H;
+            return (H = h.onChange) == null ? void 0 : H.call(h, L.target.value);
           }
         }
       )
-    ] }, m);
-    if (c.type === "imageButton") return /* @__PURE__ */ y(
+    ] }, M);
+    if (h.type === "imageButton") return /* @__PURE__ */ g(
       "button",
       {
-        title: c.tooltip,
-        disabled: c.disabled,
+        title: h.tooltip,
+        disabled: h.disabled,
         style: {
           position: "relative",
           width: 36,
@@ -2436,26 +2819,26 @@ function dn({ logo: n, items: o = [], vertical: d = !1, onAction: s, style: f })
           border: "none",
           borderRadius: "50%",
           overflow: "hidden",
-          cursor: c.disabled ? "not-allowed" : "pointer",
+          cursor: h.disabled ? "not-allowed" : "pointer",
           background: "transparent",
           flexShrink: 0
         },
-        onClick: () => r(c, m),
+        onClick: () => r(h, M),
         children: [
-          c.src && /* @__PURE__ */ t("img", { src: c.src, alt: c.value || "", style: { width: "100%", height: "100%", objectFit: "cover", borderRadius: "50%" } }),
-          c.count !== void 0 && /* @__PURE__ */ t(je, { count: c.count })
+          h.src && /* @__PURE__ */ t("img", { src: h.src, alt: h.value || "", style: { width: "100%", height: "100%", objectFit: "cover", borderRadius: "50%" } }),
+          h.count !== void 0 && /* @__PURE__ */ t(Oe, { count: h.count })
         ]
       },
-      m
+      M
     );
-    const v = !!(c.twoState && c.id && u[c.id]), l = !!((w = c.items) != null && w.length), x = {
+    const R = !!(h.twoState && h.id && p[h.id]), a = !!((C = h.items) != null && C.length), k = {
       position: "relative",
       height: d ? 40 : 36,
       gap: 6,
-      background: v ? e.primaryLt : "transparent",
-      color: v ? e.primary : c.disabled ? e.textMut : e.text,
-      opacity: c.disabled ? 0.55 : 1,
-      cursor: c.disabled ? "not-allowed" : "pointer",
+      background: R ? e.primaryLt : "transparent",
+      color: R ? e.primary : h.disabled ? e.textMut : e.text,
+      opacity: h.disabled ? 0.55 : 1,
+      cursor: h.disabled ? "not-allowed" : "pointer",
       ...d ? {
         width: "100%",
         justifyContent: "flex-start",
@@ -2463,40 +2846,40 @@ function dn({ logo: n, items: o = [], vertical: d = !1, onAction: s, style: f })
         borderRadius: 0
       } : {}
     };
-    return /* @__PURE__ */ y("div", { style: { position: "relative" }, children: [
-      /* @__PURE__ */ y(
+    return /* @__PURE__ */ g("div", { style: { position: "relative" }, children: [
+      /* @__PURE__ */ g(
         "button",
         {
           className: "dhx dhx-btn dhx-btn-ghost",
-          title: c.tooltip,
-          disabled: c.disabled,
-          style: x,
-          onClick: () => r(c, m),
+          title: h.tooltip,
+          disabled: h.disabled,
+          style: k,
+          onClick: () => r(h, M),
           children: [
-            c.icon && /* @__PURE__ */ t("span", { style: { fontSize: 16, flexShrink: 0 }, children: c.icon }),
-            c.value && /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: c.value }),
-            l && /* @__PURE__ */ t("span", { style: { fontSize: 9, opacity: 0.55, marginLeft: 2 }, children: "▼" }),
-            c.count !== void 0 && /* @__PURE__ */ t(je, { count: c.count })
+            h.icon && /* @__PURE__ */ t("span", { style: { fontSize: 16, flexShrink: 0 }, children: h.icon }),
+            h.value && /* @__PURE__ */ t("span", { style: { fontSize: 13 }, children: h.value }),
+            a && /* @__PURE__ */ t("span", { style: { fontSize: 9, opacity: 0.55, marginLeft: 2 }, children: "▼" }),
+            h.count !== void 0 && /* @__PURE__ */ t(Oe, { count: h.count })
           ]
         }
       ),
-      l && a === m && /* @__PURE__ */ t(
+      a && s === M && /* @__PURE__ */ t(
         ge,
         {
-          items: c.items,
-          onSelect: (z) => {
-            var N;
-            h(null), z.id && ((N = c.onClick) == null || N.call(c, z.id), s == null || s(z.id));
+          items: h.items,
+          onSelect: (L) => {
+            var H;
+            f(null), L.id && ((H = h.onClick) == null || H.call(h, L.id), l == null || l(L.id));
           },
           style: d ? { left: "100%", top: 0 } : { top: "100%" }
         }
       )
-    ] }, m);
+    ] }, M);
   };
-  return /* @__PURE__ */ y(
+  return /* @__PURE__ */ g(
     "nav",
     {
-      ref: S,
+      ref: z,
       className: "dhx",
       style: {
         display: "flex",
@@ -2508,7 +2891,7 @@ function dn({ logo: n, items: o = [], vertical: d = !1, onAction: s, style: f })
         padding: d ? "8px 0" : "0 12px",
         minHeight: d ? void 0 : 48,
         gap: 2,
-        ...f
+        ...u
       },
       children: [
         n && /* @__PURE__ */ t("div", { style: {
@@ -2522,41 +2905,41 @@ function dn({ logo: n, items: o = [], vertical: d = !1, onAction: s, style: f })
           marginBottom: d ? 4 : 0,
           flexShrink: 0
         }, children: n }),
-        o.map(i)
+        i.map(b)
       ]
     }
   );
 }
 export {
-  Ot as Button,
-  Jt as Calendar,
-  Gt as Chart,
-  Ut as Colorpicker,
-  Ae as Combobox,
-  Kt as ContextMenu,
-  rn as DataView,
-  sn as Form,
-  qt as Grid,
-  zt as Layout,
-  nn as List,
-  Yt as Menu,
+  Xt as Button,
+  tn as Calendar,
+  en as Chart,
+  nn as Colorpicker,
+  He as Combobox,
+  Gt as ContextMenu,
+  dn as DataView,
+  pn as Form,
+  Zt as Grid,
+  Ct as Layout,
+  an as List,
+  qt as Menu,
   ge as MenuDropdown,
-  Ye as MessageContext,
-  en as MessageProvider,
-  dn as Navbar,
-  ln as Pagination,
-  Qt as Popup,
-  an as Ribbon,
-  Vt as Sidebar,
-  Be as Slider,
-  Xt as Tabbar,
-  Et as Timepicker,
-  _t as Toolbar,
-  on as Tree,
-  Zt as Window,
+  Ke as MessageContext,
+  ln as MessageProvider,
+  fn as Navbar,
+  un as Pagination,
+  rn as Popup,
+  hn as Ribbon,
+  Ut as Sidebar,
+  Ae as Slider,
+  Qt as Tabbar,
+  Bt as Timepicker,
+  Jt as Toolbar,
+  cn as Tree,
+  on as Window,
   e as tokens,
-  fe as useClickOutside,
-  St as useDrag,
-  tn as useMessage
+  xe as useClickOutside,
+  kt as useDrag,
+  sn as useMessage
 };
 //# sourceMappingURL=dhx-react-suite.js.map