@stonecrop/atable 0.2.39 → 0.2.40

package/dist/atable.js

@@ -1,207 +1,207 @@
-var Pe = Object.defineProperty;
-var He = (e, t, n) => t in e ? Pe(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
+var We = Object.defineProperty;
+var He = (e, t, n) => t in e ? We(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
 var S = (e, t, n) => He(e, typeof t != "symbol" ? t + "" : t, n);
-import { onMounted as xe, ref as k, watch as D, onBeforeUnmount as je, computed as y, unref as f, getCurrentScope as Ee, onScopeDispose as Ie, getCurrentInstance as Ne, defineComponent as T, inject as Y, useTemplateRef as ee, openBlock as h, createElementBlock as b, createBlock as B, resolveDynamicComponent as ke, mergeProps as te, toDisplayString as P, Fragment as q, createElementVNode as O, renderSlot as I, createCommentVNode as G, withDirectives as Z, vShow as Ce, toRef as We, readonly as Ve, customRef as Ue, reactive as $, renderList as K, normalizeStyle as z, createTextVNode as Be, provide as ze, nextTick as Fe, createVNode as de, withCtx as ce } from "vue";
-function Ae(e) {
-  return Ee() ? (Ie(e), !0) : !1;
+import { onMounted as ne, ref as I, watch as D, onBeforeUnmount as je, computed as b, unref as m, getCurrentScope as ke, onScopeDispose as Ie, getCurrentInstance as Ne, defineComponent as T, inject as X, useTemplateRef as J, openBlock as h, createElementBlock as y, normalizeClass as P, createBlock as z, resolveDynamicComponent as Ce, mergeProps as oe, toDisplayString as W, Fragment as G, createElementVNode as L, renderSlot as k, createCommentVNode as Y, withDirectives as _, vShow as Ae, toRef as Ve, readonly as Ue, customRef as Be, reactive as $, renderList as ee, normalizeStyle as F, createTextVNode as ze, provide as Fe, nextTick as qe, createVNode as ue, withCtx as fe } from "vue";
+function Se(e) {
+  return ke() ? (Ie(e), !0) : !1;
 }
-function ne(e) {
-  return typeof e == "function" ? e() : f(e);
+function le(e) {
+  return typeof e == "function" ? e() : m(e);
 }
-const qe = typeof window < "u" && typeof document < "u";
+const Ge = typeof window < "u" && typeof document < "u";
 typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
-const Ge = (e) => e != null, Ye = Object.prototype.toString, Xe = (e) => Ye.call(e) === "[object Object]", Je = () => {
-}, N = qe ? window : void 0;
+const Ye = (e) => e != null, Xe = Object.prototype.toString, Je = (e) => Xe.call(e) === "[object Object]", Qe = () => {
+}, N = Ge ? window : void 0;
 function H(e) {
   var t;
-  const n = ne(e);
+  const n = le(e);
   return (t = n == null ? void 0 : n.$el) != null ? t : n;
 }
 function j(...e) {
-  let t, n, o, l;
-  if (typeof e[0] == "string" || Array.isArray(e[0]) ? ([n, o, l] = e, t = N) : [t, n, o, l] = e, !t)
-    return Je;
+  let t, n, o, a;
+  if (typeof e[0] == "string" || Array.isArray(e[0]) ? ([n, o, a] = e, t = N) : [t, n, o, a] = e, !t)
+    return Qe;
   Array.isArray(n) || (n = [n]), Array.isArray(o) || (o = [o]);
-  const i = [], a = () => {
-    i.forEach((d) => d()), i.length = 0;
-  }, r = (d, p, c, m) => (d.addEventListener(p, c, m), () => d.removeEventListener(p, c, m)), u = D(
-    () => [H(t), ne(l)],
-    ([d, p]) => {
-      if (a(), !d)
+  const l = [], i = () => {
+    l.forEach((u) => u()), l.length = 0;
+  }, s = (u, p, r, f) => (u.addEventListener(p, r, f), () => u.removeEventListener(p, r, f)), d = D(
+    () => [H(t), le(a)],
+    ([u, p]) => {
+      if (i(), !u)
         return;
-      const c = Xe(p) ? { ...p } : p;
-      i.push(
-        ...n.flatMap((m) => o.map((w) => r(d, m, w, c)))
+      const r = Je(p) ? { ...p } : p;
+      l.push(
+        ...n.flatMap((f) => o.map((w) => s(u, f, w, r)))
       );
     },
     { immediate: !0, flush: "post" }
-  ), s = () => {
-    u(), a();
+  ), c = () => {
+    d(), i();
   };
-  return Ae(s), s;
+  return Se(c), c;
 }
-function Qe() {
-  const e = k(!1), t = Ne();
-  return t && xe(() => {
+function Ze() {
+  const e = I(!1), t = Ne();
+  return t && ne(() => {
     e.value = !0;
   }, t), e;
 }
-function Ze(e) {
-  const t = Qe();
-  return y(() => (t.value, !!e()));
+function Ke(e) {
+  const t = Ze();
+  return b(() => (t.value, !!e()));
 }
-function Ke(e, t, n = {}) {
-  const { window: o = N, ...l } = n;
-  let i;
-  const a = Ze(() => o && "MutationObserver" in o), r = () => {
-    i && (i.disconnect(), i = void 0);
-  }, u = y(() => {
-    const c = ne(e), m = (Array.isArray(c) ? c : [c]).map(H).filter(Ge);
-    return new Set(m);
-  }), s = D(
-    () => u.value,
-    (c) => {
-      r(), a.value && c.size && (i = new MutationObserver(t), c.forEach((m) => i.observe(m, l)));
+function _e(e, t, n = {}) {
+  const { window: o = N, ...a } = n;
+  let l;
+  const i = Ke(() => o && "MutationObserver" in o), s = () => {
+    l && (l.disconnect(), l = void 0);
+  }, d = b(() => {
+    const r = le(e), f = (Array.isArray(r) ? r : [r]).map(H).filter(Ye);
+    return new Set(f);
+  }), c = D(
+    () => d.value,
+    (r) => {
+      s(), i.value && r.size && (l = new MutationObserver(t), r.forEach((f) => l.observe(f, a)));
     },
     { immediate: !0, flush: "post" }
-  ), d = () => i == null ? void 0 : i.takeRecords(), p = () => {
-    s(), r();
+  ), u = () => l == null ? void 0 : l.takeRecords(), p = () => {
+    c(), s();
   };
-  return Ae(p), {
-    isSupported: a,
+  return Se(p), {
+    isSupported: i,
     stop: p,
-    takeRecords: d
+    takeRecords: u
   };
 }
-function _e(e = {}) {
+function et(e = {}) {
   var t;
   const {
     window: n = N,
     deep: o = !0,
-    triggerOnRemoval: l = !1
-  } = e, i = (t = e.document) != null ? t : n == null ? void 0 : n.document, a = () => {
-    var s;
-    let d = i == null ? void 0 : i.activeElement;
+    triggerOnRemoval: a = !1
+  } = e, l = (t = e.document) != null ? t : n == null ? void 0 : n.document, i = () => {
+    var c;
+    let u = l == null ? void 0 : l.activeElement;
     if (o)
-      for (; d != null && d.shadowRoot; )
-        d = (s = d == null ? void 0 : d.shadowRoot) == null ? void 0 : s.activeElement;
-    return d;
-  }, r = k(), u = () => {
-    r.value = a();
+      for (; u != null && u.shadowRoot; )
+        u = (c = u == null ? void 0 : u.shadowRoot) == null ? void 0 : c.activeElement;
+    return u;
+  }, s = I(), d = () => {
+    s.value = i();
   };
-  return n && (j(n, "blur", (s) => {
-    s.relatedTarget === null && u();
-  }, !0), j(n, "focus", u, !0)), l && Ke(i, (s) => {
-    s.filter((d) => d.removedNodes.length).map((d) => Array.from(d.removedNodes)).flat().forEach((d) => {
-      d === r.value && u();
+  return n && (j(n, "blur", (c) => {
+    c.relatedTarget === null && d();
+  }, !0), j(n, "focus", d, !0)), a && _e(l, (c) => {
+    c.filter((u) => u.removedNodes.length).map((u) => Array.from(u.removedNodes)).flat().forEach((u) => {
+      u === s.value && d();
     });
   }, {
     childList: !0,
     subtree: !0
-  }), u(), r;
+  }), d(), s;
 }
-const et = "focusin", tt = "focusout";
-function nt(e, t = {}) {
-  const { window: n = N } = t, o = y(() => H(e)), l = k(!1), i = y(() => l.value), a = _e(t);
-  return !n || !a.value ? { focused: i } : (j(o, et, () => l.value = !0), j(o, tt, () => l.value = !1), { focused: i });
+const tt = "focusin", nt = "focusout";
+function ot(e, t = {}) {
+  const { window: n = N } = t, o = b(() => H(e)), a = I(!1), l = b(() => a.value), i = et(t);
+  return !n || !i.value ? { focused: l } : (j(o, tt, () => a.value = !0), j(o, nt, () => a.value = !1), { focused: l });
 }
-function ot(e, { window: t = N, scrollTarget: n } = {}) {
-  const o = k(!1), l = () => {
+function lt(e, { window: t = N, scrollTarget: n } = {}) {
+  const o = I(!1), a = () => {
     if (!t) return;
-    const i = t.document, a = H(e);
-    if (!a)
+    const l = t.document, i = H(e);
+    if (!i)
       o.value = !1;
     else {
-      const r = a.getBoundingClientRect();
-      o.value = r.top <= (t.innerHeight || i.documentElement.clientHeight) && r.left <= (t.innerWidth || i.documentElement.clientWidth) && r.bottom >= 0 && r.right >= 0;
+      const s = i.getBoundingClientRect();
+      o.value = s.top <= (t.innerHeight || l.documentElement.clientHeight) && s.left <= (t.innerWidth || l.documentElement.clientWidth) && s.bottom >= 0 && s.right >= 0;
     }
   };
   return D(
     () => H(e),
-    () => l(),
+    () => a(),
     { immediate: !0, flush: "post" }
-  ), t && j(n || t, "scroll", l, {
+  ), t && j(n || t, "scroll", a, {
     capture: !1,
     passive: !0
   }), o;
 }
 const C = (e) => {
-  let t = ot(e).value;
+  let t = lt(e).value;
   return t = t && e.offsetHeight > 0, t;
-}, A = (e) => e.tabIndex >= 0, ue = (e) => {
+}, A = (e) => e.tabIndex >= 0, me = (e) => {
   const t = e.target;
-  return oe(t);
-}, oe = (e) => {
+  return ae(t);
+}, ae = (e) => {
   var t;
   let n;
   if (e instanceof HTMLTableCellElement) {
     const o = (t = e.parentElement) == null ? void 0 : t.previousElementSibling;
     if (o) {
-      const l = Array.from(o.children)[e.cellIndex];
-      l && (n = l);
+      const a = Array.from(o.children)[e.cellIndex];
+      a && (n = a);
     }
   } else if (e instanceof HTMLTableRowElement) {
     const o = e.previousElementSibling;
     o && (n = o);
   }
-  return n && (!A(n) || !C(n)) ? oe(n) : n;
-}, lt = (e) => {
+  return n && (!A(n) || !C(n)) ? ae(n) : n;
+}, at = (e) => {
   var t;
   const n = e.target;
   let o;
   if (n instanceof HTMLTableCellElement) {
-    const l = (t = n.parentElement) == null ? void 0 : t.parentElement;
-    if (l) {
-      const i = l.firstElementChild.children[n.cellIndex];
-      i && (o = i);
+    const a = (t = n.parentElement) == null ? void 0 : t.parentElement;
+    if (a) {
+      const l = a.firstElementChild.children[n.cellIndex];
+      l && (o = l);
     }
   } else if (n instanceof HTMLTableRowElement) {
-    const l = n.parentElement;
-    if (l) {
-      const i = l.firstElementChild;
-      i && (o = i);
+    const a = n.parentElement;
+    if (a) {
+      const l = a.firstElementChild;
+      l && (o = l);
     }
   }
-  return o && (!A(o) || !C(o)) ? le(o) : o;
-}, fe = (e) => {
+  return o && (!A(o) || !C(o)) ? ie(o) : o;
+}, pe = (e) => {
   const t = e.target;
-  return le(t);
-}, le = (e) => {
+  return ie(t);
+}, ie = (e) => {
   var t;
   let n;
   if (e instanceof HTMLTableCellElement) {
     const o = (t = e.parentElement) == null ? void 0 : t.nextElementSibling;
     if (o) {
-      const l = Array.from(o.children)[e.cellIndex];
-      l && (n = l);
+      const a = Array.from(o.children)[e.cellIndex];
+      a && (n = a);
     }
   } else if (e instanceof HTMLTableRowElement) {
     const o = e.nextElementSibling;
     o && (n = o);
   }
-  return n && (!A(n) || !C(n)) ? le(n) : n;
-}, at = (e) => {
+  return n && (!A(n) || !C(n)) ? ie(n) : n;
+}, it = (e) => {
   var t;
   const n = e.target;
   let o;
   if (n instanceof HTMLTableCellElement) {
-    const l = (t = n.parentElement) == null ? void 0 : t.parentElement;
-    if (l) {
-      const i = l.lastElementChild.children[n.cellIndex];
-      i && (o = i);
+    const a = (t = n.parentElement) == null ? void 0 : t.parentElement;
+    if (a) {
+      const l = a.lastElementChild.children[n.cellIndex];
+      l && (o = l);
     }
   } else if (n instanceof HTMLTableRowElement) {
-    const l = n.parentElement;
-    if (l) {
-      const i = l.lastElementChild;
-      i && (o = i);
+    const a = n.parentElement;
+    if (a) {
+      const l = a.lastElementChild;
+      l && (o = l);
     }
   }
-  return o && (!A(o) || !C(o)) ? oe(o) : o;
-}, me = (e) => {
+  return o && (!A(o) || !C(o)) ? ae(o) : o;
+}, ve = (e) => {
   const t = e.target;
-  return ae(t);
-}, ae = (e) => {
+  return se(t);
+}, se = (e) => {
   var t;
   let n;
   if (e.previousElementSibling)
@@ -210,11 +210,11 @@ const C = (e) => {
     const o = (t = e.parentElement) == null ? void 0 : t.previousElementSibling;
     n = o == null ? void 0 : o.lastElementChild;
   }
-  return n && (!A(n) || !C(n)) ? ae(n) : n;
-}, pe = (e) => {
+  return n && (!A(n) || !C(n)) ? se(n) : n;
+}, we = (e) => {
   const t = e.target;
-  return ie(t);
-}, ie = (e) => {
+  return re(t);
+}, re = (e) => {
   var t;
   let n;
   if (e.nextElementSibling)
@@ -223,427 +223,426 @@ const C = (e) => {
     const o = (t = e.parentElement) == null ? void 0 : t.nextElementSibling;
     n = o == null ? void 0 : o.firstElementChild;
   }
-  return n && (!A(n) || !C(n)) ? ie(n) : n;
-}, ve = (e) => {
+  return n && (!A(n) || !C(n)) ? re(n) : n;
+}, he = (e) => {
   const t = e.target.parentElement.firstElementChild;
-  return t && (!A(t) || !C(t)) ? ie(t) : t;
-}, we = (e) => {
+  return t && (!A(t) || !C(t)) ? re(t) : t;
+}, ge = (e) => {
   const t = e.target.parentElement.lastElementChild;
-  return t && (!A(t) || !C(t)) ? ae(t) : t;
-}, V = ["alt", "control", "shift", "meta"], it = {
+  return t && (!A(t) || !C(t)) ? se(t) : t;
+}, U = ["alt", "control", "shift", "meta"], st = {
   ArrowUp: "up",
   ArrowDown: "down",
   ArrowLeft: "left",
   ArrowRight: "right"
-}, re = {
+}, de = {
   "keydown.up": (e) => {
-    const t = ue(e);
+    const t = me(e);
     t && (e.preventDefault(), e.stopPropagation(), t.focus());
   },
   "keydown.down": (e) => {
-    const t = fe(e);
+    const t = pe(e);
     t && (e.preventDefault(), e.stopPropagation(), t.focus());
   },
   "keydown.left": (e) => {
-    const t = me(e);
+    const t = ve(e);
     e.preventDefault(), e.stopPropagation(), t && t.focus();
   },
   "keydown.right": (e) => {
-    const t = pe(e);
+    const t = we(e);
     e.preventDefault(), e.stopPropagation(), t && t.focus();
   },
   "keydown.control.up": (e) => {
-    const t = lt(e);
+    const t = at(e);
     t && (e.preventDefault(), e.stopPropagation(), t.focus());
   },
   "keydown.control.down": (e) => {
-    const t = at(e);
+    const t = it(e);
     t && (e.preventDefault(), e.stopPropagation(), t.focus());
   },
   "keydown.control.left": (e) => {
-    const t = ve(e);
+    const t = he(e);
     t && (e.preventDefault(), e.stopPropagation(), t.focus());
   },
   "keydown.control.right": (e) => {
-    const t = we(e);
+    const t = ge(e);
     t && (e.preventDefault(), e.stopPropagation(), t.focus());
   },
   "keydown.end": (e) => {
-    const t = we(e);
+    const t = ge(e);
     t && (e.preventDefault(), e.stopPropagation(), t.focus());
   },
   "keydown.enter": (e) => {
     if (e.target instanceof HTMLTableCellElement) {
       e.preventDefault(), e.stopPropagation();
-      const t = fe(e);
+      const t = pe(e);
       t && t.focus();
     }
   },
   "keydown.shift.enter": (e) => {
     if (e.target instanceof HTMLTableCellElement) {
       e.preventDefault(), e.stopPropagation();
-      const t = ue(e);
+      const t = me(e);
       t && t.focus();
     }
   },
   "keydown.home": (e) => {
-    const t = ve(e);
+    const t = he(e);
     t && (e.preventDefault(), e.stopPropagation(), t.focus());
   },
   "keydown.tab": (e) => {
-    const t = pe(e);
+    const t = we(e);
     t && (e.preventDefault(), e.stopPropagation(), t.focus());
   },
   "keydown.shift.tab": (e) => {
-    const t = me(e);
+    const t = ve(e);
     t && (e.preventDefault(), e.stopPropagation(), t.focus());
   }
 };
-function se(e) {
-  const t = (a) => {
-    let r = null;
-    return a.parent && (typeof a.parent == "string" ? r = document.querySelector(a.parent) : a.parent instanceof HTMLElement ? r = a.parent : r = a.parent.value), r;
-  }, n = (a) => {
-    const r = t(a);
-    let u = [];
-    if (typeof a.selectors == "string")
-      u = r ? Array.from(r.querySelectorAll(a.selectors)) : Array.from(document.querySelectorAll(a.selectors));
-    else if (Array.isArray(a.selectors))
-      for (const s of a.selectors)
-        s instanceof HTMLElement ? u.push(s) : u.push(s.$el);
-    else if (a.selectors instanceof HTMLElement)
-      u.push(a.selectors);
-    else if (Array.isArray(a.selectors.value))
-      for (const s of a.selectors.value)
-        s instanceof HTMLElement ? u.push(s) : u.push(s.$el);
+function ce(e) {
+  const t = (i) => {
+    let s = null;
+    return i.parent && (typeof i.parent == "string" ? s = document.querySelector(i.parent) : i.parent instanceof HTMLElement ? s = i.parent : s = i.parent.value), s;
+  }, n = (i) => {
+    const s = t(i);
+    let d = [];
+    if (typeof i.selectors == "string")
+      d = s ? Array.from(s.querySelectorAll(i.selectors)) : Array.from(document.querySelectorAll(i.selectors));
+    else if (Array.isArray(i.selectors))
+      for (const c of i.selectors)
+        c instanceof HTMLElement ? d.push(c) : d.push(c.$el);
+    else if (i.selectors instanceof HTMLElement)
+      d.push(i.selectors);
+    else if (Array.isArray(i.selectors.value))
+      for (const c of i.selectors.value)
+        c instanceof HTMLElement ? d.push(c) : d.push(c.$el);
     else
-      u.push(a.selectors.value);
-    return u;
-  }, o = (a) => {
-    const r = t(a);
-    let u = [];
-    return a.selectors ? u = n(a) : r && (u = Array.from(r.children).filter((s) => A(s) && C(s))), u;
-  }, l = (a) => (r) => {
-    const u = it[r.key] || r.key.toLowerCase();
-    if (V.includes(u)) return;
-    const s = a.handlers || re;
-    for (const d of Object.keys(s)) {
-      const [p, ...c] = d.split(".");
-      if (p === "keydown" && c.includes(u)) {
-        const m = s[d], w = c.filter((x) => V.includes(x)), W = V.some((x) => {
+      d.push(i.selectors.value);
+    return d;
+  }, o = (i) => {
+    const s = t(i);
+    let d = [];
+    return i.selectors ? d = n(i) : s && (d = Array.from(s.children).filter((c) => A(c) && C(c))), d;
+  }, a = (i) => (s) => {
+    const d = st[s.key] || s.key.toLowerCase();
+    if (U.includes(d)) return;
+    const c = i.handlers || de;
+    for (const u of Object.keys(c)) {
+      const [p, ...r] = u.split(".");
+      if (p === "keydown" && r.includes(d)) {
+        const f = c[u], w = r.filter((x) => U.includes(x)), V = U.some((x) => {
           const v = x.charAt(0).toUpperCase() + x.slice(1);
-          return r.getModifierState(v);
+          return s.getModifierState(v);
         });
         if (w.length > 0) {
-          if (W) {
-            for (const x of V)
-              if (c.includes(x)) {
+          if (V) {
+            for (const x of U)
+              if (r.includes(x)) {
                 const v = x.charAt(0).toUpperCase() + x.slice(1);
-                r.getModifierState(v) && m(r);
+                s.getModifierState(v) && f(s);
               }
           }
         } else
-          W || m(r);
+          V || f(s);
       }
     }
-  }, i = [];
-  xe(() => {
-    for (const a of e) {
-      const r = t(a), u = o(a), s = l(a), d = r ? [r] : u;
-      for (const p of d) {
-        const { focused: c } = nt(k(p)), m = D(c, (w) => {
-          w ? p.addEventListener("keydown", s) : p.removeEventListener("keydown", s);
+  }, l = [];
+  ne(() => {
+    for (const i of e) {
+      const s = t(i), d = o(i), c = a(i), u = s ? [s] : d;
+      for (const p of u) {
+        const { focused: r } = ot(I(p)), f = D(r, (w) => {
+          w ? p.addEventListener("keydown", c) : p.removeEventListener("keydown", c);
         });
-        i.push(m);
+        l.push(f);
       }
     }
   }), je(() => {
-    for (const a of i)
-      a();
+    for (const i of l)
+      i();
   });
 }
-const rt = ["data-colindex", "data-rowindex", "data-editable", "contenteditable", "tabindex"], st = { key: 1 }, Se = /* @__PURE__ */ T({
+const rt = ["data-colindex", "data-rowindex", "data-editable", "contenteditable", "tabindex"], dt = { key: 1 }, De = /* @__PURE__ */ T({
   __name: "ACell",
   props: {
     colIndex: {},
     rowIndex: {},
     tableid: {},
     addNavigation: { type: [Boolean, Object], default: !0 },
-    tabIndex: { default: 0 }
+    tabIndex: { default: 0 },
+    pinned: { type: Boolean }
   },
   setup(e) {
     var x;
-    const t = Y(e.tableid), n = ee("cell"), o = k(""), l = k(!1), i = t.table, a = t.columns[e.colIndex], r = t.rows[e.rowIndex], u = y(() => {
-      const v = t.cellData(e.colIndex, e.rowIndex), E = a.format;
-      return E ? typeof E == "function" ? E(v, { table: i, row: r, column: a }) : typeof E == "string" ? Function(`"use strict";return (${E})`)()(v, { table: i, row: r, column: a }) : v : v;
-    }), s = () => {
-      if (a.mask, a.modalComponent) {
+    const t = X(e.tableid), n = J("cell"), o = I(""), a = I(!1), l = t.table, i = t.columns[e.colIndex], s = t.rows[e.rowIndex], d = b(() => {
+      const v = t.cellData(e.colIndex, e.rowIndex), E = i.format;
+      return E ? typeof E == "function" ? E(v, { table: l, row: s, column: i }) : typeof E == "string" ? Function(`"use strict";return (${E})`)()(v, { table: l, row: s, column: i }) : v : v;
+    }), c = () => {
+      if (i.mask, i.modalComponent) {
         const v = n.value.getBoundingClientRect();
-        t.modal.visible = !0, t.modal.colIndex = e.colIndex, t.modal.rowIndex = e.rowIndex, t.modal.parent = n.value, t.modal.top = v.top + v.height, t.modal.left = v.left, t.modal.width = p.value, typeof a.modalComponent == "function" ? t.modal.component = a.modalComponent({ table: i, row: r, column: a }) : t.modal.component = a.modalComponent, t.modal.componentProps = a.modalComponentExtraProps;
+        t.modal.visible = !0, t.modal.colIndex = e.colIndex, t.modal.rowIndex = e.rowIndex, t.modal.parent = n.value, t.modal.top = v.top + v.height, t.modal.left = v.left, t.modal.width = p.value, typeof i.modalComponent == "function" ? t.modal.component = i.modalComponent({ table: l, row: s, column: i }) : t.modal.component = i.modalComponent, t.modal.componentProps = i.modalComponentExtraProps;
       }
     };
     if (e.addNavigation) {
       let v = {
-        ...re,
-        "keydown.f2": s,
-        "keydown.alt.up": s,
-        "keydown.alt.down": s,
-        "keydown.alt.left": s,
-        "keydown.alt.right": s
+        ...de,
+        "keydown.f2": c,
+        "keydown.alt.up": c,
+        "keydown.alt.down": c,
+        "keydown.alt.left": c,
+        "keydown.alt.right": c
       };
       typeof e.addNavigation == "object" && (v = {
         ...v,
         ...e.addNavigation
-      }), se([
+      }), ce([
         {
           selectors: n,
           handlers: v
         }
       ]);
     }
-    const d = y(() => a.align || "center"), p = y(() => a.width || "40ch"), c = () => {
+    const u = b(() => i.align || "center"), p = b(() => i.width || "40ch"), r = () => {
       n.value && (o.value = n.value.textContent);
-    }, m = () => {
-      n.value && n.value.textContent !== o.value && (o.value = n.value.textContent, n.value.dispatchEvent(new Event("change")), l.value = !0, a.format || t.setCellData(e.rowIndex, e.colIndex, o.value));
-    }, w = (v, E) => E && v === 0 && E > 0 ? `${E}ch` : "inherit", W = {
-      textAlign: d.value,
+    }, f = () => {
+      n.value && n.value.textContent !== o.value && (o.value = n.value.textContent, n.value.dispatchEvent(new Event("change")), a.value = !0, i.format || t.setCellData(e.rowIndex, e.colIndex, o.value));
+    }, w = (v, E) => E && v === 0 && E > 0 ? `${E}ch` : "inherit", V = {
+      textAlign: u.value,
       width: p.value,
-      backgroundColor: l.value ? "var(--cell-modified-color)" : "inherit",
-      fontWeight: l.value ? "bold" : "inherit",
+      backgroundColor: a.value ? "var(--cell-modified-color)" : "inherit",
+      fontWeight: a.value ? "bold" : "inherit",
       paddingLeft: w(e.colIndex, (x = t.display[e.rowIndex]) == null ? void 0 : x.indent)
     };
-    return (v, E) => (h(), b("td", {
+    return (v, E) => (h(), y("td", {
       ref: "cell",
       "data-colindex": v.colIndex,
       "data-rowindex": v.rowIndex,
-      "data-editable": f(t).columns[v.colIndex].edit,
-      contenteditable: f(t).columns[v.colIndex].edit,
+      "data-editable": m(i).edit,
+      contenteditable: m(i).edit,
       tabindex: v.tabIndex,
       spellcheck: !1,
-      style: W,
-      onFocus: c,
-      onPaste: m,
-      onBlur: m,
-      onInput: m,
-      onClick: s,
-      onMousedown: s,
-      class: "atable__cell"
+      style: V,
+      onFocus: r,
+      onPaste: f,
+      onBlur: f,
+      onInput: f,
+      onClick: c,
+      onMousedown: c,
+      class: P(["atable__cell", v.pinned ? "sticky-column" : ""])
     }, [
-      f(t).columns[v.colIndex].cellComponent ? (h(), B(ke(f(t).columns[v.colIndex].cellComponent), te({
+      m(i).cellComponent ? (h(), z(Ce(m(i).cellComponent), oe({
         key: 0,
-        value: u.value
-      }, f(t).columns[v.colIndex].cellComponentProps), null, 16, ["value"])) : (h(), b("span", st, P(u.value), 1))
-    ], 40, rt));
+        value: d.value
+      }, m(i).cellComponentProps), null, 16, ["value"])) : (h(), y("span", dt, W(d.value), 1))
+    ], 42, rt));
   }
-}), dt = ["tabindex"], ct = ["tabindex"], ut = ["colspan"], ft = /* @__PURE__ */ T({
+}), ct = ["tabindex"], ut = ["tabindex"], ft = ["colspan"], mt = /* @__PURE__ */ T({
   __name: "AExpansionRow",
   props: {
-    row: {},
     rowIndex: {},
     tableid: {},
     tabIndex: { default: () => -1 },
     addNavigation: { type: [Boolean, Object] }
   },
   setup(e) {
-    const t = Y(e.tableid), n = ee("rowEl"), o = y(() => t.display[e.rowIndex].expanded ? "▼" : "►");
+    const t = X(e.tableid), n = J("rowEl"), o = b(() => t.display[e.rowIndex].expanded ? "▼" : "►");
     if (e.addNavigation) {
-      const l = {
-        "keydown.control.g": (i) => {
-          i.stopPropagation(), i.preventDefault(), t.toggleRowExpand(e.rowIndex);
+      const a = {
+        "keydown.control.g": (l) => {
+          l.stopPropagation(), l.preventDefault(), t.toggleRowExpand(e.rowIndex);
         }
       };
-      typeof e.addNavigation == "object" && Object.assign(l, e.addNavigation), se([
+      typeof e.addNavigation == "object" && Object.assign(a, e.addNavigation), ce([
         {
           selectors: n,
-          handlers: l
+          handlers: a
         }
       ]);
     }
-    return (l, i) => (h(), b(q, null, [
-      O("tr", te(l.$attrs, {
+    return (a, l) => (h(), y(G, null, [
+      L("tr", oe(a.$attrs, {
         ref: "rowEl",
-        tabindex: l.tabIndex,
+        tabindex: a.tabIndex,
         class: "expandable-row"
       }), [
-        O("td", {
+        L("td", {
           tabIndex: -1,
-          onClick: i[0] || (i[0] = (a) => f(t).toggleRowExpand(l.rowIndex)),
+          onClick: l[0] || (l[0] = (i) => m(t).toggleRowExpand(a.rowIndex)),
           class: "row-index"
-        }, P(o.value), 1),
-        I(l.$slots, "row")
-      ], 16, dt),
-      f(t).display[l.rowIndex].expanded ? (h(), b("tr", {
+        }, W(o.value), 1),
+        k(a.$slots, "row")
+      ], 16, ct),
+      m(t).display[a.rowIndex].expanded ? (h(), y("tr", {
         key: 0,
         ref: "rowExpanded",
-        tabindex: l.tabIndex,
+        tabindex: a.tabIndex,
         class: "expanded-row"
       }, [
-        O("td", {
+        L("td", {
           tabIndex: -1,
-          colspan: f(t).columns.length + 1,
+          colspan: m(t).columns.length + 1,
           class: "expanded-row-content"
         }, [
-          I(l.$slots, "content")
-        ], 8, ut)
-      ], 8, ct)) : G("", !0)
+          k(a.$slots, "content")
+        ], 8, ft)
+      ], 8, ut)) : Y("", !0)
     ], 64));
   }
-}), mt = ["tabindex"], pt = {
-  key: 0,
-  tabIndex: -1,
-  class: "list-index"
-}, De = /* @__PURE__ */ T({
+}), pt = ["tabindex"], Te = /* @__PURE__ */ T({
   __name: "ARow",
   props: {
-    row: {},
     rowIndex: {},
     tableid: {},
     tabIndex: { default: () => -1 },
     addNavigation: { type: [Boolean, Object], default: !1 }
   },
   setup(e) {
-    const t = Y(e.tableid), n = ee("rowEl"), o = y(() => t.config.view !== "tree" || t.display[e.rowIndex].isRoot || t.display[e.rowIndex].open), l = y(() => t.config.view !== "tree" ? "" : t.display[e.rowIndex].isRoot || t.display[e.rowIndex].isParent ? t.display[e.rowIndex].childrenOpen ? "-" : "+" : ""), i = (a) => {
-      t.toggleRowExpand(a);
+    const t = X(e.tableid), n = J("rowEl"), o = b(() => t.columns.some((s) => s.pinned)), a = b(() => t.config.view !== "tree" || t.display[e.rowIndex].isRoot || t.display[e.rowIndex].open), l = b(() => t.config.view !== "tree" ? "" : t.display[e.rowIndex].isRoot || t.display[e.rowIndex].isParent ? t.display[e.rowIndex].childrenOpen ? "-" : "+" : ""), i = (s) => {
+      t.toggleRowExpand(s);
     };
     if (e.addNavigation) {
-      let a = re;
-      typeof e.addNavigation == "object" && (a = {
-        ...a,
+      let s = de;
+      typeof e.addNavigation == "object" && (s = {
+        ...s,
         ...e.addNavigation
-      }), se([
+      }), ce([
         {
           selectors: n,
-          handlers: a
+          handlers: s
         }
       ]);
     }
-    return (a, r) => Z((h(), b("tr", {
+    return (s, d) => _((h(), y("tr", {
       ref: "rowEl",
-      tabindex: a.tabIndex,
+      tabindex: s.tabIndex,
       class: "table-row"
     }, [
-      I(a.$slots, "index", {}, () => [
-        f(t).config.view === "list" ? (h(), b("td", pt, P(a.rowIndex + 1), 1)) : f(t).config.view === "tree" ? (h(), b("td", {
+      k(s.$slots, "index", {}, () => [
+        m(t).config.view === "list" ? (h(), y("td", {
+          key: 0,
+          tabIndex: -1,
+          class: P(["list-index", o.value ? "sticky-index" : ""])
+        }, W(s.rowIndex + 1), 3)) : m(t).config.view === "tree" ? (h(), y("td", {
           key: 1,
           tabIndex: -1,
-          class: "tree-index",
-          onClick: r[0] || (r[0] = (u) => i(a.rowIndex))
-        }, P(l.value), 1)) : G("", !0)
+          class: P(["tree-index", o.value ? "sticky-index" : ""]),
+          onClick: d[0] || (d[0] = (c) => i(s.rowIndex))
+        }, W(l.value), 3)) : Y("", !0)
       ]),
-      I(a.$slots, "default")
-    ], 8, mt)), [
-      [Ce, o.value]
+      k(s.$slots, "default")
+    ], 8, pt)), [
+      [Ae, a.value]
     ]);
   }
 });
-function Te(e) {
-  return Ee() ? (Ie(e), !0) : !1;
+function $e(e) {
+  return ke() ? (Ie(e), !0) : !1;
 }
-function L(e) {
-  return typeof e == "function" ? e() : f(e);
+function O(e) {
+  return typeof e == "function" ? e() : m(e);
 }
-const $e = typeof window < "u" && typeof document < "u";
+const Re = typeof window < "u" && typeof document < "u";
 typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
 const vt = Object.prototype.toString, wt = (e) => vt.call(e) === "[object Object]", M = () => {
-}, _ = /* @__PURE__ */ ht();
+}, te = /* @__PURE__ */ ht();
 function ht() {
   var e, t;
-  return $e && ((e = window == null ? void 0 : window.navigator) == null ? void 0 : e.userAgent) && (/iP(?:ad|hone|od)/.test(window.navigator.userAgent) || ((t = window == null ? void 0 : window.navigator) == null ? void 0 : t.maxTouchPoints) > 2 && /iPad|Macintosh/.test(window == null ? void 0 : window.navigator.userAgent));
+  return Re && ((e = window == null ? void 0 : window.navigator) == null ? void 0 : e.userAgent) && (/iP(?:ad|hone|od)/.test(window.navigator.userAgent) || ((t = window == null ? void 0 : window.navigator) == null ? void 0 : t.maxTouchPoints) > 2 && /iPad|Macintosh/.test(window == null ? void 0 : window.navigator.userAgent));
 }
-const he = {
+const ye = {
   mounted: "mounted",
   updated: "updated",
   unmounted: "unmounted"
 };
 function gt(...e) {
   if (e.length !== 1)
-    return We(...e);
+    return Ve(...e);
   const t = e[0];
-  return typeof t == "function" ? Ve(Ue(() => ({ get: t, set: M }))) : k(t);
+  return typeof t == "function" ? Ue(Be(() => ({ get: t, set: M }))) : I(t);
 }
 function R(e) {
   var t;
-  const n = L(e);
+  const n = O(e);
   return (t = n == null ? void 0 : n.$el) != null ? t : n;
 }
-const Re = $e ? window : void 0;
-function F(...e) {
-  let t, n, o, l;
-  if (typeof e[0] == "string" || Array.isArray(e[0]) ? ([n, o, l] = e, t = Re) : [t, n, o, l] = e, !t)
+const Le = Re ? window : void 0;
+function q(...e) {
+  let t, n, o, a;
+  if (typeof e[0] == "string" || Array.isArray(e[0]) ? ([n, o, a] = e, t = Le) : [t, n, o, a] = e, !t)
     return M;
   Array.isArray(n) || (n = [n]), Array.isArray(o) || (o = [o]);
-  const i = [], a = () => {
-    i.forEach((d) => d()), i.length = 0;
-  }, r = (d, p, c, m) => (d.addEventListener(p, c, m), () => d.removeEventListener(p, c, m)), u = D(
-    () => [R(t), L(l)],
-    ([d, p]) => {
-      if (a(), !d)
+  const l = [], i = () => {
+    l.forEach((u) => u()), l.length = 0;
+  }, s = (u, p, r, f) => (u.addEventListener(p, r, f), () => u.removeEventListener(p, r, f)), d = D(
+    () => [R(t), O(a)],
+    ([u, p]) => {
+      if (i(), !u)
         return;
-      const c = wt(p) ? { ...p } : p;
-      i.push(
-        ...n.flatMap((m) => o.map((w) => r(d, m, w, c)))
+      const r = wt(p) ? { ...p } : p;
+      l.push(
+        ...n.flatMap((f) => o.map((w) => s(u, f, w, r)))
       );
     },
     { immediate: !0, flush: "post" }
-  ), s = () => {
-    u(), a();
+  ), c = () => {
+    d(), i();
   };
-  return Te(s), s;
+  return $e(c), c;
 }
-let ge = !1;
-function be(e, t, n = {}) {
-  const { window: o = Re, ignore: l = [], capture: i = !0, detectIframe: a = !1 } = n;
+let be = !1;
+function xe(e, t, n = {}) {
+  const { window: o = Le, ignore: a = [], capture: l = !0, detectIframe: i = !1 } = n;
   if (!o)
     return M;
-  _ && !ge && (ge = !0, Array.from(o.document.body.children).forEach((c) => c.addEventListener("click", M)), o.document.documentElement.addEventListener("click", M));
-  let r = !0;
-  const u = (c) => l.some((m) => {
-    if (typeof m == "string")
-      return Array.from(o.document.querySelectorAll(m)).some((w) => w === c.target || c.composedPath().includes(w));
+  te && !be && (be = !0, Array.from(o.document.body.children).forEach((r) => r.addEventListener("click", M)), o.document.documentElement.addEventListener("click", M));
+  let s = !0;
+  const d = (r) => a.some((f) => {
+    if (typeof f == "string")
+      return Array.from(o.document.querySelectorAll(f)).some((w) => w === r.target || r.composedPath().includes(w));
     {
-      const w = R(m);
-      return w && (c.target === w || c.composedPath().includes(w));
+      const w = R(f);
+      return w && (r.target === w || r.composedPath().includes(w));
     }
-  }), d = [
-    F(o, "click", (c) => {
-      const m = R(e);
-      if (!(!m || m === c.target || c.composedPath().includes(m))) {
-        if (c.detail === 0 && (r = !u(c)), !r) {
-          r = !0;
+  }), u = [
+    q(o, "click", (r) => {
+      const f = R(e);
+      if (!(!f || f === r.target || r.composedPath().includes(f))) {
+        if (r.detail === 0 && (s = !d(r)), !s) {
+          s = !0;
           return;
         }
-        t(c);
+        t(r);
       }
-    }, { passive: !0, capture: i }),
-    F(o, "pointerdown", (c) => {
-      const m = R(e);
-      r = !u(c) && !!(m && !c.composedPath().includes(m));
+    }, { passive: !0, capture: l }),
+    q(o, "pointerdown", (r) => {
+      const f = R(e);
+      s = !d(r) && !!(f && !r.composedPath().includes(f));
     }, { passive: !0 }),
-    a && F(o, "blur", (c) => {
+    i && q(o, "blur", (r) => {
       setTimeout(() => {
-        var m;
+        var f;
         const w = R(e);
-        ((m = o.document.activeElement) == null ? void 0 : m.tagName) === "IFRAME" && !(w != null && w.contains(o.document.activeElement)) && t(c);
+        ((f = o.document.activeElement) == null ? void 0 : f.tagName) === "IFRAME" && !(w != null && w.contains(o.document.activeElement)) && t(r);
       }, 0);
     })
   ].filter(Boolean);
-  return () => d.forEach((c) => c());
+  return () => u.forEach((r) => r());
 }
-const bt = {
-  [he.mounted](e, t) {
+const yt = {
+  [ye.mounted](e, t) {
     const n = !t.modifiers.bubble;
     if (typeof t.value == "function")
-      e.__onClickOutside_stop = be(e, t.value, { capture: n });
+      e.__onClickOutside_stop = xe(e, t.value, { capture: n });
     else {
-      const [o, l] = t.value;
-      e.__onClickOutside_stop = be(e, o, Object.assign({ capture: n }, l));
+      const [o, a] = t.value;
+      e.__onClickOutside_stop = xe(e, o, Object.assign({ capture: n }, a));
     }
   },
-  [he.unmounted](e) {
+  [ye.unmounted](e) {
     e.__onClickOutside_stop();
   }
 };
-function X(e) {
+function Q(e) {
   return typeof Window < "u" && e instanceof Window ? e.document.documentElement : typeof Document < "u" && e instanceof Document ? e.documentElement : e;
 }
 function Oe(e) {
@@ -655,86 +654,86 @@ function Oe(e) {
     return !n || n.tagName === "BODY" ? !1 : Oe(n);
   }
 }
-function yt(e) {
+function bt(e) {
   const t = e || window.event, n = t.target;
   return Oe(n) ? !1 : t.touches.length > 1 ? !0 : (t.preventDefault && t.preventDefault(), !1);
 }
-const J = /* @__PURE__ */ new WeakMap();
+const Z = /* @__PURE__ */ new WeakMap();
 function xt(e, t = !1) {
-  const n = k(t);
-  let o = null, l = "";
-  D(gt(e), (r) => {
-    const u = X(L(r));
-    if (u) {
-      const s = u;
-      if (J.get(s) || J.set(s, s.style.overflow), s.style.overflow !== "hidden" && (l = s.style.overflow), s.style.overflow === "hidden")
+  const n = I(t);
+  let o = null, a = "";
+  D(gt(e), (s) => {
+    const d = Q(O(s));
+    if (d) {
+      const c = d;
+      if (Z.get(c) || Z.set(c, c.style.overflow), c.style.overflow !== "hidden" && (a = c.style.overflow), c.style.overflow === "hidden")
         return n.value = !0;
       if (n.value)
-        return s.style.overflow = "hidden";
+        return c.style.overflow = "hidden";
     }
   }, {
     immediate: !0
   });
-  const i = () => {
-    const r = X(L(e));
-    !r || n.value || (_ && (o = F(
-      r,
+  const l = () => {
+    const s = Q(O(e));
+    !s || n.value || (te && (o = q(
+      s,
       "touchmove",
-      (u) => {
-        yt(u);
+      (d) => {
+        bt(d);
       },
       { passive: !1 }
-    )), r.style.overflow = "hidden", n.value = !0);
-  }, a = () => {
-    const r = X(L(e));
-    !r || !n.value || (_ && (o == null || o()), r.style.overflow = l, J.delete(r), n.value = !1);
+    )), s.style.overflow = "hidden", n.value = !0);
+  }, i = () => {
+    const s = Q(O(e));
+    !s || !n.value || (te && (o == null || o()), s.style.overflow = a, Z.delete(s), n.value = !1);
   };
-  return Te(a), y({
+  return $e(i), b({
     get() {
       return n.value;
     },
-    set(r) {
-      r ? i() : a();
+    set(s) {
+      s ? l() : i();
     }
   });
 }
 function Et() {
   let e = !1;
-  const t = k(!1);
+  const t = I(!1);
   return (n, o) => {
     if (t.value = o.value, e)
       return;
     e = !0;
-    const l = xt(n, o.value);
-    D(t, (i) => l.value = i);
+    const a = xt(n, o.value);
+    D(t, (l) => a.value = l);
   };
 }
 Et();
 var g = [];
-for (var Q = 0; Q < 256; ++Q)
-  g.push((Q + 256).toString(16).slice(1));
-function It(e, t = 0) {
+for (var K = 0; K < 256; ++K)
+  g.push((K + 256).toString(16).slice(1));
+function kt(e, t = 0) {
   return (g[e[t + 0]] + g[e[t + 1]] + g[e[t + 2]] + g[e[t + 3]] + "-" + g[e[t + 4]] + g[e[t + 5]] + "-" + g[e[t + 6]] + g[e[t + 7]] + "-" + g[e[t + 8]] + g[e[t + 9]] + "-" + g[e[t + 10]] + g[e[t + 11]] + g[e[t + 12]] + g[e[t + 13]] + g[e[t + 14]] + g[e[t + 15]]).toLowerCase();
 }
-var U, kt = new Uint8Array(16);
+var B, It = new Uint8Array(16);
 function Ct() {
-  if (!U && (U = typeof crypto < "u" && crypto.getRandomValues && crypto.getRandomValues.bind(crypto), !U))
+  if (!B && (B = typeof crypto < "u" && crypto.getRandomValues && crypto.getRandomValues.bind(crypto), !B))
     throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");
-  return U(kt);
+  return B(It);
 }
 var At = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto);
-const ye = {
+const Ee = {
   randomUUID: At
 };
 function St(e, t, n) {
-  if (ye.randomUUID && !t && !e)
-    return ye.randomUUID();
+  if (Ee.randomUUID && !t && !e)
+    return Ee.randomUUID();
   e = e || {};
   var o = e.random || (e.rng || Ct)();
-  return o[6] = o[6] & 15 | 64, o[8] = o[8] & 63 | 128, It(o);
+  return o[6] = o[6] & 15 | 64, o[8] = o[8] & 63 | 128, kt(o);
 }
 class Dt {
-  constructor(t, n, o, l, i, a) {
+  constructor(t, n, o, a, l, i) {
     S(this, "id");
     S(this, "rows");
     S(this, "columns");
@@ -742,13 +741,13 @@ class Dt {
     S(this, "table");
     S(this, "display");
     S(this, "modal");
-    this.id = t || St(), this.rows = o, this.columns = $(n), this.config = $(l), this.table = i || $(this.createTableObject()), this.display = this.createDisplayObject(a), this.modal = $({ visible: !1 });
+    this.id = t || St(), this.rows = o, this.columns = $(n), this.config = $(a), this.table = l || $(this.createTableObject()), this.display = this.createDisplayObject(i), this.modal = $({ visible: !1 });
   }
   createTableObject() {
     const t = {};
     for (const [n, o] of this.columns.entries())
-      for (const [l, i] of this.rows.entries())
-        t[`${n}:${l}`] = i[o.name];
+      for (const [a, l] of this.rows.entries())
+        t[`${n}:${a}`] = l[o.name];
     return t;
   }
   createDisplayObject(t) {
@@ -756,17 +755,17 @@ class Dt {
     if (t && "0:0" in t)
       return t;
     const o = /* @__PURE__ */ new Set();
-    for (let l = this.rows.length - 1; l >= 0; l--) {
-      const i = this.rows[l];
-      i.parent && o.add(i.parent), n[l] = {
+    for (let a = this.rows.length - 1; a >= 0; a--) {
+      const l = this.rows[a];
+      l.parent && o.add(l.parent), n[a] = {
         childrenOpen: !1,
         expanded: !1,
-        indent: i.indent || null,
-        isParent: o.has(l),
-        isRoot: i.parent === null || i.parent === void 0,
+        indent: l.indent || null,
+        isParent: o.has(a),
+        isRoot: l.parent === null || l.parent === void 0,
         modified: !1,
-        open: i.parent === null || i.parent === void 0,
-        parent: i.parent
+        open: l.parent === null || l.parent === void 0,
+        parent: l.parent
       };
     }
     return $(n);
@@ -775,15 +774,15 @@ class Dt {
     return ["list", "tree", "list-expansion"].includes(this.config.view);
   }
   get numberedRowWidth() {
-    return y(() => String(Math.ceil(this.rows.length / 100) + 1) + "ch");
+    return b(() => String(Math.ceil(this.rows.length / 100) + 1) + "ch");
   }
   cellData(t, n) {
     return this.table[`${t}:${n}`];
   }
   setCellData(t, n, o) {
     this.table[`${n}:${t}`] !== o && (this.display[t].modified = !0), this.table[`${n}:${t}`] = o;
-    const l = this.columns[n];
-    return this.rows[t][l.name] = o, this.table[`${n}:${t}`];
+    const a = this.columns[n];
+    return this.rows[t][a.name] = o, this.table[`${n}:${t}`];
   }
   toggleRowExpand(t) {
     if (this.config.view === "tree") {
@@ -799,37 +798,39 @@ const Tt = {
 }, $t = {
   class: "atable-header-row",
   tabindex: "-1"
-}, Rt = {
-  key: 0,
-  id: "header-index"
-}, Le = /* @__PURE__ */ T({
+}, Me = /* @__PURE__ */ T({
   __name: "ATableHeader",
   props: {
     columns: {},
     tableid: {}
   },
   setup(e) {
-    const t = Y(e.tableid), n = (o) => ({
-      minWidth: o.width || "40ch",
-      textAlign: o.align || "center",
+    const t = X(e.tableid), n = b(() => t.columns.some((a) => a.pinned)), o = (a) => ({
+      minWidth: a.width || "40ch",
+      textAlign: a.align || "center",
       width: t.config.fullWidth ? "auto" : null
     });
-    return (o, l) => o.columns.length ? (h(), b("thead", Tt, [
-      O("tr", $t, [
-        f(t).zeroColumn ? (h(), b("th", Rt)) : G("", !0),
-        (h(!0), b(q, null, K(o.columns, (i, a) => (h(), b("th", {
+    return (a, l) => a.columns.length ? (h(), y("thead", Tt, [
+      L("tr", $t, [
+        m(t).zeroColumn ? (h(), y("th", {
+          key: 0,
+          id: "header-index",
+          class: P(n.value ? "sticky-index" : "")
+        }, null, 2)) : Y("", !0),
+        (h(!0), y(G, null, ee(a.columns, (i, s) => (h(), y("th", {
           key: i.name,
           tabindex: "-1",
-          style: z(n(i))
+          style: F(o(i)),
+          class: P(i.pinned ? "sticky-column" : "")
         }, [
-          I(o.$slots, "default", {}, () => [
-            Be(P(i.label || String.fromCharCode(a + 97).toUpperCase()), 1)
+          k(a.$slots, "default", {}, () => [
+            ze(W(i.label || String.fromCharCode(s + 97).toUpperCase()), 1)
           ])
-        ], 4))), 128))
+        ], 6))), 128))
       ])
-    ])) : G("", !0);
+    ])) : Y("", !0);
   }
-}), Me = /* @__PURE__ */ T({
+}), Pe = /* @__PURE__ */ T({
   __name: "ATableModal",
   props: {
     colIndex: {},
@@ -840,126 +841,142 @@ const Tt = {
     const t = (n) => {
       n.stopPropagation();
     };
-    return (n, o) => (h(), b("div", {
+    return (n, o) => (h(), y("div", {
       class: "amodal",
       tabindex: "-1",
       onClick: t,
       onInput: t
     }, [
-      I(n.$slots, "default")
+      k(n.$slots, "default")
     ], 32));
   }
-}), Ot = /* @__PURE__ */ T({
+}), Rt = /* @__PURE__ */ T({
   __name: "ATable",
   props: {
     id: {},
     modelValue: {},
     columns: {},
     rows: { default: () => [] },
-    config: { default: () => new Object() },
-    tableid: {}
+    config: { default: () => new Object() }
   },
   emits: ["update:modelValue"],
   setup(e, { emit: t }) {
-    const n = t, o = e.modelValue ? e.modelValue : e.rows, l = new Dt(e.id, e.columns, o, e.config);
-    ze(l.id, l), D(
+    const n = t, o = J("table"), a = e.modelValue ? e.modelValue : e.rows, l = new Dt(e.id, e.columns, a, e.config);
+    Fe(l.id, l), D(
       () => l.rows,
-      (a) => {
-        n("update:modelValue", a);
+      (d) => {
+        n("update:modelValue", d);
       },
       { deep: !0 }
-    );
-    const i = (a) => {
-      var r;
-      a.target instanceof Node && (r = l.modal.parent) != null && r.contains(a.target) || l.modal.visible && (l.modal.visible = !1);
+    ), ne(() => {
+      i(), l.config.view === "tree" && new MutationObserver(() => i()).observe(o.value, { childList: !0, subtree: !0 });
+    });
+    const i = () => {
+      const d = o.value, c = Array.from(d.rows[0].cells);
+      for (const [u, p] of c.entries()) {
+        const r = d.rows[1].cells[u];
+        p.style.width = `${r.offsetWidth}px`;
+      }
+      for (const u of d.rows) {
+        let p = 0;
+        const r = [];
+        for (const f of u.cells)
+          (f.classList.contains("sticky-column") || f.classList.contains("sticky-index")) && (f.style.left = `${p}px`, p += f.offsetWidth, r.push(f));
+        r.length > 0 && r[r.length - 1].classList.add("sticky-column-edge");
+      }
+    }, s = (d) => {
+      var c;
+      d.target instanceof Node && (c = l.modal.parent) != null && c.contains(d.target) || l.modal.visible && (l.modal.visible = !1);
     };
-    return window.addEventListener("keydown", (a) => {
-      if (a.key === "Escape" && l.modal.visible) {
+    return window.addEventListener("keydown", (d) => {
+      if (d.key === "Escape" && l.modal.visible) {
         l.modal.visible = !1;
-        const r = l.modal.parent;
-        r && Fe().then(() => {
-          r.focus();
+        const c = l.modal.parent;
+        c && qe().then(() => {
+          c.focus();
         });
       }
-    }), (a, r) => Z((h(), b("table", {
+    }), (d, c) => _((h(), y("table", {
+      ref: "table",
       class: "atable",
-      style: z({ width: f(l).config.fullWidth ? "100%" : "auto" })
+      style: F({ width: m(l).config.fullWidth ? "100%" : "auto" })
     }, [
-      I(a.$slots, "header", { data: f(l) }, () => [
-        de(Le, {
-          columns: f(l).columns,
-          tableid: f(l).id
+      k(d.$slots, "header", { data: m(l) }, () => [
+        ue(Me, {
+          columns: m(l).columns,
+          tableid: m(l).id
         }, null, 8, ["columns", "tableid"])
       ]),
-      O("tbody", null, [
-        I(a.$slots, "body", { data: f(l) }, () => [
-          (h(!0), b(q, null, K(f(l).rows, (u, s) => (h(), B(De, {
+      L("tbody", null, [
+        k(d.$slots, "body", { data: m(l) }, () => [
+          (h(!0), y(G, null, ee(m(l).rows, (u, p) => (h(), z(Te, {
             key: u.id,
             row: u,
-            rowIndex: s,
-            tableid: f(l).id
+            rowIndex: p,
+            tableid: m(l).id
           }, {
-            default: ce(() => [
-              (h(!0), b(q, null, K(f(l).columns, (d, p) => (h(), B(Se, {
-                key: d.name,
-                tableid: f(l).id,
-                col: d,
+            default: fe(() => [
+              (h(!0), y(G, null, ee(m(l).columns, (r, f) => (h(), z(De, {
+                key: r.name,
+                tableid: m(l).id,
+                col: r,
                 spellcheck: "false",
-                rowIndex: s,
-                colIndex: p + (f(l).zeroColumn ? 0 : -1),
-                component: d.cellComponent,
-                style: z({
-                  textAlign: (d == null ? void 0 : d.align) || "center",
-                  minWidth: (d == null ? void 0 : d.width) || "40ch",
-                  width: f(l).config.fullWidth ? "auto" : null
+                pinned: r.pinned,
+                rowIndex: p,
+                colIndex: f + (m(l).zeroColumn ? 0 : -1),
+                component: r.cellComponent,
+                style: F({
+                  textAlign: (r == null ? void 0 : r.align) || "center",
+                  minWidth: (r == null ? void 0 : r.width) || "40ch",
+                  width: m(l).config.fullWidth ? "auto" : null
                 })
-              }, null, 8, ["tableid", "col", "rowIndex", "colIndex", "component", "style"]))), 128))
+              }, null, 8, ["tableid", "col", "pinned", "rowIndex", "colIndex", "component", "style"]))), 128))
             ]),
             _: 2
           }, 1032, ["row", "rowIndex", "tableid"]))), 128))
         ])
       ]),
-      I(a.$slots, "footer", { data: f(l) }),
-      I(a.$slots, "modal", { data: f(l) }, () => [
-        Z(de(Me, {
-          colIndex: f(l).modal.colIndex,
-          rowIndex: f(l).modal.rowIndex,
-          tableid: f(l).id,
-          style: z({
-            left: f(l).modal.left + "px",
-            top: f(l).modal.top + "px",
-            maxWidth: f(l).modal.width + "px"
+      k(d.$slots, "footer", { data: m(l) }),
+      k(d.$slots, "modal", { data: m(l) }, () => [
+        _(ue(Pe, {
+          colIndex: m(l).modal.colIndex,
+          rowIndex: m(l).modal.rowIndex,
+          tableid: m(l).id,
+          style: F({
+            left: m(l).modal.left + "px",
+            top: m(l).modal.top + "px",
+            maxWidth: m(l).modal.width + "px"
           })
         }, {
-          default: ce(() => [
-            (h(), B(ke(f(l).modal.component), te({
-              key: `${f(l).modal.rowIndex}:${f(l).modal.colIndex}`,
-              colIndex: f(l).modal.colIndex,
-              rowIndex: f(l).modal.rowIndex,
-              tableid: f(l).id
-            }, f(l).modal.componentProps), null, 16, ["colIndex", "rowIndex", "tableid"]))
+          default: fe(() => [
+            (h(), z(Ce(m(l).modal.component), oe({
+              key: `${m(l).modal.rowIndex}:${m(l).modal.colIndex}`,
+              colIndex: m(l).modal.colIndex,
+              rowIndex: m(l).modal.rowIndex,
+              tableid: m(l).id
+            }, m(l).modal.componentProps), null, 16, ["colIndex", "rowIndex", "tableid"]))
           ]),
           _: 1
         }, 8, ["colIndex", "rowIndex", "tableid", "style"]), [
-          [Ce, f(l).modal.visible]
+          [Ae, m(l).modal.visible]
         ])
       ])
     ], 4)), [
-      [f(bt), i]
+      [m(yt), s]
     ]);
   }
 });
-function Ht(e) {
-  e.component("ACell", Se), e.component("AExpansionRow", ft), e.component("ARow", De), e.component("ATable", Ot), e.component("ATableHeader", Le), e.component("ATableModal", Me);
+function Pt(e) {
+  e.component("ACell", De), e.component("AExpansionRow", mt), e.component("ARow", Te), e.component("ATable", Rt), e.component("ATableHeader", Me), e.component("ATableModal", Pe);
 }
 export {
-  Se as ACell,
-  ft as AExpansionRow,
-  De as ARow,
-  Ot as ATable,
-  Le as ATableHeader,
-  Me as ATableModal,
+  De as ACell,
+  mt as AExpansionRow,
+  Te as ARow,
+  Rt as ATable,
+  Me as ATableHeader,
+  Pe as ATableModal,
   Dt as TableDataStore,
-  Ht as install
+  Pt as install
 };
 //# sourceMappingURL=atable.js.map