@carandesign/drawui 0.2.1 → 0.2.2

package/dist/drawui.es.js

@@ -1,8 +1,8 @@
-import st, { createContext as nt, useContext as rt, useRef as E, useState as Q, useEffect as C } from "react";
-var ce = { exports: {} }, B = {};
+import st, { createContext as nt, useContext as rt, useRef as O, useState as Y, useEffect as R } from "react";
+var ce = { exports: {} }, Z = {};
 var je;
 function ot() {
-  if (je) return B;
+  if (je) return Z;
   je = 1;
   var o = /* @__PURE__ */ Symbol.for("react.transitional.element"), e = /* @__PURE__ */ Symbol.for("react.fragment");
   function s(t, n, r) {
@@ -20,9 +20,9 @@ function ot() {
       props: r
     };
   }
-  return B.Fragment = e, B.jsx = s, B.jsxs = s, B;
+  return Z.Fragment = e, Z.jsx = s, Z.jsxs = s, Z;
 }
-var Z = {};
+var X = {};
 var $e;
 function at() {
   return $e || ($e = 1, process.env.NODE_ENV !== "production" && (function() {
@@ -51,19 +51,19 @@ function at() {
         ), p.$$typeof) {
           case m:
             return "Portal";
-          case F:
+          case z:
             return p.displayName || "Context";
-          case N:
+          case C:
             return (p._context.displayName || "Context") + ".Consumer";
-          case H:
-            var M = p.render;
-            return p = p.displayName, p || (p = M.displayName || M.name || "", p = p !== "" ? "ForwardRef(" + p + ")" : "ForwardRef"), p;
+          case N:
+            var w = p.render;
+            return p = p.displayName, p || (p = w.displayName || w.name || "", p = p !== "" ? "ForwardRef(" + p + ")" : "ForwardRef"), p;
           case se:
-            return M = p.displayName || null, M !== null ? M : o(p.type) || "Memo";
-          case $:
-            M = p._payload, p = p._init;
+            return w = p.displayName || null, w !== null ? w : o(p.type) || "Memo";
+          case D:
+            w = p._payload, p = p._init;
             try {
-              return o(p(M));
+              return o(p(w));
             } catch {
             }
         }
@@ -75,15 +75,15 @@ function at() {
     function s(p) {
       try {
         e(p);
-        var M = !1;
+        var w = !1;
       } catch {
-        M = !0;
+        w = !0;
       }
-      if (M) {
-        M = console;
-        var _ = M.error, P = typeof Symbol == "function" && Symbol.toStringTag && p[Symbol.toStringTag] || p.constructor.name || "Object";
+      if (w) {
+        w = console;
+        var _ = w.error, P = typeof Symbol == "function" && Symbol.toStringTag && p[Symbol.toStringTag] || p.constructor.name || "Object";
         return _.call(
-          M,
+          w,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
           P
         ), e(p);
@@ -91,11 +91,11 @@ function at() {
     }
     function t(p) {
       if (p === b) return "<>";
-      if (typeof p == "object" && p !== null && p.$$typeof === $)
+      if (typeof p == "object" && p !== null && p.$$typeof === D)
         return "<...>";
       try {
-        var M = o(p);
-        return M ? "<" + M + ">" : "<...>";
+        var w = o(p);
+        return w ? "<" + w + ">" : "<...>";
       } catch {
         return "<...>";
       }
@@ -109,16 +109,16 @@ function at() {
     }
     function i(p) {
       if (S.call(p, "key")) {
-        var M = Object.getOwnPropertyDescriptor(p, "key").get;
-        if (M && M.isReactWarning) return !1;
+        var w = Object.getOwnPropertyDescriptor(p, "key").get;
+        if (w && w.isReactWarning) return !1;
       }
       return p.key !== void 0;
     }
-    function a(p, M) {
+    function a(p, w) {
       function _() {
-        D || (D = !0, console.error(
+        I || (I = !0, console.error(
           "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
-          M
+          w
         ));
       }
       _.isReactWarning = !0, Object.defineProperty(p, "key", {
@@ -132,12 +132,12 @@ function at() {
         "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
       )), p = this.props.ref, p !== void 0 ? p : null;
     }
-    function u(p, M, _, P, ie, we) {
+    function u(p, w, _, P, ie, Me) {
       var T = _.ref;
       return p = {
         $$typeof: g,
         type: p,
-        key: M,
+        key: w,
         props: _,
         _owner: P
       }, (T !== void 0 ? T : null) !== null ? Object.defineProperty(p, "ref", {
@@ -162,14 +162,14 @@ function at() {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: we
+        value: Me
       }), Object.freeze && (Object.freeze(p.props), Object.freeze(p)), p;
     }
-    function l(p, M, _, P, ie, we) {
-      var T = M.children;
+    function l(p, w, _, P, ie, Me) {
+      var T = w.children;
       if (T !== void 0)
         if (P)
-          if (j(T)) {
+          if ($(T)) {
             for (P = 0; P < T.length; P++)
               h(T[P]);
             Object.freeze && Object.freeze(T);
@@ -178,12 +178,12 @@ function at() {
               "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
             );
         else h(T);
-      if (S.call(M, "key")) {
+      if (S.call(w, "key")) {
         T = o(p);
-        var G = Object.keys(M).filter(function(tt) {
+        var G = Object.keys(w).filter(function(tt) {
           return tt !== "key";
         });
-        P = 0 < G.length ? "{key: someKey, " + G.join(": ..., ") + ": ...}" : "{key: someKey}", Y[T + P] || (G = 0 < G.length ? "{" + G.join(": ..., ") + ": ...}" : "{}", console.error(
+        P = 0 < G.length ? "{key: someKey, " + G.join(": ..., ") + ": ...}" : "{key: someKey}", B[T + P] || (G = 0 < G.length ? "{" + G.join(": ..., ") + ": ...}" : "{}", console.error(
           `A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
@@ -194,13 +194,13 @@ React keys must be passed directly to JSX without using spread:
           T,
           G,
           T
-        ), Y[T + P] = !0);
+        ), B[T + P] = !0);
       }
-      if (T = null, _ !== void 0 && (s(_), T = "" + _), i(M) && (s(M.key), T = "" + M.key), "key" in M) {
+      if (T = null, _ !== void 0 && (s(_), T = "" + _), i(w) && (s(w.key), T = "" + w.key), "key" in w) {
         _ = {};
-        for (var ye in M)
-          ye !== "key" && (_[ye] = M[ye]);
-      } else _ = M;
+        for (var ye in w)
+          ye !== "key" && (_[ye] = w[ye]);
+      } else _ = w;
       return T && a(
         _,
         typeof p == "function" ? p.displayName || p.name || "Unknown" : p
@@ -210,16 +210,16 @@ React keys must be passed directly to JSX without using spread:
         _,
         n(),
         ie,
-        we
+        Me
       );
     }
     function h(p) {
-      f(p) ? p._store && (p._store.validated = 1) : typeof p == "object" && p !== null && p.$$typeof === $ && (p._payload.status === "fulfilled" ? f(p._payload.value) && p._payload.value._store && (p._payload.value._store.validated = 1) : p._store && (p._store.validated = 1));
+      f(p) ? p._store && (p._store.validated = 1) : typeof p == "object" && p !== null && p.$$typeof === D && (p._payload.status === "fulfilled" ? f(p._payload.value) && p._payload.value._store && (p._payload.value._store.validated = 1) : p._store && (p._store.validated = 1));
     }
     function f(p) {
       return typeof p == "object" && p !== null && p.$$typeof === g;
     }
-    var d = st, g = /* @__PURE__ */ Symbol.for("react.transitional.element"), m = /* @__PURE__ */ Symbol.for("react.portal"), b = /* @__PURE__ */ Symbol.for("react.fragment"), v = /* @__PURE__ */ Symbol.for("react.strict_mode"), y = /* @__PURE__ */ Symbol.for("react.profiler"), N = /* @__PURE__ */ Symbol.for("react.consumer"), F = /* @__PURE__ */ Symbol.for("react.context"), H = /* @__PURE__ */ Symbol.for("react.forward_ref"), ee = /* @__PURE__ */ Symbol.for("react.suspense"), te = /* @__PURE__ */ Symbol.for("react.suspense_list"), se = /* @__PURE__ */ Symbol.for("react.memo"), $ = /* @__PURE__ */ Symbol.for("react.lazy"), ne = /* @__PURE__ */ Symbol.for("react.activity"), re = /* @__PURE__ */ Symbol.for("react.client.reference"), x = d.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, S = Object.prototype.hasOwnProperty, j = Array.isArray, z = console.createTask ? console.createTask : function() {
+    var d = st, g = /* @__PURE__ */ Symbol.for("react.transitional.element"), m = /* @__PURE__ */ Symbol.for("react.portal"), b = /* @__PURE__ */ Symbol.for("react.fragment"), v = /* @__PURE__ */ Symbol.for("react.strict_mode"), y = /* @__PURE__ */ Symbol.for("react.profiler"), C = /* @__PURE__ */ Symbol.for("react.consumer"), z = /* @__PURE__ */ Symbol.for("react.context"), N = /* @__PURE__ */ Symbol.for("react.forward_ref"), ee = /* @__PURE__ */ Symbol.for("react.suspense"), te = /* @__PURE__ */ Symbol.for("react.suspense_list"), se = /* @__PURE__ */ Symbol.for("react.memo"), D = /* @__PURE__ */ Symbol.for("react.lazy"), ne = /* @__PURE__ */ Symbol.for("react.activity"), re = /* @__PURE__ */ Symbol.for("react.client.reference"), x = d.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, S = Object.prototype.hasOwnProperty, $ = Array.isArray, W = console.createTask ? console.createTask : function() {
       return null;
     };
     d = {
@@ -227,38 +227,38 @@ React keys must be passed directly to JSX without using spread:
         return p();
       }
     };
-    var D, q = {}, oe = d.react_stack_bottom_frame.bind(
+    var I, q = {}, oe = d.react_stack_bottom_frame.bind(
       d,
       r
-    )(), ae = z(t(r)), Y = {};
-    Z.Fragment = b, Z.jsx = function(p, M, _) {
+    )(), ae = W(t(r)), B = {};
+    X.Fragment = b, X.jsx = function(p, w, _) {
       var P = 1e4 > x.recentlyCreatedOwnerStacks++;
       return l(
         p,
-        M,
+        w,
         _,
         !1,
         P ? Error("react-stack-top-frame") : oe,
-        P ? z(t(p)) : ae
+        P ? W(t(p)) : ae
       );
-    }, Z.jsxs = function(p, M, _) {
+    }, X.jsxs = function(p, w, _) {
       var P = 1e4 > x.recentlyCreatedOwnerStacks++;
       return l(
         p,
-        M,
+        w,
         _,
         !0,
         P ? Error("react-stack-top-frame") : oe,
-        P ? z(t(p)) : ae
+        P ? W(t(p)) : ae
       );
     };
-  })()), Z;
+  })()), X;
 }
-var De;
+var ze;
 function it() {
-  return De || (De = 1, process.env.NODE_ENV === "production" ? ce.exports = ot() : ce.exports = at()), ce.exports;
+  return ze || (ze = 1, process.env.NODE_ENV === "production" ? ce.exports = ot() : ce.exports = at()), ce.exports;
 }
-var w = it();
+var M = it();
 function Te(o, e, s) {
   if (o && o.length) {
     const [t, n] = e, r = Math.PI / 180 * s, i = Math.cos(r), a = Math.sin(r);
@@ -365,7 +365,7 @@ class Le {
     return t;
   }
 }
-function Me(o) {
+function we(o) {
   const e = o[0], s = o[1];
   return Math.sqrt(Math.pow(e[0] - s[0], 2) + Math.pow(e[1] - s[1], 2));
 }
@@ -375,7 +375,7 @@ class ft extends Le {
     t < 0 && (t = s.strokeWidth * 4), t = Math.max(t, 0.1);
     const n = Object.assign({}, s, { hachureGap: t }), r = J(e, n), i = Math.PI / 180 * s.hachureAngle, a = [], c = t * 0.5 * Math.cos(i), u = t * 0.5 * Math.sin(i);
     for (const [h, f] of r)
-      Me([h, f]) && a.push([
+      we([h, f]) && a.push([
         [h[0] - c, h[1] + u],
         [...f]
       ], [
@@ -408,7 +408,7 @@ class pt {
     r < 0 && (r = s.strokeWidth / 2);
     const i = n / 4;
     for (const a of e) {
-      const c = Me(a), u = c / n, l = Math.ceil(u) - 1, h = c - l * n, f = (a[0][0] + a[1][0]) / 2 - n / 4, d = Math.min(a[0][1], a[1][1]);
+      const c = we(a), u = c / n, l = Math.ceil(u) - 1, h = c - l * n, f = (a[0][0] + a[1][0]) / 2 - n / 4, d = Math.min(a[0][1], a[1][1]);
       for (let g = 0; g < l; g++) {
         const m = d + h + g * n, b = f - i + Math.random() * 2 * i, v = m - i + Math.random() * 2 * i, y = this.helper.ellipse(b, v, r, r, s);
         t.push(...y.ops);
@@ -428,7 +428,7 @@ class gt {
   dashedLine(e, s) {
     const t = s.dashOffset < 0 ? s.hachureGap < 0 ? s.strokeWidth * 4 : s.hachureGap : s.dashOffset, n = s.dashGap < 0 ? s.hachureGap < 0 ? s.strokeWidth * 4 : s.hachureGap : s.dashGap, r = [];
     return e.forEach((i) => {
-      const a = Me(i), c = Math.floor(a / (t + n)), u = (a + n - c * (t + n)) / 2;
+      const a = we(i), c = Math.floor(a / (t + n)), u = (a + n - c * (t + n)) / 2;
       let l = i[0], h = i[1];
       l[0] > h[0] && (l = i[1], h = i[0]);
       const f = Math.atan((h[1] - l[1]) / (h[0] - l[0]));
@@ -452,7 +452,7 @@ class mt {
   zigzagLines(e, s, t) {
     const n = [];
     return e.forEach((r) => {
-      const i = Me(r), a = Math.round(i / (2 * s));
+      const i = we(r), a = Math.round(i / (2 * s));
       let c = r[0], u = r[1];
       c[0] > u[0] && (c = r[1], u = r[0]);
       const l = Math.atan((u[1] - c[1]) / (u[0] - c[0]));
@@ -463,31 +463,31 @@ class mt {
     }), n;
   }
 }
-const O = {};
+const E = {};
 function kt(o, e) {
   let s = o.fillStyle || "hachure";
-  if (!O[s])
+  if (!E[s])
     switch (s) {
       case "zigzag":
-        O[s] || (O[s] = new ft(e));
+        E[s] || (E[s] = new ft(e));
         break;
       case "cross-hatch":
-        O[s] || (O[s] = new dt(e));
+        E[s] || (E[s] = new dt(e));
         break;
       case "dots":
-        O[s] || (O[s] = new pt(e));
+        E[s] || (E[s] = new pt(e));
         break;
       case "dashed":
-        O[s] || (O[s] = new gt(e));
+        E[s] || (E[s] = new gt(e));
         break;
       case "zigzag-line":
-        O[s] || (O[s] = new mt(e));
+        E[s] || (E[s] = new mt(e));
         break;
       default:
-        s = "hachure", O[s] || (O[s] = new Le(e));
+        s = "hachure", E[s] || (E[s] = new Le(e));
         break;
     }
-  return O[s];
+  return E[s];
 }
 function bt() {
   return Math.floor(Math.random() * 2 ** 31);
@@ -500,14 +500,14 @@ class vt {
     return this.seed ? (2 ** 31 - 1 & (this.seed = Math.imul(48271, this.seed))) / 2 ** 31 : Math.random();
   }
 }
-const Mt = 0, xe = 1, Be = 2, le = { A: 7, a: 7, C: 6, c: 6, H: 1, h: 1, L: 2, l: 2, M: 2, m: 2, Q: 4, q: 4, S: 4, s: 4, T: 2, t: 2, V: 1, v: 1, Z: 0, z: 0 };
-function wt(o) {
+const wt = 0, xe = 1, Be = 2, le = { A: 7, a: 7, C: 6, c: 6, H: 1, h: 1, L: 2, l: 2, M: 2, m: 2, Q: 4, q: 4, S: 4, s: 4, T: 2, t: 2, V: 1, v: 1, Z: 0, z: 0 };
+function Mt(o) {
   const e = new Array();
   for (; o !== ""; )
     if (o.match(/^([ \t\r\n,]+)/))
       o = o.substr(RegExp.$1.length);
     else if (o.match(/^([aAcChHlLmMqQsStTvVzZ])/))
-      e[e.length] = { type: Mt, text: RegExp.$1 }, o = o.substr(RegExp.$1.length);
+      e[e.length] = { type: wt, text: RegExp.$1 }, o = o.substr(RegExp.$1.length);
     else if (o.match(/^(([-+]?[0-9]+(\.[0-9]*)?|[-+]?\.[0-9]+)([eE][-+]?[0-9]+)?)/))
       e[e.length] = { type: xe, text: `${parseFloat(RegExp.$1)}` }, o = o.substr(RegExp.$1.length);
     else
@@ -518,7 +518,7 @@ function _e(o, e) {
   return o.type === e;
 }
 function Ae(o) {
-  const e = [], s = wt(o);
+  const e = [], s = Mt(o);
   let t = "BOD", n = 0, r = s[n];
   for (; !_e(r, Be); ) {
     let i = 0;
@@ -659,8 +659,8 @@ function Xe(o) {
       }
       case "A": {
         const h = Math.abs(l[0]), f = Math.abs(l[1]), d = l[2], g = l[3], m = l[4], b = l[5], v = l[6];
-        h === 0 || f === 0 ? (e.push({ key: "C", data: [t, n, b, v, b, v] }), t = b, n = v) : (t !== b || n !== v) && (Ue(t, n, b, v, h, f, d, g, m).forEach(function(N) {
-          e.push({ key: "C", data: N });
+        h === 0 || f === 0 ? (e.push({ key: "C", data: [t, n, b, v, b, v] }), t = b, n = v) : (t !== b || n !== v) && (Ue(t, n, b, v, h, f, d, g, m).forEach(function(C) {
+          e.push({ key: "C", data: C });
         }), t = b, n = v);
         break;
       }
@@ -675,7 +675,7 @@ function Xe(o) {
 function yt(o) {
   return Math.PI * o / 180;
 }
-function X(o, e, s) {
+function U(o, e, s) {
   const t = o * Math.cos(s) - e * Math.sin(s), n = o * Math.sin(s) + e * Math.cos(s);
   return [t, n];
 }
@@ -685,28 +685,28 @@ function Ue(o, e, s, t, n, r, i, a, c, u) {
   if (u)
     [f, d, g, m] = u;
   else {
-    [o, e] = X(o, e, -l), [s, t] = X(s, t, -l);
+    [o, e] = U(o, e, -l), [s, t] = U(s, t, -l);
     const x = (o - s) / 2, S = (e - t) / 2;
-    let j = x * x / (n * n) + S * S / (r * r);
-    j > 1 && (j = Math.sqrt(j), n = j * n, r = j * r);
-    const z = a === c ? -1 : 1, D = n * n, q = r * r, oe = D * q - D * S * S - q * x * x, ae = D * S * S + q * x * x, Y = z * Math.sqrt(Math.abs(oe / ae));
-    g = Y * n * S / r + (o + s) / 2, m = Y * -r * x / n + (e + t) / 2, f = Math.asin(parseFloat(((e - m) / r).toFixed(9))), d = Math.asin(parseFloat(((t - m) / r).toFixed(9))), o < g && (f = Math.PI - f), s < g && (d = Math.PI - d), f < 0 && (f = Math.PI * 2 + f), d < 0 && (d = Math.PI * 2 + d), c && f > d && (f = f - Math.PI * 2), !c && d > f && (d = d - Math.PI * 2);
+    let $ = x * x / (n * n) + S * S / (r * r);
+    $ > 1 && ($ = Math.sqrt($), n = $ * n, r = $ * r);
+    const W = a === c ? -1 : 1, I = n * n, q = r * r, oe = I * q - I * S * S - q * x * x, ae = I * S * S + q * x * x, B = W * Math.sqrt(Math.abs(oe / ae));
+    g = B * n * S / r + (o + s) / 2, m = B * -r * x / n + (e + t) / 2, f = Math.asin(parseFloat(((e - m) / r).toFixed(9))), d = Math.asin(parseFloat(((t - m) / r).toFixed(9))), o < g && (f = Math.PI - f), s < g && (d = Math.PI - d), f < 0 && (f = Math.PI * 2 + f), d < 0 && (d = Math.PI * 2 + d), c && f > d && (f = f - Math.PI * 2), !c && d > f && (d = d - Math.PI * 2);
   }
   let b = d - f;
   if (Math.abs(b) > Math.PI * 120 / 180) {
-    const x = d, S = s, j = t;
-    c && d > f ? d = f + Math.PI * 120 / 180 * 1 : d = f + Math.PI * 120 / 180 * -1, s = g + n * Math.cos(d), t = m + r * Math.sin(d), h = Ue(s, t, S, j, n, r, i, 0, c, [d, x, g, m]);
+    const x = d, S = s, $ = t;
+    c && d > f ? d = f + Math.PI * 120 / 180 * 1 : d = f + Math.PI * 120 / 180 * -1, s = g + n * Math.cos(d), t = m + r * Math.sin(d), h = Ue(s, t, S, $, n, r, i, 0, c, [d, x, g, m]);
   }
   b = d - f;
-  const v = Math.cos(f), y = Math.sin(f), N = Math.cos(d), F = Math.sin(d), H = Math.tan(b / 4), ee = 4 / 3 * n * H, te = 4 / 3 * r * H, se = [o, e], $ = [o + ee * y, e - te * v], ne = [s + ee * F, t - te * N], re = [s, t];
-  if ($[0] = 2 * se[0] - $[0], $[1] = 2 * se[1] - $[1], u)
-    return [$, ne, re].concat(h);
+  const v = Math.cos(f), y = Math.sin(f), C = Math.cos(d), z = Math.sin(d), N = Math.tan(b / 4), ee = 4 / 3 * n * N, te = 4 / 3 * r * N, se = [o, e], D = [o + ee * y, e - te * v], ne = [s + ee * z, t - te * C], re = [s, t];
+  if (D[0] = 2 * se[0] - D[0], D[1] = 2 * se[1] - D[1], u)
+    return [D, ne, re].concat(h);
   {
-    h = [$, ne, re].concat(h);
+    h = [D, ne, re].concat(h);
     const x = [];
     for (let S = 0; S < h.length; S += 3) {
-      const j = X(h[S][0], h[S][1], l), z = X(h[S + 1][0], h[S + 1][1], l), D = X(h[S + 2][0], h[S + 2][1], l);
-      x.push([j[0], j[1], z[0], z[1], D[0], D[1]]);
+      const $ = U(h[S][0], h[S][1], l), W = U(h[S + 1][0], h[S + 1][1], l), I = U(h[S + 2][0], h[S + 2][1], l);
+      x.push([$[0], $[1], W[0], W[1], I[0], I[1]]);
     }
     return x;
   }
@@ -718,15 +718,15 @@ const _t = {
   doubleLineOps: Rt
 };
 function Qe(o, e, s, t, n) {
-  return { type: "path", ops: I(o, e, s, t, n) };
+  return { type: "path", ops: H(o, e, s, t, n) };
 }
 function de(o, e, s) {
   const t = (o || []).length;
   if (t > 2) {
     const n = [];
     for (let r = 0; r < t - 1; r++)
-      n.push(...I(o[r][0], o[r][1], o[r + 1][0], o[r + 1][1], s));
-    return e && n.push(...I(o[t - 1][0], o[t - 1][1], o[0][0], o[0][1], s)), { type: "path", ops: n };
+      n.push(...H(o[r][0], o[r][1], o[r + 1][0], o[r + 1][1], s));
+    return e && n.push(...H(o[t - 1][0], o[t - 1][1], o[0][0], o[0][1], s)), { type: "path", ops: n };
   } else if (t === 2)
     return Qe(o[0][0], o[0][1], o[1][0], o[1][1], s);
   return { type: "path", ops: [] };
@@ -743,7 +743,7 @@ function Pt(o, e, s, t, n) {
   ];
   return St(r, n);
 }
-function ze(o, e) {
+function De(o, e) {
   if (o.length) {
     const t = typeof o[0][0] == "number" ? [o] : o, n = ue(t[0], 1 * (1 + e.roughness * 0.2), e), r = e.disableMultiStroke ? [] : ue(t[0], 1.5 * (1 + e.roughness * 0.22), We(e));
     for (let i = 1; i < t.length; i++) {
@@ -771,10 +771,10 @@ function Je(o, e, s) {
   return i += k(i * c, s), a += k(a * c, s), { increment: r, rx: i, ry: a };
 }
 function Oe(o, e, s, t) {
-  const [n, r] = Fe(t.increment, o, e, t.rx, t.ry, 1, t.increment * me(0.1, me(0.4, 1, s), s), s);
+  const [n, r] = He(t.increment, o, e, t.rx, t.ry, 1, t.increment * me(0.1, me(0.4, 1, s), s), s);
   let i = ke(n, null, s);
   if (!s.disableMultiStroke && s.roughness !== 0) {
-    const [a] = Fe(t.increment, o, e, t.rx, t.ry, 1.5, 0, s), c = ke(a, null, s);
+    const [a] = He(t.increment, o, e, t.rx, t.ry, 1.5, 0, s), c = ke(a, null, s);
     i = i.concat(c);
   }
   return {
@@ -790,12 +790,12 @@ function Ie(o, e, s, t, n, r, i, a, c) {
   for (; d < 0; )
     d += Math.PI * 2, g += Math.PI * 2;
   g - d > Math.PI * 2 && (d = 0, g = Math.PI * 2);
-  const m = Math.PI * 2 / c.curveStepCount, b = Math.min(m / 2, (g - d) / 2), v = He(b, u, l, h, f, d, g, 1, c);
+  const m = Math.PI * 2 / c.curveStepCount, b = Math.min(m / 2, (g - d) / 2), v = Fe(b, u, l, h, f, d, g, 1, c);
   if (!c.disableMultiStroke) {
-    const y = He(b, u, l, h, f, d, g, 1.5, c);
+    const y = Fe(b, u, l, h, f, d, g, 1.5, c);
     v.push(...y);
   }
-  return i && (a ? v.push(...I(u, l, u + h * Math.cos(d), l + f * Math.sin(d), c), ...I(u, l, u + h * Math.cos(g), l + f * Math.sin(g), c)) : v.push({ op: "lineTo", data: [u, l] }, { op: "lineTo", data: [u + h * Math.cos(d), l + f * Math.sin(d)] })), { type: "path", ops: v };
+  return i && (a ? v.push(...H(u, l, u + h * Math.cos(d), l + f * Math.sin(d), c), ...H(u, l, u + h * Math.cos(g), l + f * Math.sin(g), c)) : v.push({ op: "lineTo", data: [u, l] }, { op: "lineTo", data: [u + h * Math.cos(d), l + f * Math.sin(d)] })), { type: "path", ops: v };
 }
 function Ne(o, e) {
   const s = Xe(Ze(Ae(o))), t = [];
@@ -807,7 +807,7 @@ function Ne(o, e) {
         break;
       }
       case "L":
-        t.push(...I(r[0], r[1], a[0], a[1], e)), r = [a[0], a[1]];
+        t.push(...H(r[0], r[1], a[0], a[1], e)), r = [a[0], a[1]];
         break;
       case "C": {
         const [c, u, l, h, f, d] = a;
@@ -815,7 +815,7 @@ function Ne(o, e) {
         break;
       }
       case "Z":
-        t.push(...I(r[0], r[1], n[0], n[1], e)), r = [n[0], n[1]];
+        t.push(...H(r[0], r[1], n[0], n[1], e)), r = [n[0], n[1]];
         break;
     }
   return { type: "path", ops: t };
@@ -856,7 +856,7 @@ function Et(o, e, s) {
   return me(o, e, s);
 }
 function Rt(o, e, s, t, n) {
-  return I(o, e, s, t, n, !0);
+  return H(o, e, s, t, n, !0);
 }
 function We(o) {
   const e = Object.assign({}, o);
@@ -871,7 +871,7 @@ function me(o, e, s, t = 1) {
 function k(o, e, s = 1) {
   return me(-o, o, e, s);
 }
-function I(o, e, s, t, n, r = !1) {
+function H(o, e, s, t, n, r = !1) {
   const i = r ? n.disableMultiStrokeFill : n.disableMultiStroke, a = Ee(o, e, s, t, n, !0, !1);
   if (i)
     return a;
@@ -965,7 +965,7 @@ function ke(o, e, s) {
   })) : t === 2 && n.push(...Ee(o[0][0], o[0][1], o[1][0], o[1][1], s, !0, !0));
   return n;
 }
-function Fe(o, e, s, t, n, r, i, a) {
+function He(o, e, s, t, n, r, i, a) {
   const c = a.roughness === 0, u = [], l = [];
   if (c) {
     o = o / 4, l.push([
@@ -1013,7 +1013,7 @@ function Fe(o, e, s, t, n, r, i, a) {
   }
   return [l, u];
 }
-function He(o, e, s, t, n, r, i, a, c) {
+function Fe(o, e, s, t, n, r, i, a, c) {
   const u = r + k(0.1, c), l = [];
   l.push([
     k(a, c) + e + 0.9 * t * Math.cos(u - o),
@@ -1050,7 +1050,7 @@ function Ct(o, e, s, t, n, r, i, a) {
     });
   return c;
 }
-function U(o) {
+function Q(o) {
   return [...o];
 }
 function qe(o, e = 0) {
@@ -1059,14 +1059,14 @@ function qe(o, e = 0) {
     throw new Error("A curve must have at least three points.");
   const t = [];
   if (s === 3)
-    t.push(U(o[0]), U(o[1]), U(o[2]), U(o[2]));
+    t.push(Q(o[0]), Q(o[1]), Q(o[2]), Q(o[2]));
   else {
     const n = [];
     n.push(o[0], o[0]);
     for (let a = 1; a < o.length; a++)
       n.push(o[a]), a === o.length - 1 && n.push(o[a]);
     const r = [], i = 1 - e;
-    t.push(U(n[0]));
+    t.push(Q(n[0]));
     for (let a = 1; a + 2 < n.length; a++) {
       const c = n[a];
       r[0] = [c[0], c[1]], r[1] = [c[0] + (i * n[a + 1][0] - i * n[a - 1][0]) / 6, c[1] + (i * n[a + 1][1] - i * n[a - 1][1]) / 6], r[2] = [n[a + 1][0] + (i * n[a][0] - i * n[a + 2][0]) / 6, n[a + 1][1] + (i * n[a][1] - i * n[a + 2][1]) / 6], r[3] = [n[a + 1][0], n[a + 1][1]], t.push(r[1], r[2], r[3]);
@@ -1085,9 +1085,9 @@ function At(o, e, s) {
   if (t === 0)
     return pe(o, e);
   let n = ((o[0] - e[0]) * (s[0] - e[0]) + (o[1] - e[1]) * (s[1] - e[1])) / t;
-  return n = Math.max(0, Math.min(1, n)), pe(o, W(e, s, n));
+  return n = Math.max(0, Math.min(1, n)), pe(o, F(e, s, n));
 }
-function W(o, e, s) {
+function F(o, e, s) {
   return [
     o[0] + (e[0] - o[0]) * s,
     o[1] + (e[1] - o[1]) * s
@@ -1110,7 +1110,7 @@ function Re(o, e, s, t) {
     const r = o[e + 0];
     n.length ? Lt(n[n.length - 1], r) > 1 && n.push(r) : n.push(r), n.push(o[e + 3]);
   } else {
-    const i = o[e + 0], a = o[e + 1], c = o[e + 2], u = o[e + 3], l = W(i, a, 0.5), h = W(a, c, 0.5), f = W(c, u, 0.5), d = W(l, h, 0.5), g = W(h, f, 0.5), m = W(d, g, 0.5);
+    const i = o[e + 0], a = o[e + 1], c = o[e + 2], u = o[e + 3], l = F(i, a, 0.5), h = F(a, c, 0.5), f = F(c, u, 0.5), d = F(l, h, 0.5), g = F(h, f, 0.5), m = F(d, g, 0.5);
     Re([i, l, d, m], 0, s, n), Re([m, g, f, u], 0, s, n);
   }
   return n;
@@ -1135,7 +1135,7 @@ function Ce(o, e = 0.15, s) {
   }
   return s && s > 0 ? be(t, 0, t.length, s) : t;
 }
-function Dt(o, e, s) {
+function zt(o, e, s) {
   const t = Ae(o), n = Xe(Ze(t)), r = [];
   let i = [], a = [0, 0], c = [];
   const u = () => {
@@ -1171,7 +1171,7 @@ function Dt(o, e, s) {
   }
   return h;
 }
-const R = "none";
+const L = "none";
 class ve {
   constructor(e) {
     this.defaultOptions = {
@@ -1216,7 +1216,7 @@ class ve {
       const u = [[e, s], [e + t, s], [e + t, s + n], [e, s + n]];
       i.fillStyle === "solid" ? a.push(Se([u], i)) : a.push(V([u], i));
     }
-    return i.stroke !== R && a.push(c), this._d("rectangle", a, i);
+    return i.stroke !== L && a.push(c), this._d("rectangle", a, i);
   }
   ellipse(e, s, t, n, r) {
     const i = this._o(r), a = [], c = Je(t, n, i), u = Oe(e, s, i, c);
@@ -1226,7 +1226,7 @@ class ve {
         l.type = "fillPath", a.push(l);
       } else
         a.push(V([u.estimatedPoints], i));
-    return i.stroke !== R && a.push(u.opset), this._d("ellipse", a, i);
+    return i.stroke !== L && a.push(u.opset), this._d("ellipse", a, i);
   }
   circle(e, s, t, n) {
     const r = this.ellipse(e, s, t, t, n);
@@ -1246,13 +1246,13 @@ class ve {
         d.type = "fillPath", l.push(d);
       } else
         l.push(xt(e, s, t, n, r, i, u));
-    return u.stroke !== R && l.push(h), this._d("arc", l, u);
+    return u.stroke !== L && l.push(h), this._d("arc", l, u);
   }
   curve(e, s) {
-    const t = this._o(s), n = [], r = ze(e, t);
-    if (t.fill && t.fill !== R)
+    const t = this._o(s), n = [], r = De(e, t);
+    if (t.fill && t.fill !== L)
       if (t.fillStyle === "solid") {
-        const i = ze(e, Object.assign(Object.assign({}, t), { disableMultiStroke: !0, roughness: t.roughness ? t.roughness + t.fillShapeRoughnessGain : 0 }));
+        const i = De(e, Object.assign(Object.assign({}, t), { disableMultiStroke: !0, roughness: t.roughness ? t.roughness + t.fillShapeRoughnessGain : 0 }));
         n.push({
           type: "fillPath",
           ops: this._mergedShape(i.ops)
@@ -1271,18 +1271,18 @@ class ve {
         }
         i.length && n.push(V([i], t));
       }
-    return t.stroke !== R && n.push(r), this._d("curve", n, t);
+    return t.stroke !== L && n.push(r), this._d("curve", n, t);
   }
   polygon(e, s) {
     const t = this._o(s), n = [], r = de(e, !0, t);
-    return t.fill && (t.fillStyle === "solid" ? n.push(Se([e], t)) : n.push(V([e], t))), t.stroke !== R && n.push(r), this._d("polygon", n, t);
+    return t.fill && (t.fillStyle === "solid" ? n.push(Se([e], t)) : n.push(V([e], t))), t.stroke !== L && n.push(r), this._d("polygon", n, t);
   }
   path(e, s) {
     const t = this._o(s), n = [];
     if (!e)
       return this._d("path", n, t);
     e = (e || "").replace(/\n/g, " ").replace(/(-\s)/g, "-").replace("/(ss)/g", " ");
-    const r = t.fill && t.fill !== "transparent" && t.fill !== R, i = t.stroke !== R, a = !!(t.simplification && t.simplification < 1), c = a ? 4 - 4 * (t.simplification || 1) : (1 + t.roughness) / 2, u = Dt(e, 1, c), l = Ne(e, t);
+    const r = t.fill && t.fill !== "transparent" && t.fill !== L, i = t.stroke !== L, a = !!(t.simplification && t.simplification < 1), c = a ? 4 - 4 * (t.simplification || 1) : (1 + t.roughness) / 2, u = zt(e, 1, c), l = Ne(e, t);
     if (r)
       if (t.fillStyle === "solid")
         if (u.length === 1) {
@@ -1327,15 +1327,15 @@ class ve {
             d: this.opsToPath(r),
             stroke: t.stroke,
             strokeWidth: t.strokeWidth,
-            fill: R
+            fill: L
           };
           break;
         case "fillPath":
           i = {
             d: this.opsToPath(r),
-            stroke: R,
+            stroke: L,
             strokeWidth: 0,
-            fill: t.fill || R
+            fill: t.fill || L
           };
           break;
         case "fillSketch":
@@ -1350,16 +1350,16 @@ class ve {
     let t = s.fillWeight;
     return t < 0 && (t = s.strokeWidth / 2), {
       d: this.opsToPath(e),
-      stroke: s.fill || R,
+      stroke: s.fill || L,
       strokeWidth: t,
-      fill: R
+      fill: L
     };
   }
   _mergedShape(e) {
     return e.filter((s, t) => t === 0 ? !0 : s.op !== "move");
   }
 }
-class zt {
+class Dt {
   constructor(e, s) {
     this.canvas = e, this.ctx = this.canvas.getContext("2d"), this.gen = new ve(s);
   }
@@ -1525,9 +1525,9 @@ class It {
     return this.draw(t);
   }
 }
-const L = {
+const A = {
   canvas(o, e) {
-    return new zt(o, e);
+    return new Dt(o, e);
   },
   svg(o, e) {
     return new It(o, e);
@@ -1635,8 +1635,8 @@ const L = {
       ...o?.radius
     }
   };
-  return /* @__PURE__ */ w.jsx(et.Provider, { value: s, children: e });
-}, A = () => rt(et), Vt = ({
+  return /* @__PURE__ */ M.jsx(et.Provider, { value: s, children: e });
+}, j = () => rt(et), Vt = ({
   strokeWeight: o = "medium",
   radius: e = "md",
   size: s = "sm",
@@ -1645,10 +1645,10 @@ const L = {
   fillStyle: r,
   ...i
 }) => {
-  const a = A(), c = E(null), [u, l] = Q(!1), h = a.buttonSize[s].width, f = a.buttonSize[s].height, d = a.buttonSize[s].fontSize;
-  return C(() => {
+  const a = j(), c = O(null), [u, l] = Y(!1), h = a.buttonSize[s].width, f = a.buttonSize[s].height, d = a.buttonSize[s].fontSize;
+  return R(() => {
     if (!c.current) return;
-    const g = L.svg(c.current);
+    const g = A.svg(c.current);
     c.current.innerHTML = "";
     const m = a.stroke[o], b = g.path(
       K(0, 0, h, f, a.radius[e]),
@@ -1662,7 +1662,7 @@ const L = {
       }
     );
     c.current.appendChild(b);
-  }, [u, o, e, a]), /* @__PURE__ */ w.jsxs(
+  }, [u, o, e, a]), /* @__PURE__ */ M.jsxs(
     "button",
     {
       ...i,
@@ -1678,7 +1678,7 @@ const L = {
         cursor: "pointer"
       },
       children: [
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "svg",
           {
             ref: c,
@@ -1687,7 +1687,7 @@ const L = {
             style: { position: "absolute", inset: 0 }
           }
         ),
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "span",
           {
             style: {
@@ -1706,10 +1706,10 @@ const L = {
   "drawui-card-header": "_drawui-card-header_vhoat_7",
   "drawui-card-body": "_drawui-card-body_vhoat_12",
   "drawui-card-footer": "_drawui-card-footer_vhoat_17"
-}, Wt = "_vertical_1tdom_6", Ft = "_horizontal_1tdom_11", Pe = {
+}, Wt = "_vertical_1tdom_6", Ht = "_horizontal_1tdom_11", Pe = {
   "drawui-divider": "_drawui-divider_1tdom_1",
   vertical: Wt,
-  horizontal: Ft
+  horizontal: Ht
 }, Ge = ({
   strokeWeight: o = "medium",
   width: e = "100%",
@@ -1717,11 +1717,11 @@ const L = {
   className: t,
   fillStyle: n
 }) => {
-  const r = A(), i = E(null);
-  return C(() => {
+  const r = j(), i = O(null);
+  return R(() => {
     if (!i.current) return;
     i.current.innerHTML = "";
-    const a = L.svg(i.current), c = r.stroke[o];
+    const a = A.svg(i.current), c = r.stroke[o];
     if (s) {
       const u = typeof e == "number" ? e : 100, l = a.line(0, 0, 0, u, {
         stroke: c.color,
@@ -1740,12 +1740,12 @@ const L = {
       });
       i.current.appendChild(l);
     }
-  }, [r, o, e, s]), /* @__PURE__ */ w.jsx(
+  }, [r, o, e, s]), /* @__PURE__ */ M.jsx(
     "div",
     {
       className: `${Pe["drawui-divider"]} ${s ? Pe.vertical : Pe.horizontal} ${t ?? ""}`,
       style: { width: s ? void 0 : e },
-      children: /* @__PURE__ */ w.jsx(
+      children: /* @__PURE__ */ M.jsx(
         "svg",
         {
           ref: i,
@@ -1760,7 +1760,8 @@ const L = {
   strokeWeight: o = "medium",
   radius: e = "md",
   width: s = 300,
-  height: t = 200,
+  height: t,
+  //optional, card adjust height itself by content
   backgroundColor: n,
   header: r,
   footer: i,
@@ -1768,51 +1769,76 @@ const L = {
   children: c,
   ...u
 }) => {
-  const l = A(), h = E(null), [f, d] = Q(!1);
-  return C(() => {
+  const l = j(), h = O(null), f = O(null), [d, g] = Y(!1), [m, b] = Y(t ?? 200);
+  R(() => {
+    if (!f.current || t) return;
+    const y = () => {
+      if (f.current) {
+        const z = f.current.scrollHeight;
+        b(z);
+      }
+    };
+    y();
+    const C = new ResizeObserver(y);
+    return C.observe(f.current), () => C.disconnect();
+  }, [c, r, i, t]), R(() => {
     if (!h.current) return;
-    const g = L.svg(h.current);
+    const y = A.svg(h.current);
     h.current.innerHTML = "";
-    const m = l.stroke[o], b = g.path(
-      K(0, 0, s, t, l.radius[e]),
+    const C = l.stroke[o], z = t ?? m, N = y.path(
+      K(0, 0, s, z, l.radius[e]),
       {
-        stroke: m.color,
-        strokeWidth: m.width,
+        stroke: C.color,
+        strokeWidth: C.width,
         fill: n ?? l.fill.background,
-        roughness: f ? l.roughness.roughness + 1 : l.roughness.roughness,
+        roughness: d ? l.roughness.roughness + 1 : l.roughness.roughness,
         bowing: l.roughness.bowing,
         fillStyle: a
       }
     );
-    h.current.appendChild(b);
-  }, [o, e, s, t, n, l]), /* @__PURE__ */ w.jsxs(
+    h.current.appendChild(N);
+  }, [
+    o,
+    e,
+    s,
+    m,
+    t,
+    n,
+    l,
+    d,
+    a
+  ]);
+  const v = t ?? m;
+  return /* @__PURE__ */ M.jsxs(
     "div",
     {
       ...u,
+      ref: f,
       className: `${fe["drawui-card"]} ${u.className ?? ""}`,
-      onMouseEnter: () => d(!0),
-      onMouseLeave: () => d(!1),
+      onMouseEnter: () => g(!0),
+      onMouseLeave: () => g(!1),
       style: {
         position: "relative",
         width: s,
-        height: t,
+        minHeight: t || "auto",
+        height: t || "auto",
         cursor: "default",
         display: "flex",
         flexDirection: "column",
         overflow: "hidden"
       },
       children: [
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "svg",
           {
             ref: h,
             width: s,
-            height: t,
+            height: v,
             style: { position: "absolute", inset: 0, pointerEvents: "none" }
           }
         ),
-        r && /* @__PURE__ */ w.jsxs(w.Fragment, { children: [
-          /* @__PURE__ */ w.jsx(
+        r && /* @__PURE__ */ M.jsxs(M.Fragment, { children: [
+          /* @__PURE__ */ M.jsx(
             "div",
             {
               className: fe["drawui-card-header"],
@@ -1820,9 +1846,9 @@ const L = {
               children: r
             }
           ),
-          /* @__PURE__ */ w.jsx(Ge, { width: s, strokeWeight: "thick" })
+          /* @__PURE__ */ M.jsx(Ge, { width: s, strokeWeight: "thick" })
         ] }),
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "div",
           {
             className: fe["drawui-card-body"],
@@ -1830,9 +1856,9 @@ const L = {
             children: c
           }
         ),
-        i && /* @__PURE__ */ w.jsxs(w.Fragment, { children: [
-          /* @__PURE__ */ w.jsx(Ge, { width: s, strokeWeight: "thick" }),
-          /* @__PURE__ */ w.jsx(
+        i && /* @__PURE__ */ M.jsxs(M.Fragment, { children: [
+          /* @__PURE__ */ M.jsx(Ge, { width: s, strokeWeight: "thick" }),
+          /* @__PURE__ */ M.jsx(
             "div",
             {
               className: fe["drawui-card-footer"],
@@ -1856,10 +1882,10 @@ const L = {
   fillStyle: r,
   className: i
 }) => {
-  const a = A(), c = E(null);
-  return C(() => {
+  const a = j(), c = O(null);
+  return R(() => {
     if (!c.current) return;
-    const u = L.svg(c.current);
+    const u = A.svg(c.current);
     c.current.innerHTML = "";
     const l = a.stroke[s], h = u.path(
       K(0, 0, n, 40, a.radius[t]),
@@ -1873,9 +1899,9 @@ const L = {
       }
     );
     c.current.appendChild(h);
-  }, [a, s, t, n]), /* @__PURE__ */ w.jsx("div", { className: `${Ve["drawui-collapse"]} ${i ?? ""}`, style: { width: n }, children: /* @__PURE__ */ w.jsxs("details", { children: [
-    /* @__PURE__ */ w.jsxs("summary", { style: { position: "relative" }, children: [
-      /* @__PURE__ */ w.jsx(
+  }, [a, s, t, n]), /* @__PURE__ */ M.jsx("div", { className: `${Ve["drawui-collapse"]} ${i ?? ""}`, style: { width: n }, children: /* @__PURE__ */ M.jsxs("details", { children: [
+    /* @__PURE__ */ M.jsxs("summary", { style: { position: "relative" }, children: [
+      /* @__PURE__ */ M.jsx(
         "svg",
         {
           ref: c,
@@ -1884,11 +1910,11 @@ const L = {
           style: { position: "absolute", inset: 0, pointerEvents: "none" }
         }
       ),
-      /* @__PURE__ */ w.jsx("span", { style: { position: "relative", zIndex: 1 }, children: o })
+      /* @__PURE__ */ M.jsx("span", { style: { position: "relative", zIndex: 1 }, children: o })
     ] }),
-    /* @__PURE__ */ w.jsx("div", { className: Ve["drawui-collapse-content"], children: e })
+    /* @__PURE__ */ M.jsx("div", { className: Ve["drawui-collapse-content"], children: e })
   ] }) });
-}, Ht = {}, Zt = ({
+}, Ft = {}, Zt = ({
   strokeWeight: o = "medium",
   radius: e = "md",
   size: s = "sm",
@@ -1897,10 +1923,10 @@ const L = {
   backgroundColor: r,
   ...i
 }) => {
-  const a = A(), c = E(null), [u, l] = Q(!1), h = a.buttonSize[s].height;
-  return C(() => {
+  const a = j(), c = O(null), [u, l] = Y(!1), h = a.buttonSize[s].height;
+  return R(() => {
     if (!c.current) return;
-    const f = L.svg(c.current);
+    const f = A.svg(c.current);
     c.current.innerHTML = "";
     const d = a.stroke[o], g = f.path(
       K(0, 0, h, h, a.radius[e]),
@@ -1914,13 +1940,13 @@ const L = {
       }
     );
     c.current.appendChild(g);
-  }, [u, o, e, a, h, r]), /* @__PURE__ */ w.jsxs(
+  }, [u, o, e, a, h, r]), /* @__PURE__ */ M.jsxs(
     "button",
     {
       ...i,
       onMouseEnter: () => l(!0),
       onMouseLeave: () => l(!1),
-      className: `${Ht["drawui-button"]} ${i.className ?? ""}`,
+      className: `${Ft["drawui-button"]} ${i.className ?? ""}`,
       style: {
         position: "relative",
         width: h,
@@ -1935,7 +1961,7 @@ const L = {
         padding: 0
       },
       children: [
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "svg",
           {
             ref: c,
@@ -1948,7 +1974,7 @@ const L = {
             }
           }
         ),
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "span",
           {
             style: {
@@ -1977,24 +2003,24 @@ const L = {
   style: i,
   ...a
 }) => {
-  const c = A(), u = E(null), l = E(null), [h, f] = Q(!1), [d, g] = Q(!1), m = c.inputSize[t].height, b = c.inputSize[t].fontSize, v = c.inputSize[t].paddingX;
-  return C(() => {
+  const c = j(), u = O(null), l = O(null), [h, f] = Y(!1), [d, g] = Y(!1), m = c.inputSize[t].height, b = c.inputSize[t].fontSize, v = c.inputSize[t].paddingX;
+  return R(() => {
     if (!u.current || !l.current) return;
-    const y = l.current.offsetWidth, N = L.svg(u.current);
+    const y = l.current.offsetWidth, C = A.svg(u.current);
     u.current.innerHTML = "";
-    const F = c.stroke[o], H = N.path(
+    const z = c.stroke[o], N = C.path(
       K(0, 0, y, m, c.radius[s]),
       {
-        stroke: F.color,
-        strokeWidth: F.width,
+        stroke: z.color,
+        strokeWidth: z.width,
         fill: e ?? c.fill.background,
         roughness: h ? c.roughness.roughness + 1 : c.roughness.roughness,
         bowing: c.roughness.bowing,
         fillStyle: r
       }
     );
-    u.current.appendChild(H);
-  }, [h, d, o, s, t, c, e]), /* @__PURE__ */ w.jsxs(
+    u.current.appendChild(N);
+  }, [h, d, o, s, t, c, e]), /* @__PURE__ */ M.jsxs(
     "div",
     {
       ref: l,
@@ -2003,7 +2029,7 @@ const L = {
       onMouseEnter: () => g(!0),
       onMouseLeave: () => g(!1),
       children: [
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "svg",
           {
             ref: u,
@@ -2012,7 +2038,7 @@ const L = {
             style: { position: "absolute", inset: 0 }
           }
         ),
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "input",
           {
             ...a,
@@ -2040,10 +2066,10 @@ const L = {
   color: s,
   className: t
 }) => {
-  const n = A(), r = E(null);
-  return C(() => {
+  const n = j(), r = O(null);
+  return R(() => {
     if (!r.current) return;
-    const i = L.svg(r.current);
+    const i = A.svg(r.current);
     r.current.innerHTML = "";
     const a = n.stroke[e], c = s ?? a.color, u = i.path(
       "M6 18 H18 L16 12 A6 6 0 0 0 8 12 Z",
@@ -2064,17 +2090,17 @@ const L = {
       fill: "transparent"
     });
     r.current.appendChild(l);
-  }, [n, e, s]), /* @__PURE__ */ w.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: t });
+  }, [n, e, s]), /* @__PURE__ */ M.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: t });
 }, Qt = ({
   size: o = 24,
   strokeWeight: e = "medium",
   color: s,
   className: t
 }) => {
-  const n = A(), r = E(null);
-  return C(() => {
+  const n = j(), r = O(null);
+  return R(() => {
     if (!r.current) return;
-    const i = L.svg(r.current);
+    const i = A.svg(r.current);
     r.current.innerHTML = "";
     const a = n.stroke[e], c = s ?? a.color, u = i.path(
       "M2 12 L12 2 L22 12 V22 H2 Z",
@@ -2087,7 +2113,7 @@ const L = {
       }
     );
     r.current.appendChild(u);
-  }, [n, e, s]), /* @__PURE__ */ w.jsx(
+  }, [n, e, s]), /* @__PURE__ */ M.jsx(
     "svg",
     {
       ref: r,
@@ -2103,10 +2129,10 @@ const L = {
   color: s,
   className: t
 }) => {
-  const n = A(), r = E(null);
-  return C(() => {
+  const n = j(), r = O(null);
+  return R(() => {
     if (!r.current) return;
-    const i = L.svg(r.current);
+    const i = A.svg(r.current);
     r.current.innerHTML = "";
     const a = n.stroke[e], c = s ?? a.color, u = i.line(4, 12, 20, 12, {
       stroke: c,
@@ -2115,17 +2141,17 @@ const L = {
       bowing: n.roughness.bowing
     });
     r.current.appendChild(u);
-  }, [n, e, s]), /* @__PURE__ */ w.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: t });
+  }, [n, e, s]), /* @__PURE__ */ M.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: t });
 }, Kt = ({
   size: o = 24,
   strokeWeight: e = "medium",
   color: s,
   className: t
 }) => {
-  const n = A(), r = E(null);
-  return C(() => {
+  const n = j(), r = O(null);
+  return R(() => {
     if (!r.current) return;
-    const i = L.svg(r.current);
+    const i = A.svg(r.current);
     r.current.innerHTML = "";
     const a = n.stroke[e], c = s ?? a.color, u = i.line(12, 4, 12, 20, {
       stroke: c,
@@ -2139,17 +2165,17 @@ const L = {
       bowing: n.roughness.bowing
     });
     r.current.appendChild(u), r.current.appendChild(l);
-  }, [n, e, s]), /* @__PURE__ */ w.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: t });
+  }, [n, e, s]), /* @__PURE__ */ M.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: t });
 }, es = ({
   size: o = 24,
   strokeWeight: e = "medium",
   color: s,
   className: t
 }) => {
-  const n = A(), r = E(null);
-  return C(() => {
+  const n = j(), r = O(null);
+  return R(() => {
     if (!r.current) return;
-    const i = L.svg(r.current);
+    const i = A.svg(r.current);
     r.current.innerHTML = "";
     const a = n.stroke[e], c = s ?? a.color, u = i.circle(10, 10, 14, {
       stroke: c,
@@ -2164,7 +2190,7 @@ const L = {
       bowing: n.roughness.bowing
     });
     r.current.appendChild(u), r.current.appendChild(l);
-  }, [n, e, s]), /* @__PURE__ */ w.jsx(
+  }, [n, e, s]), /* @__PURE__ */ M.jsx(
     "svg",
     {
       ref: r,
@@ -2180,10 +2206,10 @@ const L = {
   color: s,
   className: t
 }) => {
-  const n = A(), r = E(null);
-  return C(() => {
+  const n = j(), r = O(null);
+  return R(() => {
     if (!r.current) return;
-    const i = L.svg(r.current);
+    const i = A.svg(r.current);
     r.current.innerHTML = "";
     const a = n.stroke[e], c = s ?? a.color, u = i.circle(12, 12, 14, {
       stroke: c,
@@ -2202,17 +2228,17 @@ const L = {
       });
       r.current.appendChild(b);
     }
-  }, [n, e, s]), /* @__PURE__ */ w.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: t });
+  }, [n, e, s]), /* @__PURE__ */ M.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: t });
 }, ss = ({
   size: o = 24,
   strokeWeight: e = "medium",
   color: s,
   className: t
 }) => {
-  const n = A(), r = E(null);
-  return C(() => {
+  const n = j(), r = O(null);
+  return R(() => {
     if (!r.current) return;
-    const i = L.svg(r.current);
+    const i = A.svg(r.current);
     r.current.innerHTML = "";
     const a = n.stroke[e], c = s ?? a.color, u = i.circle(12, 8, 6, {
       stroke: c,
@@ -2233,7 +2259,7 @@ const L = {
       }
     );
     r.current.appendChild(l);
-  }, [n, e, s]), /* @__PURE__ */ w.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: t });
+  }, [n, e, s]), /* @__PURE__ */ M.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: t });
 };
 export {
   Vt as DrawuiButton,
@@ -2250,5 +2276,5 @@ export {
   es as IconSearch,
   ts as IconSettings,
   ss as IconUser,
-  A as useDrawuiTheme
+  j as useDrawuiTheme
 };