sud-ui 0.1.191 → 0.1.193

package/dist/index.js

@@ -922,7 +922,7 @@ const e1 = {
     const Z = n ? "#000000" : "#ffffff", i = n ? "#ffffff" : "#000000";
     document.body.style.backgroundColor = Z, document.body.style.color = i;
   }, [n]), /* @__PURE__ */ t.jsx(f2.Provider, { value: o, children: l });
-}, d0 = ({
+}, i0 = ({
   border: s = !0,
   fallback: c = "default",
   componentType: n = "button"
@@ -1042,7 +1042,7 @@ const e1 = {
   colorType: g = "default",
   style: Z = {}
 }) => {
-  const i = h0(), { txtColor: h, borColor: x } = d0({
+  const i = h0(), { txtColor: h, borColor: x } = i0({
     border: o,
     fallback: g
   }), C = a ? L(a, i) : h, j = d ? L(d, i) : x, F = o && j ? `${n}px ${l} ${j}` : "none", M = () => s ? c === "left" ? { justifyContent: "flex-start" } : c === "right" ? { justifyContent: "flex-end" } : { justifyContent: "center" } : {};
@@ -1147,15 +1147,15 @@ const e1 = {
     (U) => {
       if (u || O(U), g == null || g(U), !U && (r(!1), w.current)) {
         const Q = j1.get(w.current);
-        Q && Q.forEach((o0) => {
-          var j0, a0;
+        Q && Q.forEach((d0) => {
+          var j0, o0;
           const m0 = Array.from(F1).find(
             (k0) => {
               var $0, _0;
-              return ((_0 = ($0 = k0.current) == null ? void 0 : $0.popupInstance) == null ? void 0 : _0.id) === o0;
+              return ((_0 = ($0 = k0.current) == null ? void 0 : $0.popupInstance) == null ? void 0 : _0.id) === d0;
             }
           );
-          (a0 = (j0 = m0 == null ? void 0 : m0.current) == null ? void 0 : j0.popupInstance) != null && a0.hide && m0.current.popupInstance.hide();
+          (o0 = (j0 = m0 == null ? void 0 : m0.current) == null ? void 0 : j0.popupInstance) != null && o0.hide && m0.current.popupInstance.hide();
         });
       }
     },
@@ -1170,55 +1170,55 @@ const e1 = {
   z0(() => {
     if (l !== "click" || !b) return;
     const U = (Q) => {
-      var o0, m0;
-      !((o0 = A.current) != null && o0.contains(Q.target)) && !((m0 = w.current) != null && m0.contains(Q.target)) && D();
+      var d0, m0;
+      !((d0 = A.current) != null && d0.contains(Q.target)) && !((m0 = w.current) != null && m0.contains(Q.target)) && D();
     };
     return document.addEventListener("click", U, !0), () => document.removeEventListener("mousedown", U);
   }, [l, b, D]);
-  const { bgColor: K, txtColor: W, borColor: q } = d0({
+  const { bgColor: K, txtColor: W, borColor: q } = i0({
     border: j,
     fallback: N
   }), J = x ? L(x, I) : K, p0 = C ? L(C, I) : W, x0 = F ? L(F, I) : q, b0 = j && x0 ? `${p}px ${M} ${x0}` : "none", y0 = O0(_, I), S0 = I0(S), B0 = F0(() => {
     if (!A.current || !w.current) return {};
-    const U = A.current.getBoundingClientRect(), Q = w.current.getBoundingClientRect(), o0 = window.scrollY || document.documentElement.scrollTop, m0 = window.scrollX || document.documentElement.scrollLeft, j0 = {
+    const U = A.current.getBoundingClientRect(), Q = w.current.getBoundingClientRect(), d0 = window.scrollY || document.documentElement.scrollTop, m0 = window.scrollX || document.documentElement.scrollLeft, j0 = {
       position: "absolute",
       zIndex: 1e3,
       transition: "opacity 0.2s ease"
     };
-    let a0 = {};
+    let o0 = {};
     switch (o) {
       case "top":
-        a0 = {
-          top: U.top - Q.height - c1 - z1 + o0,
+        o0 = {
+          top: U.top - Q.height - c1 - z1 + d0,
           left: U.left + U.width / 2 + m0,
           transform: "translateX(-50%)"
         };
         break;
       case "bottom":
-        a0 = {
-          top: U.bottom + c1 + z1 + o0,
+        o0 = {
+          top: U.bottom + c1 + z1 + d0,
           left: U.left + U.width / 2 + m0,
           transform: "translateX(-50%)"
         };
         break;
       case "left":
-        a0 = {
-          top: U.top + U.height / 2 + o0,
+        o0 = {
+          top: U.top + U.height / 2 + d0,
           left: U.left - Q.width - c1 - z1 + m0,
           transform: "translateY(-50%)"
         };
         break;
       case "right":
-        a0 = {
-          top: U.top + U.height / 2 + o0,
+        o0 = {
+          top: U.top + U.height / 2 + d0,
           left: U.right + c1 + z1 + m0,
           transform: "translateY(-50%)"
         };
         break;
       default:
-        a0 = {};
+        o0 = {};
     }
-    return { ...j0, ...a0 };
+    return { ...j0, ...o0 };
   }, [o]);
   w1(() => {
     if (b && w.current && A.current && !T) {
@@ -1239,14 +1239,14 @@ const e1 = {
     if (!b || !B) return;
     let U;
     const Q = () => {
-      const o0 = B0();
-      f((m0) => ({ ...m0, ...o0 })), U = requestAnimationFrame(Q);
+      const d0 = B0();
+      f((m0) => ({ ...m0, ...d0 })), U = requestAnimationFrame(Q);
     };
     return Q(), () => cancelAnimationFrame(U);
   }, [b, B, B0]);
   const X = F0(
     ({ type: U = "background" }) => {
-      const Q = U === "border", o0 = x0 && p > 0, m0 = c1 * 2 + (o0 ? p * 2 : 0), j0 = Math.sqrt(p * p * 2), a0 = !Q && o0 ? j0 : 0, k0 = {
+      const Q = U === "border", d0 = x0 && p > 0, m0 = c1 * 2 + (d0 ? p * 2 : 0), j0 = Math.sqrt(p * p * 2), o0 = !Q && d0 ? j0 : 0, k0 = {
         bottom: `linear-gradient(135deg, ${J} 50%, transparent 50%)`,
         top: `linear-gradient(-45deg, ${J} 50%, transparent 50%)`,
         left: `linear-gradient(225deg, ${J} 50%, transparent 50%)`,
@@ -1264,22 +1264,22 @@ const e1 = {
         boxShadow: Q ? y0 : void 0
       }, _0 = {
         bottom: {
-          top: `-${c1 - a0}px`,
+          top: `-${c1 - o0}px`,
           left: "50%",
           transform: "translateX(-50%) rotate(45deg)"
         },
         top: {
-          bottom: `-${c1 - a0}px`,
+          bottom: `-${c1 - o0}px`,
           left: "50%",
           transform: "translateX(-50%) rotate(45deg)"
         },
         right: {
-          left: `-${c1 - a0}px`,
+          left: `-${c1 - o0}px`,
           top: "50%",
           transform: "translateY(-50%) rotate(45deg)"
         },
         left: {
-          right: `-${c1 - a0}px`,
+          right: `-${c1 - o0}px`,
           top: "50%",
           transform: "translateY(-50%) rotate(45deg)"
         }
@@ -1299,9 +1299,9 @@ const e1 = {
     if (l !== "hover") return;
     const U = (Q) => {
       var k0, $0;
-      const o0 = document.elementFromPoint(Q.clientX, Q.clientY), m0 = (k0 = A.current) == null ? void 0 : k0.contains(o0), j0 = ($0 = w.current) == null ? void 0 : $0.contains(o0), a0 = L2(
+      const d0 = document.elementFromPoint(Q.clientX, Q.clientY), m0 = (k0 = A.current) == null ? void 0 : k0.contains(d0), j0 = ($0 = w.current) == null ? void 0 : $0.contains(d0), o0 = L2(
         w,
-        o0,
+        d0,
         D1,
         F1
       );
@@ -1309,7 +1309,7 @@ const e1 = {
         m0 && P();
         return;
       }
-      !m0 && !j0 && !a0 ? v.current || (v.current = setTimeout(() => {
+      !m0 && !j0 && !o0 ? v.current || (v.current = setTimeout(() => {
         D();
       }, 100)) : (clearTimeout(v.current), v.current = null);
     };
@@ -1463,7 +1463,7 @@ const e1 = {
   onKeyDown: S,
   tabIndex: _ = 0
 }) => {
-  const N = h0(), k = e2[o] || e2.md, { bgColor: B, txtColor: $, borColor: R } = d0({
+  const N = h0(), k = e2[o] || e2.md, { bgColor: B, txtColor: $, borColor: R } = i0({
     border: i,
     componentType: "tag",
     fallback: d
@@ -1672,7 +1672,7 @@ const t2 = {
   children: p,
   "aria-label": S
 }) => {
-  const _ = h0(), { bgColor: N, txtColor: k, borColor: B } = d0({
+  const _ = h0(), { bgColor: N, txtColor: k, borColor: B } = i0({
     border: Z,
     fallback: a,
     componentType: "tag"
@@ -2129,7 +2129,7 @@ const n0 = /* @__PURE__ */ F2(A2), r2 = {
   ariaControls: $,
   role: R = "button"
 }) => {
-  const H = h0(), I = f0(), { bgColor: z, txtColor: O, borColor: A } = d0({
+  const H = h0(), I = f0(), { bgColor: z, txtColor: O, borColor: A } = i0({
     border: S,
     fallback: x ? "disabled" : c
   }), V = n ? L(n, H) : z, w = l ? L(l, H) : O, v = o ? L(o, H) : A, m = S && v ? `${d}px ${a} ${v}` : "none", y = I0(M, H), f = O0(p, H);
@@ -3096,7 +3096,7 @@ const X2 = P0.DocumentOutline, G2 = {
     /* @__PURE__ */ e.jsx("path", { d: "M9,10h6c.5522461,0,1-.4477539,1-1s-.4477539-1-1-1h-6c-.5522461,0-1,.4477539-1,1s.4477539,1,1,1Z" }),
     /* @__PURE__ */ e.jsx("path", { d: "M9,13h6c.5522461,0,1-.4477539,1-1s-.4477539-1-1-1h-6c-.5522461,0-1,.4477539-1,1s.4477539,1,1,1Z" })
   ] })
-}, i0 = Object.entries(G2).reduce((s, [c, n]) => {
+}, a0 = Object.entries(G2).reduce((s, [c, n]) => {
   const l = ({ size: o = 24, color: a, style: d = {}, ...g }) => /* @__PURE__ */ e.jsx(
     "svg",
     {
@@ -3113,51 +3113,51 @@ const X2 = P0.DocumentOutline, G2 = {
   );
   return l.displayName = c, s[c] = l, s;
 }, {});
-i0.FolderFill;
-i0.FolderOutline;
-i0.FolderOpenFill;
-i0.FolderOpenOutline;
-i0.FolderPlusFill;
-i0.FolderPlusOutline;
-i0.FolderMinusFill;
-i0.FolderMinusOutline;
-i0.CloudOutline;
-i0.CloudFill;
-i0.CloudDownload;
-i0.CloudUpload;
-i0.CameraFill;
-i0.CameraOutline;
-const K2 = i0.PhotoFill;
-i0.PhotoOutline;
-i0.VideoFill;
-i0.VideoOutline;
-i0.VideoSlashFill;
-i0.VideoSlashOutline;
-i0.MicFill;
-i0.MicOutline;
-i0.MicMuteOutline;
-i0.MicMuteFill;
-i0.At;
-i0.AtCircleFill;
-i0.AtCircleOutline;
-i0.Attach;
-i0.BuildFill;
-i0.BuildOutline;
-i0.BulbFill;
-i0.BulbOutline;
-i0.Code;
-i0.CodeBoxFill;
-i0.CodeBoxOutline;
-i0.ColorFill;
-i0.ColorOutline;
-i0.Link;
-i0.LinkAlt;
-i0.MusicFill;
-i0.MusicOutline;
-const q2 = i0.FileTrayFill;
-i0.FileTrayOutline;
-i0.FileTrayDocumentFill;
-i0.FileTrayDocumentOutline;
+a0.FolderFill;
+a0.FolderOutline;
+a0.FolderOpenFill;
+a0.FolderOpenOutline;
+a0.FolderPlusFill;
+a0.FolderPlusOutline;
+a0.FolderMinusFill;
+a0.FolderMinusOutline;
+a0.CloudOutline;
+a0.CloudFill;
+a0.CloudDownload;
+a0.CloudUpload;
+a0.CameraFill;
+a0.CameraOutline;
+const K2 = a0.PhotoFill;
+a0.PhotoOutline;
+a0.VideoFill;
+a0.VideoOutline;
+a0.VideoSlashFill;
+a0.VideoSlashOutline;
+a0.MicFill;
+a0.MicOutline;
+a0.MicMuteOutline;
+a0.MicMuteFill;
+a0.At;
+a0.AtCircleFill;
+a0.AtCircleOutline;
+a0.Attach;
+a0.BuildFill;
+a0.BuildOutline;
+a0.BulbFill;
+a0.BulbOutline;
+a0.Code;
+a0.CodeBoxFill;
+a0.CodeBoxOutline;
+a0.ColorFill;
+a0.ColorOutline;
+a0.Link;
+a0.LinkAlt;
+a0.MusicFill;
+a0.MusicOutline;
+const q2 = a0.FileTrayFill;
+a0.FileTrayOutline;
+a0.FileTrayDocumentFill;
+a0.FileTrayDocumentOutline;
 const J2 = {
   CheckBoxFill: [
     /* @__PURE__ */ e.jsx("g", { children: /* @__PURE__ */ e.jsx("path", { d: "M18,3H6c-1.7,0-3,1.3-3,3v12c0,1.7,1.3,3,3,3h12c1.7,0,3-1.3,3-3V6c0-1.7-1.3-3-3-3ZM16.2,11.2l-5,5c-.2.2-.5.3-.7.3s-.5,0-.7-.3l-3-3c-.4-.4-.4-1,0-1.4.4-.4,1-.4,1.4,0l2.3,2.3,4.3-4.3c.4-.4,1-.4,1.4,0s.4,1,0,1.4Z" }) }, "1")
@@ -5709,7 +5709,7 @@ const Z1 = ({
   // 기본값 sm
   style: p = {}
 }) => {
-  const S = h0(), { bgColor: _, txtColor: N, borColor: k } = d0({
+  const S = h0(), { bgColor: _, txtColor: N, borColor: k } = i0({
     border: F,
     fallback: c,
     componentType: "tag"
@@ -5885,7 +5885,7 @@ const Z1 = ({
   }, U = () => {
     var e0;
     x(z ? [] : null), b(""), (e0 = J.current) == null || e0.focus();
-  }, { bgColor: Q, txtColor: o0, borColor: m0 } = d0({
+  }, { bgColor: Q, txtColor: d0, borColor: m0 } = i0({
     border: n,
     fallback: k ? "danger" : S,
     componentType: "input"
@@ -5896,7 +5896,7 @@ const Z1 = ({
   );
   const j0 = s ? L(s, f) : Q;
   console.log("finalBgColor:", j0);
-  const a0 = c ? L(c, f) : o0, k0 = l ? L(l, f) : m0, $0 = n && k0 ? `${a}px ${o} ${k0}` : "none", _0 = I0(C, f), L0 = O0(j, f), D0 = {
+  const o0 = c ? L(c, f) : d0, k0 = l ? L(l, f) : m0, $0 = n && k0 ? `${a}px ${o} ${k0}` : "none", _0 = I0(C, f), L0 = O0(j, f), D0 = {
     sm: { height: 32, fontSize: 14, padding: "4px" },
     md: { height: 38, fontSize: 16, padding: "6px" },
     lg: { height: 42, fontSize: 18, padding: "8px" }
@@ -5954,7 +5954,7 @@ const Z1 = ({
               display: "flex",
               alignItems: "center",
               backgroundColor: $ ? L("cool-gray-1", f) : j0,
-              color: $ ? L("cool-gray-3", f) : a0,
+              color: $ ? L("cool-gray-3", f) : o0,
               ..._0,
               width: "100%",
               maxWidth: "100%",
@@ -6027,7 +6027,7 @@ const Z1 = ({
                               outline: "none",
                               background: "transparent",
                               fontSize: D0.fontSize,
-                              color: a0,
+                              color: o0,
                               flexGrow: 1,
                               minWidth: 60
                             }
@@ -6051,7 +6051,7 @@ const Z1 = ({
                         border: "none",
                         outline: "none",
                         fontSize: D0.fontSize,
-                        color: a0
+                        color: o0
                       }
                     }
                   )
@@ -6119,7 +6119,7 @@ const Z1 = ({
               border: $0,
               borderRadius: 6,
               boxShadow: O0("md", f),
-              color: a0,
+              color: o0,
               zIndex: 100,
               background: j0,
               ...H
@@ -6203,7 +6203,7 @@ const Z1 = ({
   className: p = "",
   name: S = "segmented-control"
 }) => {
-  const _ = h0(), N = (z) => typeof z == "object" ? z.value : z, k = (z) => typeof z == "object" ? z.label : z, B = (z) => typeof z == "object" && z.disabled, { bgColor: $ } = d0({
+  const _ = h0(), N = (z) => typeof z == "object" ? z.value : z, k = (z) => typeof z == "object" ? z.label : z, B = (z) => typeof z == "object" && z.disabled, { bgColor: $ } = i0({
     fallback: "hovered",
     componentType: "etc"
   }), R = I0(F, _), H = O0(j, _), I = (z, O) => {
@@ -6330,7 +6330,7 @@ const Z1 = ({
   }, Q = (c0, g0, U0) => {
     const Z0 = n0(new Date(c0, g0, U0));
     p0(c0), b0(g0), S0(U0), y(Z0), D(Z0);
-  }, o0 = n0().year(), m0 = Array.from({ length: 201 }, (c0, g0) => o0 - 100 + g0), j0 = Array.from({ length: 12 }, (c0, g0) => g0), a0 = m.daysInMonth(), k0 = Array.from({ length: a0 }, (c0, g0) => g0 + 1);
+  }, d0 = n0().year(), m0 = Array.from({ length: 201 }, (c0, g0) => d0 - 100 + g0), j0 = Array.from({ length: 12 }, (c0, g0) => g0), o0 = m.daysInMonth(), k0 = Array.from({ length: o0 }, (c0, g0) => g0 + 1);
   z0(() => {
     s && (D(n0(s)), y(n0(s)));
   }, [s]), z0(() => {
@@ -6355,11 +6355,11 @@ const Z1 = ({
       c0.push({ date: n1.toDate(), inCurrentMonth: a1 });
     }
     return c0;
-  }, [m]), { bgColor: D0, txtColor: H0, borColor: Y0 } = d0({
+  }, [m]), { bgColor: D0, txtColor: H0, borColor: Y0 } = i0({
     border: M,
     fallback: h,
     componentType: "tag"
-  }), { bgColor: t1 } = d0({
+  }), { bgColor: t1 } = i0({
     border: !1,
     fallback: x,
     componentType: "etc"
@@ -6893,7 +6893,7 @@ const Z1 = ({
   // "card" | "drawer" | "modal" | "notification" | "toast"
   divider: N = !1
 }) => {
-  const k = h0(), { bgColor: B, txtColor: $, borColor: R } = d0({
+  const k = h0(), { bgColor: B, txtColor: $, borColor: R } = i0({
     border: g,
     fallback: o
   }), H = a ? L(a, k) : B, I = d ? L(d, k) : $, z = Z ? L(Z, k) : R, O = g && z ? `${h}px ${i} ${z}` : "none", A = _ === "drawer" ? {} : I0(x, k), V = O0(C, k), w = k.spacing || {
@@ -7214,13 +7214,13 @@ const Z1 = ({
     bgColor: I,
     borColor: z,
     txtColor: O
-  } = d0({
+  } = i0({
     border: !0,
     fallback: Z
-  }), { bgColor: A, txtColor: V } = d0({
+  }), { bgColor: A, txtColor: V } = i0({
     border: !1,
     fallback: x
-  }), w = i ? L(i, k) : I, v = h ? L(h, k) : O, m = a ? L(a, k) : z, y = C ? L(C, k) : A, f = j ? L(j, k) : V, T = o && m ? `${g}px ${d} ${m}` : "none", { bgColor: r, txtColor: u } = d0({
+  }), w = i ? L(i, k) : I, v = h ? L(h, k) : O, m = a ? L(a, k) : z, y = C ? L(C, k) : A, f = j ? L(j, k) : V, T = o && m ? `${g}px ${d} ${m}` : "none", { bgColor: r, txtColor: u } = i0({
     border: !1,
     fallback: "disabled"
   }), b = O0(F, k), E = I0(_, k), P = k.spacing[S] || k.spacing.md, D = k.typography.fontSize[S === "md" ? "base" : S] || k.typography.fontSize.base;
@@ -7897,13 +7897,13 @@ const Z1 = ({
     bgColor: z,
     txtColor: O,
     borColor: A
-  } = d0({
+  } = i0({
     border: i,
     fallback: d
-  }), { borColor: V } = d0({
+  }), { borColor: V } = i0({
     border: i,
     fallback: "default"
-  }), { bgColor: w, txtColor: v } = d0({
+  }), { bgColor: w, txtColor: v } = i0({
     fallback: "hovered",
     componentType: "etc"
   }), m = p.find((b) => b.key === k), y = g ? L(g, M) : z, f = Z ? L(Z, M) : O, T = h ? L(h, M) : A, r = i && T ? `${C}px ${x} ${T}` : "none";
@@ -8060,7 +8060,7 @@ const c4 = ({
   style: c = {},
   className: n = ""
 }) => {
-  const { bgColor: l } = d0({
+  const { bgColor: l } = i0({
     border: !1,
     fallback: "etc",
     componentType: "hovered"
@@ -8235,7 +8235,7 @@ const c4 = ({
   text: n = !1,
   style: l = {}
 }) => {
-  const { txtColor: o } = d0({
+  const { txtColor: o } = i0({
     fallback: c,
     componentType: "tag"
   }), a = o, d = [
@@ -8707,7 +8707,7 @@ const y2 = J0.memo(
     delay: j = 0
   }) => {
     var A, V;
-    const F = h0(), M = L(c, F), { txtColor: p, borColor: S } = d0({
+    const F = h0(), M = L(c, F), { txtColor: p, borColor: S } = i0({
       border: !0,
       fallback: "default"
     }), _ = f0(), N = f0(), [k, B] = G(0);
@@ -8944,7 +8944,7 @@ const n4 = ({
     bgColor: V,
     txtColor: w,
     borColor: v
-  } = d0({
+  } = i0({
     fallback: o,
     componentType: "button",
     border: g
@@ -8962,12 +8962,12 @@ const n4 = ({
     if (!R) return c;
     const { columnKey: X, order: U } = R, Q = s.find((j0) => (j0.dataIndex || j0.key) === X);
     if (!Q) return c;
-    const o0 = Q.sorter === !0 ? (j0, a0) => {
-      const k0 = j0[X], $0 = a0[X];
+    const d0 = Q.sorter === !0 ? (j0, o0) => {
+      const k0 = j0[X], $0 = o0[X];
       return typeof k0 == "number" ? k0 - $0 : String(k0).localeCompare(String($0));
     } : Q.sorter;
-    return [...c].sort((j0, a0) => {
-      const k0 = o0(j0, a0);
+    return [...c].sort((j0, o0) => {
+      const k0 = d0(j0, o0);
       return U === "ascend" ? k0 : -k0;
     });
   }, [c, R, s]), D = T0(() => {
@@ -8979,8 +8979,8 @@ const n4 = ({
       const U = X.dataIndex || X.key;
       let Q = null;
       !R || R.columnKey !== U ? Q = "ascend" : R.order === "ascend" ? Q = "descend" : R.order === "descend" && (Q = null);
-      const o0 = Q ? { columnKey: U, order: Q } : null;
-      H(o0), k && k({}, {}, o0);
+      const d0 = Q ? { columnKey: U, order: Q } : null;
+      H(d0), k && k({}, {}, d0);
     },
     [R, k]
   ), K = F0(
@@ -9002,8 +9002,8 @@ const n4 = ({
   z0(() => {
     const X = q.current, U = J.current;
     if (U && X) {
-      const o0 = U.scrollHeight > U.clientHeight ? U.offsetWidth - U.clientWidth : 0;
-      x0(o0);
+      const d0 = U.scrollHeight > U.clientHeight ? U.offsetWidth - U.clientWidth : 0;
+      x0(d0);
     }
   }, [P, S]);
   const b0 = T0(
@@ -9022,10 +9022,10 @@ const n4 = ({
     const X = s.reduce((U, Q) => U + (Q.col || (Q.width ? 0 : 1)), 0);
     return s.map((U) => {
       if (U.width) return U;
-      const Q = U.col || 1, o0 = X ? `${Q / X * 100}%` : "auto";
+      const Q = U.col || 1, d0 = X ? `${Q / X * 100}%` : "auto";
       return {
         ...U,
-        width: typeof o0 == "string" ? o0 : String(o0)
+        width: d0
       };
     });
   }, [s]), B0 = F0(
@@ -9064,9 +9064,18 @@ const n4 = ({
                 },
                 role: "presentation",
                 children: [
-                  /* @__PURE__ */ t.jsx("colgroup", { children: S0.map((X, U) => /* @__PURE__ */ t.jsx("col", { style: { width: X.width } }, U)) }),
+                  /* @__PURE__ */ t.jsx("colgroup", { children: S0.map((X, U) => /* @__PURE__ */ t.jsx(
+                    "col",
+                    {
+                      style: {
+                        width: X.width || "auto",
+                        minWidth: X.width || "auto"
+                      }
+                    },
+                    U
+                  )) }),
                   /* @__PURE__ */ t.jsx("thead", { children: /* @__PURE__ */ t.jsx("tr", { children: S0.map((X, U) => {
-                    const Q = X.dataIndex || X.key, o0 = (R == null ? void 0 : R.columnKey) === Q, m0 = o0 ? R.order : null, j0 = X.align || "left";
+                    const Q = X.dataIndex || X.key, d0 = (R == null ? void 0 : R.columnKey) === Q, m0 = d0 ? R.order : null, j0 = X.align || "left";
                     return /* @__PURE__ */ t.jsx(
                       "th",
                       {
@@ -9074,7 +9083,7 @@ const n4 = ({
                         className: l0(
                           "sud-table__header-cell",
                           X.sorter && "sud-table__header-cell--sortable",
-                          o0 && `sud-table__header-cell--sorted-${m0}`,
+                          d0 && `sud-table__header-cell--sorted-${m0}`,
                           X.className
                         ),
                         style: {
@@ -9089,10 +9098,10 @@ const n4 = ({
                           cursor: X.sorter ? "pointer" : "default"
                         },
                         role: "columnheader",
-                        "aria-sort": o0 ? m0 === "ascend" ? "ascending" : "descending" : "none",
+                        "aria-sort": d0 ? m0 === "ascend" ? "ascending" : "descending" : "none",
                         tabIndex: X.sorter ? 0 : -1,
-                        onKeyDown: (a0) => B0(a0, X),
-                        "aria-label": `${X.title} ${o0 ? m0 === "ascend" ? "오름차순 정렬됨" : "내림차순 정렬됨" : ""}`,
+                        onKeyDown: (o0) => B0(o0, X),
+                        "aria-label": `${X.title} ${d0 ? m0 === "ascend" ? "오름차순 정렬됨" : "내림차순 정렬됨" : ""}`,
                         children: /* @__PURE__ */ t.jsxs(
                           "div",
                           {
@@ -9186,9 +9195,18 @@ const n4 = ({
                 },
                 role: "presentation",
                 children: [
-                  /* @__PURE__ */ t.jsx("colgroup", { children: S0.map((X, U) => /* @__PURE__ */ t.jsx("col", { style: { width: X.width } }, U)) }),
+                  /* @__PURE__ */ t.jsx("colgroup", { children: S0.map((X, U) => /* @__PURE__ */ t.jsx(
+                    "col",
+                    {
+                      style: {
+                        width: X.width || "auto",
+                        minWidth: X.width || "auto"
+                      }
+                    },
+                    U
+                  )) }),
                   /* @__PURE__ */ t.jsx("tbody", { children: D.map((X, U) => {
-                    const Q = E(X, U), o0 = L(X.background, $) || "transparent", m0 = L(X.color, $) || "inherit", j0 = L(X.borderColor, $) || m, a0 = g ? `${h}px ${i} ${j0}` : "none";
+                    const Q = E(X, U), d0 = L(X.background, $) || "transparent", m0 = L(X.color, $) || "inherit", j0 = L(X.borderColor, $) || m, o0 = g ? `${h}px ${i} ${j0}` : "none";
                     return /* @__PURE__ */ t.jsx(
                       "tr",
                       {
@@ -9212,11 +9230,11 @@ const n4 = ({
                               ),
                               style: {
                                 textAlign: D0,
-                                background: o0,
+                                background: d0,
                                 color: m0,
-                                borderBottom: a0,
-                                borderLeft: $0 === 0 ? void 0 : a0,
-                                borderRight: $0 === s.length - 1 ? void 0 : a0,
+                                borderBottom: o0,
+                                borderLeft: $0 === 0 ? void 0 : o0,
+                                borderRight: $0 === s.length - 1 ? void 0 : o0,
                                 fontSize: T.fontSize,
                                 padding: b
                               },
@@ -9279,7 +9297,7 @@ function V1({
   ariaInvalid: C,
   ariaDescribedby: j
 }) {
-  const F = h0(), { bgColor: M } = d0({
+  const F = h0(), { bgColor: M } = i0({
     border: !1,
     fallback: g
   }), p = a ? L(a, F) : M, [S, _] = G(c || !1), [N, k] = G(!1), B = s !== void 0, $ = B ? s : S, R = l === "top" || l === "bottom", H = f0(), I = f0(), z = N || $ ? p : L("cool-gray-3", F), O = (A) => {
@@ -9454,7 +9472,7 @@ const E0 = ({
   ariaDescribedby: E,
   onClick: P
 }) => {
-  const D = h0(), { bgColor: Y, txtColor: K, borColor: W } = d0({
+  const D = h0(), { bgColor: Y, txtColor: K, borColor: W } = i0({
     border: n,
     fallback: T ? "danger" : m,
     componentType: "input"
@@ -9695,7 +9713,7 @@ const E0 = ({
   errorText: w,
   error: v = !1
 }) => {
-  const m = h0(), { bgColor: y, txtColor: f, borColor: T } = d0({
+  const m = h0(), { bgColor: y, txtColor: f, borColor: T } = i0({
     border: n,
     fallback: v ? "danger" : V,
     componentType: "input"
@@ -9895,7 +9913,7 @@ const _9 = ({
   errorText: $,
   error: R = !1
 }) => {
-  const H = h0(), I = f0([]), { bgColor: z, txtColor: O, borColor: A } = d0({
+  const H = h0(), I = f0([]), { bgColor: z, txtColor: O, borColor: A } = i0({
     border: n,
     fallback: R ? "danger" : k,
     componentType: "input"
@@ -10059,7 +10077,7 @@ const a2 = ({
   ariaLabel: A,
   ariaValueText: V
 }) => {
-  const w = h0(), v = f0(null), m = f0(null), [y, f] = G(!1), [T, r] = G(n), u = p2(), b = O || u, { bgColor: E, borColor: P } = d0({
+  const w = h0(), v = f0(null), m = f0(null), [y, f] = G(!1), [T, r] = G(n), u = p2(), b = O || u, { bgColor: E, borColor: P } = i0({
     border: Z,
     fallback: S,
     componentType: "button"
@@ -10091,17 +10109,17 @@ const a2 = ({
     [s, c, l, o, a]
   ), Q = (_0) => {
     d || (f(!0), S1(m.current), U(_0.clientX, _0.clientY));
-  }, o0 = (_0) => {
+  }, d0 = (_0) => {
     !y || d || U(_0.clientX, _0.clientY);
   }, m0 = () => {
     d || f(!1);
   };
   z0(() => {
     if (y)
-      return window.addEventListener("mousemove", o0), window.addEventListener("mouseup", m0), () => {
-        window.removeEventListener("mousemove", o0), window.removeEventListener("mouseup", m0);
+      return window.addEventListener("mousemove", d0), window.addEventListener("mouseup", m0), () => {
+        window.removeEventListener("mousemove", d0), window.removeEventListener("mouseup", m0);
       };
-  }, [y, o0]);
+  }, [y, d0]);
   const j0 = (_0) => {
     if (d) return;
     let L0 = T;
@@ -10130,7 +10148,7 @@ const a2 = ({
         return;
     }
     r(L0), o == null || o(L0);
-  }, a0 = a ? {
+  }, o0 = a ? {
     position: "absolute",
     left: 0,
     width: "100%",
@@ -10214,7 +10232,7 @@ const a2 = ({
                   className: "su-hover sud-slider__filled",
                   style: {
                     borderRadius: a ? S0 / 2 : B0 / 2,
-                    ...a0
+                    ...o0
                   }
                 }
               ),
@@ -10919,7 +10937,7 @@ function P1({
   ariaRequired: x,
   name: C
 }) {
-  const j = h0(), { bgColor: F } = d0({
+  const j = h0(), { bgColor: F } = i0({
     border: !1,
     fallback: g
   }), M = a ? L(a, j) : F, [p, S] = G(c || !1), [_, N] = G(!1), k = s !== void 0, B = k ? s : p, $ = l === "top" || l === "bottom", R = f0(), H = f0(), I = _ || B ? M : L("cool-gray-3", j), z = (O) => {
@@ -11070,7 +11088,7 @@ const i4 = ({
   testId: p = "rate",
   icon: S = "star"
 }) => {
-  const _ = h0(), [N, k] = G(n), [B, $] = G(null), R = l !== void 0, H = R ? l : N, I = T0(() => !i && typeof S == "string" ? S === "heart" ? "coral" : "gold" : i || "gold", [i, S]), { bgColor: z } = d0({
+  const _ = h0(), [N, k] = G(n), [B, $] = G(null), R = l !== void 0, H = R ? l : N, I = T0(() => !i && typeof S == "string" ? S === "heart" ? "coral" : "gold" : i || "gold", [i, S]), { bgColor: z } = i0({
     fallback: "hovered",
     componentType: "etc"
   }), O = T0(
@@ -11209,7 +11227,7 @@ const i4 = ({
     k || N(r), n == null || n(r), $.current && U1($.current), S1(T.currentTarget);
   }, z = (T) => {
     l || (T.key === "Enter" || T.key === " ") && (T.preventDefault(), I(T));
-  }, O = O0(h, S), { bgColor: A } = d0({
+  }, O = O0(h, S), { bgColor: A } = i0({
     border: !1,
     fallback: C,
     componentType: "button"
@@ -11389,11 +11407,11 @@ const i4 = ({
   }, T = (D) => {
     const Y = { ...A }, K = p && h === 1 ? "endTime" : "startTime";
     Y[K].ampm = D, V(Y);
-  }, { bgColor: r, txtColor: u } = d0({
+  }, { bgColor: r, txtColor: u } = i0({
     border: !1,
     fallback: d,
     componentType: "tag"
-  }), { bgColor: b } = d0({
+  }), { bgColor: b } = i0({
     border: !1,
     fallback: g,
     componentType: "etc"
@@ -11667,7 +11685,7 @@ const E1 = {
       clearTimeout(h), clearTimeout(x);
     };
   }, [s, l, o]);
-  const { bgColor: Z } = d0({
+  const { bgColor: Z } = i0({
     border: !1,
     fallback: c
   }), i = g.spacing;
@@ -11811,14 +11829,14 @@ const E1 = {
   listHoverColorType: x0 = "sky",
   listDeleteColorType: b0 = "rose"
 }) => {
-  const y0 = h0(), S0 = f0(), [B0, X] = G(g), [U, Q] = G(!1), [o0, m0] = G(!1), j0 = d !== void 0, a0 = j0 ? d : B0, k0 = f0(/* @__PURE__ */ new Set());
+  const y0 = h0(), S0 = f0(), [B0, X] = G(g), [U, Q] = G(!1), [d0, m0] = G(!1), j0 = d !== void 0, o0 = j0 ? d : B0, k0 = f0(/* @__PURE__ */ new Set());
   z0(() => () => {
     k0.current.forEach((M0) => URL.revokeObjectURL(M0)), k0.current.clear();
   }, []);
   const $0 = F0((M0) => {
     const w0 = URL.createObjectURL(M0);
     return k0.current.add(w0), w0;
-  }, []), _0 = d0({
+  }, []), _0 = i0({
     fallback: a ? "disabled" : I,
     border: E
   }), L0 = I0(u, y0), D0 = O0(b, y0), H0 = z ? L(z, y0) : _0.bgColor, Y0 = O ? L(O, y0) : _0.txtColor, t1 = A ? L(A, y0) : _0.borColor, o1 = {
@@ -11832,7 +11850,7 @@ const E1 = {
     a || (M0 = S0.current) == null || M0.click();
   }, R0 = async (M0) => {
     let w0 = Array.from(M0.target.files || []);
-    if (o && a0.length + w0.length > o && (E1.danger(`최대 ${o}개의 파일만 업로드할 수 있습니다.`), w0 = w0.slice(0, o - a0.length)), i) {
+    if (o && o0.length + w0.length > o && (E1.danger(`최대 ${o}개의 파일만 업로드할 수 있습니다.`), w0 = w0.slice(0, o - o0.length)), i) {
       Q(!0);
       try {
         if (await i(w0) === !1) {
@@ -11844,14 +11862,14 @@ const E1 = {
         return;
       }
     }
-    const Q0 = l ? [...a0, ...w0] : w0;
+    const Q0 = l ? [...o0, ...w0] : w0;
     j0 || X(Q0), h(Q0), Q(!1), S0.current && (S0.current.value = "");
   }, W0 = F0(
     (M0) => {
-      const w0 = a0.filter((Q0, l1) => l1 !== M0);
+      const w0 = o0.filter((Q0, l1) => l1 !== M0);
       j0 || X(w0), x == null || x(w0);
     },
-    [a0, j0, x]
+    [o0, j0, x]
   ), X0 = {
     children: H,
     colorType: I,
@@ -11924,7 +11942,7 @@ const E1 = {
               if (M0.preventDefault(), a || U) return;
               let w0 = Array.from(M0.dataTransfer.files || []);
               o && (w0 = w0.slice(0, o));
-              const Q0 = l ? [...a0, ...w0] : w0;
+              const Q0 = l ? [...o0, ...w0] : w0;
               j0 || X(Q0), h(Q0);
             },
             onDragOver: (M0) => M0.preventDefault(),
@@ -11967,7 +11985,7 @@ const E1 = {
               gap: 12
             },
             children: [
-              a0.map((M0, w0) => {
+              o0.map((M0, w0) => {
                 const Q0 = M0.url || $0(M0);
                 return /* @__PURE__ */ t.jsx(
                   "div",
@@ -12061,7 +12079,7 @@ const E1 = {
             children: U ? "업로드 중..." : H || "업로드"
           }
         ),
-        Z && a0.length > 0 && c !== "none" && /* @__PURE__ */ t.jsx(
+        Z && o0.length > 0 && c !== "none" && /* @__PURE__ */ t.jsx(
           "div",
           {
             className: "sud-upload__file-list",
@@ -12073,7 +12091,7 @@ const E1 = {
             },
             role: "list",
             "aria-label": "Uploaded files",
-            children: a0.map((M0, w0) => /* @__PURE__ */ t.jsx(
+            children: o0.map((M0, w0) => /* @__PURE__ */ t.jsx(
               B9,
               {
                 file: M0,
@@ -12111,10 +12129,10 @@ const E1 = {
   shadow: F = "md",
   style: M = {}
 }) => {
-  const p = h0(), S = Math.min(100, Math.max(0, c / n * 100)), { txtColor: _, bgColor: N } = d0({
+  const p = h0(), S = Math.min(100, Math.max(0, c / n * 100)), { txtColor: _, bgColor: N } = i0({
     fallback: g,
     componentType: "tag"
-  }), k = i ? L(i, p) : _, { bgColor: B } = d0({
+  }), k = i ? L(i, p) : _, { bgColor: B } = i0({
     fallback: Z,
     componentType: "etc"
   }), $ = O0(F, p), R = {
@@ -12317,10 +12335,10 @@ const E1 = {
   text: l = !1,
   style: o = {}
 }) => {
-  const a = s / 25, d = 12, g = d - a * 1.5, Z = 2 * Math.PI * g, { txtColor: i } = d0({
+  const a = s / 25, d = 12, g = d - a * 1.5, Z = 2 * Math.PI * g, { txtColor: i } = i0({
     fallback: c,
     componentType: "tag"
-  }), { bgColor: h } = d0({
+  }), { bgColor: h } = i0({
     fallback: "hovered",
     componentType: "etc"
   }), x = n === "elastic" ? "elasticSpin 1s cubic-bezier(0.68, -0.55, 0.27, 1.55) infinite" : "spin 1s linear infinite";
@@ -12764,7 +12782,7 @@ const x4 = {
     border: F = !0,
     style: M = {}
   }, p) => {
-    const S = h0(), { bgColor: _, txtColor: N, borColor: k } = d0({
+    const S = h0(), { bgColor: _, txtColor: N, borColor: k } = i0({
       border: F,
       fallback: l
     }), B = c ? L(c, S) : _, $ = n ? L(n, S) : N, R = o ? L(o, S) : k, H = F && R ? `${d}px ${a} ${R}` : "none", I = Z === "rounded" ? { borderRadius: "0 0 15px 15px" } : { borderRadius: "0" }, z = O0(x, S);
@@ -12822,7 +12840,7 @@ const E9 = R1(
     z0(() => {
       k.current && (C == null || C(k.current.offsetWidth));
     }, []);
-    const { bgColor: $, txtColor: R, borColor: H } = d0({
+    const { bgColor: $, txtColor: R, borColor: H } = i0({
       border: p,
       fallback: n
     }), I = c ? L(c, B) : $, z = l ? L(l, B) : R, O = o ? L(o, B) : H, A = p && O ? `${d}px ${a} ${O}` : "none", V = O0(x, B), w = Z === "rounded" ? { borderRadius: "0 15px 15px 0" } : { borderRadius: "0" };
@@ -12874,7 +12892,7 @@ const I9 = R1(
     layoutOffset: o = { header: 0, footer: 0, sider: 0 },
     style: a = {}
   }, d) => {
-    const g = f0(null), Z = d || g, { header: i = 0, footer: h = 0, sider: x = 0 } = o, { bgColor: C, txtColor: j } = d0({
+    const g = f0(null), Z = d || g, { header: i = 0, footer: h = 0, sider: x = 0 } = o, { bgColor: C, txtColor: j } = i0({
       border: !1
     }), F = n ? resolveColor(n, theme) : C, M = l ? resolveColor(l, theme) : j;
     return /* @__PURE__ */ t.jsx(
@@ -12928,7 +12946,7 @@ const V9 = R1(
     z0(() => {
       N.current && (C == null || C(N.current.offsetHeight));
     }, []);
-    const { bgColor: B, txtColor: $, borColor: R } = d0({
+    const { bgColor: B, txtColor: $, borColor: R } = i0({
       border: M,
       fallback: l
     }), H = c ? L(c, k) : B, I = n ? L(n, k) : $, z = o ? L(o, k) : R, O = M && z ? `${d}px ${a} ${z}` : "none", A = O0(x, k), V = Z === "rounded" ? { borderRadius: "15px 15px 0 0" } : { borderRadius: "0" };
@@ -13141,7 +13159,7 @@ const P9 = ({ isOpen: s, children: c }) => {
       (B) => B.includes(k) ? B.filter(($) => $ !== k) : [...B, k]
     );
   }, N = (k, B, $) => {
-    const R = p === k && B, I = d0({
+    const R = p === k && B, I = i0({
       border: !1,
       componentType: "etc",
       fallback: R ? "selected" : $ ? "hovered" : "default"
@@ -13185,7 +13203,7 @@ const P9 = ({ isOpen: s, children: c }) => {
   placement: g,
   colorType: Z
 }) => {
-  const [i, h] = G(!1), x = f0(), C = f0(null), j = l === s.key, F = Array.isArray(s.children) && s.children.length > 0, M = j || i, S = d0({
+  const [i, h] = G(!1), x = f0(), C = f0(null), j = l === s.key, F = Array.isArray(s.children) && s.children.length > 0, M = j || i, S = i0({
     border: !1,
     componentType: "etc",
     fallback: j ? "selected" : "hovered"
@@ -13442,7 +13460,7 @@ const P9 = ({ isOpen: s, children: c }) => {
   listStyle: g = {}
 }) => {
   if (!c || c.length === 0) return null;
-  const { separatorColor: Z, textColor: i, nowColor: h } = d0({
+  const { separatorColor: Z, textColor: i, nowColor: h } = i0({
     componentType: "breadcrumb"
   }), x = {
     color: Z,
@@ -13582,7 +13600,7 @@ export {
   u4 as Upload,
   _1 as adjustBrightness,
   K9 as applyPulseEffect,
-  d0 as computeColorStyles,
+  i0 as computeColorStyles,
   d1 as darkTheme,
   e1 as defaultTheme,
   G9 as getColorWithIntensity,