react-excel-lite 0.3.0 → 0.4.0

package/dist/react-excel-lite.js

@@ -1,32 +1,32 @@
-import { jsxs as K, jsx as N, Fragment as Z } from "react/jsx-runtime";
-import { useState as G, useCallback as k, useEffect as q, useRef as O, useLayoutEffect as ee, useMemo as j } from "react";
+import { jsxs as K, jsx as R, Fragment as te } from "react/jsx-runtime";
+import { useState as G, useCallback as k, useEffect as q, useRef as O, useLayoutEffect as oe, useMemo as j } from "react";
 function B(...e) {
   return e.filter(Boolean).join(" ");
 }
-function Ee(e) {
+function Fe(e) {
   return `${e.row}-${e.col}`;
 }
-function Fe(e) {
+function Re(e) {
   const [t, n] = e.split("-").map(Number);
   return { row: t, col: n };
 }
-function Ne(e, t) {
+function Ie(e, t) {
   if (!e || !t) return e ? [e] : [];
-  const n = Math.min(e.row, t.row), c = Math.max(e.row, t.row), u = Math.min(e.col, t.col), y = Math.max(e.col, t.col), f = [];
+  const n = Math.min(e.row, t.row), c = Math.max(e.row, t.row), a = Math.min(e.col, t.col), y = Math.max(e.col, t.col), u = [];
   for (let p = n; p <= c; p++)
-    for (let d = u; d <= y; d++)
-      f.push({ row: p, col: d });
-  return f;
+    for (let h = a; h <= y; h++)
+      u.push({ row: p, col: h });
+  return u;
 }
-function te(e, t) {
+function ne(e, t) {
   if (!t.start) return !1;
-  const n = t.end || t.start, c = Math.min(t.start.row, n.row), u = Math.max(t.start.row, n.row), y = Math.min(t.start.col, n.col), f = Math.max(t.start.col, n.col);
-  return e.row >= c && e.row <= u && e.col >= y && e.col <= f;
+  const n = t.end || t.start, c = Math.min(t.start.row, n.row), a = Math.max(t.start.row, n.row), y = Math.min(t.start.col, n.col), u = Math.max(t.start.col, n.col);
+  return e.row >= c && e.row <= a && e.col >= y && e.col <= u;
 }
-function oe(e) {
+function le(e) {
   return e.split(/\r?\n/).filter((t) => t.trim()).map((t) => t.split("	").map((n) => n.trim()));
 }
-function ne(e) {
+function re(e) {
   return e.map((t) => t.join("	")).join(`
 `);
 }
@@ -42,128 +42,128 @@ function U(e) {
     }
   };
 }
-function Re(e, t) {
+function ze(e, t) {
   if (e.row === t.row && e.col === t.col)
     return [];
-  const n = Math.min(e.row, t.row), c = Math.max(e.row, t.row), u = Math.min(e.col, t.col), y = Math.max(e.col, t.col), f = [];
+  const n = Math.min(e.row, t.row), c = Math.max(e.row, t.row), a = Math.min(e.col, t.col), y = Math.max(e.col, t.col), u = [];
   for (let p = n; p <= c; p++)
-    for (let d = u; d <= y; d++)
-      p === e.row && d === e.col || f.push({ row: p, col: d });
-  return f;
+    for (let h = a; h <= y; h++)
+      p === e.row && h === e.col || u.push({ row: p, col: h });
+  return u;
 }
-function le({
+function se({
   containerRef: e
 }) {
   const [t, n] = G({
     start: null,
     end: null
-  }), [c, u] = G(!1), y = k((i) => {
-    n({ start: i, end: i }), u(!0);
-  }, []), f = k(
-    (i) => {
-      c && n((o) => ({ ...o, end: i }));
+  }), [c, a] = G(!1), y = k((d) => {
+    n({ start: d, end: d }), a(!0);
+  }, []), u = k(
+    (d) => {
+      c && n((o) => ({ ...o, end: d }));
     },
     [c]
   ), p = k(() => {
-    u(!1);
-  }, []), d = k(() => {
-    n({ start: null, end: null }), u(!1);
-  }, []), g = k(
-    (i) => te(i, t),
+    a(!1);
+  }, []), h = k(() => {
+    n({ start: null, end: null }), a(!1);
+  }, []), S = k(
+    (d) => ne(d, t),
     [t]
   );
   return q(() => {
-    const i = () => {
-      c && u(!1);
+    const d = () => {
+      c && a(!1);
     };
-    return window.addEventListener("mouseup", i), () => window.removeEventListener("mouseup", i);
+    return window.addEventListener("mouseup", d), () => window.removeEventListener("mouseup", d);
   }, [c]), q(() => {
-    const i = (o) => {
-      e.current && !e.current.contains(o.target) && d();
+    const d = (o) => {
+      e.current && !e.current.contains(o.target) && h();
     };
-    return document.addEventListener("mousedown", i), () => document.removeEventListener("mousedown", i);
-  }, [e, d]), {
+    return document.addEventListener("mousedown", d), () => document.removeEventListener("mousedown", d);
+  }, [e, h]), {
     selection: t,
     isSelecting: c,
-    isCellSelected: g,
+    isCellSelected: S,
     handleCellMouseDown: y,
-    handleCellMouseEnter: f,
+    handleCellMouseEnter: u,
     handleMouseUp: p,
-    clearSelection: d,
+    clearSelection: h,
     setSelection: n
   };
 }
-function re({
+function ce({
   selection: e,
   getValue: t,
   setValues: n,
   setSelection: c,
-  rowCount: u,
+  rowCount: a,
   colCount: y
 }) {
-  const f = k(() => {
+  const u = k(() => {
     const o = U(e);
     if (!o.start || !o.end) return [];
-    const S = [];
-    for (let h = o.start.row; h <= o.end.row; h++) {
+    const x = [];
+    for (let f = o.start.row; f <= o.end.row; f++) {
       const C = [];
       for (let s = o.start.col; s <= o.end.col; s++)
-        C.push(t({ row: h, col: s }));
-      S.push(C);
+        C.push(t({ row: f, col: s }));
+      x.push(C);
     }
-    return S;
+    return x;
   }, [e, t]), p = k(async () => {
-    const o = f();
+    const o = u();
     if (o.length === 0) return;
-    const S = ne(o);
+    const x = re(o);
     try {
-      await navigator.clipboard.writeText(S);
-    } catch (h) {
-      console.error("Clipboard copy failed:", h);
+      await navigator.clipboard.writeText(x);
+    } catch (f) {
+      console.error("Clipboard copy failed:", f);
     }
-  }, [f]), d = k(async () => {
+  }, [u]), h = k(async () => {
     if (e.start)
       try {
-        const o = await navigator.clipboard.readText(), S = oe(o);
-        if (S.length === 0) return;
-        const h = e.start.row, C = e.start.col, s = [];
-        S.forEach((m, a) => {
-          const w = h + a;
-          w >= u || m.forEach((R, F) => {
-            const r = C + F;
-            r >= y || s.push({ coord: { row: w, col: r }, value: R });
+        const o = await navigator.clipboard.readText(), x = le(o);
+        if (x.length === 0) return;
+        const f = e.start.row, C = e.start.col, s = [];
+        x.forEach((m, w) => {
+          const i = f + w;
+          i >= a || m.forEach((F, N) => {
+            const r = C + N;
+            r >= y || s.push({ coord: { row: i, col: r }, value: F });
           });
         }), s.length > 0 && n(s);
       } catch (o) {
         console.error("Clipboard paste failed:", o);
       }
-  }, [e.start, n, u, y]), g = k(() => {
+  }, [e.start, n, a, y]), S = k(() => {
     const o = U(e);
     if (!o.start || !o.end) return;
-    const S = [];
-    for (let h = o.start.row; h <= o.end.row; h++)
+    const x = [];
+    for (let f = o.start.row; f <= o.end.row; f++)
       for (let C = o.start.col; C <= o.end.col; C++)
-        S.push({ coord: { row: h, col: C }, value: "" });
-    S.length > 0 && n(S);
-  }, [e, n]), i = k(
+        x.push({ coord: { row: f, col: C }, value: "" });
+    x.length > 0 && n(x);
+  }, [e, n]), d = k(
     (o) => {
       if (!(o.target instanceof HTMLInputElement && !o.target.readOnly)) {
         if (["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"].includes(o.key)) {
           o.preventDefault();
-          const h = U(e).start ?? { row: 0, col: 0 };
-          let C = h.row, s = h.col;
+          const f = U(e).start ?? { row: 0, col: 0 };
+          let C = f.row, s = f.col;
           switch (o.key) {
             case "ArrowUp":
-              C = Math.max(0, h.row - 1);
+              C = Math.max(0, f.row - 1);
               break;
             case "ArrowDown":
-              C = Math.min(u - 1, h.row + 1);
+              C = Math.min(a - 1, f.row + 1);
               break;
             case "ArrowLeft":
-              s = Math.max(0, h.col - 1);
+              s = Math.max(0, f.col - 1);
               break;
             case "ArrowRight":
-              s = Math.min(y - 1, h.col + 1);
+              s = Math.min(y - 1, f.col + 1);
               break;
           }
           c({
@@ -172,132 +172,132 @@ function re({
           });
           return;
         }
-        (o.ctrlKey || o.metaKey) && o.key === "c" && (o.preventDefault(), p()), (o.ctrlKey || o.metaKey) && o.key === "v" && (o.preventDefault(), d()), (o.key === "Backspace" || o.key === "Delete") && (o.preventDefault(), g());
+        (o.ctrlKey || o.metaKey) && o.key === "c" && (o.preventDefault(), p()), (o.ctrlKey || o.metaKey) && o.key === "v" && (o.preventDefault(), h()), (o.key === "Backspace" || o.key === "Delete") && (o.preventDefault(), S());
       }
     },
     [
       p,
-      d,
-      g,
+      h,
+      S,
       e,
       c,
-      u,
+      a,
       y
     ]
   );
   return {
     handleCopy: p,
-    handlePaste: d,
-    handleKeyDown: i
+    handlePaste: h,
+    handleKeyDown: d
   };
 }
-function se(e) {
+function ie(e) {
   if (e.trim() === "") return null;
   const t = Number(e);
   return isNaN(t) ? null : t;
 }
-function J(e) {
+function Q(e) {
   if (e.length === 0) return null;
-  const t = e.map(se);
-  if (t.some((u) => u === null)) return null;
+  const t = e.map(ie);
+  if (t.some((a) => a === null)) return null;
   const n = t;
   if (n.length === 1)
     return { numbers: n, diff: 0 };
   const c = n[1] - n[0];
-  for (let u = 2; u < n.length; u++)
-    if (n[u] - n[u - 1] !== c)
+  for (let a = 2; a < n.length; a++)
+    if (n[a] - n[a - 1] !== c)
       return { numbers: n, diff: 0 };
   return { numbers: n, diff: c };
 }
-function ce({
+function ae({
   selection: e,
   getValue: t,
   setValues: n
 }) {
-  const [c, u] = G(null), [y, f] = G([]), [p, d] = G(!1), [g, i] = G(null), o = k((s) => {
-    u(s), d(!0), f([]), i(null);
-  }, []), S = k(
+  const [c, a] = G(null), [y, u] = G([]), [p, h] = G(!1), [S, d] = G(null), o = k((s) => {
+    a(s), h(!0), u([]), d(null);
+  }, []), x = k(
     (s) => {
       if (!p || !e.start) return;
       const m = U(e);
       if (!m.start || !m.end) return;
-      i(s);
-      const a = {
+      d(s);
+      const w = {
         row: Math.min(m.start.row, s.row),
         col: Math.min(m.start.col, s.col)
-      }, w = {
+      }, i = {
         row: Math.max(m.end.row, s.row),
         col: Math.max(m.end.col, s.col)
-      }, R = [];
-      for (let F = a.row; F <= w.row; F++)
-        for (let r = a.col; r <= w.col; r++)
-          F >= m.start.row && F <= m.end.row && r >= m.start.col && r <= m.end.col || R.push({ row: F, col: r });
-      f(R);
+      }, F = [];
+      for (let N = w.row; N <= i.row; N++)
+        for (let r = w.col; r <= i.col; r++)
+          N >= m.start.row && N <= m.end.row && r >= m.start.col && r <= m.end.col || F.push({ row: N, col: r });
+      u(F);
     },
     [p, e]
-  ), h = k(() => {
-    if (!e.start || y.length === 0 || !g) {
-      u(null), f([]), d(!1), i(null);
+  ), f = k(() => {
+    if (!e.start || y.length === 0 || !S) {
+      a(null), u([]), h(!1), d(null);
       return;
     }
     const s = U(e);
     if (!s.start || !s.end) {
-      u(null), f([]), d(!1), i(null);
+      a(null), u([]), h(!1), d(null);
       return;
     }
-    const m = [], a = s.start, w = s.end, R = w.row - a.row + 1, F = w.col - a.col + 1;
+    const m = [], w = s.start, i = s.end, F = i.row - w.row + 1, N = i.col - w.col + 1;
     y.forEach((r) => {
-      let z, L;
-      if (r.row < a.row) {
-        const E = a.row - r.row;
-        z = w.row - (E - 1) % R;
-      } else if (r.row > w.row) {
-        const E = r.row - w.row;
-        z = a.row + (E - 1) % R;
+      let I, z;
+      if (r.row < w.row) {
+        const M = w.row - r.row;
+        I = i.row - (M - 1) % F;
+      } else if (r.row > i.row) {
+        const M = r.row - i.row;
+        I = w.row + (M - 1) % F;
       } else
-        z = r.row;
-      if (r.col < a.col) {
-        const E = a.col - r.col;
-        L = w.col - (E - 1) % F;
-      } else if (r.col > w.col) {
-        const E = r.col - w.col;
-        L = a.col + (E - 1) % F;
+        I = r.row;
+      if (r.col < w.col) {
+        const M = w.col - r.col;
+        z = i.col - (M - 1) % N;
+      } else if (r.col > i.col) {
+        const M = r.col - i.col;
+        z = w.col + (M - 1) % N;
       } else
-        L = r.col;
-      let I = t({ row: z, col: L });
-      if (r.row !== z && r.col >= a.col && r.col <= w.col) {
-        const E = [];
-        for (let M = a.row; M <= w.row; M++)
-          E.push(t({ row: M, col: r.col }));
-        const v = J(E);
+        z = r.col;
+      let L = t({ row: I, col: z });
+      if (r.row !== I && r.col >= w.col && r.col <= i.col) {
+        const M = [];
+        for (let E = w.row; E <= i.row; E++)
+          M.push(t({ row: E, col: r.col }));
+        const v = Q(M);
         if (v && v.diff !== 0) {
-          if (r.row > w.row) {
-            const M = r.row - w.row;
-            I = String(v.numbers[v.numbers.length - 1] + v.diff * M);
-          } else if (r.row < a.row) {
-            const M = a.row - r.row;
-            I = String(v.numbers[0] - v.diff * M);
+          if (r.row > i.row) {
+            const E = r.row - i.row;
+            L = String(v.numbers[v.numbers.length - 1] + v.diff * E);
+          } else if (r.row < w.row) {
+            const E = w.row - r.row;
+            L = String(v.numbers[0] - v.diff * E);
           }
         }
       }
-      if (r.col !== L && r.row >= a.row && r.row <= w.row) {
-        const E = [];
-        for (let M = a.col; M <= w.col; M++)
-          E.push(t({ row: r.row, col: M }));
-        const v = J(E);
+      if (r.col !== z && r.row >= w.row && r.row <= i.row) {
+        const M = [];
+        for (let E = w.col; E <= i.col; E++)
+          M.push(t({ row: r.row, col: E }));
+        const v = Q(M);
         if (v && v.diff !== 0) {
-          if (r.col > w.col) {
-            const M = r.col - w.col;
-            I = String(v.numbers[v.numbers.length - 1] + v.diff * M);
-          } else if (r.col < a.col) {
-            const M = a.col - r.col;
-            I = String(v.numbers[0] - v.diff * M);
+          if (r.col > i.col) {
+            const E = r.col - i.col;
+            L = String(v.numbers[v.numbers.length - 1] + v.diff * E);
+          } else if (r.col < w.col) {
+            const E = w.col - r.col;
+            L = String(v.numbers[0] - v.diff * E);
           }
         }
       }
-      m.push({ coord: r, value: I });
-    }), m.length > 0 && n(m), u(null), f([]), d(!1), i(null);
-  }, [e, y, g, t, n]), C = k(
+      m.push({ coord: r, value: L });
+    }), m.length > 0 && n(m), a(null), u([]), h(!1), d(null);
+  }, [e, y, S, t, n]), C = k(
     (s) => y.some(
       (m) => m.row === s.row && m.col === s.col
     ),
@@ -305,26 +305,26 @@ function ce({
   );
   return q(() => {
     const s = () => {
-      p && h();
+      p && f();
     };
     return window.addEventListener("mouseup", s), () => window.removeEventListener("mouseup", s);
-  }, [p, h]), {
+  }, [p, f]), {
     fillSource: c,
     fillTargets: y,
     isDraggingFill: p,
     isFillTarget: C,
     handleFillHandleMouseDown: o,
-    handleCellMouseEnterForFill: S,
-    handleFillMouseUp: h
+    handleCellMouseEnterForFill: x,
+    handleFillMouseUp: f
   };
 }
-const ie = {
+const ue = {
   position: "relative",
   border: "1px solid #d1d5db",
   padding: 0,
   height: "28px",
   minWidth: "80px"
-}, ae = {
+}, fe = {
   width: "100%",
   height: "100%",
   padding: "4px",
@@ -335,7 +335,7 @@ const ie = {
   backgroundColor: "transparent",
   outline: "none",
   border: "none"
-}, ue = {
+}, de = {
   position: "absolute",
   bottom: "-2px",
   right: "-2px",
@@ -344,14 +344,14 @@ const ie = {
   cursor: "crosshair",
   zIndex: 20,
   backgroundColor: "#3b82f6"
-}, fe = {
+}, we = {
   position: "absolute",
   top: 0,
   left: 0,
   minWidth: "100%",
   height: "100%",
   zIndex: 30
-}, de = {
+}, he = {
   height: "100%",
   padding: "4px",
   textAlign: "right",
@@ -361,129 +361,131 @@ const ie = {
   border: "2px solid #3b82f6",
   outline: "none",
   minWidth: "100%"
-}, we = {
+}, pe = {
   position: "absolute",
   visibility: "hidden",
   whiteSpace: "pre",
   fontSize: "12px",
   padding: "4px"
-}, he = {
+}, me = {
   backgroundColor: "#dbeafe",
   outline: "2px solid #3b82f6",
   outlineOffset: "-2px"
-}, pe = {
+}, be = {
   backgroundColor: "#eff6ff"
 };
-function me({
+function ye({
   coord: e,
   value: t,
   isSelected: n,
   isFillTarget: c,
-  showFillHandle: u,
+  showFillHandle: a,
   onMouseDown: y,
-  onMouseEnter: f,
+  onMouseEnter: u,
   onChange: p,
-  onFillHandleMouseDown: d,
-  styles: g
+  onFillHandleMouseDown: h,
+  styles: S,
+  cellClassName: d
 }) {
-  const [i, o] = G(!1), [S, h] = G(!1), [C, s] = G(null), m = O(null), a = O(null), w = O(null), R = O(null);
-  ee(() => {
-    if (i && w.current && R.current) {
-      const D = w.current.offsetWidth, X = R.current.offsetWidth;
-      s(Math.max(D + 16, X));
+  const [o, x] = G(!1), [f, C] = G(!1), [s, m] = G(null), w = O(null), i = O(null), F = O(null), N = O(null);
+  oe(() => {
+    if (o && F.current && N.current) {
+      const D = F.current.offsetWidth, _ = N.current.offsetWidth;
+      m(Math.max(D + 16, _));
     }
-  }, [i, t]), q(() => {
-    i && a.current ? (a.current.focus(), S && (a.current.select(), h(!1))) : n && !i && m.current && m.current.focus();
-  }, [n, i, S]), q(() => {
-    !n && i && (o(!1), s(null));
-  }, [n, i]);
-  const F = (D) => {
+  }, [o, t]), q(() => {
+    o && i.current ? (i.current.focus(), f && (i.current.select(), C(!1))) : n && !o && w.current && w.current.focus();
+  }, [n, o, f]), q(() => {
+    !n && o && (x(!1), m(null));
+  }, [n, o]);
+  const r = (D) => {
     p(e, D.target.value);
-  }, r = (D) => {
+  }, I = (D) => {
     D.target.classList.contains("fill-handle") || y(e);
   }, z = () => {
-    o(!0), h(!0);
+    x(!0), C(!0);
   }, L = () => {
-    o(!1);
-  }, I = (D) => {
-    i ? (D.key === "Enter" || D.key === "Escape") && o(!1) : D.key === "Enter" ? (D.preventDefault(), o(!0), h(!0)) : D.key.length === 1 && !D.ctrlKey && !D.metaKey && (D.preventDefault(), p(e, D.key), o(!0));
-  }, E = (D) => {
-    D.stopPropagation(), D.preventDefault(), d(e);
-  }, v = !!g?.selected, M = !!g?.fillTarget, P = !!g?.fillHandle, V = {
-    ...ie,
-    ...n && !v ? he : {},
-    ...c && !M ? pe : {}
-  }, $ = {
+    x(!1);
+  }, M = (D) => {
+    o ? (D.key === "Enter" || D.key === "Escape") && x(!1) : D.key === "Enter" ? (D.preventDefault(), x(!0), C(!0)) : D.key.length === 1 && !D.ctrlKey && !D.metaKey && (D.preventDefault(), p(e, D.key), x(!0));
+  }, v = (D) => {
+    D.stopPropagation(), D.preventDefault(), h(e);
+  }, E = !!S?.selected, P = !!S?.fillTarget, V = !!S?.fillHandle, $ = {
     ...ue,
-    ...P ? { backgroundColor: void 0 } : {}
+    ...n && !E ? me : {},
+    ...c && !P ? be : {}
+  }, X = {
+    ...de,
+    ...V ? { backgroundColor: void 0 } : {}
   }, H = {
-    ...ae,
+    ...fe,
     overflow: "hidden",
     textOverflow: "ellipsis"
   };
   return /* @__PURE__ */ K(
     "td",
     {
-      ref: R,
+      ref: N,
       className: B(
-        g?.cell,
-        n && g?.selected,
-        c && g?.fillTarget
+        S?.cell,
+        n && S?.selected,
+        c && S?.fillTarget,
+        d
       ),
-      style: V,
-      onMouseDown: r,
-      onMouseEnter: () => f(e),
+      style: $,
+      onMouseDown: I,
+      onMouseEnter: () => u(e),
       onDoubleClick: z,
       children: [
-        /* @__PURE__ */ N(
+        /* @__PURE__ */ R(
           "input",
           {
-            ref: m,
+            ref: w,
             type: "text",
             value: t,
             readOnly: !0,
-            onChange: F,
-            onKeyDown: I,
+            onChange: r,
+            onKeyDown: M,
             style: H,
-            tabIndex: i ? -1 : 0
+            tabIndex: o ? -1 : 0
           }
         ),
-        i && /* @__PURE__ */ N("div", { style: fe, children: /* @__PURE__ */ N(
+        o && /* @__PURE__ */ R("div", { style: we, children: /* @__PURE__ */ R(
           "input",
           {
-            ref: a,
+            ref: i,
             type: "text",
             value: t,
-            onChange: F,
+            onChange: r,
             onBlur: L,
-            onKeyDown: I,
+            onKeyDown: M,
             style: {
-              ...de,
-              width: C ?? "100%"
+              ...he,
+              width: s ?? "100%"
             }
           }
         ) }),
-        i && /* @__PURE__ */ N("span", { ref: w, style: we, children: t }),
-        u && /* @__PURE__ */ N(
+        o && /* @__PURE__ */ R("span", { ref: F, style: pe, children: t }),
+        a && /* @__PURE__ */ R(
           "div",
           {
-            className: B("fill-handle", g?.fillHandle),
-            style: $,
-            onMouseDown: E
+            className: B("fill-handle", S?.fillHandle),
+            style: X,
+            onMouseDown: v
           }
         )
       ]
     }
   );
 }
-const be = {
+const xe = {
   outline: "none",
   overflowX: "auto"
-}, ye = {
+}, ge = {
   borderCollapse: "collapse",
   fontSize: "12px",
   userSelect: "none"
-}, xe = {
+}, Se = {
   position: "sticky",
   left: 0,
   zIndex: 10,
@@ -491,155 +493,156 @@ const be = {
   padding: "6px 8px",
   textAlign: "center",
   fontWeight: 500
-}, ge = {
+}, Ce = {
   border: "1px solid #d1d5db",
   padding: "6px 4px",
   textAlign: "center",
   fontWeight: 500
-}, Se = {
+}, Me = {
   border: "1px solid #d1d5db",
   padding: "4px",
   textAlign: "center",
   fontWeight: 500,
   fontSize: "11px"
-}, Ce = {
+}, De = {
   backgroundColor: "#f3f4f6"
-}, Me = {
+}, ke = {
   backgroundColor: "#dbeafe",
   color: "#1d4ed8"
-}, De = {
+}, ve = {
   backgroundColor: "#f9fafb"
 };
-function Ie({
+function Le({
   data: e,
   onChange: t,
   rowHeaders: n,
   colHeaders: c,
-  className: u,
+  className: a,
   rowHeaderTitle: y = "",
-  styles: f
+  styles: u,
+  cellStyles: p
 }) {
-  const p = O(null), d = e.length, g = j(() => c ? c.reduce(
+  const h = O(null), S = e.length, d = j(() => c ? c.reduce(
     (l, b) => l + b.headers.length,
     0
-  ) : e[0]?.length ?? 0, [c, e]), i = j(() => c ? c.flatMap((l) => l.headers) : [], [c]), o = j(() => c ? c.some((l) => l.label !== void 0) : !1, [c]), S = j(() => n ? n.some((l) => l.label !== void 0) : !1, [n]), h = j(() => {
+  ) : e[0]?.length ?? 0, [c, e]), o = j(() => c ? c.flatMap((l) => l.headers) : [], [c]), x = j(() => c ? c.some((l) => l.label !== void 0) : !1, [c]), f = j(() => n ? n.some((l) => l.label !== void 0) : !1, [n]), C = j(() => {
     if (!n) return null;
     const l = [];
-    return n.forEach((b, x) => {
-      b.headers.forEach((T, W) => {
+    return n.forEach((b, g) => {
+      b.headers.forEach((A, W) => {
         l.push({
-          groupIndex: x,
+          groupIndex: g,
           isFirstInGroup: W === 0,
           groupLabel: b.label,
           groupRowCount: b.headers.length,
-          rowHeader: T,
+          rowHeader: A,
           groupClassName: b.className,
           groupDescription: b.description
         });
       });
     }), l;
-  }, [n]), C = k(
-    (l) => l.row < 0 || l.row >= d || l.col < 0 || l.col >= g ? "" : e[l.row]?.[l.col] ?? "",
-    [e, d, g]
-  ), s = k(
+  }, [n]), s = k(
+    (l) => l.row < 0 || l.row >= S || l.col < 0 || l.col >= d ? "" : e[l.row]?.[l.col] ?? "",
+    [e, S, d]
+  ), m = k(
     (l, b) => {
-      const x = e.map(
-        (T, W) => W === l.row ? T.map(
-          (A, _) => _ === l.col ? b : A
-        ) : T
+      const g = e.map(
+        (A, W) => W === l.row ? A.map(
+          (T, J) => J === l.col ? b : T
+        ) : A
       );
-      t(x);
+      t(g);
     },
     [e, t]
-  ), m = k(
+  ), w = k(
     (l) => {
       if (l.length === 0) return;
-      const b = e.map((x) => [...x]);
-      l.forEach(({ coord: x, value: T }) => {
-        x.row >= 0 && x.row < d && x.col >= 0 && x.col < g && (b[x.row][x.col] = T);
+      const b = e.map((g) => [...g]);
+      l.forEach(({ coord: g, value: A }) => {
+        g.row >= 0 && g.row < S && g.col >= 0 && g.col < d && (b[g.row][g.col] = A);
       }), t(b);
     },
-    [e, t, d, g]
+    [e, t, S, d]
   ), {
-    selection: a,
-    isSelecting: w,
-    isCellSelected: R,
-    handleCellMouseDown: F,
-    handleCellMouseEnter: r,
+    selection: i,
+    isSelecting: F,
+    isCellSelected: N,
+    handleCellMouseDown: r,
+    handleCellMouseEnter: I,
     setSelection: z
-  } = le({ containerRef: p }), { handleKeyDown: L } = re({
-    selection: a,
-    getValue: C,
-    setValues: m,
+  } = se({ containerRef: h }), { handleKeyDown: L } = ce({
+    selection: i,
+    getValue: s,
+    setValues: w,
     setSelection: z,
-    rowCount: d,
-    colCount: g
+    rowCount: S,
+    colCount: d
   }), {
-    isDraggingFill: I,
-    isFillTarget: E,
-    handleFillHandleMouseDown: v,
-    handleCellMouseEnterForFill: M
-  } = ce({
-    selection: a,
-    getValue: C,
-    setValues: m
-  }), P = k(
+    isDraggingFill: M,
+    isFillTarget: v,
+    handleFillHandleMouseDown: E,
+    handleCellMouseEnterForFill: P
+  } = ae({
+    selection: i,
+    getValue: s,
+    setValues: w
+  }), V = k(
     (l) => {
-      I ? M(l) : w && r(l);
+      M ? P(l) : F && I(l);
     },
     [
-      I,
-      w,
       M,
-      r
+      F,
+      P,
+      I
     ]
-  ), V = k(
+  ), $ = k(
     (l, b) => {
-      s(l, b);
+      m(l, b);
     },
-    [s]
-  ), $ = k(
+    [m]
+  ), X = k(
     (l) => {
-      if (!a.start) return !1;
-      const b = U(a);
+      if (!i.start) return !1;
+      const b = U(i);
       return !b.start || !b.end ? !1 : l.row === b.end.row && l.col === b.end.col;
     },
-    [a]
+    [i]
   ), H = (l) => ({
-    ...xe,
-    ...!l && !f?.rowHeader ? Ce : {}
-  }), D = (l) => ({
-    ...ge,
-    ...!l && !f?.colGroup ? Me : {}
-  }), X = (l) => ({
     ...Se,
-    ...!l && !f?.colHeader ? De : {}
+    ...!l && !u?.rowHeader ? De : {}
+  }), D = (l) => ({
+    ...Ce,
+    ...!l && !u?.colGroup ? ke : {}
+  }), _ = (l) => ({
+    ...Me,
+    ...!l && !u?.colHeader ? ve : {}
   });
-  return /* @__PURE__ */ N(
+  return /* @__PURE__ */ R(
     "div",
     {
-      ref: p,
-      className: u,
-      style: be,
+      ref: h,
+      className: a,
+      style: xe,
       tabIndex: 0,
       onKeyDown: L,
-      children: /* @__PURE__ */ K("table", { style: ye, children: [
+      children: /* @__PURE__ */ K("table", { style: ge, children: [
         /* @__PURE__ */ K("thead", { children: [
-          c && o && /* @__PURE__ */ K("tr", { children: [
-            n && /* @__PURE__ */ N(
+          c && x && /* @__PURE__ */ K("tr", { children: [
+            n && /* @__PURE__ */ R(
               "th",
               {
-                colSpan: S ? 2 : 1,
-                className: f?.rowHeader,
+                colSpan: f ? 2 : 1,
+                className: u?.rowHeader,
                 style: H(),
                 children: y
               }
             ),
-            c.map((l, b) => /* @__PURE__ */ N(
+            c.map((l, b) => /* @__PURE__ */ R(
               "th",
               {
                 colSpan: l.headers.length,
-                className: B(f?.colGroup, l.className),
+                className: B(u?.colGroup, l.className),
                 style: D(l.className),
                 title: l.description,
                 children: l.label ?? ""
@@ -648,20 +651,20 @@ function Ie({
             ))
           ] }),
           c && /* @__PURE__ */ K("tr", { children: [
-            n && /* @__PURE__ */ N(
+            n && /* @__PURE__ */ R(
               "th",
               {
-                colSpan: S ? 2 : 1,
-                className: f?.rowHeader,
+                colSpan: f ? 2 : 1,
+                className: u?.rowHeader,
                 style: H(),
-                children: !o && y
+                children: !x && y
               }
             ),
-            i.map((l) => /* @__PURE__ */ N(
+            o.map((l) => /* @__PURE__ */ R(
               "th",
               {
-                className: B(f?.colHeader, l.className),
-                style: X(l.className),
+                className: B(u?.colHeader, l.className),
+                style: _(l.className),
                 title: l.description,
                 children: l.label
               },
@@ -669,45 +672,46 @@ function Ie({
             ))
           ] })
         ] }),
-        /* @__PURE__ */ N("tbody", { children: e.map((l, b) => {
-          const x = h?.[b];
+        /* @__PURE__ */ R("tbody", { children: e.map((l, b) => {
+          const g = C?.[b];
           return /* @__PURE__ */ K("tr", { children: [
-            x && /* @__PURE__ */ K(Z, { children: [
-              S && x.isFirstInGroup && /* @__PURE__ */ N(
+            g && /* @__PURE__ */ K(te, { children: [
+              f && g.isFirstInGroup && /* @__PURE__ */ R(
                 "td",
                 {
-                  rowSpan: x.groupRowCount,
-                  className: B(f?.rowHeader, x.groupClassName),
-                  style: H(x.groupClassName),
-                  title: x.groupDescription,
-                  children: x.groupLabel ?? ""
+                  rowSpan: g.groupRowCount,
+                  className: B(u?.rowHeader, g.groupClassName),
+                  style: H(g.groupClassName),
+                  title: g.groupDescription,
+                  children: g.groupLabel ?? ""
                 }
               ),
-              /* @__PURE__ */ N(
+              /* @__PURE__ */ R(
                 "td",
                 {
-                  className: B(f?.rowHeader, x.rowHeader.className),
-                  style: H(x.rowHeader.className),
-                  title: x.rowHeader.description,
-                  children: x.rowHeader.label
+                  className: B(u?.rowHeader, g.rowHeader.className),
+                  style: H(g.rowHeader.className),
+                  title: g.rowHeader.description,
+                  children: g.rowHeader.label
                 }
               )
             ] }),
-            l.map((T, W) => {
-              const A = { row: b, col: W }, _ = R(A), Q = E(A), Y = $(A);
-              return /* @__PURE__ */ N(
-                me,
+            l.map((A, W) => {
+              const T = { row: b, col: W }, J = N(T), Y = v(T), Z = X(T), ee = p?.(T);
+              return /* @__PURE__ */ R(
+                ye,
                 {
-                  coord: A,
-                  value: C(A),
-                  isSelected: _,
-                  isFillTarget: Q,
-                  showFillHandle: Y && !I,
-                  onMouseDown: F,
-                  onMouseEnter: P,
-                  onChange: V,
-                  onFillHandleMouseDown: v,
-                  styles: f
+                  coord: T,
+                  value: s(T),
+                  isSelected: J,
+                  isFillTarget: Y,
+                  showFillHandle: Z && !M,
+                  onMouseDown: r,
+                  onMouseEnter: V,
+                  onChange: $,
+                  onFillHandleMouseDown: E,
+                  styles: u,
+                  cellClassName: ee
                 },
                 W
               );
@@ -718,29 +722,29 @@ function Ie({
     }
   );
 }
-function ze(e) {
+function Ge(e) {
   const t = typeof e == "string" ? parseFloat(e.replace(/,/g, "")) : e;
   return isNaN(t) ? "0" : new Intl.NumberFormat("ko-KR").format(t);
 }
-function Le(e) {
+function Te(e) {
   const t = parseInt(e.replace(/,/g, ""), 10);
   return isNaN(t) ? 0 : t;
 }
 export {
-  Ie as ExcelGrid,
-  me as GridCell,
+  Le as ExcelGrid,
+  ye as GridCell,
   B as cn,
-  Ee as coordToKey,
-  ze as formatCurrency,
-  Ne as getCellsInRange,
-  Re as getFillTargetCells,
-  te as isCellInRange,
-  Fe as keyToCoord,
+  Fe as coordToKey,
+  Ge as formatCurrency,
+  Ie as getCellsInRange,
+  ze as getFillTargetCells,
+  ne as isCellInRange,
+  Re as keyToCoord,
   U as normalizeRange,
-  Le as parseCurrency,
-  oe as parseTSV,
-  ne as toTSV,
-  re as useGridClipboard,
-  ce as useGridDragFill,
-  le as useGridSelection
+  Te as parseCurrency,
+  le as parseTSV,
+  re as toTSV,
+  ce as useGridClipboard,
+  ae as useGridDragFill,
+  se as useGridSelection
 };